Fleet UI: Fix flaky race condition bug, clean code

[RachelElysia]

Issue

Addresses #18740

Description

• Use useEffect to update formData to avoid race condition
• Clean code and other consistency nits, examples include:
  • Rename onSubmit, instead of handleSubmit
  • Rename isUpdatingXYZ, instead of updatingXYZ
  • Re-order `useState``s for readability
  • Rename variables to clearly match 2 similar but different modals

Checklist for submitter

If some of the following don't apply, delete the relevant line.

• Manual QA for all new/changed functionality

[RachelElysia]

Status: @getvictor is testing this branch. If the await doesn't fix it, will need to table to next Wednesday and consider looking into useMutation hook.

[getvictor]

It looks to be working most of the time. I was able to reproduce it once, but I can't reproduce it again: https://www.loom.com/share/df5b97abcd204ce3846fed799e348799 So, I'm OK with this fix.

Looks like after saving the policies in parallel, you refetch the policies. Do you wait some time before refetching? I'm wondering whether it makes sense to wait a small amount of time to avoid read-after-write consistency issues in production (where we have separate master/replica databases).

This question is not just for this issue. This applies to any time we read something after writing a new value for it, like updating a user, etc. In production, I see a replication time of 30ms, so that's probably a good enough wait time. Note: I'm not running master/replica in my dev environment, but this is just a thought I had.

[RachelElysia]

ation time of 30m

Thanks for all this @getvictor - I just added a 100ms wait to be on the safe side.