Fix/theme toggle UI

frontend/package.json

@@ -55,6 +55,7 @@
     "react-router": "^6.30.4",
     "dompurify": "^3.4.10",
     "@babel/core": "^7.29.7",
+    "nanoid": "^3.3.9",
     "undici": "^8.10.0"
   }
 }

frontend/src/pages/SignIn.tsx

@@ -13,11 +13,32 @@ import { routes } from '../routes'
  * POST /api/v1/auth/session). On success we mark the session authenticated and
  * return the operator to the route they were sent here from (or the dashboard).
  */
+function isSafeInternalPath(path: string): boolean {
+  if (!path.startsWith('/')) {
+    return false
+  }
+  // Prevent protocol-relative URLs like //evil.com
+  if (path.startsWith('//')) {
+    return false
+  }
+  // Prevent backslash protocol-relative bypasses or Windows share paths like /\evil.com
+  if (path.startsWith('/\\')) {
+    return false
+  }
+  // Ensure no protocols/schemes (e.g. http://, https://, javascript:) are in the pathname
+  if (/^[a-z0-9+.-]+:/i.test(path.trim())) {
+    return false
+  }
+  return true
+}
+
 export default function SignIn() {
   const { isAuthenticated, loading, markAuthenticated } = useAuth()
   const navigate = useNavigate()
   const location = useLocation() as { state?: { from?: { pathname?: string } } }
-  const from = location.state?.from?.pathname || routes.dashboard
+
+  const rawFrom = location.state?.from?.pathname
+  const from = rawFrom && isSafeInternalPath(rawFrom) ? rawFrom : routes.dashboard
 
   // If a valid session already exists, don't show the key prompt.
   useEffect(() => {

frontend/tailwind.config.js

@@ -8,25 +8,25 @@ export default {
   theme: {
     extend: {
       colors: {
-        'primary': 'var(--bg-primary)',
-        'secondary': 'var(--bg-secondary)',
-        'bg-primary': 'var(--bg-primary)',
-        'bg-secondary': 'var(--bg-secondary)',
-        'bg-tertiary': 'var(--bg-tertiary)',
-        'bg-elevated': 'var(--bg-elevated)',
-        'primary-text': 'var(--text-primary)',
-        'secondary-text': 'var(--text-secondary)',
-        'muted': 'var(--text-muted)',
-        'charcoal-dark': 'var(--bg-primary)',
+        'primary': 'color-mix(in srgb, var(--bg-primary) 100%, transparent)',
+        'secondary': 'color-mix(in srgb, var(--bg-secondary) 100%, transparent)',
+        'bg-primary': 'color-mix(in srgb, var(--bg-primary) 100%, transparent)',
+        'bg-secondary': 'color-mix(in srgb, var(--bg-secondary) 100%, transparent)',
+        'bg-tertiary': 'color-mix(in srgb, var(--bg-tertiary) 100%, transparent)',
+        'bg-elevated': 'color-mix(in srgb, var(--bg-elevated) 100%, transparent)',
+        'primary-text': 'color-mix(in srgb, var(--text-primary) 100%, transparent)',
+        'secondary-text': 'color-mix(in srgb, var(--text-secondary) 100%, transparent)',
+        'muted': 'color-mix(in srgb, var(--text-muted) 100%, transparent)',
+        'charcoal-dark': 'color-mix(in srgb, var(--bg-primary) 100%, transparent)',
         charcoal: {
-          light: 'var(--bg-tertiary)',
-          DEFAULT: 'var(--bg-secondary)',
-          dark: 'var(--bg-primary)', /* mapped for backward compatibility */
+          light: 'color-mix(in srgb, var(--bg-tertiary) 100%, transparent)',
+          DEFAULT: 'color-mix(in srgb, var(--bg-secondary) 100%, transparent)',
+          dark: 'color-mix(in srgb, var(--bg-primary) 100%, transparent)', /* mapped for backward compatibility */
         },
         silver: {
-          bright: 'var(--text-primary)',
-          DEFAULT: 'var(--text-secondary)',
-          dark: 'var(--text-muted)',
+          bright: 'color-mix(in srgb, var(--text-primary) 100%, transparent)',
+          DEFAULT: 'color-mix(in srgb, var(--text-secondary) 100%, transparent)',
+          dark: 'color-mix(in srgb, var(--text-muted) 100%, transparent)',
         },
         rag: {
           red: '#ef4444',
@@ -37,7 +37,7 @@ export default {
           'blue-bright': '#3b82f6',    
         },
         accent: {
-          silver: 'var(--accent-silver)'
+          silver: 'color-mix(in srgb, var(--accent-silver) 100%, transparent)'
         }
       },
       fontFamily: {

frontend/testing/unit/pages/SignIn.test.tsx

@@ -64,6 +64,40 @@ describe('SignIn page (issue #795)', () => {
     await waitFor(() => expect(screen.getByText('FINDINGS PAGE')).toBeInTheDocument())
   })
 
+  it('rejects external HTTP/HTTPS URLs and redirects to the dashboard instead', async () => {
+    vi.mocked(authenticateWithApiKey).mockResolvedValue(undefined)
+    renderSignIn({ pathname: '/signin', state: { from: { pathname: 'https://evil.com/findings' } } })
+    await screen.findByLabelText(/Backend API Key/i)
+
+    await userEvent.type(screen.getByLabelText(/Backend API Key/i), 'operator-key-123')
+    await userEvent.click(screen.getByText(/Save and connect/i))
+
+    await waitFor(() => expect(screen.getByText('DASHBOARD HOME')).toBeInTheDocument())
+    expect(screen.queryByText('FINDINGS PAGE')).not.toBeInTheDocument()
+  })
+
+  it('rejects protocol-relative URLs (starts with //) and redirects to the dashboard', async () => {
+    vi.mocked(authenticateWithApiKey).mockResolvedValue(undefined)
+    renderSignIn({ pathname: '/signin', state: { from: { pathname: '//evil.com/findings' } } })
+    await screen.findByLabelText(/Backend API Key/i)
+
+    await userEvent.type(screen.getByLabelText(/Backend API Key/i), 'operator-key-123')
+    await userEvent.click(screen.getByText(/Save and connect/i))
+
+    await waitFor(() => expect(screen.getByText('DASHBOARD HOME')).toBeInTheDocument())
+  })
+
+  it('rejects javascript: schemes and redirects to the dashboard', async () => {
+    vi.mocked(authenticateWithApiKey).mockResolvedValue(undefined)
+    renderSignIn({ pathname: '/signin', state: { from: { pathname: 'javascript:alert(1)' } } })
+    await screen.findByLabelText(/Backend API Key/i)
+
+    await userEvent.type(screen.getByLabelText(/Backend API Key/i), 'operator-key-123')
+    await userEvent.click(screen.getByText(/Save and connect/i))
+
+    await waitFor(() => expect(screen.getByText('DASHBOARD HOME')).toBeInTheDocument())
+  })
+
   it('shows the backend error and does not redirect when the key is rejected', async () => {
     vi.mocked(authenticateWithApiKey).mockRejectedValue(new Error('Invalid API key'))
     renderSignIn()