diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index d0f17a4e..341f484f 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -8,6 +8,7 @@ import { FullAttemptLogsPage } from '@/pages/FullAttemptLogs'; import { NormalLayout } from '@/components/layout/NormalLayout'; import { usePostHog } from 'posthog-js/react'; import { useAuth } from '@/hooks'; +import { usePreviousPath } from '@/hooks/usePreviousPath'; import { AgentSettings, @@ -42,6 +43,9 @@ function AppContent() { const posthog = usePostHog(); const { isSignedIn } = useAuth(); + // Track previous path for back navigation + usePreviousPath(); + // Handle opt-in/opt-out and user identification when config loads useEffect(() => { if (!posthog || !analyticsUserId) return; diff --git a/frontend/src/hooks/usePreviousPath.ts b/frontend/src/hooks/usePreviousPath.ts new file mode 100644 index 00000000..03515cdd --- /dev/null +++ b/frontend/src/hooks/usePreviousPath.ts @@ -0,0 +1,28 @@ +import { useCallback, useEffect } from 'react'; +import { useLocation, useNavigate } from 'react-router-dom'; + +const globalVisited: string[] = []; + +export function usePreviousPath() { + const navigate = useNavigate(); + const location = useLocation(); + + // Track pathnames as user navigates + useEffect(() => { + if (globalVisited[globalVisited.length - 1] !== location.pathname) { + globalVisited.push(location.pathname); + // Keep only last 50 entries to prevent memory bloat + if (globalVisited.length > 50) { + globalVisited.splice(0, globalVisited.length - 50); + } + } + }, [location]); + + return useCallback(() => { + // Find last non-settings route in history + const lastNonSettingsPath = [...globalVisited] + .reverse() + .find((p) => !p.startsWith('/settings')); + navigate(lastNonSettingsPath || '/'); + }, [navigate]); +} diff --git a/frontend/src/pages/settings/SettingsLayout.tsx b/frontend/src/pages/settings/SettingsLayout.tsx index e7db80ae..41987487 100644 --- a/frontend/src/pages/settings/SettingsLayout.tsx +++ b/frontend/src/pages/settings/SettingsLayout.tsx @@ -1,4 +1,4 @@ -import { NavLink, Outlet, useNavigate } from 'react-router-dom'; +import { NavLink, Outlet } from 'react-router-dom'; import { useTranslation } from 'react-i18next'; import { Settings, Cpu, Server, X, FolderOpen, Building2 } from 'lucide-react'; import { cn } from '@/lib/utils'; @@ -7,6 +7,7 @@ import { useEffect } from 'react'; import { useHotkeysContext } from 'react-hotkeys-hook'; import { useKeyExit } from '@/keyboard/hooks'; import { Scope } from '@/keyboard/registry'; +import { usePreviousPath } from '@/hooks/usePreviousPath'; const settingsNavigation = [ { @@ -34,6 +35,7 @@ const settingsNavigation = [ export function SettingsLayout() { const { t } = useTranslation('settings'); const { enableScope, disableScope } = useHotkeysContext(); + const goToPreviousPath = usePreviousPath(); // Enable SETTINGS scope when component mounts useEffect(() => { @@ -43,13 +45,8 @@ export function SettingsLayout() { }; }, [enableScope, disableScope]); - const navigate = useNavigate(); - - const handleBack = () => { - navigate(-1); - }; // Register ESC keyboard shortcut - useKeyExit(handleBack, { scope: Scope.SETTINGS }); + useKeyExit(goToPreviousPath, { scope: Scope.SETTINGS }); return (
@@ -61,7 +58,7 @@ export function SettingsLayout() {