From 6c0f7ac39c17b99bd4259eb4eca35792aea31dff Mon Sep 17 00:00:00 2001
From: "Kai (Tam Nhu) Tran" <61256810+kaitranntt@users.noreply.github.com>
Date: Sat, 23 May 2026 21:44:53 -0400
Subject: [PATCH] fix(dashboard): clear local control-panel management key
 (#1372)

---
 .../components/cliproxy/control-panel-embed.tsx  | 16 ++++++++++++++++
 .../cliproxy/control-panel-embed.test.tsx        |  2 ++
 2 files changed, 18 insertions(+)

diff --git a/ui/src/components/cliproxy/control-panel-embed.tsx b/ui/src/components/cliproxy/control-panel-embed.tsx
index 1a5c6b1d..6a013a6e 100644
--- a/ui/src/components/cliproxy/control-panel-embed.tsx
+++ b/ui/src/components/cliproxy/control-panel-embed.tsx
@@ -57,6 +57,10 @@ function clearLocalControlPanelSession(): void {
   window.localStorage.removeItem(CONTROL_PANEL_LOGIN_FLAG_KEY);
 }
 
+function clearPersistedLocalControlPanelSecret(): void {
+  window.localStorage.removeItem(CONTROL_PANEL_MANAGEMENT_KEY);
+}
+
 export function ControlPanelEmbed({ port = CLIPROXY_DEFAULT_PORT }: ControlPanelEmbedProps) {
   const { t } = useTranslation();
   const iframeRef = useRef<HTMLIFrameElement>(null);
@@ -162,7 +166,13 @@ export function ControlPanelEmbed({ port = CLIPROXY_DEFAULT_PORT }: ControlPanel
       return;
     }
 
+    const handleBeforeUnload = () => {
+      clearLocalControlPanelSession();
+    };
+    window.addEventListener('beforeunload', handleBeforeUnload);
+
     return () => {
+      window.removeEventListener('beforeunload', handleBeforeUnload);
       clearLocalControlPanelSession();
     };
   }, [isRemote]);
@@ -266,9 +276,15 @@ export function ControlPanelEmbed({ port = CLIPROXY_DEFAULT_PORT }: ControlPanel
   const handleIframeLoad = () => {
     setLoadedFrameKey(iframeKey);
     postRemoteAutoLoginCredentials();
+    if (!isRemote) {
+      clearPersistedLocalControlPanelSecret();
+    }
   };
 
   const handleRefresh = () => {
+    if (!isRemote) {
+      clearLocalControlPanelSession();
+    }
     setLoadedFrameKey(null);
     setIframeRevision((value) => value + 1);
     setError(null);
diff --git a/ui/tests/unit/components/cliproxy/control-panel-embed.test.tsx b/ui/tests/unit/components/cliproxy/control-panel-embed.test.tsx
index e70c0a52..c2463db5 100644
--- a/ui/tests/unit/components/cliproxy/control-panel-embed.test.tsx
+++ b/ui/tests/unit/components/cliproxy/control-panel-embed.test.tsx
@@ -94,6 +94,7 @@ describe('ControlPanelEmbed', () => {
     const iframe = await screen.findByTitle('CLIProxy Management Panel');
 
     expect(iframe).toHaveAttribute('src', '/api/cliproxy-local/management.html');
+    fireEvent.load(iframe);
 
     await waitFor(() => {
       expect(window.localStorage.removeItem).toHaveBeenCalledWith('cli-proxy-auth');
@@ -107,6 +108,7 @@ describe('ControlPanelEmbed', () => {
       );
       expect(window.localStorage.setItem).toHaveBeenCalledWith('managementKey', 'custom-secret');
       expect(window.localStorage.setItem).toHaveBeenCalledWith('isLoggedIn', 'true');
+      expect(window.localStorage.removeItem).toHaveBeenCalledWith('managementKey');
     });
 
     vi.clearAllMocks();