Use react router, fix Firefox test

mui · Feb 8, 2024 · 172d2c3 · 172d2c3
1 parent e35837f
commit 172d2c3
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 5 deletions.
diff --git a/packages/toolpad-app/src/runtime/ToolpadApp.tsx b/packages/toolpad-app/src/runtime/ToolpadApp.tsx
@@ -1660,7 +1660,7 @@ export function ToolpadAppProvider({
     (window as any).toggleDevtools = () => toggleDevtools();
   }, [toggleDevtools]);
 
-  const authContext = useAuth({ dom, basename, signInPagePath: `${basename}/signin` });
+  const authContext = useAuth({ dom, basename, signInPagePath: '/signin' });
 
   const appHost = useNonNullableContext(AppHostContext);
   const showPreviewHeader = shouldShowPreviewHeader(appHost);

diff --git a/packages/toolpad-app/src/runtime/useAuth.ts b/packages/toolpad-app/src/runtime/useAuth.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import * as appDom from '@mui/toolpad-core/appDom';
 import { useNonNullableContext } from '@mui/toolpad-utils/react';
+import { useLocation, useNavigate } from 'react-router-dom';
 import { AppHostContext } from './AppHostContext';
 
 const AUTH_API_PATH = '/api/auth';
@@ -52,10 +53,13 @@ export const AuthContext = React.createContext<AuthPayload>({
 interface UseAuthInput {
   dom: appDom.RenderTree;
   basename: string;
-  signInPagePath?: string;
+  signInPagePath: string;
 }
 
 export function useAuth({ dom, basename, signInPagePath }: UseAuthInput): AuthPayload {
+  const location = useLocation();
+  const navigate = useNavigate();
+
   const authProviders = React.useMemo(() => {
     const app = appDom.getApp(dom);
     const authProviderConfigs = app.attributes.authentication?.providers ?? [];
@@ -107,10 +111,10 @@ export function useAuth({ dom, basename, signInPagePath }: UseAuthInput): AuthPa
     setSession(null);
     setIsSigningOut(false);
 
-    if (!signInPagePath || window.location.pathname !== signInPagePath) {
-      window.location.href = `${basename}${AUTH_SIGNIN_PATH}`;
+    if (location.pathname !== signInPagePath) {
+      navigate(signInPagePath);
     }
-  }, [basename, getCsrfToken, signInPagePath]);
+  }, [basename, getCsrfToken, location.pathname, navigate, signInPagePath]);
 
   const getSession = React.useCallback(async () => {
     setIsSigningIn(true);

diff --git a/test/integration/auth/domain.spec.ts b/test/integration/auth/domain.spec.ts
@@ -8,6 +8,8 @@ const currentDirectory = url.fileURLToPath(new URL('.', import.meta.url));
 test.use({
   ignoreConsoleErrors: [
     /Failed to load resource: the server responded with a status of 401 \(Unauthorized\)/,
+    /NetworkError when attempting to fetch resource./,
+    /The operation was aborted./,
   ],
 });