refactor(hooks): adopt eslint-plugin-react-hooks v6 rules (Next 16)

app/auth/forgot-password/page.tsx

@@ -32,9 +32,15 @@ export default function ForgotPasswordPage() {
     return () => clearInterval(timer);
   }, [rateLimitSeconds]);
 
-  // Redirect if already logged in
+  // Redirect if already logged in. Runs in an effect (not during render) so the
+  // navigation side effect stays out of the render phase.
+  useEffect(() => {
+    if (user) {
+      window.location.href = ROUTES.SETTINGS;
+    }
+  }, [user]);
+
   if (user) {
-    window.location.href = ROUTES.SETTINGS;
     return null;
   }
 

app/auth/reset-password/page.tsx

@@ -23,6 +23,7 @@ export default function ResetPasswordPage() {
     // User should have a session from the email link
     // Supabase handles the token exchange automatically
     if (session) {
+      // eslint-disable-next-line react-hooks/set-state-in-effect -- syncs a local validity flag to the external Supabase auth session
       setIsValidSession(true);
     } else {
       // Give it a moment for the session to be established

app/auth/signin/page.tsx

@@ -33,9 +33,15 @@ export default function SignInPage() {
     return () => clearInterval(timer);
   }, [rateLimitSeconds]);
 
-  // Redirect if already logged in
+  // Redirect if already logged in. Runs in an effect (not during render) so the
+  // navigation side effect stays out of the render phase.
+  useEffect(() => {
+    if (user) {
+      window.location.href = ROUTES.SETTINGS;
+    }
+  }, [user]);
+
   if (user) {
-    window.location.href = ROUTES.SETTINGS;
     return null;
   }
 

app/auth/signup/page.tsx

@@ -34,9 +34,15 @@ export default function SignUpPage() {
     return () => clearInterval(timer);
   }, [rateLimitSeconds]);
 
-  // Redirect if already logged in
+  // Redirect if already logged in. Runs in an effect (not during render) so the
+  // navigation side effect stays out of the render phase.
+  useEffect(() => {
+    if (user) {
+      window.location.href = ROUTES.SETTINGS;
+    }
+  }, [user]);
+
   if (user) {
-    window.location.href = ROUTES.SETTINGS;
     return null;
   }
 

app/auth/verify-email/page.tsx

@@ -36,6 +36,20 @@ export default function VerifyEmailPage() {
     return () => clearInterval(timer);
   }, [rateLimitSeconds]);
 
