useController in items managed by useFieldArray

[RwwL]

My team uses a component library that leans heavily on controlled components, and before we adopted RHF we already had a wrapper component for form inputs that managed changing label colors and rendering error messages for invalid fields. So we wrote a wrapper component makes use of useController and it's worked very well for us overall for a few years, including inside components rendered by useFieldArray.

This week we were adding features to a pretty complex form with useFieldArray, where a change to another field outside the field array required us to use useFieldArray.replace. Replacing the value worked fine, but we noticed that if replaced the fields with a shorter array value, when we hit append to add a new "blank" item, a sub-value from the previous array item at the just-added index was preserved in the rendered component. We could log out fields and see that the unwanted/old value information was not there, but in the field returned by useController, it was.

It seemed most sensible to us that we should pass shouldUnregister: true to our useFieldArray based on the docs, but that didn't solve it.

However, passing shouldUnregister: true to useController inside the relevant component being rendered by the fieldArray did solve it.

We're having a hard time understanding why this was the case. This was a little unsettling too because the docs for useController say this about shouldUnregister:

Note: this prop should be avoided when using with useFieldArray as unregister function gets called after input unmount/remount and reorder.

It would take a lot of time to build a minimal test case to demonstrate this, so I was hoping by writing up clearly enough here it might get a helpful response.