pwa

src/components/AppShell.jsx

@@ -28,7 +28,7 @@ export default function AppShell() {
               key={path}
               component={NavLink}
               to={path}
-              end={path === '/'}
+              onMouseDown={(e) => e.preventDefault()}
               sx={(theme) => ({
                 borderRadius: 0,
                 px: 1.5,

src/components/LoginPage.jsx

@@ -8,7 +8,13 @@ import Typography from '@mui/material/Typography';
 import GoogleIcon from '@mui/icons-material/Google';
 import { useSnackbar } from 'notistack';
 import { useAuth } from '../auth/useAuth';
-import { requestGoogleIdToken } from '../auth/googleSignIn';
+import {
+  abortGoogleSignIn,
+  FEDCM_BLOCKED_MESSAGE,
+  GoogleSignInBlockedError,
+  GoogleSignInCancelledError,
+  requestGoogleIdToken,
+} from '../auth/googleSignIn';
 
 export default function LoginPage() {
   const { loginWithGoogle, googleClientId, status } = useAuth();
@@ -16,11 +22,24 @@ export default function LoginPage() {
   const [busy, setBusy] = useState(false);
 
   const handleLogin = async () => {
-    setBusy(true);
+    abortGoogleSignIn();
     try {
-      const idToken = await requestGoogleIdToken(googleClientId);
+      const idToken = await requestGoogleIdToken(googleClientId, {
+        onFedcmBlocked: () => {
+          enqueueSnackbar(FEDCM_BLOCKED_MESSAGE, {
+            variant: 'warning',
+            autoHideDuration: 12000,
+          });
+        },
+      });
+      setBusy(true);
       await loginWithGoogle(idToken);
     } catch (err) {
+      if (err instanceof GoogleSignInCancelledError) return;
+      if (err instanceof GoogleSignInBlockedError) {
+        enqueueSnackbar(err.message, { variant: 'warning', autoHideDuration: 12000 });
+        return;
+      }
       enqueueSnackbar(`Login failed: ${err.message}`, { variant: 'error' });
     } finally {
       setBusy(false);