+  // Redirects run in effects (not during render) so the navigation side effects
+  // stay out of the render phase.
+  useEffect(() => {
+    if (!loading && !user) {
+      window.location.href = ROUTES.AUTH.SIGNIN;
+    }
+  }, [loading, user]);
+
+  useEffect(() => {
+    if (!loading && user && isEmailVerified) {
+      window.location.href = ROUTES.SETTINGS;
+    }
+  }, [loading, user, isEmailVerified]);
+
   const isRateLimited = rateLimitSeconds > 0;
 
   const handleResend = async () => {
@@ -72,15 +86,13 @@ export default function VerifyEmailPage() {
     return <PageLoading />;
   }
 
-  // Not logged in - redirect to signin
+  // Not logged in - the effect above redirects to signin.
   if (!user) {
-    window.location.href = ROUTES.AUTH.SIGNIN;
     return null;
   }
 
-  // Already verified - redirect to settings
+  // Already verified - the effect above redirects to settings.
   if (isEmailVerified) {
-    window.location.href = ROUTES.SETTINGS;
     return null;
   }
 

app/blog/[slug]/page.tsx

@@ -74,64 +74,62 @@ export default async function BlogPost({ params }: { params: Promise<{ slug: str
   const { slug } = await params;
   console.info('Rendering blog post for slug:', slug);
 
-  try {
-    if (!slug) {
-      console.info('Missing slug parameter');
-      notFound();
-    }
+  // No try/catch: notFound() and render errors must propagate to Next's
+  // not-found.tsx / error.tsx boundaries. A catch that only re-throws would also
+  // spuriously log notFound() as an error.
+  if (!slug) {
+    console.info('Missing slug parameter');
+    notFound();
+  }
 
-    const post = await fetchBlogPostBySlug(slug);
+  const post = await fetchBlogPostBySlug(slug);
 
-    if (!post) {
-      console.info('Blog post not found for slug:', slug);
-      notFound();
-    }
+  if (!post) {
+    console.info('Blog post not found for slug:', slug);
+    notFound();
+  }
 
-    return (
-      <article className="mx-auto max-w-3xl px-6 py-16">
-        <header className="mb-12">
-          <div className="flex items-center gap-4 text-sm text-gray-500">
-            <time dateTime={post.date}>{format(new Date(post.date), 'MMMM d, yyyy')}</time>
-            <span>•</span>
-            <span>{post.author}</span>
-          </div>
+  return (
+    <article className="mx-auto max-w-3xl px-6 py-16">
+      <header className="mb-12">
+        <div className="flex items-center gap-4 text-sm text-gray-500">
+          <time dateTime={post.date}>{format(new Date(post.date), 'MMMM d, yyyy')}</time>
+          <span>•</span>
+          <span>{post.author}</span>
+        </div>
 
-          <h1 className="mt-4 text-4xl font-semibold tracking-tight text-gray-900">{post.title}</h1>
+        <h1 className="mt-4 text-4xl font-semibold tracking-tight text-gray-900">{post.title}</h1>
 
-          {post.tags && post.tags.length > 0 && (
-            <div className="mt-4 flex flex-wrap gap-2">
-              {post.tags.map((tag) => (
-                <span
-                  key={tag}
-                  className="inline-block rounded-full bg-gray-100 px-3 py-1 text-xs text-gray-700"
-                >
-                  {tag}
-                </span>
-              ))}
-            </div>
-          )}
+        {post.tags && post.tags.length > 0 && (
+          <div className="mt-4 flex flex-wrap gap-2">
+            {post.tags.map((tag) => (
+              <span
+                key={tag}
+                className="inline-block rounded-full bg-gray-100 px-3 py-1 text-xs text-gray-700"
+              >
+                {tag}
+              </span>
+            ))}
+          </div>
+        )}
 
-          {post.featuredImage && (
-            <div className="mt-8 relative h-96 w-full overflow-hidden rounded-lg">
-              <Image
-                src={post.featuredImage}
-                alt={post.title}
-                fill
-                sizes="(max-width: 1024px) 100vw, 800px"
-                className="object-cover"
-                priority
-              />
-            </div>
-          )}
-        </header>
+        {post.featuredImage && (
+          <div className="mt-8 relative h-96 w-full overflow-hidden rounded-lg">
+            <Image
+              src={post.featuredImage}
+              alt={post.title}
+              fill
+              sizes="(max-width: 1024px) 100vw, 800px"
+              className="object-cover"
+              priority
+            />
+          </div>
+        )}
+      </header>
 
-        <ServerMDXContent content={post.content} slug={post.slug} />
+      <ServerMDXContent content={post.content} slug={post.slug} />
 
-        <Comments slug={post.slug} />
-      </article>
-    );
-  } catch (error) {
-    console.info('Error rendering blog post:', error);
-    throw error;
-  }
+      <Comments slug={post.slug} />
+    </article>
+  );
 }

app/projects/governance/components/CitizenProfile.tsx

@@ -46,6 +46,7 @@ const CitizenProfile: React.FC<CitizenProfileProps> = ({ citizen, agencies: _age
         advisoryPercentage: contribution.percentage,
         difference: 0,
       }));
+      // eslint-disable-next-line react-hooks/set-state-in-effect -- seeds editable advisory distribution from the citizen prop
       setAdvisoryDistribution(initialDistribution);
     }
   }, [citizen.contributions]);

app/projects/governance/components/citizen-profile/index.tsx

@@ -36,6 +36,7 @@ const CitizenProfile: React.FC<CitizenProfileProps> = ({ citizen, agencies: _age
         advisoryPercentage: contribution.percentage,
         difference: 0,
       }));
+      // eslint-disable-next-line react-hooks/set-state-in-effect -- seeds editable advisory distribution from the citizen prop
       setAdvisoryDistribution(initialDistribution);
     }
   }, [citizen.contributions]);

app/settings/page.tsx

@@ -44,6 +44,7 @@ export default function SettingsPage() {
 
   // Initialize profile form when user data loads
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect -- seeds editable form fields from async-loaded user metadata
     if (displayName) setProfileDisplayName(displayName);
     if (avatarUrl) setProfileAvatarUrl(avatarUrl);
   }, [displayName, avatarUrl]);

