From 210a676ed9e6a18d198c40f85c56a1907d7edfe6 Mon Sep 17 00:00:00 2001 From: Sajid Mehmood Date: Wed, 12 Nov 2025 13:04:13 -0500 Subject: [PATCH] Fix navigation during render warning MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Move navigation logic from render to useEffect to prevent React warning about state updates during render. Use ref to track redirect state and handle both cloud mode (window.location.assign) and standard mode (router.replace) navigation. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- src/app/(main)/App.tsx | 22 +++++++++++++++++----- 1 file changed, 17 insertions(+), 5 deletions(-) diff --git a/src/app/(main)/App.tsx b/src/app/(main)/App.tsx index 32218d11..0177983c 100644 --- a/src/app/(main)/App.tsx +++ b/src/app/(main)/App.tsx @@ -1,5 +1,6 @@ 'use client'; import { Grid, Loading, Column, Row } from '@umami/react-zen'; +import { useEffect, useRef } from 'react'; import Script from 'next/script'; import { UpdateNotice } from './UpdateNotice'; import { SideNav } from '@/app/(main)/SideNav'; @@ -11,16 +12,27 @@ export function App({ children }) { const config = useConfig(); const { pathname, router } = useNavigation(); + // Avoid navigation during render; perform redirect after commit. + const redirectedRef = useRef(false); + useEffect(() => { + if (redirectedRef.current) return; + if (isLoading) return; + if (error) { + redirectedRef.current = true; + if (process.env.cloudMode) { + window.location.assign('/login'); + } else { + router.replace('/login'); + } + } + }, [isLoading, error, router]); + if (isLoading || !config) { return ; } if (error) { - if (process.env.cloudMode) { - window.location.href = '/login'; - } else { - router.push('/login'); - } + // Navigation handled in effect to prevent React warning in dev. return null; }