Merge pull request #10773 from marmelab/fix-disabled-boolean-input

Fix disabled boolean input

Author: djhi

packages/ra-core/src/form/useApplyInputDefaultValues.ts

@@ -32,7 +32,7 @@ export const useApplyInputDefaultValues = ({
     isArrayInput,
     fieldArrayInputControl,
 }: Props) => {
-    const { defaultValue, source } = inputProps;
+    const { defaultValue, source, disabled } = inputProps;
     const finalSource = useWrappedSource(source);
 
     const record = useRecordContext(inputProps);
@@ -46,6 +46,9 @@ export const useApplyInputDefaultValues = ({
         if (
             defaultValue == null ||
             formValue != null ||
+            // When the input is disabled, its value may always be undefined, no matter the default value.
+            // This prevents from trying to reset the value indefinitely.
+            disabled ||
             // We check strictly for undefined to avoid setting default value
             // when the field is null
             recordValue !== undefined ||

packages/ra-ui-materialui/src/input/BooleanInput.stories.tsx

@@ -18,12 +18,35 @@ export const Basic = () => (
     </Wrapper>
 );
 
-export const Disabled = () => (
+export const Disabled = ({
+    defaultValue,
+    disabled,
+}: {
+    defaultValue: boolean;
+    disabled: boolean;
+}) => (
     <Wrapper>
-        <BooleanInput source="published" disabled />
+        <BooleanInput
+            source="published"
+            defaultValue={defaultValue}
+            disabled={disabled}
+        />
     </Wrapper>
 );
 
+Disabled.argTypes = {
+    defaultValue: {
+        control: 'boolean',
+    },
+    disabled: {
+        control: 'boolean',
+    },
+};
+Disabled.args = {
+    defaultValue: true,
+    disabled: true,
+};
+
 export const ReadOnly = () => (
     <Wrapper>
         <BooleanInput source="published" readOnly />