2
0

🚸 (fileUpload) Add clear and skip button labels customization

This commit is contained in:
Baptiste Arnaud
2023-01-20 08:12:59 +01:00
parent aa32fe782f
commit f697a5e99c
5 changed files with 54 additions and 26 deletions

View File

@ -14,16 +14,28 @@ type Props = {
export const FileInputSettings = ({ options, onOptionsChange }: Props) => {
const handleButtonLabelChange = (button: string) =>
onOptionsChange({ ...options, labels: { ...options.labels, button } })
const handlePlaceholderLabelChange = (placeholder: string) =>
onOptionsChange({ ...options, labels: { ...options.labels, placeholder } })
const handleMultipleFilesChange = (isMultipleAllowed: boolean) =>
onOptionsChange({ ...options, isMultipleAllowed })
const handleVariableChange = (variable?: Variable) =>
onOptionsChange({ ...options, variableId: variable?.id })
const handleSizeLimitChange = (sizeLimit?: number) =>
onOptionsChange({ ...options, sizeLimit })
const handleRequiredChange = (isRequired: boolean) =>
onOptionsChange({ ...options, isRequired })
const updateClearButtonLabel = (clear: string) =>
onOptionsChange({ ...options, labels: { ...options.labels, clear } })
const updateSkipButtonLabel = (skip: string) =>
onOptionsChange({ ...options, labels: { ...options.labels, skip } })
return (
<Stack spacing={4}>
<SwitchWithLabel
@ -56,17 +68,24 @@ export const FileInputSettings = ({ options, onOptionsChange }: Props) => {
withVariableButton={false}
/>
</Stack>
<Stack>
<FormLabel mb="0" htmlFor="button">
Button label:
</FormLabel>
<Input
id="button"
defaultValue={options.labels.button}
onChange={handleButtonLabelChange}
withVariableButton={false}
/>
</Stack>
<Input
label="Button label:"
defaultValue={options.labels.button}
onChange={handleButtonLabelChange}
withVariableButton={false}
/>
<Input
label="Clear button label:"
defaultValue={options.labels.clear}
onChange={updateClearButtonLabel}
withVariableButton={false}
/>
<Input
label="Skip button label:"
defaultValue={options.labels.skip}
onChange={updateSkipButtonLabel}
withVariableButton={false}
/>
<Stack>
<FormLabel mb="0" htmlFor="variable">
Save upload URL{options.isMultipleAllowed ? 's' : ''} in a variable: