react-currency-input-field: CurrencyInput is not reset with Formik/ReactHookForm

Describe the bug When using this input with either Formik or ReactHookForm and resetting the form state, it still keeps the updated value.

To Reproduce Steps to reproduce the behavior:

Go to the modal with the form.
Modify the value of the required input.
Modify the value of other inputs.
Close/Cancel the modal with the form.
Open the modal again.
Check the inputs and see CurrencyInput wasn’t reset.

Expected behavior It should act like the other inputs and receive its value reset as well.

Additional context You can see the actual behavior in the video:

https://user-images.githubusercontent.com/5034215/190878969-764c1aed-01de-4b2f-a083-6ef3521392a1.mov

About this issue

Original URL
State: closed
Created 2 years ago
Comments: 16 (2 by maintainers)

Most upvoted comments

I’m seeing the same issue.

edit: I think in my case the issue is related to changing the value prop to undefined. So coalescing to empty string seems to be a work-around for me.

ex: value={amount ?? ''}

jake-crane on Jan 5, 2023

Here’s a codesandbox example of the Issue I was running into: https://codesandbox.io/s/elegant-darwin-lt8mpx?file=/src/App.tsx

To trigger the issue, enter a number in the input and then click the reset button. Notice that the value is set to undefined, but the currency input still displays the number that you entered.

jake-crane on Nov 8, 2023

I’m not sure about the original issue, but other folks on this thread seem to encounter an issue specifically when the value is set to undefined. To separate concerns from the original issue, I’ve create a new ticket specifically when undefined is passed with a Sandbox reproducible case. Feel free to follow along: https://github.com/cchanxzy/react-currency-input-field/issues/322

aconrad on Dec 20, 2023

Having the same issue here

mochetts on Dec 6, 2023

Is this still an issue? I imagine it is.

Can someone create a code sandbox so I can have a look?

Thanks

cchanxzy on Nov 7, 2023

I think the issue might be the state used here, which changes as keystroke happens.

All 4 examples uses their own state to set value.

There seems to be no way to have both programmatically set value and value from key stroke without maintaining your own state

@cchanxzy if userValue passed in ... !== undefined && ... !== null, including initial default value, no matter what key pressed no new value will be renedered.

xyz1hang on Aug 6, 2023