issue: setValue on property in useFieldArray does not work with null as value when shouldDirty: true

[graesj]

Version Number

7.49.3

Codesandbox/Expo snack

https://codesandbox.io/p/sandbox/billowing-field-4rkhs9?file=%2Fsrc%2FApp.tsx%3A57%2C26

Steps to reproduce

1. Go to Codesandbox
2. Open sandbox console.
3. Press "Remove organization address" button
4. Verify "address" is null in console log statement.
5. Set shouldDirty: true and refresh codesandbox.
6. Press "Remove organization address" button
7. See error

Expected behaviour

No error thrown and formState.isDirty = true

What browsers are you seeing the problem on?

No response

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

[Moshyfawn]

You're trying to set a non-registered organizations.${index}.address field to null, which is not expected to work. If you register fields <path>.address.street, <path>.address.city, you need to update them instead of their root object <path>.address.

onClick={() =>
  setValue(
-   `organizations[${index}].address`,
+   `organizations.${index}.address`,
-   null,
+   { street: "", city: "" },
    {
      shouldDirty: true,
    }
  )
}

[graesj]

How should I refactor my approach to be able to set organizations.${index}.address to null once it has been set to an address object? I feel like this is a valid use case. For instance, if the address has certain validation rules, but is also optional in the form, it should be possible to add/remove address.

Moreover, is it a desirable that my code works without the shouldDirty: true flag, but throws error with it?

[graesj]

Any follow-up on this?