Frontend: Auth: Move redirect function out of render cycle to avoid repeated redirects

[rvveber]

Auth.tsx redirects are happening in component render cycle.
In combination with the serviceworker intercepting requests,
can lead to situations where the component is rerendering and making repeated requests fast.

We should move the redirection to a guarded useEffect.

Reproduce:

1. Have service worker activated
2. Delete the docs_sessionid cookie after already authenticated and reload.
3. Should see multiple cancelled requests
   (for us in opendesk it ends in a loop for 25 or so requests per second)

---

Old issue description (before the issues cause was clearer)

The redirect to the `authenticate|callback|logout` endpoints should not be intercepted by the service worker. They need to be top-level redirects (window.location=...) for the browser to set the `docs_sessionid` cookie correctly.

They are not like regular api endpoints which just return cachable data, these endpoints can redirect and the browser must follow the redirect to properly set the session cookie.

Intercepting them at the service-worker for offline use, leads to the service-worker pre-checking if data is available with an XHR/fetch (browser will not follow) and causing the actual top-level redirect to be cancelled. Causes redirect loops.

This is probably causd by the catch‑all API route matching /authenticate/:

docs/src/frontend/apps/impress/src/features/service-worker/service-worker-api.ts

Lines 107 to 124 in 62e122b

	registerRoute(
	({ url }) => isApiUrl(url.href),
	new NetworkFirst({
	cacheName: getCacheNameVersion('api'),
	plugins: [
	new CacheableResponsePlugin({ statuses: [0, 200] }),
	new ExpirationPlugin({
	maxAgeSeconds: 24 * 60 * 60 * DAYS_EXP,
	}),
	new ApiPlugin({
	type: 'synch',
	syncManager,
	}),
	new OfflinePlugin(),
	],
	}),
	'GET',
	);

[AntoLC]

I am not sure to understand the bug, could you describe the way to reproduce it ? Does not seem to have any impact on our environments.

We could except them though, I don't think they are useful for the offline mode.

[rvveber]

I can't reproduce the issue outside of opendesk infrastructure, it might be in correlation with configuration or it might be fixed already in a new version.

I will add more information after my vacation.

[rvveber]

Updated findings: The root cause is duplicate redirects in Auth component

After investigating the redirect loops and canceled requests, I've identified the actual issue.

The real problem: Auth component triggers duplicate redirects

The Auth component in src/features/auth/components/Auth.tsx calls gotoLogin() during render:

if (!authenticated && !pathAllowed) {
  if (config?.FRONTEND_HOMEPAGE_FEATURE_ENABLED) {
    void replace(HOME_URL);
  } else {
    gotoLogin();  // ← Called during render, not in useEffect
  }
  return <Loader />;
}

When the page loads without a session:

1. /users/me/ returns 401 → authenticated: false
2. Auth renders, calls gotoLogin() → starts navigation to /authenticate/
3. React Query cache update triggers re-render
4. Second render calls gotoLogin() again → starts second navigation
5. Browser cancels first navigation, causing the redirect loop

This is why we see the "canceled" request and infinite redirects in the network trace.

Network trace explained

/users/me/              401  fetch
/authenticate/          (canceled)  fetch  [service-worker.js]  ← duplicate gotoLogin() call
/authenticate/          302  document / Redirect                ← the actual successful navigation

The service worker's NetworkFirst strategy intercepts the navigation, but the canceled fetch is caused by the duplicate gotoLogin() calls, not by the service worker itself. The second call cancels the first.

Why it only happens after docs_sessionid deletion

The bug is latent in the code but only manifests when:

• The session is expired/deleted → /users/me/ returns 401
• This triggers the unauthenticated code path in Auth
• When authenticated, the redirect logic never executes, so the bug remains hidden

The fix: Move redirects to useEffect

// Auth.tsx
const [isRedirecting, setIsRedirecting] = useState(false);

useEffect(() => {
  if (isRedirecting || isLoading) return;
  
  if (!authenticated && !pathAllowed) {
    setIsRedirecting(true);
    if (config?.FRONTEND_HOMEPAGE_FEATURE_ENABLED) {
      void replace(HOME_URL);
    } else {
      gotoLogin();
    }
  }
}, [authenticated, pathAllowed, config?.FRONTEND_HOMEPAGE_FEATURE_ENABLED, replace, isLoading, isRedirecting]);

By moving the redirect into useEffect and guarding with isRedirecting state, we ensure gotoLogin() is called exactly once, regardless of how many times React re-renders.

This fix resolves the infinite redirect loop completely.

About the service worker interception

While the service worker does intercept /authenticate/ via the catch-all API route matcher, this is not causing the redirect loop. The loop is caused by duplicate gotoLogin() calls.

That said, auth endpoints (/authenticate/, /callback/, /logout/) probably shouldn't go through the service worker's NetworkFirst strategy at all, as they:

• Handle redirects that set cookies
• Shouldn't be cached
• Should be pure browser navigations

But this is a separate optimization, not the fix for the redirect loop issue.

---

Confirmed in opendesk: Implementing the useEffect fix completely resolved the infinite redirect issue without needing to modify the service worker.

[rvveber]

Reproduce:
Delete the docs_sessionid cookie after already authenticated and reload.