Optimize sign out behavior

src/admin/AdminAppMenu.tsx

@@ -44,7 +44,7 @@ export default function AdminAppMenu({
     startUpload,
     setSelectedPhotoIds,
     refreshAdminData,
-    clearAuthStateAndRedirect,
+    clearAuthStateAndRedirectIfNecessary,
   } = useAppState();
 
   const isSelecting = selectedPhotoIds !== undefined;
@@ -148,7 +148,7 @@ export default function AdminAppMenu({
   }, {
     label: 'Sign Out',
     icon: <IconSignOut size={15} />,
-    action: () => signOutAction().then(clearAuthStateAndRedirect),
+    action: () => signOutAction().then(clearAuthStateAndRedirectIfNecessary),
   });
 
   return (

src/app/Footer.tsx

@@ -17,7 +17,7 @@ import { useAppState } from '@/state/AppState';
 export default function Footer() {
   const pathname = usePathname();
 
-  const { userEmail, clearAuthStateAndRedirect } = useAppState();
+  const { userEmail, clearAuthStateAndRedirectIfNecessary } = useAppState();
 
   const showFooter = !isPathSignIn(pathname);
 
@@ -49,7 +49,7 @@ export default function Footer() {
                         {userEmail}
                       </div>
                       <form action={() => signOutAction()
-                        .then(clearAuthStateAndRedirect)}>
+                        .then(clearAuthStateAndRedirectIfNecessary)}>
                         <SubmitButtonWithStatus styleAs="link">
                           Sign out
                         </SubmitButtonWithStatus>

src/auth/SignInForm.tsx

@@ -61,15 +61,18 @@ export default function SignInForm({
     password.length > 0;
 
   return (
-    <Container className={clsx(
+    <Container
-      'w-[calc(100vw-1.5rem)] sm:w-[min(360px,90vw)]',
+      className={clsx(
-      'px-6 py-5',
+        'w-[calc(100vw-1.5rem)] sm:w-[min(360px,90vw)]',
-      className,
+        'px-6 py-5',
-    )}>
+        className,
+      )}
+    >
       {includeTitle &&
         <h1 className={clsx(
           'flex gap-3 items-center justify-center',
-          'self-start text-2xl mb-3.5',
+          'self-start text-2xl',
+          'mb-6',
         )}>
           <IconLock className="text-main translate-y-[0.5px]" />
           <span className="text-main">
@@ -77,7 +80,7 @@ export default function SignInForm({
           </span>
         </h1>}
       <form action={action} className="w-full">
-        <div className="space-y-6 w-full -translate-y-0.5">
+        <div className="space-y-5 w-full -translate-y-0.5">
           {response === KEY_CREDENTIALS_SIGN_IN_ERROR &&
             <ErrorNote>
               Invalid email/password

src/cmdk/CommandKClient.tsx

@@ -124,7 +124,7 @@ export default function CommandKClient({
 
   const {
     isUserSignedIn,
-    clearAuthStateAndRedirect,
+    clearAuthStateAndRedirectIfNecessary,
     isCommandKOpen: isOpen,
     startUpload,
     photosCountHidden,
@@ -521,7 +521,9 @@ export default function CommandKClient({
     }
     adminSection.items.push({
       label: 'Sign Out',
-      action: () => signOutAction().then(clearAuthStateAndRedirect),
+      action: () => signOutAction()
+        .then(clearAuthStateAndRedirectIfNecessary)
+        .then(() => setIsOpen?.(false)),
     });
   } else {
     adminSection.items.push({

src/state/AppState.ts

@@ -39,7 +39,7 @@ export type AppStateContextType = {
   setUserEmail?: Dispatch<SetStateAction<string | undefined>>
   isUserSignedIn?: boolean
   isUserSignedInEager?: boolean
-  clearAuthStateAndRedirect?: () => void
+  clearAuthStateAndRedirectIfNecessary?: () => void
   // ADMIN
   isCheckingAuth?: boolean
   adminUpdateTimes?: Date[]

src/state/AppStateProvider.tsx

@@ -21,7 +21,7 @@ import {
   hasAuthEmailCookie,
 } from '@/auth/client';
 import { useRouter, usePathname } from 'next/navigation';
-import { isPathAdmin, PATH_SIGN_IN } from '@/app/paths';
+import { isPathAdmin, PATH_ROOT } from '@/app/paths';
 import { INITIAL_UPLOAD_STATE, UploadState } from '@/admin/upload';
 import { RecipeProps } from '@/recipe';
 import { getCountsForCategoriesCachedAction } from '@/category/actions';
@@ -105,6 +105,8 @@ export default function AppStateProvider({
     setIsUserSignedInEager(hasAuthEmailCookie());
     if (!authError) {
       setUserEmail(auth?.user?.email ?? undefined);
+    } else {
+      setIsUserSignedInEager(false);
     }
   }, [auth, authError]);
   const isUserSignedIn = Boolean(userEmail);
@@ -133,11 +135,11 @@ export default function AppStateProvider({
     setAdminUpdateTimes(updates => [...updates, new Date()])
   , []);
 
-  const clearAuthStateAndRedirect = useCallback(() => {
+  const clearAuthStateAndRedirectIfNecessary = useCallback(() => {
     setUserEmail(undefined);
     setIsUserSignedInEager(false);
     clearAuthEmailCookie();
-    if (isPathAdmin(pathname)) { router.push(PATH_SIGN_IN); }
+    if (isPathAdmin(pathname)) { router.push(PATH_ROOT); }
   }, [router, pathname]);
 
   // Returns false when upload is cancelled
@@ -187,7 +189,7 @@ export default function AppStateProvider({
         setUserEmail,
         isUserSignedIn,
         isUserSignedInEager,
-        clearAuthStateAndRedirect,
+        clearAuthStateAndRedirectIfNecessary,
         // ADMIN
         adminUpdateTimes,
         registerAdminUpdate,