Sanitize connection profiles before storing

Avoid persisting sensitive credentials in localStorage by stripping secret fields (proxyPassword, pangolinToken) before serializing connection profiles. Add stripSensitiveConnectionFields and canAutoRestoreConnectionProfile helpers to normalize profiles and only auto-restore sessions when required secrets are present/valid. Initialize LoginPage state from sanitized stored profile when available and update tests to reflect sanitized storage and conditional restore behavior.

Author: hhftechnology

mobile/src/contexts/ApiContext.tsx

@@ -1,13 +1,15 @@
 import React, { createContext, useCallback, useContext, useMemo, useState } from 'react';
 import {
   buildConnectionCandidates,
+  canAutoRestoreConnectionProfile,
   createDefaultConnectionProfileDraft,
   finalizeConnectionProfile,
   isExplicitHttpUrl,
   normalizeConnectionProfileDraft,
   parsePangolinAccessToken,
   parseStoredConnectionProfile,
   serializeConnectionProfile,
+  stripSensitiveConnectionFields,
   type ConnectionMode,
   type ConnectionProfile,
   type ConnectionProfileDraft,
@@ -35,7 +37,7 @@ function readInitialConnectionProfile(): ConnectionProfile | null {
   const stored = parseStoredConnectionProfile(
     localStorage.getItem(CONNECTION_PROFILE_KEY),
   );
-  if (stored) return stored;
+  if (stored && canAutoRestoreConnectionProfile(stored)) return stored;
 
   const legacyBaseUrl = localStorage.getItem(LEGACY_BASE_URL_KEY);
   if (!legacyBaseUrl) return null;
@@ -162,7 +164,9 @@ export const ApiProvider: React.FC<{ children: React.ReactNode }> = ({
           setConnectionProfile(candidateProfile);
           localStorage.setItem(
             CONNECTION_PROFILE_KEY,
-            serializeConnectionProfile(candidateProfile),
+            serializeConnectionProfile(
+              stripSensitiveConnectionFields(candidateProfile),
+            ),
           );
           localStorage.removeItem(LEGACY_BASE_URL_KEY);
           localStorage.removeItem(LEGACY_INSECURE_KEY);

mobile/src/lib/connection.ts

@@ -136,6 +136,37 @@ export function parseStoredConnectionProfile(value: string | null): ConnectionPr
   }
 }
 
+export function stripSensitiveConnectionFields(
+  profile: ConnectionProfile,
+): ConnectionProfile {
+  const normalized = normalizeConnectionProfileDraft(profile);
+
+  return {
+    ...normalized,
+    proxyPassword: '',
+    pangolinToken: '',
+  };
+}
+
+export function canAutoRestoreConnectionProfile(
+  profile: ConnectionProfile,
+): boolean {
+  const normalized = normalizeConnectionProfileDraft(profile);
+
+  if (normalized.mode === 'proxy-basic') {
+    return Boolean(normalized.baseUrl && normalized.proxyPassword);
+  }
+
+  if (normalized.mode === 'pangolin') {
+    return Boolean(
+      normalized.baseUrl &&
+        parsePangolinAccessToken(normalized.pangolinToken),
+    );
+  }
+
+  return Boolean(normalized.baseUrl);
+}
+
 export function serializeConnectionProfile(profile: ConnectionProfile): string {
   return JSON.stringify(normalizeConnectionProfileDraft(profile));
 }

mobile/src/pages/LoginPage.tsx

@@ -7,14 +7,20 @@ import { Button } from '@/components/ui/button';
 import {
   createDefaultConnectionProfileDraft,
   isConnectionDraftComplete,
+  parseStoredConnectionProfile,
   type ConnectionProfileDraft,
 } from '@/lib/connection';
 
+const CONNECTION_PROFILE_KEY = 'csm_connection_profile';
+
 export default function LoginPage() {
   const navigate = useNavigate();
   const { login, isLoading, error } = useApi();
   const [profile, setProfile] = useState<ConnectionProfileDraft>(
-    createDefaultConnectionProfileDraft,
+    () =>
+      parseStoredConnectionProfile(
+        localStorage.getItem(CONNECTION_PROFILE_KEY),
+      ) ?? createDefaultConnectionProfileDraft(),
   );
 
   const handleSubmit = async (event: React.FormEvent) => {

mobile/src/test/api-context.test.tsx

@@ -111,7 +111,7 @@ describe('ApiContext', () => {
     });
   });
 
-  it('persists the full profile and clears it on logout', async () => {
+  it('persists only non-secret profile fields and clears them on logout', async () => {
     vi.spyOn(globalThis, 'fetch').mockResolvedValue(
       new Response(
         JSON.stringify({
@@ -150,7 +150,7 @@ describe('ApiContext', () => {
       mode: 'proxy-basic',
       baseUrl: 'https://proxy.example.com',
       proxyUsername: 'alice',
-      proxyPassword: 'secret',
+      proxyPassword: '',
     });
 
     fireEvent.click(screen.getByRole('button', { name: 'Logout' }));
@@ -161,6 +161,30 @@ describe('ApiContext', () => {
     expect(localStorage.getItem('csm_connection_profile')).toBeNull();
   });
 
+  it('does not restore secret-backed authenticated sessions from sanitized storage', () => {
+    localStorage.setItem(
+      'csm_connection_profile',
+      JSON.stringify({
+        mode: 'pangolin',
+        baseUrl: 'https://pangolin.example.com',
+        allowInsecure: false,
+        proxyUsername: '',
+        proxyPassword: '',
+        pangolinToken: '',
+        pangolinTokenParam: 'p_token',
+      }),
+    );
+
+    render(
+      <ApiProvider>
+        <Harness draft={createDraft()} />
+      </ApiProvider>,
+    );
+
+    expect(screen.getByTestId('base-url')).toHaveTextContent('');
+    expect(screen.getByTestId('mode')).toHaveTextContent('');
+  });
+
   it('migrates legacy url-only storage into the new profile shape', () => {
     localStorage.setItem('csm_base_url', 'https://legacy.example.com');
     localStorage.setItem('csm_allow_insecure', 'true');

mobile/src/test/login-page.test.tsx

@@ -21,6 +21,7 @@ vi.mock('react-router-dom', async () => {
 
 describe('LoginPage', () => {
   beforeEach(() => {
+    localStorage.clear();
     mockUseApi.mockReset();
     mockNavigate.mockReset();
     mockUseApi.mockReturnValue({
@@ -88,4 +89,31 @@ describe('LoginPage', () => {
     });
     expect(screen.getByRole('button', { name: 'Connect' })).toBeEnabled();
   });
+
+  it('prefills non-secret saved connection fields from storage', () => {
+    localStorage.setItem(
+      'csm_connection_profile',
+      JSON.stringify({
+        mode: 'proxy-basic',
+        baseUrl: 'https://proxy.example.com',
+        allowInsecure: false,
+        proxyUsername: 'alice',
+        proxyPassword: '',
+        pangolinToken: '',
+        pangolinTokenParam: 'p_token',
+      }),
+    );
+
+    render(<LoginPage />);
+
+    const proxyTab = screen.getByRole('tab', { name: 'Proxy' });
+    fireEvent.mouseDown(proxyTab);
+    fireEvent.click(proxyTab);
+
+    expect(screen.getByLabelText('Server URL')).toHaveValue(
+      'https://proxy.example.com',
+    );
+    expect(screen.getByLabelText('Proxy username')).toHaveValue('alice');
+    expect(screen.getByLabelText('Proxy password')).toHaveValue('');
+  });
 });