feat: Toolbar v2: Unauth flow inside the EdgeLayout #310
Conversation
ryan953
force-pushed
the
ryan953/v2
branch
2 times, most recently
from
600168b to
9efb6d8
Compare
![sentry[bot]](https://avatars.githubusercontent.com/in/12637?s=60&v=4){kind=small}
Putting the unauth state inside the EdgeLayout system means that it can be drag+dropped, we can use bigger panels to show more infomation about whats configured and and the current state, it can be collapsed in the same way as a logged-in session, and finally we can include the Feature Flags panel even when the user is not logged-in because it uses local state only.
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
| className="hidden" | ||
| ref={iframeRef} | ||
| /> | ||
| <ApiProxyStateContext.Provider key={proxyState} value={proxyState}> |
There was a problem hiding this comment.
Provider key causes children to remount on state change
Adding key={proxyState} to ApiProxyStateContext.Provider causes React to unmount and remount all children whenever the proxy state changes (e.g., from 'connecting' to 'logged-in'). This will reset all component state throughout the application on every auth state transition, potentially causing data loss, re-fetching, and unexpected UI resets. The key on the iframe is intentional to refresh it on state changes, but the key on the Provider appears unintended.
There was a problem hiding this comment.
This is fine. We want to blow up all useQuery caches and stuff whenever auth state changes, so that no sensitive data is stashed on the device.
Resetting state is part of that as it'll help guarantee that the user is at a reasonable starting point given that they've just logged-in or -out.
We could test more when problematic login states occur, it would be ideal to render those without the user needing to click through. Something to followup on.
This will make it better when we have multiple callers of useNavigationExpansion() at different layers
1 participant
Putting the unauth state inside the EdgeLayout system means that it can be drag+dropped, we can use bigger panels to show more information about whats configured and and the current state, it can be collapsed in the same way as a logged-in session, and finally we can include the Feature Flags panel even when the user is not logged-in because it uses local state only.