components/blog/Comments.tsx

@@ -7,6 +7,7 @@ export default function Comments({ slug }: { slug: string }) {
   const [isClient, setIsClient] = useState(false);
 
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect -- client-mount detection for SSR-safe giscus embed
     setIsClient(true);
   }, []);
 

components/blog/MDXComponents.tsx

@@ -70,6 +70,7 @@ const Img = (
     // passes string paths, so narrow before the string operations below.
     if (!src || typeof src !== 'string') {
       console.info('Image source missing');
+      // eslint-disable-next-line react-hooks/set-state-in-effect -- client-only image URL resolution (reads window.location as a slug fallback)
       setIsError(true);
       return;
     }

components/conversations/ConversationList.tsx

@@ -49,6 +49,7 @@ export const ConversationList = ({
   }, [botType, botId, documentId]);
 
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect -- loads conversations from the API on mount
     loadConversations();
   }, [loadConversations, refreshTrigger]);
 

components/shared/ProfessionalDemo.tsx

@@ -51,6 +51,7 @@ export const ProfessionalDemo: FC<ProfessionalDemoProps> = ({ professional }) =>
       role: 'assistant',
       content: getWelcomeMessage(),
     };
+    // eslint-disable-next-line react-hooks/set-state-in-effect -- seeds the on-mount welcome message
     setMessages([welcomeMessage]);
     inputRef.current?.focus({ preventScroll: true });
   }, [getWelcomeMessage]);

components/shared/quick-create/QuickChat.tsx

@@ -80,6 +80,7 @@ export const QuickChat: FC<QuickChatProps> = ({ bot, onReset }) => {
       role: 'assistant',
       content: getWelcomeMessage(),
     };
+    // eslint-disable-next-line react-hooks/set-state-in-effect -- seeds the on-mount welcome message
     setMessages([welcomeMessage]);
     inputRef.current?.focus({ preventScroll: true });
   }, [getWelcomeMessage]);

eslint.config.mjs

@@ -45,15 +45,6 @@ const eslintConfig = [
       'react/no-unescaped-entities': 'off',
       'react/display-name': 'off',
       '@next/next/no-img-element': 'warn',
-      // eslint-plugin-react-hooks v6 (bundled with Next 16's eslint-config-next)
-      // adds React-Compiler-era rules that did not exist in the Next 15 config and
-      // flag pre-existing intentional patterns (localStorage hydration, load-on-mount
-      // effects). Adopting them is a dedicated refactor, out of scope for this
-      // framework upgrade — deferred, tracked as follow-up. rules-of-hooks and
-      // exhaustive-deps stay enabled.
-      'react-hooks/set-state-in-effect': 'off',
-      'react-hooks/error-boundaries': 'off',
-      'react-hooks/immutability': 'off',
     },
   },
 ];

hooks/useDocumentChat.ts

@@ -29,6 +29,7 @@ export const useDocumentChat = ({ selectedDocId }: UseDocumentChatOptions) => {
   // Load conversation messages when active conversation changes
   useEffect(() => {
     if (!activeConversationId) {
+      // eslint-disable-next-line react-hooks/set-state-in-effect -- resets messages when the active conversation clears
       setChatMessages([]);
       return;
     }

lib/auth.tsx

@@ -76,6 +76,7 @@ export function AuthProvider({ children }: { children: ReactNode }) {
 
     // If Supabase is not configured, just set loading to false
     if (!client) {
+      // eslint-disable-next-line react-hooks/set-state-in-effect -- initializes auth state from the external Supabase client
       setLoading(false);
       return;
     }

lib/hooks/useDashboardStats.ts

@@ -116,6 +116,7 @@ export function useDashboardStats(userId: string | undefined): UseDashboardStats
   }, [userId]);
 
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect -- loads dashboard stats from the API on mount
     loadData();
   }, [loadData]);
 

lib/hooks/useLocalStorage.ts

@@ -15,6 +15,7 @@ export function useLocalStorageFlag(
   useEffect(() => {
     const stored = localStorage.getItem(key);
     if (stored !== null) {
+      // eslint-disable-next-line react-hooks/set-state-in-effect -- hydrates from localStorage after mount (SSR-safe by design)
       setValue(stored === 'true');
     }
   }, [key]);