Allow switching GLM session mode

Author: zwaetschge

packages/frontend/src/pages/SessionPage.tsx

@@ -52,10 +52,12 @@ export function SessionPage() {
   const [mobileView, setMobileView] = useState<MobileView>('chat');
   const [showAllowedDirsDialog, setShowAllowedDirsDialog] = useState(false);
   const [now, setNow] = useState(Date.now());
+  const loadedModeForSessionRef = useRef<string | null>(null);
 
   const { usage, addMessage } = useSessionStore();
   const { uiProvider } = useProviderStore();
   const providerLabel = UI_PROVIDER_META[uiProvider].label;
+  const sessionModeStorageKey = useMemo(() => (id ? `sessionMode:${id}` : null), [id]);
 
   // Mobile swipe gesture navigation
   const mobileViewOrder = useMemo((): MobileView[] => {
@@ -247,6 +249,23 @@ export function SessionPage() {
     return `${seconds}s`;
   }, []);
 
+  const allowedSessionModes: SessionMode[] = useMemo(
+    () => ['planning', 'auto-accept', 'manual', 'danger', 'orchestration'],
+    []
+  );
+
+  const getStoredSessionMode = useCallback((key: string) => {
+    try {
+      const stored = window.localStorage.getItem(key);
+      if (stored && allowedSessionModes.includes(stored as SessionMode)) {
+        return stored as SessionMode;
+      }
+    } catch {
+      // Ignore storage errors (private mode, blocked, etc.)
+    }
+    return null;
+  }, [allowedSessionModes]);
+
   // Fetch session details
   const { data: session, isLoading: sessionLoading } = useQuery({
     queryKey: ['session', id],
@@ -264,11 +283,27 @@ export function SessionPage() {
     if (!id || !session) {
       return;
     }
-    if (session.cliProvider === 'glm' && sessionMode === 'auto-accept') {
-      setSessionMode('planning');
-      socketService.setSessionMode(id, 'planning');
+    if (sessionModeStorageKey && loadedModeForSessionRef.current !== id) {
+      const storedMode = getStoredSessionMode(sessionModeStorageKey);
+      if (storedMode) {
+        setSessionMode(storedMode);
+        socketService.setSessionMode(id, storedMode);
+      }
+      loadedModeForSessionRef.current = id;
     }
-  }, [id, session, sessionMode]);
+    if (session.cliProvider === 'glm' && sessionModeStorageKey) {
+      const storedMode = getStoredSessionMode(sessionModeStorageKey);
+      if (!storedMode && sessionMode === 'auto-accept') {
+        setSessionMode('planning');
+        socketService.setSessionMode(id, 'planning');
+        try {
+          window.localStorage.setItem(sessionModeStorageKey, 'planning');
+        } catch {
+          // Ignore storage errors
+        }
+      }
+    }
+  }, [id, session, sessionMode, sessionModeStorageKey, getStoredSessionMode]);
 
   const limitsProvider = session?.cliProvider;
   const limitsSupported = limitsProvider === 'claude' || limitsProvider === 'glm';
@@ -364,7 +399,7 @@ export function SessionPage() {
     return () => {
       socketService.unsubscribeFromSession(id);
     };
-  }, [id]);
+  }, [id, sessionModeStorageKey]);
 
   // Scroll to bottom when new messages arrive
   useEffect(() => {
@@ -490,6 +525,13 @@ export function SessionPage() {
     if (id) {
       socketService.setSessionMode(id, newMode);
     }
+    if (sessionModeStorageKey) {
+      try {
+        window.localStorage.setItem(sessionModeStorageKey, newMode);
+      } catch {
+        // Ignore storage errors
+      }
+    }
   }, [id]);
 
   // Handler for hooks-based permission response