Adding a new field to a field array, change the isDirty state of some other field to be true.

[Akhil017]

I am using React Hook Form to render two form fields. One field uses useFieldArray(), and the other is a normal field. I have a use case where I need to fetch the initial data for the form from an API. I am using form.reset() for setting the default value

For the normal field, the initial value is an array. I am rendering a multi-select component in the actual project where the items from the array are the values the user selected earlier. Upon adding a field to the useFieldArray component, the isDirty state for the second field is changing.

I am attaching the CodeSandbox link for the above case. You can check this by opening the dev tools and adding a new field in the field array (phone number field), which will change the isDirty state of the test field to true.

Can someone explain what I am doing wrong here? Why does the isDirty state of the test field change when I try to add a field in the phone number field?