Hanging react app on session refresh using Supabase Auth

[qawseuk]

More a resolution on a bug I encountered and managed to resolve, just in case there is an inherent issue when Dyad sets up Supabase authentication - or at least as part of its error resolution so it isn't just reliant on the underlying AI to know the fix.

Describe the bug
After logging in and using the app successfully, when the page is refreshed or re-visited, the initial code used for the Supabase authentication causes the app to end up in a deadlock state when calling TOKEN_REFRESHED event using supabase.auth.onAuthStateChange.

This results in the app no longer being able to read data from the Supabase database (and for my app led to the app just showing skeleton components.

To Reproduce
Steps to reproduce the behavior:

1. Log in to react app using Supabase auth
2. Use app as normal
3. Refresh the page (or revisit)
4. App no longer loads data (fails to refresh the access token)

Expected behavior
When a user refreshes or revisits the page, the user remains logged in and the data is loaded.

Config (please complete the following information):

• OS: Windows
• AI Model: Gemini 2.5 Pro
• Browser NA (not relevant)

Additional context
This issue seems to be caused by the @supabase/auth-js issue 762 where an async call to within the callback function in onAuthStateChange causes a deadlock. The solution is to remove any async call from the onAuthStateChange callback.

Issue raised as the initial code set-up for Supabase auth seems to have included the async option, whether this is Gemini 2.5 Pro incorrectly adding it, or something on the Supabase / Dyad side, hopefully it can help debug any similar hanging issues if they have cropped in

Old code:

const { data: { subscription } } = supabase.auth.onAuthStateChange(
      async (_event, session) => {
        setSession(session);
        setUser(session?.user ?? null);

Updated code:

  useEffect(() => {
    const { data: { subscription } } = supabase.auth.onAuthStateChange(
      (event, session) => { // This callback is now synchronous     
        setSession(session);
        const currentUser = session?.user ?? null;
        setUser(currentUser);