Inconsistent State Movement in React Array Fields on Reordering about form HOT 5 CLOSED

There are typescript errors as well.
ex. index, field state value is undefined and these come from typescript definitions...

from form.

Oh! This is an immutability issue, then! 😅 Reopening and tagging @aadito123 who's working on array stuff now

from form.

@SergiuPlesco TypeScript errors should be reported elsewhere, but there have been a ton of typing fixes since this was opened, so the issues you experienced may have been solved

from form.

@rodogir the more I think about this, the more I'm not sure how we could solve this in any meaningful way. From our perspective we shouldn't keep track of an internal key but your data should. We could introduce some kind of keyExtractor or something but even then what would that solve over key={yourIdHere} in React?

I think I'm going to close this for a triage of the upcoming 1.x release, but that doesn't mean the conversation is over. Please keep chatting about the topic and you might convince me that we need to reopen it :)

from form.

@crutchcorn

The example in the original issue already tries to solve it by managing the key outside the library. See the hobbies fields. In the discord thread I mentioned a potential bug:

I tried adding stable key handling outside of the form to solve it, but it does not work. This is because hobbiesField.state.value only changes on array size changes, not on reordering.

My guess: if hobbiesField.state.value changed on reordering it would solve the problem.

IMO there is no need for the library to keep track of an internal key as long as a solution exists. Currently, the behavior I mentioned is preventing me from handling stable keys.

from form.