Prevent POST /usage 404 flooding on sign out (#144)

apps/web/src/app/(authenticated)/layout.tsx

@@ -17,7 +17,7 @@ export default async function AuthenticatedLayout({
   const authResult = await authorize();
 
   if (!authResult.success) {
-    redirect('/select-org');
+    redirect('/sign-in');
   }
 
   // Set enhanced Sentry context for authenticated users.

apps/web/src/app/(authenticated)/usage/Usage.tsx

@@ -2,11 +2,13 @@
 
 import { useState, useCallback } from 'react';
 import { useTranslations } from 'next-intl';
+import { useUser } from '@clerk/nextjs';
 import { X } from 'lucide-react';
 
 import type { TaskWithUser } from '@/actions/analytics';
 import { Badge, Button } from '@/components/ui';
 import { UsageCard } from '@/components/usage';
+import { Loading } from '@/components/layout';
 
 import { type Filter, type ViewMode, viewModes } from './types';
 import { Developers } from './Developers';
@@ -20,6 +22,7 @@ type UsageProps = {
 };
 
 export const Usage = ({ userRole = 'admin', currentUserId }: UsageProps) => {
+  const { isSignedIn } = useUser();
   const t = useTranslations('Analytics');
   const [viewMode, setViewMode] = useState<ViewMode>('tasks');
   const [filter, setFilter] = useState<Filter | null>(null);
@@ -30,16 +33,20 @@ export const Usage = ({ userRole = 'admin', currentUserId }: UsageProps) => {
     setViewMode('tasks');
   }, []);
 
-  // For members, automatically set filter to their user ID and hide other tabs
+  // For members, automatically set filter to their user ID and hide other tabs.
   const isMember = userRole === 'member';
   const availableViewModes = isMember ? (['tasks'] as const) : viewModes;
 
-  // Auto-apply user filter for members
+  // Auto-apply user filter for members.
   const effectiveFilter =
     isMember && currentUserId
       ? { type: 'userId' as const, value: currentUserId, label: 'Your Tasks' }
       : filter;
 
+  if (!isSignedIn) {
+    return <Loading />;
+  }
+
   return (
     <>
       <div className="flex flex-col gap-3 sm:gap-4 lg:gap-6">

apps/web/src/app/(centered)/signed-out/page.tsx

@@ -1,18 +0,0 @@
-'use client';
-
-import { useEffect } from 'react';
-import { LoaderCircle } from 'lucide-react';
-
-export default function Page() {
-  useEffect(() => {
-    setTimeout(() => {
-      window.location.href = '/sign-in';
-    }, 1000);
-  }, []);
-
-  return (
-    <div className="flex justify-center">
-      <LoaderCircle className="animate-spin" />
-    </div>
-  );
-}

apps/web/src/components/layout/AuthProvider.tsx

@@ -23,7 +23,7 @@ export const AuthProvider = ({
     <ClerkProvider
       appearance={{ baseTheme }}
       localization={localization}
-      afterSignOutUrl={'/signed-out'}
+      afterSignOutUrl={'/sign-in'}
     >
       <SentryUserContext />
       {children}

apps/web/src/middleware.ts

@@ -7,7 +7,6 @@ const isUnprotectedRoute = createRouteMatcher([
   '/extension/sign-in(.*)',
   '/api/marketplace(.*)',
   '/share(.*)',
-  '/signed-out(.*)',
   '/',
 ]);