Linking Two Inputs: format function change does not trigger a rerender

[smeng9]

I have two inputs in a form: one for the value and another for the unit

What you were expecting:

I expect changing the unit from selection input will cause the value also be reformatted based on the new unit

What happened instead:

The value does not get reformatted

Steps to reproduce:

Go to https://stackblitz.com/edit/github-m7rhmv?file=src%2Fcomments%2FCommentCreate.tsx
Go to Comments -> Create new comments
In the form change the units to degrees or radians, however in the value input only input adornment gets changed, but not the input value.

Related code:

The value may need to be recalculated here

react-admin/packages/ra-core/src/form/useInput.ts

Line 94 in 032e146

value: format ? format(controllerField.value) : controllerField.value,

Maybe missing a dependency in useEffect

react-admin/packages/ra-ui-materialui/src/input/NumberInput.tsx

Line 69 in 032e146

}, [field.value]); // eslint-disable-line react-hooks/exhaustive-deps

• Preferably, a CodeSandbox forked from
  • https://codesandbox.io/s/github/marmelab/react-admin/tree/master/examples/simple (v4)
  • https://codesandbox.io/s/github/marmelab/react-admin/tree/3.x/examples/simple (v3)
• A StackBlitz forked from
  • https://stackblitz.com/github/marmelab/react-admin/tree/master/examples/simple (v4)
• A link to a GitHub repo with the minimal codebase to reproduce the issue

https://stackblitz.com/edit/github-m7rhmv?file=src%2Fcomments%2FCommentCreate.tsx

Other information:

Environment

• React-admin version: 4.5.1
• Last version that did not exhibit the issue (if applicable): N/A
• React version: 18.0.2
• Browser: Firefox 106
• Stack trace (in case of a JS error):

[WiXSL]

Reproduced!
Thanks.

It works with a TextInput, you can use that for now as a workaround

[fzaninotto]

The fix was reverted in #8442, so I'm reopening this bug.