Feat v0.2.5 ui polish dead code (#9)

Co-authored-by: Jeffrey Smith <jasafpro@gmail.com>
Co-committed-by: Jeffrey Smith <jasafpro@gmail.com>

src/css/layout.css

@@ -158,109 +158,6 @@
     margin-left: auto; font-size: 10px; color: var(--text-3);
 }
 
-/* Chat/Channel list */
-.sidebar-chats {
-    flex: 1; overflow-y: auto; overflow-x: hidden;
-    padding: 8px 6px;
-}
-.sidebar-chats::-webkit-scrollbar { width: 4px; }
-
-/* Channels section header */
-.sidebar-section-header {
-    display: flex; align-items: center; gap: 6px;
-    padding: 8px 10px 4px; cursor: pointer;
-    user-select: none;
-}
-.sidebar-section-header .section-arrow {
-    font-size: 10px; color: var(--text-3); transition: transform var(--transition);
-}
-.sidebar-section-header.collapsed .section-arrow { transform: rotate(-90deg); }
-.sidebar-section-header .section-label {
-    font-size: 11px; font-weight: 600; color: var(--text-3);
-    text-transform: uppercase; letter-spacing: 0.5px;
-}
-.sidebar-section-header .section-count {
-    font-size: 10px; color: var(--text-3); margin-left: auto;
-}
-.sidebar.collapsed .sidebar-section-header { display: none; }
-
-.channel-item {
-    display: flex; align-items: center; gap: 8px;
-    padding: 7px 10px; border-radius: var(--radius);
-    cursor: pointer; font-size: 13px; color: var(--text-2);
-    transition: background var(--transition); position: relative;
-    overflow: hidden;
-}
-.channel-item:hover { background: var(--bg-hover); color: var(--text); }
-.channel-item.active { background: var(--bg-raised); color: var(--text); }
-.channel-item .channel-hash { color: var(--text-3); font-weight: 600; flex-shrink: 0; }
-.channel-item .channel-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.sidebar.collapsed .channel-item .channel-name { display: none; }
-
-.chat-group-label {
-    font-size: 11px; font-weight: 600; color: var(--text-3);
-    padding: 12px 10px 4px; text-transform: uppercase; letter-spacing: 0.5px;
-    white-space: nowrap; overflow: hidden;
-}
-.sidebar.collapsed .chat-group-label { display: none; }
-
-.chat-item {
-    display: flex; align-items: center; gap: 8px;
-    padding: 7px 10px; border-radius: var(--radius);
-    cursor: pointer; font-size: 13px; color: var(--text-2);
-    transition: background var(--transition); position: relative;
-    overflow: hidden;
-}
-.chat-item:hover { background: var(--bg-hover); color: var(--text); }
-.chat-item.active { background: var(--bg-raised); color: var(--text); }
-.chat-item-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.chat-item-time {
-    font-size: 10px; color: var(--text-3); flex-shrink: 0;
-    white-space: nowrap;
-}
-.chat-item-delete {
-    opacity: 0; position: absolute; right: 6px; background: var(--bg-raised);
-    border: none; color: var(--text-3); cursor: pointer; font-size: 11px;
-    padding: 2px 6px; border-radius: 4px; transition: opacity var(--transition);
-}
-.chat-item:hover .chat-item-delete { opacity: 1; }
-.chat-item:hover .chat-item-time { display: none; }
-.sidebar.collapsed .chat-item-title,
-.sidebar.collapsed .chat-item-time,
-.sidebar.collapsed .chat-item-delete { display: none; }
-.sidebar.collapsed .sidebar-chats { visibility: hidden; }
-
-.sidebar-empty {
-    color: var(--text-3); font-size: 12px; text-align: center; padding: 2rem 0.5rem;
-}
-.sidebar.collapsed .sidebar-empty { display: none; }
-
-/* User area */
-.sidebar-bottom {
-    border-top: 1px solid var(--border);
-    padding: 8px 10px; position: relative;
-}
-.sidebar-bottom-divider {
-    height: 1px; background: var(--border);
-    margin: 4px 8px;
-}
-.sidebar-notes-btn {
-    color: var(--text-2); font-size: 13px;
-}
-.sidebar-notes-btn:hover { background: var(--bg-hover); color: var(--text); }
-.sidebar.collapsed .sidebar-notes-btn .sb-label { opacity: 0; width: 0; }
-.sidebar.collapsed .sidebar-notes-btn { justify-content: center; padding: 8px 0; gap: 0; }
-.sidebar-editor-btn {
-    display: flex; align-items: center; gap: 10px;
-    padding: 4px 8px; color: var(--text-2); text-decoration: none;
-    font-size: 13px; white-space: nowrap;
-    transition: background var(--transition), color var(--transition);
-}
-.sidebar-editor-btn:hover { background: var(--bg-hover); color: var(--text); text-decoration: none; }
-.sidebar-editor-btn svg { flex-shrink: 0; }
-.sidebar.collapsed .sidebar-editor-btn .sb-label { opacity: 0; width: 0; }
-.sidebar.collapsed .sidebar-editor-btn { justify-content: center; padding: 8px 0; gap: 0; }
-.sidebar.collapsed .sidebar-bottom-divider { margin: 4px 12px; }
 
 .user-btn {
     display: flex; align-items: center; gap: 10px;

src/css/surfaces.css

@@ -1,5 +1,5 @@
 /* ── surfaces.css ─────────────────────────────
-   Admin, settings, editor, projects, stat cards, data tables
+   Admin, settings, editor, stat cards, data tables
    ──────────────────────────────────────────── */
 
 /* ── Admin Storage Panel ────────────────────── */
@@ -19,193 +19,6 @@
 .admin-storage-value { font-size: 14px; font-weight: 500; }
 
 
-/* =========================================
-   PROJECTS (v0.19.0)
-   ========================================= */
-
-.project-group {
-    margin-bottom: 2px;
-    border-radius: var(--radius);
-    transition: background 0.15s;
-}
-.project-group.drag-over {
-    background: color-mix(in srgb, var(--accent) 12%, transparent);
-    outline: 1px dashed var(--accent);
-    outline-offset: -1px;
-    border-radius: var(--radius);
-}
-
-.project-header {
-    display: flex; align-items: center; gap: 6px;
-    padding: 6px 10px; cursor: pointer; user-select: none;
-    border-radius: var(--radius);
-    transition: background var(--transition);
-}
-.project-header:hover { background: var(--bg-hover); }
-
-.project-arrow {
-    font-size: 10px; color: var(--text-3); width: 12px; text-align: center; flex-shrink: 0;
-}
-.project-dot {
-    width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
-    background: var(--text-3); display: inline-block;
-}
-.project-name {
-    font-size: 12px; font-weight: 600; color: var(--text-2);
-    flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
-}
-.project-count {
-    font-size: 10px; color: var(--text-3); flex-shrink: 0; margin-left: auto;
-}
-.project-menu-btn {
-    opacity: 0; background: none; border: none; color: var(--text-3);
-    cursor: pointer; font-size: 14px; padding: 0 4px; border-radius: 4px;
-    transition: opacity var(--transition), background var(--transition);
-    line-height: 1; flex-shrink: 0;
-}
-.project-header:hover .project-menu-btn { opacity: 1; }
-.project-header:hover .project-count { display: none; }
-.project-menu-btn:hover { background: var(--bg-raised); color: var(--text); }
-
-.project-empty {
-    font-size: 11px; color: var(--text-3); padding: 4px 10px 8px 28px;
-    font-style: italic;
-}
-
-/* Active project indicator (v0.19.1) */
-.project-group.active { border-left: 2px solid var(--accent); }
-.project-group.active .project-header { background: color-mix(in srgb, var(--accent) 6%, transparent); }
-.project-pin { font-size: 10px; margin-left: 2px; opacity: 0.7; }
-
-.sidebar.collapsed .project-group { display: none; }
-.sidebar.collapsed .recent-section .chat-group-label { display: none; }
-
-/* Recent section drop target */
-.recent-section { min-height: 40px; }
-.recent-section.drag-over {
-    background: color-mix(in srgb, var(--accent) 8%, transparent);
-    border-radius: var(--radius);
-}
-
-/* Dragging state */
-.chat-item.dragging { opacity: 0.4; }
-.chat-item[draggable="true"] { cursor: grab; }
-.chat-item[draggable="true"]:active { cursor: grabbing; }
-
-/* Context menu */
-.project-ctx-menu {
-    position: fixed; z-index: 9999;
-    background: var(--bg-surface); border: 1px solid var(--border);
-    border-radius: var(--radius); box-shadow: var(--shadow);
-    padding: 4px; min-width: 160px; max-width: 220px;
-}
-.ctx-item {
-    display: flex; align-items: center; gap: 8px;
-    width: 100%; padding: 7px 10px; border: none; background: none;
-    color: var(--text-2); font-size: 13px; cursor: pointer;
-    border-radius: calc(var(--radius) - 2px); text-align: left;
-    white-space: nowrap; overflow: hidden;
-}
-.ctx-item:hover { background: var(--bg-hover); color: var(--text); }
-.ctx-item.ctx-danger:hover { background: var(--danger-bg, #fef2f2); color: var(--danger, #ef4444); }
-.ctx-icon { width: 16px; text-align: center; flex-shrink: 0; font-size: 12px; }
-.ctx-divider { height: 1px; background: var(--border); margin: 3px 0; }
-.ctx-hint { font-size: 11px; color: var(--text-3); padding: 6px 10px; }
-
-/* Time labels inside project-grouped sidebar */
-.chat-time-label { padding-left: 12px; font-size: 10px; }
-
-/* ── Project Detail Panel (v0.19.1) ───────── */
-.project-panel { padding: 16px; display: flex; flex-direction: column; gap: 16px; }
-.project-panel-section { display: flex; flex-direction: column; gap: 6px; }
-.project-panel-section-header { display: flex; justify-content: space-between; align-items: center; }
-.project-panel-label { font-size: 12px; font-weight: 600; color: var(--text-2); text-transform: uppercase; letter-spacing: 0.5px; }
-.project-panel-textarea {
-    width: 100%; resize: vertical; min-height: 80px; padding: 8px;
-    font-family: var(--mono); font-size: 13px;
-    background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius);
-    color: var(--text);
-}
-.project-panel-textarea:focus { outline: none; border-color: var(--accent); }
-.project-panel-status { font-size: 11px; margin-left: 8px; }
-.project-panel-status.success { color: var(--success, #22c55e); }
-.project-panel-status.error { color: var(--danger, #ef4444); }
-.project-panel-list { display: flex; flex-direction: column; gap: 2px; }
-.project-panel-item {
-    display: flex; align-items: center; justify-content: space-between;
-    padding: 6px 8px; border-radius: var(--radius);
-    background: var(--bg); border: 1px solid var(--border);
-    font-size: 13px;
-}
-.project-panel-item-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.project-panel-item-remove {
-    background: none; border: none; cursor: pointer; color: var(--text-3);
-    font-size: 14px; padding: 2px 4px; border-radius: 4px; flex-shrink: 0;
-}
-.project-panel-item-remove:hover { color: var(--danger, #ef4444); background: var(--danger-bg, #fef2f2); }
-.project-panel-empty { font-size: 12px; color: var(--text-3); font-style: italic; padding: 4px 0; }
-.project-panel-select {
-    width: 100%; padding: 6px 8px; font-size: 13px;
-    background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius);
-    color: var(--text);
-}
-.project-panel-select:focus { outline: none; border-color: var(--accent); }
-.project-panel-hint { font-size: 11px; color: var(--text-3); margin-top: 2px; }
-.project-panel-ws-row { display: flex; gap: 6px; align-items: center; }
-.project-panel-ws-row select { flex: 1; }
-.project-panel-checkbox {
-    display: flex; align-items: center; gap: 8px; font-size: 13px;
-    cursor: pointer; color: var(--text-2);
-}
-.project-panel-checkbox input { cursor: pointer; }
-.project-panel-footer { padding-top: 8px; border-top: 1px solid var(--border); }
-.project-show-archived {
-    background: none; border: none; cursor: pointer;
-    font-size: 11px; color: var(--text-3); padding: 6px 10px;
-    width: 100%; text-align: left;
-}
-.project-show-archived:hover { color: var(--text-2); }
-.project-group.archived { opacity: 0.5; }
-.project-group.archived .project-header { font-style: italic; }
-
-/* ── Router Workspace Picker (v0.21.6) ──── */
-
-.router-picker-overlay {
-    position: fixed; inset: 0; z-index: 9999;
-    background: rgba(0,0,0,0.5); backdrop-filter: blur(2px);
-    display: flex; align-items: center; justify-content: center;
-}
-.router-picker {
-    background: var(--bg-primary, #1a1a2e); color: var(--text, #e0e0e0);
-    border: 1px solid var(--border, #333); border-radius: 12px;
-    padding: 24px; min-width: 320px; max-width: 440px;
-    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
-}
-.router-picker h3 { margin: 0 0 4px; font-size: 16px; font-weight: 600; }
-.router-picker p { margin: 0 0 16px; font-size: 13px; color: var(--text-2, #999); }
-.router-picker-list {
-    display: flex; flex-direction: column; gap: 4px;
-    max-height: 280px; overflow-y: auto; margin-bottom: 16px;
-}
-.router-picker-empty {
-    padding: 24px; text-align: center; color: var(--text-3, #666); font-size: 13px;
-}
-.router-picker-item {
-    display: flex; align-items: center; gap: 10px;
-    padding: 10px 12px; border: 1px solid var(--border, #333);
-    border-radius: 8px; background: none; color: var(--text, #e0e0e0);
-    cursor: pointer; font-size: 14px; text-align: left;
-    transition: background 0.15s, border-color 0.15s;
-}
-.router-picker-item:hover {
-    background: var(--hover, rgba(255,255,255,0.05));
-    border-color: var(--accent, #6366f1);
-}
-.router-picker-icon { font-size: 18px; flex-shrink: 0; }
-.router-picker-actions {
-    display: flex; gap: 8px; justify-content: flex-end;
-}
-
 /* ── Settings Surface ────────────────────── */
 
 .surface-settings {
@@ -404,19 +217,6 @@
     font-size: 11px; color: var(--text-3);
     font-family: var(--mono);
 }
-.editor-chat {
-    display: flex; flex-direction: column;
-    min-width: 200px; background: var(--bg-surface);
-}
-.editor-chat-header {
-    padding: 8px 12px; border-bottom: 1px solid var(--border);
-    display: flex; align-items: center; gap: 8px;
-}
-.editor-chat-messages { flex: 1; overflow-y: auto; padding: 12px; }
-.editor-chat-input {
-    padding: 8px 12px; border-top: 1px solid var(--border);
-}
-
 /* ── Stat Cards Grid ──────────────────────── */
 .stat-cards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; margin-bottom: 24px; }
 .stat-card {
@@ -720,45 +520,3 @@
     flex-shrink: 0;
 }
 
-/* ── Chats section folder items ── */
-
-.sb-folder-group { margin-bottom: 1px; }
-.sb-folder-group.drag-over .sb-folder-header { background: var(--accent-dim); }
-.sb-folder-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.sb-folder-menu {
-    visibility: hidden; background: none; border: none; cursor: pointer;
-    color: var(--text-3); font-size: 14px; padding: 0 2px; line-height: 1;
-    flex-shrink: 0; border-radius: 3px;
-}
-.sb-folder-menu:hover { color: var(--text); background: var(--bg-hover); }
-.sb-folder-header:hover .sb-folder-menu { visibility: visible; }
-.sb-folder-empty { padding: 4px 14px 6px 28px; font-size: 11px; color: var(--text-3); font-style: italic; }
-
-.sb-folder-header {
-    display: flex;
-    align-items: center;
-    gap: 6px;
-    padding: 5px 10px;
-    border-radius: 6px;
-    margin: 0 4px;
-    cursor: pointer;
-    font-size: 12px;
-    font-weight: 500;
-    color: var(--text-3);
-    transition: background 0.1s;
-}
-.sb-folder-header:hover { background: var(--bg-hover); color: var(--text-2); }
-
-.sb-folder-arrow { font-size: 9px; flex-shrink: 0; width: 12px; text-align: center; }
-
-/* v0.23.2: Drop zone for chats section */
-#sbBodyChats.drag-over { outline: 2px dashed var(--accent); outline-offset: -2px; border-radius: 4px; }
-.sb-unfiled-zone { min-height: 30px; border-radius: 4px; margin-top: 2px; }
-.sb-unfiled-zone.drag-over { outline: 2px dashed var(--accent); outline-offset: -2px; }
-.sb-unfiled-hint { padding: 6px 14px; font-size: 11px; color: var(--text-3); font-style: italic; }
-
-/* Indented chat items inside folders */
-.chat-item.indented { padding-left: 28px; }
-
-/* ── Notes Surface ─────────────────────── */
-/* v0.37.11: Moved to sw-notes-surface.css (Preact surface) */

src/js/sw/surfaces/admin/index.js

@@ -15,6 +15,7 @@ const { render } = preact;
 
 import { ToastContainer } from '../../primitives/toast.js';
 import { DialogStack } from '../../shell/dialog-stack.js';
+import { UserMenu } from '../../shell/user-menu.js';
 
 // ── Category → Section mapping ──────────────
 const ADMIN_SECTIONS = {
@@ -121,26 +122,6 @@ function AdminSurface() {
         }
     }, [section]);
 
-    // Back button with return URL stash
-    useEffect(() => {
-        const RETURN_KEY = 'sb_admin_return';
-        if (!sessionStorage.getItem(RETURN_KEY)) {
-            const ref = document.referrer;
-            if (ref && ref.startsWith(location.origin) && !ref.includes('/admin')) {
-                sessionStorage.setItem(RETURN_KEY, ref);
-            } else {
-                sessionStorage.setItem(RETURN_KEY, location.origin + BASE + '/');
-            }
-        }
-    }, []);
-
-    const backClick = useCallback((e) => {
-        e.preventDefault();
-        const RETURN_KEY = 'sb_admin_return';
-        const returnURL = sessionStorage.getItem(RETURN_KEY);
-        sessionStorage.removeItem(RETURN_KEY);
-        location.href = returnURL || BASE + '/';
-    }, []);
 
     const navClick = useCallback((e) => {
         e.preventDefault();
@@ -155,15 +136,6 @@ function AdminSurface() {
         <div class="surface-admin">
             ${/* Top Bar */``}
             <div class="admin-topbar">
-                <a href="${BASE}/" class="admin-topbar-back" onClick=${backClick}>
-                    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-                         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-                        <line x1="19" y1="12" x2="5" y2="12"/>
-                        <polyline points="12 19 5 12 12 5"/>
-                    </svg>
-                    Back
-                </a>
-                <div class="admin-topbar-sep"></div>
                 <span class="admin-topbar-title">
                     <img src="${BASE}/favicon.svg" alt="" width="18" height="18" style="vertical-align:-3px;" />
                     Administration
@@ -179,6 +151,10 @@ function AdminSurface() {
                         </a>
                     `)}
                 </div>
+
+                <div style="margin-left:auto;">
+                    <${UserMenu} placement="down-right" />
+                </div>
             </div>
 
             <div class="admin-body">

src/js/sw/surfaces/admin/settings.js

@@ -6,7 +6,6 @@ const { useState, useEffect, useCallback } = hooks;
 
 export default function SettingsSection() {
     const [cfg, setCfg] = useState({});
-    const [models, setModels] = useState([]);
     const [surfaces, setSurfaces] = useState([]);
     const [vault, setVault] = useState(null);
     const [loading, setLoading] = useState(true);
@@ -14,9 +13,8 @@ export default function SettingsSection() {
 
     const load = useCallback(async () => {
         try {
-            const [s, m, v, surfList] = await Promise.all([
+            const [s, v, surfList] = await Promise.all([
                 sw.api.admin.settings.get(),
-                sw.api.admin.models.list().catch(() => []),
                 sw.api.admin.vault.status().catch(() => null),
                 sw.api.admin.surfaces.list().catch(() => []),
             ]);
@@ -28,11 +26,6 @@ export default function SettingsSection() {
                 default_surface: cfg_.default_surface?.id || '',
                 allow_registration: pol.allow_registration === 'true',
                 registration_default_state: cfg_.registration_default_state || 'pending',
-                system_prompt: cfg_.system_prompt || '',
-                default_model: pol.default_model || '',
-                allow_user_byok: pol.allow_user_byok === 'true',
-                allow_user_personas: pol.allow_user_personas === 'true',
-                allow_kb_direct_access: pol.allow_kb_direct_access === 'true' || pol.kb_direct_access === 'true',
                 banner_enabled: !!cfg_.banner?.enabled,
                 banner_text: cfg_.banner?.text || '',
                 banner_bg: cfg_.banner?.bg || '#007a33',
@@ -43,17 +36,7 @@ export default function SettingsSection() {
                 message_variant: cfg_.message?.variant || 'info',
                 footer_enabled: !!cfg_.footer?.enabled,
                 footer_text: cfg_.footer?.text || '',
-                search_provider: cfg_.search_provider || 'duckduckgo',
-                search_endpoint: cfg_.search_endpoint || '',
-                search_api_key: cfg_.search_api_key || '',
-                search_max_results: cfg_.search_max_results || 5,
-                compaction_enabled: !!cfg_.auto_compaction_enabled,
-                compaction_threshold: cfg_.compaction_threshold || 70,
-                compaction_cooldown: cfg_.compaction_cooldown || 30,
-                memory_extraction_enabled: !!cfg_.memory_extraction_enabled,
-                memory_auto_approve: !!cfg_.memory_auto_approve,
             });
-            setModels(m || []);
             setVault(v);
         } catch (e) { sw.toast(e.message, 'error'); }
         finally { setLoading(false); }
@@ -69,16 +52,9 @@ export default function SettingsSection() {
             // Default surface
             await sw.api.admin.settings.update('default_surface', { value: cfg.default_surface ? { id: cfg.default_surface } : null });
 
-            // Policies
+            // Registration
             await sw.api.admin.settings.update('allow_registration', { value: String(cfg.allow_registration) });
             await sw.api.admin.settings.update('registration_default_state', { value: cfg.registration_default_state });
-            await sw.api.admin.settings.update('allow_user_byok', { value: String(cfg.allow_user_byok) });
-            await sw.api.admin.settings.update('allow_user_personas', { value: String(cfg.allow_user_personas) });
-            await sw.api.admin.settings.update('allow_kb_direct_access', { value: String(cfg.allow_kb_direct_access) });
-
-            // System prompt & default model
-            await sw.api.admin.settings.update('system_prompt', { value: cfg.system_prompt });
-            if (cfg.default_model) await sw.api.admin.settings.update('default_model', { value: cfg.default_model });
 
             // Banner
             await sw.api.admin.settings.update('banner', { value: {
@@ -102,23 +78,6 @@ export default function SettingsSection() {
                 text: cfg.footer_text,
             }});
 
-            // Search
-            await sw.api.admin.settings.update('search_provider', { value: cfg.search_provider });
-            if (cfg.search_provider === 'searxng') {
-                await sw.api.admin.settings.update('search_endpoint', { value: cfg.search_endpoint });
-                await sw.api.admin.settings.update('search_api_key', { value: cfg.search_api_key });
-            }
-            await sw.api.admin.settings.update('search_max_results', { value: cfg.search_max_results });
-
-            // Compaction
-            await sw.api.admin.settings.update('auto_compaction_enabled', { value: String(cfg.compaction_enabled) });
-            await sw.api.admin.settings.update('compaction_threshold', { value: cfg.compaction_threshold });
-            await sw.api.admin.settings.update('compaction_cooldown', { value: cfg.compaction_cooldown });
-
-            // Memory
-            await sw.api.admin.settings.update('memory_extraction_enabled', { value: String(cfg.memory_extraction_enabled) });
-            await sw.api.admin.settings.update('memory_auto_approve', { value: String(cfg.memory_auto_approve) });
-
             sw.toast('Settings saved', 'success');
         } catch (e) { sw.toast(e.message, 'error'); }
         finally { setSaving(false); }
@@ -155,23 +114,6 @@ export default function SettingsSection() {
                 </div>
             </div>
 
-            <div class="settings-section"><h3>System Prompt</h3>
-                <textarea rows="4" placeholder="Global system prompt\u2026" value=${cfg.system_prompt} onInput=${e => set('system_prompt', e.target.value)}></textarea>
-            </div>
-
-            <div class="settings-section"><h3>Default Model</h3>
-                <select value=${cfg.default_model} onChange=${e => set('default_model', e.target.value)}>
-                    <option value="">-- None (first visible) --</option>
-                    ${models.map(m => html`<option key=${m.id} value=${m.model_id || m.id}>${m.display_name || m.model_id || m.id}</option>`)}
-                </select>
-            </div>
-
-            <div class="settings-section"><h3>Policies</h3>
-                <label class="toggle-label"><input type="checkbox" checked=${cfg.allow_user_byok} onChange=${e => set('allow_user_byok', e.target.checked)} /><span class="toggle-track"></span><span>Allow BYOK (user API keys)</span></label>
-                <label class="toggle-label"><input type="checkbox" checked=${cfg.allow_user_personas} onChange=${e => set('allow_user_personas', e.target.checked)} /><span class="toggle-track"></span><span>Allow user personas</span></label>
-                <label class="toggle-label"><input type="checkbox" checked=${cfg.allow_kb_direct_access} onChange=${e => set('allow_kb_direct_access', e.target.checked)} /><span class="toggle-track"></span><span>Allow direct KB access</span></label>
-            </div>
-
             <div class="settings-section"><h3>Environment Banner</h3>
                 <label class="toggle-label"><input type="checkbox" checked=${cfg.banner_enabled} onChange=${e => set('banner_enabled', e.target.checked)} /><span class="toggle-track"></span><span>Show environment banner</span></label>
                 ${cfg.banner_enabled && html`
@@ -217,36 +159,6 @@ export default function SettingsSection() {
                 `}
             </div>
 
-            <div class="settings-section"><h3>Web Search</h3>
-                <div class="form-group"><label>Provider</label>
-                    <select value=${cfg.search_provider} onChange=${e => set('search_provider', e.target.value)}>
-                        <option value="duckduckgo">DuckDuckGo</option><option value="searxng">SearXNG</option>
-                    </select>
-                </div>
-                ${cfg.search_provider === 'searxng' && html`
-                    <div class="form-group"><label>Endpoint</label><input value=${cfg.search_endpoint} onInput=${e => set('search_endpoint', e.target.value)} placeholder="https://searxng.example.com" /></div>
-                    <div class="form-group"><label>API Key</label><input value=${cfg.search_api_key} onInput=${e => set('search_api_key', e.target.value)} placeholder="Optional" /></div>
-                `}
-                <div class="form-group"><label>Max Results</label><input type="number" min="1" max="20" value=${cfg.search_max_results} onInput=${e => set('search_max_results', parseInt(e.target.value) || 5)} /></div>
-            </div>
-
-            <div class="settings-section"><h3>Auto-Compaction</h3>
-                <label class="toggle-label"><input type="checkbox" checked=${cfg.compaction_enabled} onChange=${e => set('compaction_enabled', e.target.checked)} /><span class="toggle-track"></span><span>Enable auto-compaction</span></label>
-                ${cfg.compaction_enabled && html`
-                    <div class="form-row" style="margin-top:8px;">
-                        <div class="form-group"><label>Threshold (%)</label><input type="number" min="50" max="95" value=${cfg.compaction_threshold} onInput=${e => set('compaction_threshold', parseInt(e.target.value))} /></div>
-                        <div class="form-group"><label>Cooldown (min)</label><input type="number" min="5" max="1440" value=${cfg.compaction_cooldown} onInput=${e => set('compaction_cooldown', parseInt(e.target.value))} /></div>
-                    </div>
-                `}
-            </div>
-
-            <div class="settings-section"><h3>Memory Extraction</h3>
-                <label class="toggle-label"><input type="checkbox" checked=${cfg.memory_extraction_enabled} onChange=${e => set('memory_extraction_enabled', e.target.checked)} /><span class="toggle-track"></span><span>Enable memory extraction</span></label>
-                ${cfg.memory_extraction_enabled && html`
-                    <label class="toggle-label" style="margin-top:8px;"><input type="checkbox" checked=${cfg.memory_auto_approve} onChange=${e => set('memory_auto_approve', e.target.checked)} /><span class="toggle-track"></span><span>Auto-approve extracted memories</span></label>
-                `}
-            </div>
-
             <div class="settings-section"><h3>Encryption Vault</h3>
                 ${vault
                     ? html`<div class="text-muted" style="font-size:12px;">Key set: ${vault.encryption_key_set ? 'Yes' : 'No'} \u2022 User vaults: ${vault.user_vaults_count ?? '?'}</div>`

src/js/sw/surfaces/settings/general.js

@@ -1,68 +1,35 @@
 /**
- * GeneralSection — chat defaults: model, system prompt, max tokens, temperature, thinking
+ * GeneralSection — user preferences (default surface)
  */
 const { html } = window;
-const { useState, useEffect, useCallback, useRef } = hooks;
+const { useState, useEffect, useCallback } = hooks;
 
 export function GeneralSection() {
-    const [models, setModels] = useState([]);
-    const [settings, setSettings] = useState({});
+    const [surfaces, setSurfaces] = useState([]);
+    const [defaultSurface, setDefaultSurface] = useState('');
     const [saving, setSaving] = useState(false);
-    const [maxHint, setMaxHint] = useState('');
-    const tempRef = useRef(null);
 
-    // Load settings + models
     useEffect(() => {
         (async () => {
             try {
-                const [s, m] = await Promise.all([
+                const [s, surfList] = await Promise.all([
                     sw.api.profile.settings(),
-                    sw.api.models.enabled(),
+                    sw.api.get('/api/v1/surfaces').catch(() => []),
                 ]);
                 const sObj = s || {};
-                setSettings({
-                    model: sObj.model || '',
-                    system_prompt: sObj.system_prompt || '',
-                    max_tokens: sObj.max_tokens || 0,
-                    temperature: sObj.temperature ?? 0.7,
-                    show_thinking: sObj.show_thinking || false,
-                });
-                const modelList = (m.data || []).filter(x => !x.hidden);
-                setModels(modelList);
-
-                // Set initial max hint
-                const active = modelList.find(x => x.id === sObj.model);
-                if (active?.capabilities?.max_output_tokens > 0) {
-                    setMaxHint(`(model max: ${(active.capabilities.max_output_tokens / 1000).toFixed(0)}K)`);
-                }
+                setDefaultSurface(sObj.default_surface || '');
+                setSurfaces((surfList || []).filter(s => s.route?.startsWith('/s/')));
             } catch (e) {
                 console.warn('[settings/general] Load failed:', e.message);
             }
         })();
     }, []);
 
-    const onModelChange = useCallback((e) => {
-        const id = e.target.value;
-        setSettings(s => ({ ...s, model: id }));
-        const m = models.find(x => x.id === id);
-        const cap = m?.capabilities || {};
-        setMaxHint(cap.max_output_tokens > 0
-            ? `(model max: ${(cap.max_output_tokens / 1000).toFixed(0)}K)` : '');
-    }, [models]);
-
-    const onTempInput = useCallback((e) => {
-        setSettings(s => ({ ...s, temperature: parseFloat(e.target.value) }));
-    }, []);
-
     const save = useCallback(async () => {
         setSaving(true);
         try {
             await sw.api.profile.updateSettings({
-                model: settings.model,
-                system_prompt: settings.system_prompt,
-                max_tokens: settings.max_tokens,
-                temperature: settings.temperature,
-                show_thinking: settings.show_thinking,
+                default_surface: defaultSurface,
             });
             sw.emit('toast', { message: 'Settings saved', variant: 'success' });
         } catch (e) {
@@ -70,57 +37,22 @@ export function GeneralSection() {
         } finally {
             setSaving(false);
         }
-    }, [settings]);
+    }, [defaultSurface]);
 
     return html`
         <div class="settings-section">
-            <h3>Chat Defaults</h3>
+            <h3>Default Surface</h3>
             <div class="form-group">
-                <label>Default Model</label>
-                <select value=${settings.model} onChange=${onModelChange}>
-                    ${models.map(m => html`
-                        <option value=${m.id}>
-                            ${m.name || m.id}${m.provider ? ` (${m.provider})` : ''}
-                        </option>
-                    `)}
+                <label>Landing page after login</label>
+                <select value=${defaultSurface} onChange=${e => setDefaultSurface(e.target.value)}>
+                    <option value="">-- Use global default --</option>
+                    ${surfaces.map(s => html`<option key=${s.id} value=${s.id}>${s.icon ? s.icon + ' ' : ''}${s.title || s.id}</option>`)}
                 </select>
             </div>
-            <div class="form-group">
-                <label>System Prompt</label>
-                <textarea rows="3" placeholder="Optional system prompt\u2026"
-                          style="max-width:100%;"
-                          value=${settings.system_prompt}
-                          onInput=${e => setSettings(s => ({ ...s, system_prompt: e.target.value }))} />
-            </div>
-            <div style="display:flex;gap:16px;">
-                <div class="form-group" style="flex:1;">
-                    <label>Max Tokens${' '}
-                        <span style="font-weight:400;color:var(--text-3);">${maxHint}</span>
-                    </label>
-                    <input type="number" placeholder="default"
-                           value=${settings.max_tokens || ''}
-                           onInput=${e => setSettings(s => ({ ...s, max_tokens: parseInt(e.target.value) || 0 }))} />
-                </div>
-                <div class="form-group" style="flex:1;">
-                    <label>Temperature</label>
-                    <div style="display:flex;align-items:center;gap:8px;">
-                        <input type="range" min="0" max="2" step="0.1"
-                               ref=${tempRef}
-                               value=${settings.temperature}
-                               onInput=${onTempInput}
-                               style="flex:1;" />
-                        <span style="font-size:12px;color:var(--text-2);font-family:var(--mono);">
-                            ${settings.temperature}
-                        </span>
-                    </div>
-                </div>
-            </div>
-            <label style="display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-2);cursor:pointer;margin-top:4px;">
-                <input type="checkbox"
-                       checked=${settings.show_thinking}
-                       onChange=${e => setSettings(s => ({ ...s, show_thinking: e.target.checked }))} />
-                Show thinking blocks
-            </label>
+            <span style="font-size:12px;color:var(--text-3);">
+                Override the global default set by your administrator.
+                If your chosen surface is uninstalled, the global default is used.
+            </span>
         </div>
         <button class="btn-md btn-primary" style="margin-top:12px;"
                 disabled=${saving} onClick=${save}>

src/js/sw/surfaces/welcome/index.js

@@ -0,0 +1,67 @@
+/**
+ * WelcomeSurface — fallback landing page.
+ * Shown when no default surface is configured or no extensions are installed.
+ * Checks for available extension surfaces and adjusts messaging.
+ */
+const { html } = window;
+const { useState, useEffect } = hooks;
+const { render } = preact;
+
+import { Topbar } from '../../shell/topbar.js';
+
+function WelcomeSurface() {
+    const BASE = window.__BASE__ || '';
+    const isAdmin = sw.can?.('surface.admin.access');
+    const [surfaces, setSurfaces] = useState([]);
+
+    useEffect(() => {
+        sw.api.get('/api/v1/surfaces').then(list => {
+            setSurfaces((list || []).filter(s => s.route?.startsWith('/s/')));
+        }).catch(() => {});
+    }, []);
+
+    const hasSurfaces = surfaces.length > 0;
+
+    return html`
+        <${Topbar} title="Switchboard" />
+        <div style="flex:1;display:flex;align-items:center;justify-content:center;padding:24px;">
+            <div style="max-width:420px;width:100%;background:var(--bg-surface);border:1px solid var(--border);border-radius:12px;padding:32px;text-align:center;">
+                <div style="font-size:36px;margin-bottom:16px;">${hasSurfaces ? '🏠' : '📦'}</div>
+                <h2 style="font-size:20px;font-weight:600;margin:0 0 8px;">Welcome to Switchboard</h2>
+                ${hasSurfaces ? html`
+                    <p style="font-size:14px;color:var(--text-2);margin:0 0 24px;line-height:1.5;">
+                        No default surface is configured. Choose a surface from
+                        the menu, or ${isAdmin ? 'set a default in admin settings.' : 'ask your administrator to set a default.'}
+                    </p>
+                    ${isAdmin && html`
+                        <a href="${BASE}/admin/settings"
+                           style="display:inline-flex;align-items:center;gap:8px;padding:10px 24px;background:var(--accent);color:#fff;border-radius:8px;text-decoration:none;font-weight:600;font-size:14px;">
+                            Set Default Surface
+                        </a>
+                    `}
+                ` : html`
+                    <p style="font-size:14px;color:var(--text-2);margin:0 0 24px;line-height:1.5;">
+                        No surfaces are installed yet. Install an extension surface
+                        to get started.
+                    </p>
+                    ${isAdmin && html`
+                        <a href="${BASE}/admin/packages"
+                           style="display:inline-flex;align-items:center;gap:8px;padding:10px 24px;background:var(--accent);color:#fff;border-radius:8px;text-decoration:none;font-weight:600;font-size:14px;">
+                            Go to Packages
+                        </a>
+                    `}
+                    ${!isAdmin && html`
+                        <p style="font-size:13px;color:var(--text-3);">
+                            Ask your administrator to install a surface package.
+                        </p>
+                    `}
+                `}
+            </div>
+        </div>
+    `;
+}
+
+const mount = document.getElementById('welcome-mount');
+if (mount) {
+    render(html`<${WelcomeSurface} />`, mount);
+}