From aae92dabfdcb6b8bcb254984da0da619c0d32155 Mon Sep 17 00:00:00 2001 From: Daria Larionova Date: Wed, 25 Dec 2024 09:39:32 +0300 Subject: [PATCH] Refactor & redesign selectors edit dialog (#1964) --- .../en.json | 11 - .../ru.json | 11 - .../en.json | 21 ++ .../ru.json | 21 ++ .../dash.group-controls-dialog.edit/en.json | 15 +- .../dash.group-controls-dialog.edit/ru.json | 15 +- src/shared/constants/qa/control.ts | 6 +- src/shared/types/dash.ts | 17 +- .../AppearanceSection/AppearanceSection.scss | 10 +- .../Rows/ColorAccentRow/ColorAccentRow.tsx | 4 +- .../Rows/HintRow/HintRow.tsx | 4 +- .../Rows/InnerTitleRow/InnerTitleRow.tsx | 4 +- .../TitlePlacementRow/TitlePlacementRow.tsx | 20 +- .../Rows/TitleRow/TitleRow.tsx | 24 +- .../CommonSettingsSection.tsx | 7 +- .../ConnectionSettings/ConnectionSettings.tsx | 14 +- .../ConnectionSelector/ConnectionSelector.tsx | 2 + .../DatasetSelector/DatasetSelector.tsx | 4 +- .../DatasetSettings/DatasetSettings.tsx | 11 +- .../EntrySelector/EntrySelector.scss | 4 +- .../EntrySelector/EntrySelector.tsx | 4 +- .../ExternalSelectorSettings.tsx | 12 +- .../InputSettings/InputSettings.tsx | 17 +- .../InputTypeSelector/InputTypeSelector.tsx | 4 +- .../ParameterNameInput/ParameterNameInput.tsx | 3 +- .../OperationSelector/OperationSelector.tsx | 4 +- .../ListValueControl/ListValueControl.tsx | 10 +- .../MultiselectableCheckbox.tsx | 4 +- .../RequiredValueCheckbox.tsx | 4 +- .../Sections/ValueSelector/ValueSelector.tsx | 26 +- .../TwoColumnDialog/TwoColumnDialog.scss | 34 +- .../TwoColumnDialog/TwoColumnDialog.tsx | 2 +- .../DialogChartWidget/DialogChartWidget.scss | 1 + .../DialogChartWidget/DialogChartWidget.tsx | 7 +- .../DialogChartWidget/TabMenu/TabMenu.scss | 91 ----- .../DialogControlsPlacement.tsx | 173 --------- .../ControlPlacementRow.tsx | 6 +- .../DialogExtendedSettings.scss} | 36 +- .../DialogExtendedSettings.tsx | 328 ++++++++++++++++++ .../DialogGroupControl.scss | 55 +-- .../GroupControlBody/GroupControlBody.tsx | 71 ++-- .../GroupControlSidebar.tsx | 175 +--------- .../components/FormSection/FormSection.scss | 10 + src/ui/components/FormSection/FormSection.tsx | 25 ++ .../components/ListWithMenu/ListWithMenu.tsx | 2 +- src/ui/components/TabMenu/TabMenu.scss | 62 ++++ .../TabMenu/TabMenu.tsx | 32 +- .../{DialogChartWidget => }/TabMenu/types.ts | 1 - src/ui/store/actions/openDialogTypes.ts | 4 +- src/ui/store/reducers/controlDialog.ts | 11 +- src/ui/store/typings/controlDialog.ts | 4 +- src/ui/store/utils/controlDialog.ts | 10 +- .../externalInfluencesOnGroup.test.ts | 2 + .../dash/selectors/groupBaseActions.test.ts | 4 +- .../dash/selectors/groupButtonActions.test.ts | 6 + .../dash/selectors/selectorsLabels.test.ts | 4 +- .../common/DialogControlPO/AppearanceTitle.ts | 8 +- .../common/abstract/RadioGroupElementPO.ts | 1 - .../page-objects/dashboard/ControlActions.ts | 20 +- tests/page-objects/dashboard/DashboardPage.ts | 2 + .../dash/selectors/selectorsLabels.test.ts | 4 +- 61 files changed, 754 insertions(+), 750 deletions(-) delete mode 100644 src/i18n-keysets/dash.controls-placement-dialog.edit/en.json delete mode 100644 src/i18n-keysets/dash.controls-placement-dialog.edit/ru.json create mode 100644 src/i18n-keysets/dash.extended-settings-dialog.edit/en.json create mode 100644 src/i18n-keysets/dash.extended-settings-dialog.edit/ru.json delete mode 100644 src/ui/components/DialogChartWidget/TabMenu/TabMenu.scss delete mode 100644 src/ui/components/DialogControlsPlacement/DialogControlsPlacement.tsx rename src/ui/components/{DialogControlsPlacement => DialogExtendedSettings}/ControlPlacementRow/ControlPlacementRow.tsx (94%) rename src/ui/components/{DialogControlsPlacement/DialogControlsPlacement.scss => DialogExtendedSettings/DialogExtendedSettings.scss} (58%) create mode 100644 src/ui/components/DialogExtendedSettings/DialogExtendedSettings.tsx create mode 100644 src/ui/components/FormSection/FormSection.scss create mode 100644 src/ui/components/FormSection/FormSection.tsx create mode 100644 src/ui/components/TabMenu/TabMenu.scss rename src/ui/components/{DialogChartWidget => }/TabMenu/TabMenu.tsx (91%) rename src/ui/components/{DialogChartWidget => }/TabMenu/types.ts (97%) diff --git a/src/i18n-keysets/dash.controls-placement-dialog.edit/en.json b/src/i18n-keysets/dash.controls-placement-dialog.edit/en.json deleted file mode 100644 index 18246b10a4..0000000000 --- a/src/i18n-keysets/dash.controls-placement-dialog.edit/en.json +++ /dev/null @@ -1,11 +0,0 @@ -{ - "button_back": "Back", - "button_cancel": "Cancel", - "button_save": "Save", - "label_field-validation": "Invalid width value", - "label_note": "Selectors whose width does not fit completely inside the widget that unites a group of selectors will be moved to the next line", - "label_title": "Settings for the location of selectors in a group", - "value_auto": "Auto", - "value_percent": "%", - "value_pixels": "px" -} diff --git a/src/i18n-keysets/dash.controls-placement-dialog.edit/ru.json b/src/i18n-keysets/dash.controls-placement-dialog.edit/ru.json deleted file mode 100644 index 5714444a89..0000000000 --- a/src/i18n-keysets/dash.controls-placement-dialog.edit/ru.json +++ /dev/null @@ -1,11 +0,0 @@ -{ - "button_back": "Назад", - "button_cancel": "Отмена", - "button_save": "Сохранить", - "label_field-validation": "Некорректное значение ширины", - "label_note": "Селекторы, которые по ширине не помещаются в виджет, объединяющий группу селекторов, будут перенесены на следующую строку", - "label_title": "Настройки размещения селекторов в группе", - "value_auto": "Авто", - "value_percent": "%", - "value_pixels": "px" -} diff --git a/src/i18n-keysets/dash.extended-settings-dialog.edit/en.json b/src/i18n-keysets/dash.extended-settings-dialog.edit/en.json new file mode 100644 index 0000000000..e274170768 --- /dev/null +++ b/src/i18n-keysets/dash.extended-settings-dialog.edit/en.json @@ -0,0 +1,21 @@ +{ + "button_back": "Back", + "button_cancel": "Cancel", + "button_save": "Save", + "context_apply-button": "This option enables a button for applying selectors", + "context_reset-button": "This option enables a button for resetting selectors", + "context_update-controls-on-change": "Once you enable this option, the dependent selectors will have influence on each other before you click Apply.", + "label_apply-button-checkbox": "Apply button", + "label_autoheight-checkbox": "Autoheight", + "label_field-validation": "Invalid width value", + "label_group-name": "Name", + "label_group-parameters": "Group parameters", + "label_note": "Selectors whose width does not fit completely inside the widget that unites a group of selectors will be moved to the next line", + "label_reset-button-checkbox": "Reset button", + "label_selectors-representation": "Selectors representation order and width", + "label_title": "Settings for selectors group", + "label_update-controls-on-change": "Auto-updating dependent selectors", + "value_auto": "Auto", + "value_percent": "%", + "value_pixels": "px" +} diff --git a/src/i18n-keysets/dash.extended-settings-dialog.edit/ru.json b/src/i18n-keysets/dash.extended-settings-dialog.edit/ru.json new file mode 100644 index 0000000000..54dbede7f7 --- /dev/null +++ b/src/i18n-keysets/dash.extended-settings-dialog.edit/ru.json @@ -0,0 +1,21 @@ +{ + "button_back": "Назад", + "button_cancel": "Отмена", + "button_save": "Сохранить", + "context_apply-button": "Опция включает кнопку для применения селекторов", + "context_reset-button": "Опция включает кнопку для сброса селекторов", + "context_update-controls-on-change": "При включении опции зависимые селекторы будут влиять друг на друга до нажатия кнопки «Применить».", + "label_apply-button-checkbox": "Кнопка «‎Применить»‎", + "label_autoheight-checkbox": "Автовысота", + "label_field-validation": "Некорректное значение ширины", + "label_group-name": "Название", + "label_group-parameters": "Параметры группы", + "label_note": "Селекторы, которые по ширине не помещаются в виджет, объединяющий группу селекторов, будут перенесены на следующую строку", + "label_reset-button-checkbox": "Кнопка «‎Сбросить»", + "label_selectors-representation": "Порядок отображения и ширина селекторов", + "label_title": "Настройки группы селекторов", + "label_update-controls-on-change": "Автообновление зависимых селекторов", + "value_auto": "Авто", + "value_percent": "%", + "value_pixels": "px" +} diff --git a/src/i18n-keysets/dash.group-controls-dialog.edit/en.json b/src/i18n-keysets/dash.group-controls-dialog.edit/en.json index 63a607a8d6..d773a38811 100644 --- a/src/i18n-keysets/dash.group-controls-dialog.edit/en.json +++ b/src/i18n-keysets/dash.group-controls-dialog.edit/en.json @@ -1,22 +1,19 @@ { - "button_add-selector": "Add", + "button_add-selector": "Add selector", "button_cancel": "Cancel", + "button_extended-settings": "Extended settings", "button_paste-selector": "Paste", "button_save": "Save", - "button_selectors-placement": "Selector placement", - "context_apply-button": "This option enables a button for applying selectors", - "context_reset-button": "This option enables a button for resetting selectors", - "context_update-controls-on-change": "Once you enable this option, the dependent selectors will have influence on each other before you click Apply.", - "label_apply-button-checkbox": "Apply button", - "label_autoheight-checkbox": "Autoheight", "label_copy-invalid-control": "Failed to copy selector: some fields did not pass validation", + "label_data": "Data", "label_default-tab": "Selector {{index}}", - "label_reset-button-checkbox": "Reset button", + "label_filtration": "Filtration", + "label_representation": "Representation", "label_selector-settings": "Selector settings", "label_selectors-list": "Selectors", "label_source": "Source", "label_title-placement": "Title placement", - "label_update-controls-on-change": "Auto-updating dependent selectors", + "value_title-hidden": "Hidden", "value_title-placement-left": "Left", "value_title-placement-top": "Top" } diff --git a/src/i18n-keysets/dash.group-controls-dialog.edit/ru.json b/src/i18n-keysets/dash.group-controls-dialog.edit/ru.json index 72ed10a099..e64085facb 100644 --- a/src/i18n-keysets/dash.group-controls-dialog.edit/ru.json +++ b/src/i18n-keysets/dash.group-controls-dialog.edit/ru.json @@ -1,22 +1,19 @@ { - "button_add-selector": "Добавить", + "button_add-selector": "Добавить селектор", "button_cancel": "Отменить", + "button_extended-settings": "Расширенные настройки", "button_paste-selector": "Вставить", "button_save": "Сохранить", - "button_selectors-placement": "Размещение селекторов", - "context_apply-button": "Опция включает кнопку для применения селекторов", - "context_reset-button": "Опция включает кнопку для сброса селекторов", - "context_update-controls-on-change": "При включении опции зависимые селекторы будут влиять друг на друга до нажатия кнопки «Применить».", - "label_apply-button-checkbox": "Кнопка «‎Применить»‎", - "label_autoheight-checkbox": "Автовысота", "label_copy-invalid-control": "Не удалось скопировать селектор: некоторые его поля заполнены некорректно", + "label_data": "Данные", "label_default-tab": "Селектор {{index}}", - "label_reset-button-checkbox": "Кнопка «‎Сбросить»", + "label_filtration": "Фильтрация", + "label_representation": "Отображение", "label_selector-settings": "Настройки селектора", "label_selectors-list": "Селекторы", "label_source": "Источник", "label_title-placement": "Размещение заголовка", - "label_update-controls-on-change": "Автообновление зависимых селекторов", + "value_title-hidden": "Скрыт", "value_title-placement-left": "Слева", "value_title-placement-top": "Сверху" } diff --git a/src/shared/constants/qa/control.ts b/src/shared/constants/qa/control.ts index 1459882d9a..211715a54e 100644 --- a/src/shared/constants/qa/control.ts +++ b/src/shared/constants/qa/control.ts @@ -1,6 +1,5 @@ export const ControlQA = { showInnerTitleCheckbox: 'show-inner-title-checkbox', - showLabelCheckbox: 'show-control-name-checkbox', controlLabel: 'chartkit-control-title', controlSelect: 'chartkit-control-select', @@ -41,6 +40,7 @@ export const DialogControlQa = { radioSourceType: 'radio-source-type', seletSourceType: 'select-source-type', appearanceTitle: 'dialog-control-appearance-title', + appearanceTitlePlacement: 'dialog-control-appearance-title-placement', appearanceInnerTitle: 'dialog-control-appearance-inner-title', fieldNameInput: 'field-name-input', dateRangeCheckbox: 'date-range-checkbox', @@ -63,9 +63,9 @@ export const DialogGroupControlQa = { applyButtonCheckbox: 'apply-button-checkbox', resetButtonCheckbox: 'reset-button-checkbox', updateControlOnChangeCheckbox: 'update-controls-button-checkbox', - placementButton: 'selectors-placement-button', + extendedSettingsButton: 'extended-settings-button', placementControlList: 'selectors-placement-control-list', - placementApplyButton: 'selectors-placement-apply-button', + extendedSettingsApplyButton: 'selectors-extended-settings-apply-button', controlMenu: 'control-menu', removeControlButton: 'remove-control-button', copyControlButton: 'copy-control-button', diff --git a/src/shared/types/dash.ts b/src/shared/types/dash.ts index 72cc3539e7..25fd0c01ad 100644 --- a/src/shared/types/dash.ts +++ b/src/shared/types/dash.ts @@ -2,7 +2,14 @@ import type {ItemDropProps} from '@gravity-ui/dashkit'; import type {Operations} from '../modules'; -import type {ClientChartsConfig, Dictionary, Entry, EntryScope, StringParams} from './index'; +import type { + ClientChartsConfig, + Dictionary, + Entry, + EntryScope, + StringParams, + ValueOf, +} from './index'; export enum ControlType { Dash = 'control_dash', @@ -235,6 +242,14 @@ export enum TitlePlacementOption { Top = 'top', } +export const TitlePlacements = { + Hide: 'hide' as const, + Left: TitlePlacementOption.Left, + Top: TitlePlacementOption.Top, +}; + +export type TitlePlacement = ValueOf; + export type AccentTypeValue = 'info' | null; export interface DashTabItemControlElementBase { diff --git a/src/ui/components/ControlComponents/Sections/AppearanceSection/AppearanceSection.scss b/src/ui/components/ControlComponents/Sections/AppearanceSection/AppearanceSection.scss index e88760dbcb..4add0b4613 100644 --- a/src/ui/components/ControlComponents/Sections/AppearanceSection/AppearanceSection.scss +++ b/src/ui/components/ControlComponents/Sections/AppearanceSection/AppearanceSection.scss @@ -1,16 +1,12 @@ .control2-appearance-section { &__setting-container { display: flex; - align-items: center; + align-items: flex-start; min-height: var(--gc-form-row-field-height); } &__setting-checkbox { - margin-right: 8px; - - &_top { - align-self: flex-start; - margin-top: 4px; - } + margin-block-start: var(--g-spacing-1); + margin-inline-end: var(--g-spacing-2); } } diff --git a/src/ui/components/ControlComponents/Sections/AppearanceSection/Rows/ColorAccentRow/ColorAccentRow.tsx b/src/ui/components/ControlComponents/Sections/AppearanceSection/Rows/ColorAccentRow/ColorAccentRow.tsx index 401bdc5246..4f768dd603 100644 --- a/src/ui/components/ControlComponents/Sections/AppearanceSection/Rows/ColorAccentRow/ColorAccentRow.tsx +++ b/src/ui/components/ControlComponents/Sections/AppearanceSection/Rows/ColorAccentRow/ColorAccentRow.tsx @@ -17,7 +17,7 @@ const b = block('control2-appearance-section'); const i18n = I18n.keyset('dash.control-dialog.edit'); -export const ColorAccentRow = () => { +export const ColorAccentRow = ({className}: {className?: string}) => { const dispatch = useDispatch(); const {accentType} = useSelector(selectSelectorDialog); const isFieldDisabled = useSelector(selectIsControlConfigurationDisabled); @@ -47,7 +47,7 @@ export const ColorAccentRow = () => { ); return ( - +
{ +export const HintRow = ({className}: {className?: string}) => { const dispatch = useDispatch(); const {showHint = false, hint} = useSelector(selectSelectorDialog); const isFieldDisabled = useSelector(selectIsControlConfigurationDisabled); @@ -38,7 +38,7 @@ export const HintRow = () => { const {MarkdownControl} = registry.common.components.getAll(); return ( - +
{ +export const InnerTitleRow = ({className}: {className?: string}) => { const dispatch = useDispatch(); const {showInnerTitle, innerTitle, sourceType} = useSelector(selectSelectorDialog); const isFieldDisabled = useSelector(selectIsControlConfigurationDisabled); @@ -63,7 +63,7 @@ export const InnerTitleRow = () => { ); return ( - +
{ +export const TitlePlacementRow = ({className}: {className?: string}) => { const dispatch = useDispatch(); - const {elementType, titlePlacement = TitlePlacementOption.Left} = - useSelector(selectSelectorDialog); + const {elementType, titlePlacement} = useSelector(selectSelectorDialog); const isFieldDisabled = useSelector(selectIsControlConfigurationDisabled); const isPlacementDisabled = isFieldDisabled || elementType === ELEMENT_TYPE.CHECKBOX; const handleItemPlacementUpdate = React.useCallback( - (value: string) => { + (value: TitlePlacement) => { dispatch( setSelectorDialogItem({ - titlePlacement: value as TitlePlacementOption, + titlePlacement: value, }), ); }, @@ -44,9 +45,10 @@ export const TitlePlacementRow = () => { ); return ( - +
{ +export const TitleRow = ({className}: {className?: string}) => { const dispatch = useDispatch(); - const {showTitle, title, validation} = useSelector(selectSelectorDialog); + const {title, validation} = useSelector(selectSelectorDialog); const isFieldDisabled = useSelector(selectIsControlConfigurationDisabled); const handleTitleUpdate = React.useCallback((title: string) => { @@ -33,25 +33,9 @@ export const TitleRow = () => { ); }, []); - const handleShowTitleUpdate = React.useCallback((value: boolean) => { - dispatch( - setSelectorDialogItem({ - showTitle: value, - }), - ); - }, []); - return ( - +
- void; hideCommonFields?: boolean; enableAutoheightDefault?: boolean; + className?: string; }) => { const {sourceType} = useSelector(selectSelectorDialog); @@ -27,16 +29,18 @@ export const CommonSettingsSection = ({ case DashTabItemControlSourceType.External: return ( ); case DashTabItemControlSourceType.Manual: - return ; + return ; case DashTabItemControlSourceType.Connection: return ( void; + rowClassName?: string; }) => { const {connectionQueryTypes} = useSelector(selectSelectorDialog); return ( {connectionQueryTypes && connectionQueryTypes.length > 0 && ( - + {!hideCommonFields && ( - - - + + + )} diff --git a/src/ui/components/ControlComponents/Sections/CommonSettingsSection/ConnectionSettings/components/ConnectionSelector/ConnectionSelector.tsx b/src/ui/components/ControlComponents/Sections/CommonSettingsSection/ConnectionSettings/components/ConnectionSelector/ConnectionSelector.tsx index 794e2347c7..8e1150761f 100644 --- a/src/ui/components/ControlComponents/Sections/CommonSettingsSection/ConnectionSettings/components/ConnectionSelector/ConnectionSelector.tsx +++ b/src/ui/components/ControlComponents/Sections/CommonSettingsSection/ConnectionSettings/components/ConnectionSelector/ConnectionSelector.tsx @@ -17,6 +17,7 @@ const i18n = I18n.keyset('dash.control-dialog.edit'); export const ConnectionSelector = (props: { navigationPath: string | null; changeNavigationPath: (newNavigationPath: string) => void; + className?: string; }) => { const dispatch = useDispatch(); const {connectionId} = useSelector(selectSelectorDialog); @@ -85,6 +86,7 @@ export const ConnectionSelector = (props: { return ( `/datasets/${entryId}`; function DatasetSelector(props: { navigationPath: string | null; changeNavigationPath: (newNavigationPath: string) => void; + rowClassName?: string; }) { const dispatch = useDispatch(); const {datasetId, datasetFieldId, isManualTitle, title, fieldType, validation} = @@ -133,6 +134,7 @@ function DatasetSelector(props: { return ( - + void; + rowClassName?: string; }) => { return ( {!hideCommonFields && ( - - - - + + + + )} diff --git a/src/ui/components/ControlComponents/Sections/CommonSettingsSection/EntrySelector/EntrySelector.scss b/src/ui/components/ControlComponents/Sections/CommonSettingsSection/EntrySelector/EntrySelector.scss index 3f27354d13..42b0f17cb3 100644 --- a/src/ui/components/ControlComponents/Sections/CommonSettingsSection/EntrySelector/EntrySelector.scss +++ b/src/ui/components/ControlComponents/Sections/CommonSettingsSection/EntrySelector/EntrySelector.scss @@ -1,11 +1,11 @@ .entry-selector { &__navigation { grid-template-columns: 1fr auto; - grid-template-rows: 40px; + row-gap: var(--g-spacing-2); + margin-block-end: var(--g-spacing-2); } &__link { - grid-auto-rows: 40px; --dl-dropdown-navigation-width: initial; } } diff --git a/src/ui/components/ControlComponents/Sections/CommonSettingsSection/EntrySelector/EntrySelector.tsx b/src/ui/components/ControlComponents/Sections/CommonSettingsSection/EntrySelector/EntrySelector.tsx index c00bf8e1c9..743b4b7029 100644 --- a/src/ui/components/ControlComponents/Sections/CommonSettingsSection/EntrySelector/EntrySelector.tsx +++ b/src/ui/components/ControlComponents/Sections/CommonSettingsSection/EntrySelector/EntrySelector.tsx @@ -32,6 +32,7 @@ type EntrySelectorProps = { getEntryLink?: (entryId: string) => string; navigationPath: string | null; changeNavigationPath: (newNavigationPath: string) => void; + className?: string; }; export const EntrySelector: React.FC = (props: EntrySelectorProps) => { @@ -47,10 +48,11 @@ export const EntrySelector: React.FC = (props: EntrySelector includeClickableType, navigationPath, changeNavigationPath, + className, } = props; return ( - + void; enableAutoheightDefault?: boolean; + rowClassName?: string; }> = (props) => { const dispatch = useDispatch(); const {autoHeight, chartId, title, selectorParameters, validation, selectorParametersGroup} = @@ -100,7 +101,10 @@ const ExternalSelectorSettings: React.FC<{ return ( - + {!props.enableAutoheightDefault && ( - + { +const InputSettings = ({ + hideCommonFields, + rowClassName, +}: { + hideCommonFields?: boolean; + rowClassName?: string; +}) => { return ( {!hideCommonFields && ( - - - - + + + + )} diff --git a/src/ui/components/ControlComponents/Sections/CommonSettingsSection/InputTypeSelector/InputTypeSelector.tsx b/src/ui/components/ControlComponents/Sections/CommonSettingsSection/InputTypeSelector/InputTypeSelector.tsx index 5930f2aab7..893fe7006f 100644 --- a/src/ui/components/ControlComponents/Sections/CommonSettingsSection/InputTypeSelector/InputTypeSelector.tsx +++ b/src/ui/components/ControlComponents/Sections/CommonSettingsSection/InputTypeSelector/InputTypeSelector.tsx @@ -27,7 +27,7 @@ const i18n = I18n.keyset('dash.control-dialog.edit'); const renderOptions = (option: SelectOption) => ; -const InputTypeSelector = () => { +const InputTypeSelector = ({className}: {className?: string}) => { const dispatch = useDispatch(); const controlType = useSelector(selectSelectorControlType); const isFieldDisabled = useSelector(selectIsControlConfigurationDisabled); @@ -79,7 +79,7 @@ const InputTypeSelector = () => { ); return ( - +