Merge pull request 'claude/reverent-moore' (#6) from claude/reverent-moore into main

Reviewed-on: #6

frontend/src/pages/preferences/UserPreferencesPage.tsx

@@ -10,7 +10,7 @@ import { usePreferencesStore } from '../../stores/preferencesStore';
 
 export function UserPreferencesPage() {
   const { user, currentOrg } = useAuthStore();
-  const { colorScheme, toggleColorScheme } = usePreferencesStore();
+  const { colorScheme, toggleColorScheme, compactView, toggleCompactView } = usePreferencesStore();
 
   return (
     <Stack>
@@ -78,7 +78,7 @@ export function UserPreferencesPage() {
                 <Text size="sm">Compact View</Text>
                 <Text size="xs" c="dimmed">Reduce spacing in tables and lists</Text>
               </div>
-              <Switch disabled />
+              <Switch checked={compactView} onChange={toggleCompactView} />
             </Group>
             <Divider />
             <Text size="xs" c="dimmed" ta="center">More display preferences coming in a future release</Text>

frontend/src/pages/settings/SettingsPage.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 import {
   Title, Text, Card, Stack, Group, SimpleGrid, Badge, ThemeIcon, Divider,
-  Tabs, Button,
+  Tabs, Button, Switch,
 } from '@mantine/core';
 import {
   IconBuilding, IconUser, IconSettings, IconShieldLock,
@@ -9,6 +9,7 @@ import {
 } from '@tabler/icons-react';
 import { notifications } from '@mantine/notifications';
 import { useAuthStore } from '../../stores/authStore';
+import { usePreferencesStore } from '../../stores/preferencesStore';
 import { MfaSettings } from './MfaSettings';
 import { PasskeySettings } from './PasskeySettings';
 import { LinkedAccounts } from './LinkedAccounts';
@@ -16,6 +17,7 @@ import api from '../../services/api';
 
 export function SettingsPage() {
   const { user, currentOrg } = useAuthStore();
+  const { compactView, toggleCompactView } = usePreferencesStore();
   const [loggingOutAll, setLoggingOutAll] = useState(false);
 
   const handleLogoutEverywhere = async () => {
@@ -112,6 +114,14 @@ export function SettingsPage() {
               <Text size="sm" c="dimmed">API</Text>
               <Text size="sm" ff="monospace" c="dimmed">/api/docs</Text>
             </Group>
+            <Divider />
+            <Group justify="space-between">
+              <div>
+                <Text size="sm">Compact View</Text>
+                <Text size="xs" c="dimmed">Reduce spacing in tables and lists</Text>
+              </div>
+              <Switch checked={compactView} onChange={toggleCompactView} />
+            </Group>
           </Stack>
         </Card>