diff --git a/src/components/ConfigurationRow.tsx b/src/components/ConfigurationRow.tsx index 08822dd84a..bdc0e0be08 100644 --- a/src/components/ConfigurationRow.tsx +++ b/src/components/ConfigurationRow.tsx @@ -75,6 +75,22 @@ export const getConfigurationRow = ({ } }; + const isDisabled = () => { + return disabled || !!formik.values.editRestriction; + }; + + const getDisabledReasonOrTitle = (title?: string) => { + if (formik.values.editRestriction) { + return formik.values.editRestriction; + } + + if (disabledReason) { + return disabledReason; + } + + return title; + }; + const getForm = (): ReactNode => { return (
@@ -86,7 +102,7 @@ export const getConfigurationRow = ({ onBlur: formik.handleBlur, onChange: formik.handleChange, value, - disabled: disabled || !!formik.values.editRestriction, + disabled: isDisabled(), help: ( @@ -126,12 +140,9 @@ export const getConfigurationRow = ({ ); const wrapDisabledTooltip = (children: ReactNode): ReactNode => { - if ((disabled && disabledReason) || formik.values.editRestriction) { + if (disabledReason || formik.values.editRestriction) { return ( - + {children} ); @@ -141,16 +152,6 @@ export const getConfigurationRow = ({ const renderOverride = (): ReactNode => { if (formik.values.readOnly) { - const getTitle = () => { - if (formik.values.editRestriction) { - return formik.values.editRestriction; - } - if (disabled) { - return disabledReason; - } - - return isOverridden ? "Edit" : "Create override"; - }; return ( <> {overrideValue} @@ -165,8 +166,10 @@ export const getConfigurationRow = ({ className="u-no-margin--bottom" type="button" appearance="base" - title={getTitle()} - disabled={disabled || !!formik.values.editRestriction} + title={getDisabledReasonOrTitle( + isOverridden ? "Edit" : "Create override", + )} + disabled={isDisabled()} hasIcon > @@ -182,9 +185,9 @@ export const getConfigurationRow = ({ onClick={toggleDefault} className="u-no-margin--bottom" type="button" - disabled={disabled || !!formik.values.editRestriction} + disabled={isDisabled()} appearance="base" - title={formik.values.editRestriction ?? "Create override"} + title={getDisabledReasonOrTitle("Create override")} hasIcon > diff --git a/src/components/forms/FormSubmitBtn.tsx b/src/components/forms/FormSubmitBtn.tsx index 67716139c6..666c10677b 100644 --- a/src/components/forms/FormSubmitBtn.tsx +++ b/src/components/forms/FormSubmitBtn.tsx @@ -17,14 +17,8 @@ const FormSubmitBtn: FC = ({ formik, disabled, isYaml = false }) => { void formik.submitForm()} - title={formik.values.editRestriction} > {changeCount === 0 || isYaml ? "Save changes" diff --git a/src/components/forms/InheritedDeviceRow.tsx b/src/components/forms/InheritedDeviceRow.tsx index 04ecedc6d8..30af58a15d 100644 --- a/src/components/forms/InheritedDeviceRow.tsx +++ b/src/components/forms/InheritedDeviceRow.tsx @@ -83,46 +83,47 @@ export const getInheritedDeviceRow = ({ )}
), - override: - readOnly || disabledReason ? ( - overrideValue ? ( -
- {overrideValue} -
- ) : ( - "" - ) - ) : overrideValue ? ( -
-
{overrideForm}
- {clearOverride && ( -
- -
- )} + override: readOnly ? ( + overrideValue ? ( +
+ {overrideValue}
) : ( - addOverride && ( - - ) - ), + "" + ) + ) : overrideValue ? ( +
+
{overrideForm}
+ {clearOverride && ( +
+ +
+ )} +
+ ) : ( + addOverride && ( + + ) + ), }); }; diff --git a/src/components/forms/NetworkDevicesForm.tsx b/src/components/forms/NetworkDevicesForm.tsx index aac17310be..3f4781baa8 100644 --- a/src/components/forms/NetworkDevicesForm.tsx +++ b/src/components/forms/NetworkDevicesForm.tsx @@ -258,13 +258,8 @@ or remove the originating item" }} type="button" hasIcon - disabled={ - !!formik.values.editRestriction || !managedNetworks.length - } - title={ - formik.values.editRestriction ?? - (!managedNetworks.length ? "No networks available" : "") - } + disabled={!!formik.values.editRestriction} + title={formik.values.editRestriction} > Attach network diff --git a/src/components/forms/ProxyDeviceForm.tsx b/src/components/forms/ProxyDeviceForm.tsx index d2426c5f5e..2bf2e15a59 100644 --- a/src/components/forms/ProxyDeviceForm.tsx +++ b/src/components/forms/ProxyDeviceForm.tsx @@ -108,9 +108,7 @@ const ProxyDeviceForm: FC = ({ formik, project }) => { options={options} help={} className="u-no-margin--bottom" - disabled={ - disabledText != undefined || !!formik.values.editRestriction - } + disabled={!!disabledText || !!formik.values.editRestriction} title={formik.values.editRestriction ?? disabledText} /> ),