Toggle form fields based on condition

[maxfahl]

Description

When changing a string propery of an object in state, toggling the visibility of form fields based on this string does not behave correctly. I've used useEffect to know that the property in question is indeed chaning.

Raycast version: 1.34.1
@Raycast/api version: 1.34.1

Steps To Reproduce

1. git clone -b rsync-commands-before-after [email protected]:maxfahl/raycast-extensions.git
2. cd raycast-extensions/extensions/rsync-commands
3. npm install
4. npm run dev
5. Run Rsync Commands in Raycast
6. Create new entry
7. Select SSH > "Source"
8. Swap to SSH > "Destination"
9. The SSH fields under source field set are still visible, and no SSH fields are visible under the destination field set.

The toggle is being made on line 31 of extensions/rsync-commands/src/components/entry-location-form-fields.tsx. Adding a useEffect with sshEnabled as the dependency here shows that the value is indeed changing, but the view does not update when swapping from "Source" to "Destination" in the SSH field. There are two instances of EntryLocationFormFields rendered in extensions/rsync-commands/src/views/entry-form.tsx, conditioned on the sshSelection value of the entry state object.

If first selecting SSH > "Source", you can make the fields go away from the source field set by selecting SSH > "None". When this is done you can successfully change to SSH > "Destination" to see the SSH fields be positioned correctly.