steps 5-8: deep gut — purge chat/notes/projects/providers from code

main.go: remove ~300 lines of stale routes referencing deleted handlers (channels, messages, folders, personas, notes, projects, memories, models, providers, tasks, roles, usage, routing, capabilities, etc.) Fix branding: "Chat Switchboard" → "Switchboard Core" pages: remove chat/notes/projects surface manifests and templates Keep: admin, settings, team-admin, workflow, workflow-landing frontend: delete chat/, notes/, projects/ surface directories (19 files) Delete 5 CSS files (4,144 lines): sw-chat-*, sw-notes-*, sw-projects-* SDK: strip gutted API domains (594→287 lines), remove chatPane/notesPane tests: remove integration_test.go (5,194 lines, broken imports to deleted packages) and perm_enforcement_test.go (551 lines, depended on deleted test helpers). Fix testmain_test.go (remove providers import). openapi.yaml: replace 12,491-line stale spec with kernel auth stub. Full ICD rebuild is Step 8 proper. Auth (builtin, mTLS, OIDC) untouched throughout. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-26 09:47:32 +00:00
parent a9c652ff59
commit 45291860c5
36 changed files with 76 additions and 25937 deletions
--- a/src/js/sw/sdk/api-domains.js
+++ b/src/js/sw/sdk/api-domains.js
@@ -1,7 +1,7 @@
 // ==========================================
-// Chat Switchboard — SDK: API Domain Namespaces
+// Switchboard Core — SDK: API Domain Namespaces
 // ==========================================
-// 18 namespaced domain clients wrapping restClient.
+// Namespaced domain clients wrapping restClient.
 // Each domain is a plain object with typed methods.
 //
 // Factory: createDomains(restClient)
@@ -65,136 +65,13 @@ export function createDomains(restClient) {
            logout:   (refreshToken)               => rc.post('/api/v1/auth/logout', { refresh_token: refreshToken }),
        },

-        // ── 2. Channels ────────────────────────
-        channels: {
-            ...crud(rc, '/api/v1/channels'),
-            messages:       (id, opts)          => rc.get(`/api/v1/channels/${id}/messages` + _qs(opts)),
-            send:           (id, data)          => rc.post(`/api/v1/channels/${id}/messages`, data),
-            complete:       (data, signal)      => rc.stream('/api/v1/chat/completions', data, signal),
-            regenerate:     (id, msgId, data, signal) => rc.stream(`/api/v1/channels/${id}/messages/${msgId}/regenerate`, data, signal),
-            editMessage:    (id, msgId, content) => rc.post(`/api/v1/channels/${id}/messages/${msgId}/edit`, { content }),
-            deleteMessage:  (id, msgId)          => rc.del(`/api/v1/channels/${id}/messages/${msgId}`),
-            siblings:       (id, msgId)         => rc.get(`/api/v1/channels/${id}/messages/${msgId}/siblings`),
-            path:           (id)                => rc.get(`/api/v1/channels/${id}/path`),
-            cursor:         (id, leafId)        => rc.put(`/api/v1/channels/${id}/cursor`, { active_leaf_id: leafId }),
-            markRead:       (id)                => rc.post(`/api/v1/channels/${id}/mark-read`, {}),
-            generateTitle:  (id)                => rc.post(`/api/v1/channels/${id}/generate-title`, {}),
-            summarize:      (id)                => rc.post(`/api/v1/channels/${id}/summarize`, {}),
-            // Participants
-            participants:      (id)             => rc.get(`/api/v1/channels/${id}/participants`),
-            addParticipant:    (id, data)        => rc.post(`/api/v1/channels/${id}/participants`, data),
-            updateParticipant: (id, pid, data)   => rc.patch(`/api/v1/channels/${id}/participants/${pid}`, data),
-            removeParticipant: (id, pid)         => rc.del(`/api/v1/channels/${id}/participants/${pid}`),
-            // Channel models
-            models:         (id)                => rc.get(`/api/v1/channels/${id}/models`),
-            addModel:       (id, data)          => rc.post(`/api/v1/channels/${id}/models`, data),
-            updateModel:    (id, modelId, data)  => rc.patch(`/api/v1/channels/${id}/models/${modelId}`, data),
-            removeModel:    (id, modelId)        => rc.del(`/api/v1/channels/${id}/models/${modelId}`),
-            // Knowledge bases
-            kbs:            (id)                => rc.get(`/api/v1/channels/${id}/knowledge-bases`),
-            setKbs:         (id, kbIds)         => rc.put(`/api/v1/channels/${id}/knowledge-bases`, { kb_ids: kbIds }),
-            // Files
-            files:          (id, opts)          => rc.get(`/api/v1/channels/${id}/files` + _qs(opts)),
-            uploadFile:     (id, file)          => rc.upload(`/api/v1/channels/${id}/files`, file),
-        },
-
-        // ── 3. Personas ────────────────────────
-        personas: {
-            ...crud(rc, '/api/v1/personas'),
-            kbs:    (id)       => rc.get(`/api/v1/personas/${id}/knowledge-bases`),
-            setKbs: (id, data) => rc.put(`/api/v1/personas/${id}/knowledge-bases`, data),
-        },
-
-        // ── 4. Knowledge Bases ─────────────────
-        knowledge: {
-            ...crud(rc, '/api/v1/knowledge-bases'),
-            discoverable: ()                  => rc.get('/api/v1/knowledge-bases-discoverable'),
-            search:       (id, query, limit)  => rc.post(`/api/v1/knowledge-bases/${id}/search`, { query, limit }),
-            documents:    (id)                => rc.get(`/api/v1/knowledge-bases/${id}/documents`),
-            upload:       (id, file)          => rc.upload(`/api/v1/knowledge-bases/${id}/documents`, file),
-            docStatus:    (id, docId)         => rc.get(`/api/v1/knowledge-bases/${id}/documents/${docId}/status`),
-            delDoc:       (id, docId)         => rc.del(`/api/v1/knowledge-bases/${id}/documents/${docId}`),
-        },
-
-        // ── 5. Notes ───────────────────────────
-        notes: {
-            ...crud(rc, '/api/v1/notes'),
-            search:       (query, limit)  => rc.get(`/api/v1/notes/search` + _qs({ q: query, limit })),
-            searchTitles: (query, limit)  => rc.get(`/api/v1/notes/search-titles` + _qs({ q: query, limit })),
-            folders:      ()              => rc.get('/api/v1/notes/folders'),
-            backlinks:    (id)            => rc.get(`/api/v1/notes/${id}/backlinks`),
-            graph:        ()              => rc.get('/api/v1/notes/graph'),
-            bulkDelete:   (ids)           => rc.post('/api/v1/notes/bulk-delete', { ids }),
-        },
-
-        // ── 6. Projects ────────────────────────
-        projects: {
-            ...crud(rc, '/api/v1/projects'),
-            channels:       (id)                     => rc.get(`/api/v1/projects/${id}/channels`),
-            addChannel:     (id, channelId, pos)     => rc.post(`/api/v1/projects/${id}/channels`, { channel_id: channelId, position: pos || 0 }),
-            removeChannel:  (id, channelId)          => rc.del(`/api/v1/projects/${id}/channels/${channelId}`),
-            reorderChannels:(id, channelIds)         => rc.put(`/api/v1/projects/${id}/channels/reorder`, { channel_ids: channelIds }),
-            kbs:            (id)                     => rc.get(`/api/v1/projects/${id}/knowledge-bases`),
-            addKb:          (id, kbId, autoSearch)   => rc.post(`/api/v1/projects/${id}/knowledge-bases`, { kb_id: kbId, auto_search: autoSearch || false }),
-            removeKb:       (id, kbId)               => rc.del(`/api/v1/projects/${id}/knowledge-bases/${kbId}`),
-            notes:          (id)                     => rc.get(`/api/v1/projects/${id}/notes`),
-            addNote:        (id, noteId)             => rc.post(`/api/v1/projects/${id}/notes`, { note_id: noteId }),
-            removeNote:     (id, noteId)             => rc.del(`/api/v1/projects/${id}/notes/${noteId}`),
-            files:          (id, opts)               => rc.get(`/api/v1/projects/${id}/files` + _qs(opts)),
-            uploadFile:     (id, file, path)         => rc.upload(`/api/v1/projects/${id}/files` + (path ? _qs({ path }) : ''), file),
-            deleteFile:     (id, path)               => rc.del(`/api/v1/projects/${id}/files` + _qs({ path })),
-            mkdir:          (id, path)               => rc.post(`/api/v1/projects/${id}/files/mkdir`, { path }),
-            uploadArchive:  (id, file)               => rc.upload(`/api/v1/projects/${id}/archive/upload`, file),
-        },
-
-        // ── 7. Workspaces ──────────────────────
-        workspaces: {
-            ...crud(rc, '/api/v1/workspaces'),
-            update:     (id, data) => rc.patch(`/api/v1/workspaces/${id}`, data),
-            getDefault: ()         => rc.get('/api/v1/workspaces/default'),
-            files:       (id, opts) => rc.get(`/api/v1/workspaces/${id}/files` + _qs(opts)),
-            readFile:    (id, path) => rc.get(`/api/v1/workspaces/${id}/files/read` + _qs({ path })),
-            writeFile:   (id, path, content) => rc.put(`/api/v1/workspaces/${id}/files/write` + _qs({ path }), content),
-            deleteFile:  (id, path) => rc.del(`/api/v1/workspaces/${id}/files/delete` + _qs({ path })),
-            mkdir:       (id, path) => rc.post(`/api/v1/workspaces/${id}/files/mkdir`, { path }),
-            gitStatus:   (id)       => rc.get(`/api/v1/workspaces/${id}/git/status`),
-            gitBranches: (id)       => rc.get(`/api/v1/workspaces/${id}/git/branches`),
-            credentials: ()         => rc.get('/api/v1/git-credentials'),
-        },
-
-        // ── 8. Memory ──────────────────────────
-        memory: {
-            list:    (opts)       => rc.get('/api/v1/memories' + _qs(opts)),
-            get:     (id)        => rc.get(`/api/v1/memories/${id}`),
-            update:  (id, data)  => rc.put(`/api/v1/memories/${id}`, data),
-            del:     (id)        => rc.del(`/api/v1/memories/${id}`),
-            count:   ()          => rc.get('/api/v1/memories/count'),
-            approve: (id)        => rc.post(`/api/v1/memories/${id}/approve`, {}),
-            reject:  (id)        => rc.post(`/api/v1/memories/${id}/reject`, {}),
-        },
-
-        // ── 9. Models ──────────────────────────
-        models: {
-            enabled:     ()                           => rc.get('/api/v1/models/enabled'),
-            preferences: ()                           => rc.get('/api/v1/models/preferences'),
-            setPref:     (modelId, provId, hidden)     => rc.put('/api/v1/models/preferences', { model_id: modelId, provider_config_id: provId, hidden }),
-            bulkSetPref: (entries, hidden)             => rc.post('/api/v1/models/preferences/bulk', { entries, hidden }),
-        },
-
-        // ── 10. Providers (user BYOK) ──────────
-        providers: {
-            ...crud(rc, '/api/v1/api-configs'),
-            models:      (id) => rc.get(`/api/v1/api-configs/${id}/models`),
-            fetchModels: (id) => rc.post(`/api/v1/api-configs/${id}/models/fetch`),
-        },
-
-        // ── 10b. Connections (v0.38.1) ────────
+        // ── 2. Connections ────────────────────
        connections: {
            ...crud(rc, '/api/v1/connections'),
            resolve: (type, name) => rc.get('/api/v1/connections/resolve' + _qs({ type, name })),
        },

-        // ── 10c. Connection Types (v0.38.4) ──
+        // ── 3. Connection Types ────────────────
        connectionTypes: {
            list: () => rc.get('/api/v1/connection-types'),
        },
@@ -239,30 +116,14 @@ export function createDomains(restClient) {
            addMember:  (id, userId, role)      => rc.post(`/api/v1/teams/${id}/members`, { user_id: userId, role }),
            updateMember:(id, memberId, role)   => rc.put(`/api/v1/teams/${id}/members/${memberId}`, { role }),
            removeMember:(id, memberId)         => rc.del(`/api/v1/teams/${id}/members/${memberId}`),
-            personas:   (id)                    => rc.get(`/api/v1/teams/${id}/personas`),
-            createPersona:(id, data)            => rc.post(`/api/v1/teams/${id}/personas`, data),
-            updatePersona:(id, pid, data)       => rc.put(`/api/v1/teams/${id}/personas/${pid}`, data),
-            deletePersona:(id, pid)             => rc.del(`/api/v1/teams/${id}/personas/${pid}`),
-            personaKbs:  (id, pid)              => rc.get(`/api/v1/teams/${id}/personas/${pid}/knowledge-bases`),
-            setPersonaKbs:(id, pid, data)       => rc.put(`/api/v1/teams/${id}/personas/${pid}/knowledge-bases`, data),
-            models:     (id)                    => rc.get(`/api/v1/teams/${id}/models`),
            groups:     (id)                    => rc.get(`/api/v1/teams/${id}/groups`),
-            providers:  (id)                    => rc.get(`/api/v1/teams/${id}/providers`),
-            createProvider:(id, data)           => rc.post(`/api/v1/teams/${id}/providers`, data),
-            updateProvider:(id, pid, data)      => rc.put(`/api/v1/teams/${id}/providers/${pid}`, data),
-            deleteProvider:(id, pid)            => rc.del(`/api/v1/teams/${id}/providers/${pid}`),
-            providerModels:(id, pid)            => rc.get(`/api/v1/teams/${id}/providers/${pid}/models`),
-            // Team connections (v0.38.1)
+            // Team connections
            connections:      (id)                 => rc.get(`/api/v1/teams/${id}/connections`),
            createConnection: (id, data)           => rc.post(`/api/v1/teams/${id}/connections`, data),
            updateConnection: (id, cid, data)      => rc.put(`/api/v1/teams/${id}/connections/${cid}`, data),
            deleteConnection: (id, cid)            => rc.del(`/api/v1/teams/${id}/connections/${cid}`),
-            roles:      (id)                    => rc.get(`/api/v1/teams/${id}/roles`),
-            updateRole: (id, role, config)      => rc.put(`/api/v1/teams/${id}/roles/${role}`, config),
-            deleteRole: (id, role)              => rc.del(`/api/v1/teams/${id}/roles/${role}`),
            audit:      (id, opts)              => rc.get(`/api/v1/teams/${id}/audit` + _qs(opts)),
            auditActions:(id)                   => rc.get(`/api/v1/teams/${id}/audit/actions`),
-            usage:      (id, opts)              => rc.get(`/api/v1/teams/${id}/usage` + _qs(opts)),
            // Team workflows
            workflows:       (id, opts)         => rc.get(`/api/v1/teams/${id}/workflows` + _qs(opts)),
            createWorkflow:  (id, data)         => rc.post(`/api/v1/teams/${id}/workflows`, data),
@@ -276,22 +137,9 @@ export function createDomains(restClient) {
            updateWorkflowStage:   (id, wfId, sid, data) => rc.put(`/api/v1/teams/${id}/workflows/${wfId}/stages/${sid}`, data),
            deleteWorkflowStage:   (id, wfId, sid)      => rc.del(`/api/v1/teams/${id}/workflows/${wfId}/stages/${sid}`),
            reorderWorkflowStages: (id, wfId, ids)      => rc.patch(`/api/v1/teams/${id}/workflows/${wfId}/stages/reorder`, { ordered_ids: ids }),
-            // Team assignments + monitor (v0.37.15)
-            assignments:            (id, opts)  => rc.get(`/api/v1/teams/${id}/assignments` + _qs(opts)),
-            workflowInstances:      (id)        => rc.get(`/api/v1/teams/${id}/workflows/monitor/instances`),
-            cancelWorkflowInstance: (id, chId)  => rc.post(`/api/v1/teams/${id}/workflows/monitor/instances/${chId}/cancel`, {}),
-            // Team tasks
-            tasks:       (id, opts)             => rc.get(`/api/v1/teams/${id}/tasks` + _qs(opts)),
-            createTask:  (id, data)             => rc.post(`/api/v1/teams/${id}/tasks`, data),
-            updateTask:  (id, taskId, data)     => rc.put(`/api/v1/teams/${id}/tasks/${taskId}`, data),
-            deleteTask:  (id, taskId)           => rc.del(`/api/v1/teams/${id}/tasks/${taskId}`),
-            runTask:     (id, taskId)           => rc.post(`/api/v1/teams/${id}/tasks/${taskId}/run`, {}),
-            killTask:    (id, taskId)           => rc.post(`/api/v1/teams/${id}/tasks/${taskId}/kill`, {}),
-            // Team knowledge bases
-            knowledgeBases:(id)                 => rc.get(`/api/v1/teams/${id}/knowledge-bases`),
        },

-        // ── 15. Workflows ──────────────────────
+        // ── 9. Workflows ───────────────────────
        workflows: {
            ...crud(rc, '/api/v1/workflows'),
            update: (id, data) => rc.patch(`/api/v1/workflows/${id}`, data),
@@ -302,27 +150,7 @@ export function createDomains(restClient) {
            cancel:    (channelId) => rc.post(`/api/v1/channels/${channelId}/workflow/cancel`, {}),
        },

-        // ── 15b. Workflow Assignments (v0.37.15) ─
-        workflowAssignments: {
-            mine:     ()              => rc.get('/api/v1/workflow-assignments/mine'),
-            get:      (id)            => rc.get(`/api/v1/workflow-assignments/${id}`),
-            claim:    (id)            => rc.post(`/api/v1/workflow-assignments/${id}/claim`, {}),
-            unclaim:  (id)            => rc.post(`/api/v1/workflow-assignments/${id}/unclaim`, {}),
-            complete: (id)            => rc.post(`/api/v1/workflow-assignments/${id}/complete`, {}),
-            reassign: (id, userId)    => rc.post(`/api/v1/workflow-assignments/${id}/reassign`, { user_id: userId }),
-            cancel:   (id)            => rc.post(`/api/v1/workflow-assignments/${id}/cancel`, {}),
-            comment:  (id, text)      => rc.post(`/api/v1/workflow-assignments/${id}/comment`, { text }),
-        },
-
-        // ── 16. Tasks ──────────────────────────
-        tasks: {
-            ...crud(rc, '/api/v1/tasks'),
-            runs:  (id, opts) => rc.get(`/api/v1/tasks/${id}/runs` + _qs(opts)),
-            start: (id, data) => rc.post(`/api/v1/tasks/${id}/run`, data || {}),
-            stop:  (id)       => rc.post(`/api/v1/tasks/${id}/kill`, {}),
-        },
-
-        // ── 17. Surfaces ───────────────────────
+        // ── 10. Surfaces ──────────────────────
        surfaces: {
            list:    (opts) => rc.get('/api/v1/surfaces' + _qs(opts)),
            get:     (id)   => rc.get(`/api/v1/surfaces/${id}`),
@@ -332,7 +160,6 @@ export function createDomains(restClient) {
        // ── 18. Admin ──────────────────────────
        admin: {
            stats:     ()     => rc.get('/api/v1/admin/stats'),
-            dashboard: ()     => rc.get('/api/v1/admin/dashboard'),

            users: {
                list:          (opts)              => rc.get('/api/v1/admin/users' + _qs(opts)),
@@ -351,38 +178,6 @@ export function createDomains(restClient) {
                public: ()         => rc.get('/api/v1/settings/public'),
            },

-            configs: {
-                list:   ()           => rc.get('/api/v1/admin/configs'),
-                create: (data)       => rc.post('/api/v1/admin/configs', data),
-                update: (id, data)   => rc.put(`/api/v1/admin/configs/${id}`, data),
-                del:    (id)         => rc.del(`/api/v1/admin/configs/${id}`),
-            },
-
-            models: {
-                list:       ()               => rc.get('/api/v1/admin/models'),
-                fetch:      ()               => rc.post('/api/v1/admin/models/fetch', {}),
-                update:     (id, data)       => rc.put(`/api/v1/admin/models/${id}`, data),
-                bulkUpdate: (visibility)     => rc.put('/api/v1/admin/models/bulk', { visibility, is_enabled: visibility === 'enabled' }),
-                del:        (id)             => rc.del(`/api/v1/admin/models/${id}`),
-                capabilities:   (modelId)    => rc.get(`/api/v1/admin/models/${encodeURIComponent(modelId)}/capabilities`),
-                setCapability:  (modelId, d) => rc.put(`/api/v1/admin/models/${encodeURIComponent(modelId)}/capabilities`, d),
-                delCapability:  (modelId, oId) => rc.del(`/api/v1/admin/models/${encodeURIComponent(modelId)}/capabilities/${oId}`),
-                overrides:      ()           => rc.get('/api/v1/admin/capability-overrides'),
-            },
-
-            personas: {
-                list:       ()              => rc.get('/api/v1/admin/personas'),
-                create:     (data)          => rc.post('/api/v1/admin/personas', data),
-                update:     (id, data)      => rc.put(`/api/v1/admin/personas/${id}`, data),
-                del:        (id)            => rc.del(`/api/v1/admin/personas/${id}`),
-                avatar:     (id, base64)    => rc.post(`/api/v1/admin/personas/${id}/avatar`, { image: base64 }),
-                delAvatar:  (id)            => rc.del(`/api/v1/admin/personas/${id}/avatar`),
-                kbs:        (id)            => rc.get(`/api/v1/admin/personas/${id}/knowledge-bases`),
-                setKbs:     (id, data)      => rc.put(`/api/v1/admin/personas/${id}/knowledge-bases`, data),
-                toolGrants:    (id)         => rc.get(`/api/v1/admin/personas/${id}/tool-grants`),
-                setToolGrants: (id, data)   => rc.put(`/api/v1/admin/personas/${id}/tool-grants`, data),
-            },
-
            teams: {
                list:         ()                => rc.get('/api/v1/admin/teams'),
                get:          (id)              => rc.get(`/api/v1/admin/teams/${id}`),
@@ -421,71 +216,19 @@ export function createDomains(restClient) {
                actions: ()     => rc.get('/api/v1/admin/audit/actions'),
            },

-            roles: {
-                list:   ()              => rc.get('/api/v1/admin/roles'),
-                get:    (role)          => rc.get(`/api/v1/admin/roles/${role}`),
-                update: (role, config)  => rc.put(`/api/v1/admin/roles/${role}`, config),
-                test:   (role)          => rc.post(`/api/v1/admin/roles/${role}/test`, {}),
-            },
-
-            usage: {
-                get:    (opts)          => rc.get('/api/v1/admin/usage' + _qs(opts)),
-                user:   (id, opts)      => rc.get(`/api/v1/admin/usage/users/${id}` + _qs(opts)),
-                team:   (id, opts)      => rc.get(`/api/v1/admin/usage/teams/${id}` + _qs(opts)),
-            },
-
-            pricing: {
-                list:   ()                  => rc.get('/api/v1/admin/pricing'),
-                upsert: (entry)             => rc.put('/api/v1/admin/pricing', entry),
-                del:    (provId, modelId)   => rc.del(`/api/v1/admin/pricing/${provId}/${encodeURIComponent(modelId)}`),
-            },
-
-            providers: {
-                health:    ()    => rc.get('/api/v1/admin/providers/health'),
-                healthOne: (id)  => rc.get(`/api/v1/admin/providers/${id}/health`),
-                types:     ()    => rc.get('/api/v1/admin/provider-types'),
-            },
-
-            routing: {
-                policies:   ()           => rc.get('/api/v1/admin/routing/policies'),
-                getPolicy:  (id)         => rc.get(`/api/v1/admin/routing/policies/${id}`),
-                createPolicy:(data)      => rc.post('/api/v1/admin/routing/policies', data),
-                updatePolicy:(id, data)  => rc.put(`/api/v1/admin/routing/policies/${id}`, data),
-                deletePolicy:(id)        => rc.del(`/api/v1/admin/routing/policies/${id}`),
-                test:       (data)       => rc.post('/api/v1/admin/routing/test', data),
-            },
-
            storage: {
                status:      () => rc.get('/api/v1/admin/storage/status'),
-                orphans:     () => rc.get('/api/v1/admin/storage/orphans'),
-                cleanup:     () => rc.post('/api/v1/admin/storage/cleanup', {}),
-                extraction:  () => rc.get('/api/v1/admin/storage/extraction'),
            },

            vault: {
                status: () => rc.get('/api/v1/admin/vault/status'),
            },

-            projects: {
-                list: (opts)  => rc.get('/api/v1/admin/projects' + _qs(opts)),
-                del:  (id)    => rc.del(`/api/v1/admin/projects/${id}`),
-            },
-
-            memories: {
-                pending:     () => rc.get('/api/v1/admin/memories/pending'),
-                bulkApprove: (ids) => rc.post('/api/v1/admin/memories/bulk-approve', { ids }),
-            },
-
            notifications: {
                testEmail:  () => rc.post('/api/v1/admin/notifications/test-email', {}),
                broadcast:  (data) => rc.post('/api/v1/admin/notifications/broadcast', data),
            },

-            channels: {
-                archived: (opts) => rc.get('/api/v1/admin/channels/archived' + _qs(opts)),
-                purge:    (id)   => rc.del(`/api/v1/admin/channels/${id}/purge`),
-            },
-
            extensions: {
                list:   ()           => rc.get('/api/v1/admin/extensions'),
                create: (data)       => rc.post('/api/v1/admin/extensions', data),
@@ -516,13 +259,6 @@ export function createDomains(restClient) {
                list: () => rc.get('/api/v1/admin/dependencies'),
            },

-            tasks: {
-                list: ()    => rc.get('/api/v1/admin/tasks'),
-                run:  (id)  => rc.post(`/api/v1/admin/tasks/${id}/run`, {}),
-                kill: (id)  => rc.post(`/api/v1/admin/tasks/${id}/kill`, {}),
-                del:  (id)  => rc.del(`/api/v1/admin/tasks/${id}`),
-            },
-
            surfaces: {
                list:    ()    => rc.get('/api/v1/admin/surfaces'),
                get:     (id)  => rc.get(`/api/v1/admin/surfaces/${id}`),
@@ -533,42 +269,6 @@ export function createDomains(restClient) {
            },
        },

-        // ── 19. Git Credentials ──────────────────
-        git: {
-            credentials: {
-                list:   ()         => rc.get('/api/v1/git-credentials'),
-                create: (data)     => rc.post('/api/v1/git-credentials', data),
-                del:    (id)       => rc.del(`/api/v1/git-credentials/${id}`),
-            },
-        },
-
-        // ── 20. Data Portability ─────────────────
-        dataPortability: {
-            exportMe:      ()     => rc.get('/api/v1/export/me'),
-            deleteAccount: (data) => rc.post('/api/v1/profile/delete', data),
-        },
-
-        // ── Misc (not domain-specific) ─────────
-        folders: {
-            list:   ()           => rc.get('/api/v1/folders'),
-            create: (name, opts) => rc.post('/api/v1/folders', { name, parent_id: opts?.parent_id || null, sort_order: opts?.sort_order || 0 }),
-            update: (id, data)   => rc.put(`/api/v1/folders/${id}`, data),
-            del:    (id)         => rc.del(`/api/v1/folders/${id}`),
-        },
-
-        // NOTE: notifications is defined in the main domain block above (§11).
-        // The duplicate here was overwriting prefs/setPref/delPref methods.
-        // Removed — see line ~190 for the canonical definition.
-
-        files: {
-            get:       (id)          => rc.get(`/api/v1/files/${id}`),
-            del:       (id)          => rc.del(`/api/v1/files/${id}`),
-        },
-
-        tools: {
-            list: () => rc.get('/api/v1/tools'),
-        },
-
        // ── Users ──────────────────────────────
        users: {
            search: (q) => rc.get('/api/v1/users/search' + _qs({ q })),
@@ -578,16 +278,10 @@ export function createDomains(restClient) {
            heartbeat: () => rc.post('/api/v1/presence/heartbeat', {}),
        },

-        usage: {
-            mine: (opts) => rc.get('/api/v1/usage' + _qs(opts)),
-        },
-
        groups: {
            mine: () => rc.get('/api/v1/groups/mine'),
        },

        health: () => rc.get('/api/v1/health'),
-
-        export: (content, format, filename) => rc.post('/api/v1/export', { content, format, filename }),
    };
 }
--- a/src/js/sw/sdk/index.js
+++ b/src/js/sw/sdk/index.js
@@ -1,5 +1,5 @@
 // ==========================================
-// Chat Switchboard — SDK Entry Point
+// Switchboard Core — SDK Entry Point
 // ==========================================
 // Assembles all SDK modules into the `sw` object
 // and runs the boot sequence.
@@ -129,28 +129,6 @@ export async function boot() {
        });
    };

-    // ChatPane render helper — surfaces call sw.chatPane(container, opts)
-    // Returns Promise<imperative handle> for backward-compat with old ChatPane API.
-    sw.chatPane = function (container, opts = {}) {
-        return import('../components/chat-pane/index.js').then(({ ChatPane }) => {
-            const handleRef = { current: null };
-            const { render } = preact;
-            render(html`<${ChatPane} handleRef=${handleRef} ...${opts} />`, container);
-            return handleRef.current;
-        });
-    };
-
-    // NotesPane render helper — surfaces call sw.notesPane(container, opts)
-    // Returns Promise<imperative handle>.
-    sw.notesPane = function (container, opts = {}) {
-        return import('../components/notes-pane/index.js').then(({ NotesPane }) => {
-            const handleRef = { current: null };
-            const { render } = preact;
-            render(html`<${NotesPane} handleRef=${handleRef} ...${opts} />`, container);
-            return handleRef.current;
-        });
-    };
-
    // Marker for idempotency
    sw._sdk = '0.38.1';

--- a/src/js/sw/surfaces/chat/channel-members-panel.js
+++ b/src/js/sw/surfaces/chat/channel-members-panel.js
@@ -1,104 +0,0 @@
-// ==========================================
-// Chat Surface — Channel Members Panel
-// ==========================================
-// Drawer showing channel participants with role management.
-// Uses Drawer primitive + channels.participants API.
-
-import { Drawer } from '../../primitives/drawer.js';
-import { UserPicker } from '../../primitives/user-picker.js';
-
-const { html } = window;
-const { useState, useEffect, useCallback } = hooks;
-
-const ROLES = ['owner', 'member', 'observer'];
-
-function _initials(name) {
-    if (!name) return '?';
-    return name.split(/\s+/).map(w => w[0]).join('').toUpperCase().slice(0, 2);
-}
-
-/**
- * @param {{ open: boolean, channelId: string, onClose: () => void }} props
- */
-export function ChannelMembersPanel({ open, channelId, onClose }) {
-    const [members, setMembers] = useState([]);
-    const [loading, setLoading] = useState(false);
-    const [adding, setAdding] = useState(false);
-
-    const load = useCallback(async () => {
-        if (!channelId) return;
-        setLoading(true);
-        try {
-            const data = await sw.api.channels.participants(channelId);
-            setMembers(data || []);
-        } catch (e) { sw.toast(e.message, 'error'); }
-        finally { setLoading(false); }
-    }, [channelId]);
-
-    useEffect(() => {
-        if (open && channelId) load();
-    }, [open, channelId, load]);
-
-    async function updateRole(pid, role) {
-        try {
-            await sw.api.channels.updateParticipant(channelId, pid, { role });
-            sw.toast('Role updated', 'success');
-            load();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    async function remove(pid) {
-        const ok = await sw.confirm('Remove this participant?', true);
-        if (!ok) return;
-        try {
-            await sw.api.channels.removeParticipant(channelId, pid);
-            sw.toast('Participant removed', 'success');
-            load();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    const _onUserSelect = useCallback(async (user) => {
-        setAdding(true);
-        try {
-            await sw.api.channels.addParticipant(channelId, {
-                participant_type: 'user',
-                participant_id: user.id,
-            });
-            sw.toast('Participant added', 'success');
-            load();
-        } catch (e) { sw.toast(e.message, 'error'); }
-        finally { setAdding(false); }
-    }, [channelId, load]);
-
-    if (!open) return null;
-
-    return html`
-        <${Drawer} open=${open} side="right" width="340px" title="Members" onClose=${onClose}>
-            ${loading && !members.length
-                ? html`<div class="sw-panel-loading">Loading\u2026</div>`
-                : html`
-                    <div class="sw-members-list">
-                        ${members.map(m => html`
-                            <div class="sw-members-row" key=${m.id}>
-                                <span class="sw-members-avatar">${_initials(m.display_name || m.participant_id)}</span>
-                                <div class="sw-members-info">
-                                    <span class="sw-members-name">${m.display_name || m.participant_id}</span>
-                                    <span class="sw-members-type">${m.participant_type}</span>
-                                </div>
-                                <select class="sw-members-role" value=${m.role || 'member'}
-                                        onChange=${e => updateRole(m.id, e.target.value)}>
-                                    ${ROLES.map(r => html`<option key=${r} value=${r}>${r}</option>`)}
-                                </select>
-                                <button class="sw-members-remove" onClick=${() => remove(m.id)}
-                                        title="Remove">\u00d7</button>
-                            </div>`)}
-                        ${members.length === 0 && html`
-                            <div class="sw-panel-empty">No participants</div>`}
-                    </div>
-                    <div class="sw-members-add">
-                        <${UserPicker}
-                            onSelect=${_onUserSelect}
-                            placeholder=${adding ? 'Adding\u2026' : 'Add participant\u2026'} />
-                    </div>`}
-        <//>`;
-}
--- a/src/js/sw/surfaces/chat/channel-settings-panel.js
+++ b/src/js/sw/surfaces/chat/channel-settings-panel.js
@@ -1,108 +0,0 @@
-// ==========================================
-// Chat Surface — Channel Settings Panel
-// ==========================================
-// Drawer for editing channel title, description, topic, ai_mode.
-// Uses Drawer primitive + channels.update API.
-
-import { Drawer } from '../../primitives/drawer.js';
-
-const { html } = window;
-const { useState, useEffect, useCallback } = hooks;
-
-const AI_MODES = [
-    { value: 'auto', label: 'Auto (always reply)' },
-    { value: 'mention_only', label: 'Mention only' },
-    { value: 'off', label: 'Off' },
-];
-
-/**
- * @param {{ open: boolean, channelId: string, onClose: () => void }} props
- */
-export function ChannelSettingsPanel({ open, channelId, onClose }) {
-    const [channel, setChannel] = useState(null);
-    const [loading, setLoading] = useState(false);
-    const [saving, setSaving] = useState(false);
-    const [form, setForm] = useState({ title: '', description: '', topic: '', ai_mode: 'auto' });
-
-    const load = useCallback(async () => {
-        if (!channelId) return;
-        setLoading(true);
-        try {
-            const data = await sw.api.channels.get(channelId);
-            setChannel(data);
-            setForm({
-                title: data.title || '',
-                description: data.description || '',
-                topic: data.topic || '',
-                ai_mode: data.ai_mode || 'auto',
-            });
-        } catch (e) { sw.toast(e.message, 'error'); }
-        finally { setLoading(false); }
-    }, [channelId]);
-
-    useEffect(() => {
-        if (open && channelId) load();
-    }, [open, channelId, load]);
-
-    function _set(key, value) {
-        setForm(prev => ({ ...prev, [key]: value }));
-    }
-
-    async function save(e) {
-        e.preventDefault();
-        setSaving(true);
-        try {
-            await sw.api.channels.update(channelId, {
-                title: form.title || undefined,
-                description: form.description || undefined,
-                topic: form.topic || undefined,
-                ai_mode: form.ai_mode || undefined,
-            });
-            sw.toast('Settings saved', 'success');
-        } catch (e) { sw.toast(e.message, 'error'); }
-        finally { setSaving(false); }
-    }
-
-    if (!open) return null;
-
-    return html`
-        <${Drawer} open=${open} side="right" width="340px" title="Channel Settings" onClose=${onClose}>
-            ${loading && !channel
-                ? html`<div class="sw-panel-loading">Loading\u2026</div>`
-                : html`
-                    <form class="sw-settings-form" onSubmit=${save}>
-                        <div class="sw-settings-field">
-                            <label>Title</label>
-                            <input type="text" value=${form.title}
-                                   onInput=${e => _set('title', e.target.value)} />
-                        </div>
-                        <div class="sw-settings-field">
-                            <label>Description</label>
-                            <textarea rows="3" value=${form.description}
-                                      onInput=${e => _set('description', e.target.value)} />
-                        </div>
-                        <div class="sw-settings-field">
-                            <label>Topic</label>
-                            <input type="text" value=${form.topic}
-                                   onInput=${e => _set('topic', e.target.value)} />
-                        </div>
-                        <div class="sw-settings-field">
-                            <label>AI Mode</label>
-                            <select value=${form.ai_mode}
-                                    onChange=${e => _set('ai_mode', e.target.value)}>
-                                ${AI_MODES.map(m => html`
-                                    <option key=${m.value} value=${m.value}>${m.label}</option>`)}
-                            </select>
-                        </div>
-                        ${channel && html`
-                            <div class="sw-settings-info">
-                                <div><strong>Type:</strong> ${channel.channel_type || channel.type || '\u2014'}</div>
-                                <div><strong>Created:</strong> ${channel.created_at ? new Date(channel.created_at).toLocaleDateString() : '\u2014'}</div>
-                            </div>`}
-                        <button type="submit" class="btn-md btn-primary sw-settings-save"
-                                disabled=${saving}>
-                            ${saving ? 'Saving\u2026' : 'Save'}
-                        </button>
-                    </form>`}
-        <//>`;
-}
--- a/src/js/sw/surfaces/chat/chat-workspace.js
+++ b/src/js/sw/surfaces/chat/chat-workspace.js
@@ -1,231 +0,0 @@
-// ==========================================
-// Chat Surface — ChatWorkspace Component
-// ==========================================
-// Header bar (model selector, tools, sidebar toggle) + ChatPane.
-// ChatPane runs standalone=false — the surface manages navigation.
-
-import { ChatPane, ModelSelector, useChat } from '../../components/chat-pane/index.js';
-import { NotificationBell } from '../../shell/notification-bell.js';
-import { ChannelMembersPanel } from './channel-members-panel.js';
-import { ChannelSettingsPanel } from './channel-settings-panel.js';
-import { UserPicker } from '../../primitives/user-picker.js';
-
-const html = window.html;
-const { useState, useRef, useEffect, useCallback } = window.hooks;
-
-
-const PANEL_SVG = html`
-    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <rect x="3" y="3" width="18" height="18" rx="2"/>
-        <line x1="9" y1="3" x2="9" y2="21"/>
-    </svg>`;
-
-const PEOPLE_SVG = html`
-    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/>
-        <circle cx="9" cy="7" r="4"/>
-        <path d="M23 21v-2a4 4 0 0 0-3-3.87"/>
-        <path d="M16 3.13a4 4 0 0 1 0 7.75"/>
-    </svg>`;
-
-const GEAR_SVG = html`
-    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <circle cx="12" cy="12" r="3"/>
-        <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/>
-    </svg>`;
-
-/**
- * @param {{
- *   activeId: string|null,
- *   activeType: 'chat'|'channel'|null,
- *   onChannelChange: (id: string) => void,
- *   onNewChat: () => void,
- *   sidebarOpen: boolean,
- *   onToggleSidebar: () => void,
- *   toolsButton?: any,
- * }} props
- */
-export function ChatWorkspace({
-    activeId, activeType, channelType, onChannelChange, onNewChat, onCreateChannel,
-    sidebarOpen, onToggleSidebar, toolsButton, sidebar,
-}) {
-    const chatRef = useRef(null);
-    const [selectedModel, setSelectedModel] = useState(null);
-    const [membersOpen, setMembersOpen] = useState(false);
-    const [settingsOpen, setSettingsOpen] = useState(false);
-    const activeChannel = sidebar?.items?.find(c => c.id === activeId);
-    const showModelSelector = (activeChannel?.ai_mode || 'auto') !== 'off';
-
-    // Close panels on channel switch
-    useEffect(() => {
-        setMembersOpen(false);
-        setSettingsOpen(false);
-    }, [activeId]);
-
-    // Sync model selection into ChatPane's useChat
-    useEffect(() => {
-        if (selectedModel && chatRef.current?.setModel) {
-            chatRef.current.setModel(selectedModel);
-        }
-    }, [selectedModel]);
-
-    // When activeId changes, tell ChatPane to switch channel
-    useEffect(() => {
-        if (chatRef.current) {
-            chatRef.current.setChannel(activeId);
-        }
-    }, [activeId]);
-
-    // Dashboard view when no channel selected
-    if (!activeId) {
-        return html`
-            <div class="sw-chat-surface__workspace">
-                <div class="sw-chat-surface__workspace-header">
-                    <div class="sw-chat-surface__workspace-header-left">
-                        ${!sidebarOpen && html`
-                            <button class="sw-chat-surface__sidebar-toggle"
-                                    onClick=${onToggleSidebar}
-                                    title="Show sidebar"
-                                    aria-label="Show sidebar">
-                                ${PANEL_SVG}
-                            </button>`}
-                    </div>
-                    <div class="sw-chat-surface__workspace-header-right">
-                        <${NotificationBell} onNavigate=${onChannelChange} />
-                    </div>
-                </div>
-                <${ChatDashboard} onNewChat=${onNewChat} onCreateChannel=${onCreateChannel}
-                                  items=${sidebar?.items} onNavigate=${onChannelChange} />
-            </div>`;
-    }
-
-    return html`
-        <div class="sw-chat-surface__workspace">
-            <div class="sw-chat-surface__workspace-header">
-                <div class="sw-chat-surface__workspace-header-left">
-                    ${!sidebarOpen && html`
-                        <button class="sw-chat-surface__sidebar-toggle"
-                                onClick=${onToggleSidebar}
-                                title="Show sidebar"
-                                aria-label="Show sidebar">
-                            ${PANEL_SVG}
-                        </button>`}
-                </div>
-                <div class="sw-chat-surface__workspace-header-right">
-                    ${showModelSelector && html`
-                        <${ModelSelector}
-                            value=${selectedModel}
-                            onChange=${setSelectedModel} />`}
-                    <button class="sw-chat-surface__header-btn"
-                            onClick=${() => setMembersOpen(v => !v)}
-                            title="Members"
-                            aria-label="Members">
-                        ${PEOPLE_SVG}
-                    </button>
-                    <button class="sw-chat-surface__header-btn"
-                            onClick=${() => setSettingsOpen(v => !v)}
-                            title="Channel settings"
-                            aria-label="Channel settings">
-                        ${GEAR_SVG}
-                    </button>
-                    <${NotificationBell} onNavigate=${onChannelChange} />
-                    ${toolsButton}
-                </div>
-            </div>
-            <${ChatPane}
-                channelId=${activeId}
-                standalone=${false}
-                modelId=${selectedModel}
-                handleRef=${chatRef}
-                onChannelChange=${onChannelChange}
-                className="sw-chat-surface__chat-pane" />
-            <${ChannelMembersPanel}
-                open=${membersOpen}
-                channelId=${activeId}
-                onClose=${() => setMembersOpen(false)} />
-            <${ChannelSettingsPanel}
-                open=${settingsOpen}
-                channelId=${activeId}
-                onClose=${() => setSettingsOpen(false)} />
-        </div>`;
-}
-
-// ── Dashboard (no chat selected) ────────────
-
-function ChatDashboard({ onNewChat, onCreateChannel, items, onNavigate }) {
-    const recentItems = (items || []).slice(0, 8);
-    const [showDmPicker, setShowDmPicker] = useState(false);
-
-    async function _create(type) {
-        if (type === 'dm') {
-            setShowDmPicker(true);
-            return;
-        }
-        const label = type === 'channel' ? 'Channel' : 'Group';
-        const name = await window.sw.prompt(label + ' name:', '');
-        if (name && name.trim()) onCreateChannel(type, name.trim());
-    }
-
-    const _onDmSelect = useCallback((user) => {
-        setShowDmPicker(false);
-        const name = user.display_name || user.username;
-        onCreateChannel('dm', 'DM: ' + name, { participant: user.id });
-    }, [onCreateChannel]);
-
-    return html`
-        <div class="sw-chat-dashboard">
-            <div class="sw-chat-dashboard__welcome">
-                <h2 class="sw-chat-dashboard__title">Chat Switchboard</h2>
-                <p class="sw-chat-dashboard__hint">Start a conversation or browse your channels.</p>
-            </div>
-            <div class="sw-chat-dashboard__actions">
-                <button class="sw-chat-dashboard__card" onClick=${onNewChat}>
-                    <span class="sw-chat-dashboard__card-icon">\u{1F4AC}</span>
-                    <span class="sw-chat-dashboard__card-label">New AI Chat</span>
-                </button>
-                ${sw.can('channel.create') && html`
-                <button class="sw-chat-dashboard__card" onClick=${() => _create('channel')}>
-                    <span class="sw-chat-dashboard__card-icon">#</span>
-                    <span class="sw-chat-dashboard__card-label">New Channel</span>
-                </button>`}
-                ${sw.can('channel.create') && html`
-                <button class="sw-chat-dashboard__card" onClick=${() => _create('group')}>
-                    <span class="sw-chat-dashboard__card-icon">\u{1F465}</span>
-                    <span class="sw-chat-dashboard__card-label">New Group</span>
-                </button>`}
-                <button class="sw-chat-dashboard__card" onClick=${() => _create('dm')}>
-                    <span class="sw-chat-dashboard__card-icon">\u{1F4E8}</span>
-                    <span class="sw-chat-dashboard__card-label">Direct Message</span>
-                </button>
-            </div>
-            ${showDmPicker && html`
-                <div class="sw-chat-dashboard__dm-picker">
-                    <h3 class="sw-chat-dashboard__section-title">Start a DM</h3>
-                    <${UserPicker}
-                        onSelect=${_onDmSelect}
-                        placeholder="Search for a user\u2026"
-                        autoFocus=${true} />
-                    <button class="btn-small"
-                            style="margin-top: 8px;"
-                            onClick=${() => setShowDmPicker(false)}>Cancel</button>
-                </div>`}
-            ${recentItems.length > 0 && html`
-                <div class="sw-chat-dashboard__recent">
-                    <h3 class="sw-chat-dashboard__section-title">Recent</h3>
-                    <div class="sw-chat-dashboard__recent-list">
-                        ${recentItems.map(ch => html`
-                            <div class="sw-chat-dashboard__recent-item" key=${ch.id}
-                                 onClick=${() => onNavigate?.(ch.id)}
-                                 style="cursor: pointer">
-                                <span class="sw-chat-dashboard__recent-icon">
-                                    ${ch.type === 'channel' || ch.type === 'group' ? '#' : '\u{1F4AC}'}
-                                </span>
-                                <span class="sw-chat-dashboard__recent-title">${ch.title || 'Untitled'}</span>
-                            </div>`)}
-                    </div>
-                </div>`}
-        </div>`;
-}
--- a/src/js/sw/surfaces/chat/index.js
+++ b/src/js/sw/surfaces/chat/index.js
@@ -1,151 +0,0 @@
-// ==========================================
-// Chat Surface — Root Component
-// ==========================================
-// Main chat surface: sidebar + workspace.
-// Follows the settings/admin mount pattern.
-//
-// v0.37.10: New Preact surface replacing the legacy SPA.
-
-import { ToastContainer } from '../../primitives/toast.js';
-import { DialogStack }    from '../../shell/dialog-stack.js';
-import { useWorkspace }   from './use-workspace.js';
-import { useSidebar }     from './use-sidebar.js';
-import { Sidebar }        from './sidebar.js';
-import { ChatWorkspace }  from './chat-workspace.js';
-import { useTools, ToolsPopup } from './tools-popup.js';
-
-const { render } = window.preact;
-const html = window.html;
-const { useState, useCallback } = window.hooks;
-
-const WRENCH_SVG = html`
-    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0
-                 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1
-                 7.94-7.94l-3.76 3.76z"/>
-    </svg>`;
-
-function ChatSurface() {
-    const workspace = useWorkspace();
-    const sidebar = useSidebar({ activeId: workspace.activeId });
-    const tools = useTools();
-    const [toolsOpen, setToolsOpen] = useState(false);
-
-    const _onNewChat = useCallback(async () => {
-        try {
-            const resp = await window.sw.api.channels.create({ type: 'direct', title: 'New Chat' });
-            const ch = resp;
-            if (ch?.id) {
-                sidebar.reload();
-                workspace.select(ch.id, 'direct');
-            }
-        } catch (err) {
-            console.error('[chat] New chat failed:', err);
-            window.sw?.toast?.('Failed to create chat', 'error');
-        }
-    }, [workspace.select, sidebar.reload]);
-
-    const _onCreateChannel = useCallback(async (type, title, opts) => {
-        try {
-            const body = { type, title };
-            if (opts?.participant) body.participants = [opts.participant];
-            const resp = await window.sw.api.channels.create(body);
-            const ch = resp;
-            if (ch?.id) {
-                sidebar.reload();
-                workspace.select(ch.id, type);
-            }
-        } catch (err) {
-            console.error('[chat] Create channel failed:', err);
-            window.sw?.toast?.('Failed to create ' + type, 'error');
-        }
-    }, [workspace.select, sidebar.reload]);
-
-    const _onDeleteChat = useCallback(async (id) => {
-        await sidebar.deleteChat(id);
-        if (id === workspace.activeId) workspace.clearSelection();
-    }, [sidebar.deleteChat, workspace.activeId, workspace.clearSelection]);
-
-    const _onChannelChange = useCallback((id) => {
-        if (id) workspace.select(id, 'direct');
-        else workspace.clearSelection();
-    }, [workspace.select, workspace.clearSelection]);
-
-    const _toggleSidebar = useCallback(() => {
-        workspace.setSidebarOpen(!workspace.sidebarOpen);
-    }, [workspace.sidebarOpen, workspace.setSidebarOpen]);
-
-    const _toggleTools = useCallback(() => {
-        setToolsOpen(v => !v);
-    }, []);
-
-    const _closeTools = useCallback(() => {
-        setToolsOpen(false);
-    }, []);
-
-    // Tools button — shared between mobile bar and workspace header
-    const toolsButton = html`
-        <button class="sw-chat-surface__tools-btn"
-                onClick=${_toggleTools}
-                title="Tools"
-                aria-label="Toggle tools"
-                aria-expanded=${toolsOpen}>
-            ${WRENCH_SVG}
-            ${tools.disabled.size > 0 && html`
-                <span class="sw-chat-surface__tools-badge">${tools.disabled.size}</span>`}
-        </button>`;
-
-    return html`
-        <div class="sw-chat-surface">
-            ${/* Mobile sidebar overlay */''}
-            ${workspace.sidebarOpen && html`
-                <div class="sw-chat-surface__sidebar-overlay"
-                     onClick=${_toggleSidebar} />`}
-
-            ${/* Sidebar */''}
-            ${workspace.sidebarOpen && html`
-                <${Sidebar}
-                    sidebar=${sidebar}
-                    activeId=${workspace.activeId}
-                    onSelect=${workspace.select}
-                    onNewChat=${_onNewChat}
-                    onCreateChannel=${_onCreateChannel}
-                    onDeleteChat=${_onDeleteChat}
-                    onCollapse=${_toggleSidebar} />`}
-
-            ${/* Main workspace */''}
-            <div class="sw-chat-surface__main">
-                <${ChatWorkspace}
-                    activeId=${workspace.activeId}
-                    activeType=${workspace.activeType}
-                    channelType=${workspace.channelType}
-                    onChannelChange=${_onChannelChange}
-                    onNewChat=${_onNewChat}
-                    onCreateChannel=${_onCreateChannel}
-                    sidebarOpen=${workspace.sidebarOpen}
-                    onToggleSidebar=${_toggleSidebar}
-                    toolsButton=${toolsButton}
-                    sidebar=${sidebar} />
-                <${ToolsPopup}
-                    open=${toolsOpen}
-                    onClose=${_closeTools}
-                    categories=${tools.categories}
-                    disabled=${tools.disabled}
-                    onToggle=${tools.toggle}
-                    onToggleCategory=${tools.toggleCategory} />
-            </div>
-        </div>
-        <${ToastContainer} />
-        <${DialogStack} />
-    `;
-}
-
-// ── Mount ────────────────────────────────────
-const mount = document.getElementById('chat-mount');
-if (mount) {
-    render(html`<${ChatSurface} />`, mount);
-    console.log('[chat] Surface mounted (v0.37.10)');
-}
-
-export { ChatSurface };
--- a/src/js/sw/surfaces/chat/sidebar-chats.js
+++ b/src/js/sw/surfaces/chat/sidebar-chats.js
@@ -1,361 +0,0 @@
-// ==========================================
-// Chat Surface — SidebarItems Component
-// ==========================================
-// Unified channel list with folder grouping, context menus,
-// nested folders, and HTML5 drag-and-drop.
-
-const html = window.html;
-const { useState, useCallback, useRef, useEffect } = window.hooks;
-
-// ── Icons ────────────────────────────────
-
-const CHAT_SVG = html`
-    <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>
-    </svg>`;
-
-const HASH_SVG = html`
-    <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <line x1="4" y1="9" x2="20" y2="9"/>
-        <line x1="4" y1="15" x2="20" y2="15"/>
-        <line x1="10" y1="3" x2="8" y2="21"/>
-        <line x1="16" y1="3" x2="14" y2="21"/>
-    </svg>`;
-
-const FOLDER_SVG = html`
-    <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/>
-    </svg>`;
-
-const DOTS_SVG = html`
-    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/>
-    </svg>`;
-
-const CHEVRON_SVG = html`
-    <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
-        <polyline points="9 18 15 12 9 6"/>
-    </svg>`;
-
-function _iconForType(type) {
-    if (type === 'channel' || type === 'group') return HASH_SVG;
-    return CHAT_SVG;
-}
-
-// Max nesting depth for folders
-const MAX_DEPTH = 3;
-
-// ── Main Component ───────────────────────
-
-export function SidebarItems({
-    itemsByFolder, folders, folderTree, activeId, onSelect,
-    onRename, onDelete, onMoveToFolder, onMoveFolderTo, onCreateFolder,
-    onRenameFolder, onDeleteFolder,
-}) {
-    const [contextMenu, setContextMenu] = useState(null);
-    const [dragOver, setDragOver] = useState(null);     // { id, type } of drop target
-    const [dragging, setDragging] = useState(false);    // true while any drag in progress
-    const [collapsedFolders, setCollapsedFolders] = useState({});
-    const menuRef = useRef(null);
-
-    // ── Context menu close ──────────────
-    useEffect(() => {
-        if (!contextMenu) return;
-        function _close(e) {
-            if (e.type === 'keydown' && e.key !== 'Escape') return;
-            if (e.type === 'click' && menuRef.current?.contains(e.target)) return;
-            setContextMenu(null);
-        }
-        document.addEventListener('click', _close);
-        document.addEventListener('keydown', _close);
-        return () => {
-            document.removeEventListener('click', _close);
-            document.removeEventListener('keydown', _close);
-        };
-    }, [contextMenu]);
-
-    const _openMenu = useCallback((e, type, item) => {
-        e.preventDefault();
-        e.stopPropagation();
-        const scale = sw.shell.getScale();
-        // The dots button may be display:none (zero rect) — fall back to parent
-        let rect = e.currentTarget.getBoundingClientRect();
-        if (!rect.width && !rect.height) {
-            const parent = e.currentTarget.closest('.sw-chat-surface__item, .sw-chat-surface__folder-header');
-            if (parent) rect = parent.getBoundingClientRect();
-        }
-        const x = rect.right / scale;
-        const y = rect.bottom / scale;
-        setContextMenu({ type, item, x, y });
-    }, []);
-
-    const _bodyContextMenu = useCallback((e) => {
-        if (e.target.closest('.sw-chat-surface__item') || e.target.closest('.sw-chat-surface__folder-header')) return;
-        e.preventDefault();
-        const scale = sw.shell.getScale();
-        setContextMenu({ type: 'body', item: null, x: e.clientX / scale, y: e.clientY / scale });
-    }, []);
-
-    const _action = useCallback(async (action, item) => {
-        setContextMenu(null);
-        if (action === 'rename') {
-            const newTitle = await window.sw.prompt('Rename:', item.title || item.name || '');
-            if (newTitle && newTitle.trim()) {
-                if (item.name !== undefined) await onRenameFolder(item.id, newTitle.trim());
-                else await onRename(item.id, newTitle.trim());
-            }
-        } else if (action === 'delete') {
-            const label = item.name !== undefined ? 'folder' : 'conversation';
-            const ok = await window.sw.confirm('Delete this ' + label + '?', true);
-            if (ok) {
-                if (item.name !== undefined) await onDeleteFolder(item.id);
-                else await onDelete(item.id);
-            }
-        } else if (action === 'move-out') {
-            await onMoveToFolder(item.id, null);
-        } else if (action === 'new-folder') {
-            const name = await window.sw.prompt('Folder name:', '');
-            if (name && name.trim()) await onCreateFolder(name.trim());
-        } else if (action === 'new-subfolder') {
-            const name = await window.sw.prompt('Subfolder name:', '');
-            if (name && name.trim()) await onCreateFolder(name.trim(), item.id);
-        } else if (action === 'unnest-folder') {
-            await onMoveFolderTo(item.id, null);
-        } else if (action.startsWith('move-to:')) {
-            const fid = action.slice(8);
-            await onMoveToFolder(item.id, fid);
-        }
-    }, [onRename, onDelete, onMoveToFolder, onMoveFolderTo, onCreateFolder, onRenameFolder, onDeleteFolder]);
-
-    // ── Folder collapse toggle ──────────
-    const _toggleFolder = useCallback((folderId) => {
-        setCollapsedFolders(prev => ({ ...prev, [folderId]: !prev[folderId] }));
-    }, []);
-
-    // ── Drag & Drop ─────────────────────
-    const _onDragStart = useCallback((e, dragType, item) => {
-        e.dataTransfer.effectAllowed = 'move';
-        e.dataTransfer.setData('text/plain', JSON.stringify({ dragType, id: item.id }));
-        setDragging(true);
-    }, []);
-
-    const _onDragOver = useCallback((e, targetId, targetType) => {
-        e.preventDefault();
-        e.dataTransfer.dropEffect = 'move';
-        setDragOver({ id: targetId, type: targetType });
-    }, []);
-
-    const _onDragLeave = useCallback(() => {
-        setDragOver(null);
-    }, []);
-
-    const _onDropOnFolder = useCallback((e, folderId) => {
-        e.preventDefault();
-        setDragOver(null);
-        try {
-            const data = JSON.parse(e.dataTransfer.getData('text/plain'));
-            if (data.dragType === 'channel') {
-                onMoveToFolder(data.id, folderId);
-            } else if (data.dragType === 'folder' && data.id !== folderId) {
-                onMoveFolderTo(data.id, folderId);
-            }
-        } catch (_) {}
-    }, [onMoveToFolder, onMoveFolderTo]);
-
-    const _onDropOnRoot = useCallback((e) => {
-        e.preventDefault();
-        setDragOver(null);
-        setDragging(false);
-        try {
-            const data = JSON.parse(e.dataTransfer.getData('text/plain'));
-            if (data.dragType === 'channel') {
-                onMoveToFolder(data.id, null);
-            } else if (data.dragType === 'folder') {
-                onMoveFolderTo(data.id, null);
-            }
-        } catch (_) {}
-    }, [onMoveToFolder, onMoveFolderTo]);
-
-    const _onDragEnd = useCallback(() => {
-        setDragging(false);
-        setDragOver(null);
-    }, []);
-
-    // ── Render ───────────────────────────
-    const unfolderedItems = itemsByFolder[''] || [];
-    const totalItems = Object.values(itemsByFolder).reduce((sum, arr) => sum + arr.length, 0);
-    const tree = folderTree || [];
-
-    const rootDropActive = dragging && dragOver?.id === '__root' && dragOver?.type === 'root';
-
-    return html`
-        <div class="sw-chat-surface__section-body"
-             role="listbox"
-             onContextMenu=${_bodyContextMenu}
-             onDragOver=${(e) => { e.preventDefault(); }}
-             onDrop=${_onDropOnRoot}
-             onDragEnd=${_onDragEnd}>
-            ${/* Render folder tree recursively */''}
-            ${tree.map(node => html`
-                <${FolderNode}
-                    key=${'f-' + node.id}
-                    node=${node}
-                    depth=${0}
-                    itemsByFolder=${itemsByFolder}
-                    activeId=${activeId}
-                    collapsedFolders=${collapsedFolders}
-                    dragOver=${dragOver}
-                    onSelect=${onSelect}
-                    onOpenMenu=${_openMenu}
-                    onToggleFolder=${_toggleFolder}
-                    onDragStart=${_onDragStart}
-                    onDragOver=${_onDragOver}
-                    onDragLeave=${_onDragLeave}
-                    onDropOnFolder=${_onDropOnFolder} />`)}
-            ${/* Unfoldered items */''}
-            ${unfolderedItems.map(ch => html`
-                <${ChannelItem} key=${ch.id} channel=${ch} activeId=${activeId}
-                                onSelect=${onSelect} onOpenMenu=${_openMenu}
-                                onDragStart=${_onDragStart} />`)}
-            ${totalItems === 0 && tree.length === 0 && html`
-                <div class="sw-chat-surface__empty">No conversations yet</div>`}
-            ${/* Visible root drop zone — shown during drag */''}
-            ${dragging && tree.length > 0 && html`
-                <div class=${'sw-chat-surface__root-drop' + (rootDropActive ? ' sw-chat-surface__root-drop--active' : '')}
-                     onDragOver=${(e) => _onDragOver(e, '__root', 'root')}
-                     onDragLeave=${_onDragLeave}
-                     onDrop=${_onDropOnRoot}>
-                    Drop here to remove from folder
-                </div>`}
-        </div>
-
-        ${/* Context Menu */''}
-        ${contextMenu && html`
-            <div class="sw-chat-surface__context-menu" ref=${menuRef}
-                 style=${'left:' + contextMenu.x + 'px;top:' + contextMenu.y + 'px;'}>
-                ${contextMenu.type === 'chat' && html`
-                    <button onClick=${() => _action('rename', contextMenu.item)}>Rename</button>
-                    ${folders.length > 0 && folders.map(f => html`
-                        <button key=${f.id} onClick=${() => _action('move-to:' + f.id, contextMenu.item)}>
-                            Move to ${f.name}
-                        </button>`)}
-                    ${contextMenu.item.folder_id && html`
-                        <button onClick=${() => _action('move-out', contextMenu.item)}>Remove from folder</button>`}
-                    <button class="sw-chat-surface__ctx-danger"
-                            onClick=${() => _action('delete', contextMenu.item)}>Delete</button>
-                `}
-                ${contextMenu.type === 'folder' && html`
-                    <button onClick=${() => _action('rename', contextMenu.item)}>Rename</button>
-                    <button onClick=${() => _action('new-subfolder', contextMenu.item)}>New subfolder</button>
-                    ${contextMenu.item.parent_id && html`
-                        <button onClick=${() => _action('unnest-folder', contextMenu.item)}>Move to root</button>`}
-                    <button class="sw-chat-surface__ctx-danger"
-                            onClick=${() => _action('delete', contextMenu.item)}>Delete</button>
-                `}
-                ${contextMenu.type === 'body' && html`
-                    <button onClick=${() => _action('new-folder', null)}>New Folder</button>
-                `}
-            </div>`}
-    `;
-}
-
-// ── FolderNode (recursive) ───────────────
-
-function FolderNode({
-    node, depth, itemsByFolder, activeId, collapsedFolders, dragOver,
-    onSelect, onOpenMenu, onToggleFolder,
-    onDragStart, onDragOver, onDragLeave, onDropOnFolder,
-}) {
-    const folderItems = itemsByFolder[node.id] || [];
-    const totalCount = folderItems.length + (node.children || []).length;
-    const isCollapsed = !!collapsedFolders[node.id];
-    const isDragTarget = dragOver?.id === node.id && dragOver?.type === 'folder';
-    const hasChildren = (node.children?.length > 0) || folderItems.length > 0;
-    const indent = depth * 12;
-
-    return html`
-        <div key=${'f-' + node.id}
-             class=${'sw-chat-surface__folder' + (isDragTarget ? ' sw-chat-surface__folder--drag-over' : '')}
-             style=${indent ? 'padding-left:' + indent + 'px' : ''}
-             draggable=${depth < MAX_DEPTH}
-             onDragStart=${(e) => { e.stopPropagation(); onDragStart(e, 'folder', node); }}
-             onDragOver=${(e) => { if (depth < MAX_DEPTH - 1) onDragOver(e, node.id, 'folder'); }}
-             onDragLeave=${onDragLeave}
-             onDrop=${(e) => { e.stopPropagation(); onDropOnFolder(e, node.id); }}>
-            <div class="sw-chat-surface__folder-header"
-                 onClick=${() => onToggleFolder(node.id)}>
-                <span class=${'sw-chat-surface__chevron' + (isCollapsed ? '' : ' sw-chat-surface__chevron--open')}>
-                    ${CHEVRON_SVG}
-                </span>
-                <span class="sw-chat-surface__item-icon">${FOLDER_SVG}</span>
-                <span class="sw-chat-surface__folder-name">${node.name}</span>
-                <span class="sw-chat-surface__folder-count">${totalCount}</span>
-                <button class="sw-chat-surface__item-menu"
-                        onClick=${(e) => { e.stopPropagation(); onOpenMenu(e, 'folder', node); }}
-                        title="Folder actions"
-                        aria-label="Folder actions">
-                    ${DOTS_SVG}
-                </button>
-            </div>
-            ${!isCollapsed && html`
-                ${/* Child folders */''}
-                ${(node.children || []).map(child => html`
-                    <${FolderNode}
-                        key=${'f-' + child.id}
-                        node=${child}
-                        depth=${depth + 1}
-                        itemsByFolder=${itemsByFolder}
-                        activeId=${activeId}
-                        collapsedFolders=${collapsedFolders}
-                        dragOver=${dragOver}
-                        onSelect=${onSelect}
-                        onOpenMenu=${onOpenMenu}
-                        onToggleFolder=${onToggleFolder}
-                        onDragStart=${onDragStart}
-                        onDragOver=${onDragOver}
-                        onDragLeave=${onDragLeave}
-                        onDropOnFolder=${onDropOnFolder} />`)}
-                ${/* Channel items in this folder */''}
-                ${folderItems.map(ch => html`
-                    <${ChannelItem} key=${ch.id} channel=${ch} activeId=${activeId}
-                                    onSelect=${onSelect} onOpenMenu=${onOpenMenu}
-                                    onDragStart=${onDragStart}
-                                    indent=${true} />`)}
-            `}
-        </div>`;
-}
-
-// ── ChannelItem ──────────────────────────
-
-function ChannelItem({ channel, activeId, onSelect, onOpenMenu, onDragStart, indent }) {
-    const icon = _iconForType(channel.type);
-    return html`
-        <button class=${'sw-chat-surface__item' + (channel.id === activeId ? ' sw-chat-surface__item--active' : '') + (indent ? ' sw-chat-surface__item--indent' : '')}
-                onClick=${() => onSelect(channel.id, channel.type)}
-                onContextMenu=${(e) => { e.preventDefault(); onOpenMenu(e, 'chat', channel); }}
-                draggable=${true}
-                onDragStart=${(e) => onDragStart(e, 'channel', channel)}
-                role="option"
-                aria-selected=${channel.id === activeId}
-                title=${channel.title || 'Untitled'}>
-            <span class="sw-chat-surface__item-icon">${icon}</span>
-            <span class="sw-chat-surface__item-title">${channel.title || 'Untitled'}</span>
-            ${(channel.unread_count || 0) > 0 && html`
-                <span class="sw-chat-surface__unread">${channel.unread_count}</span>`}
-            <button class="sw-chat-surface__item-menu"
-                    onClick=${(e) => { e.stopPropagation(); onOpenMenu(e, 'chat', channel); }}
-                    title="Actions"
-                    aria-label="Actions">
-                ${DOTS_SVG}
-            </button>
-        </button>`;
-}
-
-// Scale detection moved to sw.shell.getScale() in v0.37.19 (CR P3-3).
-
-// Folder count = direct children only (subfolders + channels in this folder).
--- a/src/js/sw/surfaces/chat/sidebar.js
+++ b/src/js/sw/surfaces/chat/sidebar.js
@@ -1,186 +0,0 @@
-// ==========================================
-// Chat Surface — Sidebar Component
-// ==========================================
-// Search bar, new chat, unified channel list with folders.
-// Footer has UserMenu (avatar) — all navigation lives in the menu flyout.
-
-import { SidebarItems }    from './sidebar-chats.js';
-import { UserMenu }        from '../../shell/user-menu.js';
-import { UserPicker }      from '../../primitives/user-picker.js';
-
-const html = window.html;
-const { useState, useCallback, useRef, useEffect } = window.hooks;
-
-const PLUS_SVG = html`
-    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <line x1="12" y1="5" x2="12" y2="19"/>
-        <line x1="5" y1="12" x2="19" y2="12"/>
-    </svg>`;
-
-const SEARCH_SVG = html`
-    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <circle cx="11" cy="11" r="8"/>
-        <line x1="21" y1="21" x2="16.65" y2="16.65"/>
-    </svg>`;
-
-const COLLAPSE_SVG = html`
-    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <rect x="3" y="3" width="18" height="18" rx="2"/>
-        <line x1="9" y1="3" x2="9" y2="21"/>
-    </svg>`;
-
-const FOLDER_PLUS_SVG = html`
-    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/>
-        <line x1="12" y1="11" x2="12" y2="17"/>
-        <line x1="9" y1="14" x2="15" y2="14"/>
-    </svg>`;
-
-/**
- * @param {{
- *   sidebar: ReturnType<import('./use-sidebar.js').useSidebar>,
- *   activeId: string|null,
- *   onSelect: (id: string, type: string) => void,
- *   onNewChat: () => void,
- *   onCollapse: () => void,
- * }} props
- */
-export function Sidebar({ sidebar, activeId, onSelect, onNewChat, onCreateChannel, onDeleteChat, onCollapse }) {
-    const [newMenuOpen, setNewMenuOpen] = useState(false);
-    const [showDmPicker, setShowDmPicker] = useState(false);
-    const newMenuRef = useRef(null);
-
-    const _onSearch = useCallback((e) => {
-        sidebar.setSearch(e.target.value);
-    }, [sidebar.setSearch]);
-
-    const _onNewFolder = useCallback(async () => {
-        const name = await window.sw.prompt('Folder name:', '');
-        if (name && name.trim()) sidebar.createFolder(name.trim());
-    }, [sidebar.createFolder]);
-
-    // Close new-channel dropdown on outside click / Escape
-    useEffect(() => {
-        if (!newMenuOpen) return;
-        function _close(e) {
-            if (e.type === 'keydown' && e.key !== 'Escape') return;
-            if (e.type === 'click' && newMenuRef.current?.contains(e.target)) return;
-            setNewMenuOpen(false);
-        }
-        document.addEventListener('click', _close);
-        document.addEventListener('keydown', _close);
-        return () => {
-            document.removeEventListener('click', _close);
-            document.removeEventListener('keydown', _close);
-        };
-    }, [newMenuOpen]);
-
-    const _newChannel = useCallback(async (type) => {
-        setNewMenuOpen(false);
-        if (type === 'direct') {
-            onNewChat();
-        } else if (type === 'dm') {
-            setShowDmPicker(true);
-        } else {
-            const name = await window.sw.prompt((type === 'channel' ? 'Channel' : 'Group') + ' name:', '');
-            if (name && name.trim()) onCreateChannel(type, name.trim());
-        }
-    }, [onNewChat, onCreateChannel]);
-
-    const _onDmSelect = useCallback((user) => {
-        setShowDmPicker(false);
-        const name = user.display_name || user.username;
-        onCreateChannel('dm', 'DM: ' + name, { participant: user.id });
-    }, [onCreateChannel]);
-
-    return html`
-        <div class="sw-chat-surface__sidebar" role="navigation" aria-label="Chat sidebar">
-            ${/* Header: new chat + collapse */''}
-            <div class="sw-chat-surface__sidebar-header">
-                <div class="sw-chat-surface__new-menu-wrap" ref=${newMenuRef}>
-                    <button class="sw-chat-surface__new-chat-btn"
-                            onClick=${() => setNewMenuOpen(!newMenuOpen)}
-                            title="New conversation"
-                            aria-label="New conversation">
-                        ${PLUS_SVG}
-                        <span>New</span>
-                    </button>
-                    ${newMenuOpen && html`
-                        <div class="sw-chat-surface__new-menu">
-                            <button onClick=${() => _newChannel('direct')}>
-                                <span class="sw-chat-surface__new-menu-icon">\u{1F4AC}</span> AI Chat
-                            </button>
-                            ${sw.can('channel.create') && html`<button onClick=${() => _newChannel('channel')}>
-                                <span class="sw-chat-surface__new-menu-icon">#</span> Channel
-                            </button>`}
-                            ${sw.can('channel.create') && html`<button onClick=${() => _newChannel('group')}>
-                                <span class="sw-chat-surface__new-menu-icon">\u{1F465}</span> Group
-                            </button>`}
-                            <button onClick=${() => _newChannel('dm')}>
-                                <span class="sw-chat-surface__new-menu-icon">\u{1F4E8}</span> Direct Message
-                            </button>
-                        </div>`}
-                </div>
-                <button class="sw-chat-surface__new-folder-btn"
-                        onClick=${_onNewFolder}
-                        title="New folder"
-                        aria-label="Create new folder">
-                    ${FOLDER_PLUS_SVG}
-                </button>
-                <button class="sw-chat-surface__collapse-btn"
-                        onClick=${onCollapse}
-                        title="Collapse sidebar"
-                        aria-label="Collapse sidebar">
-                    ${COLLAPSE_SVG}
-                </button>
-            </div>
-
-            ${showDmPicker && html`
-                <div style="padding: 6px 8px;">
-                    <${UserPicker}
-                        onSelect=${_onDmSelect}
-                        placeholder="Search for a user\u2026"
-                        autoFocus=${true} />
-                    <button class="btn-small"
-                            style="margin-top: 4px; width: 100%;"
-                            onClick=${() => setShowDmPicker(false)}>Cancel</button>
-                </div>`}
-
-            ${/* Search */''}
-            <div class="sw-chat-surface__search-wrap">
-                <span class="sw-chat-surface__search-icon">${SEARCH_SVG}</span>
-                <input class="sw-chat-surface__search"
-                       type="text"
-                       placeholder="Search\u2026"
-                       value=${sidebar.search}
-                       onInput=${_onSearch}
-                       aria-label="Search chats and channels" />
-            </div>
-
-            ${/* Scrollable content */''}
-            <div class="sw-chat-surface__sidebar-body">
-                <${SidebarItems}
-                    itemsByFolder=${sidebar.itemsByFolder}
-                    folders=${sidebar.folders}
-                    folderTree=${sidebar.folderTree}
-                    activeId=${activeId}
-                    onSelect=${onSelect}
-                    onRename=${sidebar.renameChat}
-                    onDelete=${onDeleteChat || sidebar.deleteChat}
-                    onMoveToFolder=${sidebar.moveToFolder}
-                    onMoveFolderTo=${sidebar.moveFolderTo}
-                    onCreateFolder=${sidebar.createFolder}
-                    onRenameFolder=${sidebar.renameFolder}
-                    onDeleteFolder=${sidebar.deleteFolder} />
-            </div>
-
-            ${/* Footer: UserMenu only */''}
-            <div class="sw-chat-surface__sidebar-footer">
-                <${UserMenu} placement="up-right" />
-            </div>
-        </div>`;
-}
--- a/src/js/sw/surfaces/chat/tools-popup.js
+++ b/src/js/sw/surfaces/chat/tools-popup.js
@@ -1,166 +0,0 @@
-// ==========================================
-// Chat Surface — ToolsPopup Component
-// ==========================================
-// Scrollable popup anchored to a toolbar icon.
-// Category-based tool toggles with persistence to localStorage.
-
-const html = window.html;
-const { useState, useEffect, useRef, useCallback, useMemo } = window.hooks;
-
-const STORAGE_KEY = 'sw-disabled-tools';
-
-/**
- * Load tools list from API and organize by category.
- * @returns {{ categories: Array, disabled: Set, toggle: Function, getDisabled: Function }}
- */
-export function useTools() {
-    const [tools, setTools] = useState([]);
-    const [disabled, setDisabled] = useState(_loadDisabled);
-
-    useEffect(() => {
-        // Load available tools from API
-        if (window.sw?.api?.tools?.list) {
-            window.sw.api.tools.list().then(resp => {
-                setTools(resp || []);
-            }).catch(() => {});
-        }
-    }, []);
-
-    const categories = useMemo(() => {
-        const map = {};
-        for (const t of tools) {
-            const cat = t.category || 'Other';
-            if (!map[cat]) map[cat] = [];
-            map[cat].push(t);
-        }
-        return Object.entries(map).map(([name, items]) => ({ name, items }));
-    }, [tools]);
-
-    const toggle = useCallback((toolName) => {
-        setDisabled(prev => {
-            const next = new Set(prev);
-            if (next.has(toolName)) next.delete(toolName);
-            else next.add(toolName);
-            _saveDisabled(next);
-            return next;
-        });
-    }, []);
-
-    const toggleCategory = useCallback((catName) => {
-        setDisabled(prev => {
-            const cat = categories.find(c => c.name === catName);
-            if (!cat) return prev;
-            const next = new Set(prev);
-            const allDisabled = cat.items.every(t => next.has(t.name));
-            for (const t of cat.items) {
-                if (allDisabled) next.delete(t.name);
-                else next.add(t.name);
-            }
-            _saveDisabled(next);
-            return next;
-        });
-    }, [categories]);
-
-    const getDisabled = useCallback(() => [...disabled], [disabled]);
-
-    return { categories, disabled, toggle, toggleCategory, getDisabled };
-}
-
-/**
- * @param {{
- *   open: boolean,
- *   onClose: () => void,
- *   categories: Array<{name: string, items: Array<{name: string, description?: string}>}>,
- *   disabled: Set<string>,
- *   onToggle: (name: string) => void,
- *   onToggleCategory: (catName: string) => void,
- * }} props
- */
-export function ToolsPopup({ open, onClose, categories, disabled, onToggle, onToggleCategory }) {
-    const panelRef = useRef(null);
-    const [expandedCats, setExpandedCats] = useState({});
-
-    // Close on Escape or outside click
-    useEffect(() => {
-        if (!open) return;
-        function _onKey(e) {
-            if (e.key === 'Escape') { e.stopPropagation(); onClose(); }
-        }
-        function _onClick(e) {
-            if (panelRef.current && !panelRef.current.contains(e.target)) onClose();
-        }
-        document.addEventListener('keydown', _onKey, true);
-        setTimeout(() => document.addEventListener('click', _onClick), 0);
-        return () => {
-            document.removeEventListener('keydown', _onKey, true);
-            document.removeEventListener('click', _onClick);
-        };
-    }, [open, onClose]);
-
-    const _toggleCat = useCallback((name) => {
-        setExpandedCats(prev => ({ ...prev, [name]: !prev[name] }));
-    }, []);
-
-    if (!open) return null;
-
-    const disabledCount = disabled.size;
-
-    return html`
-        <div class="sw-tools-popup" ref=${panelRef} role="dialog" aria-label="Tools toggle">
-            <div class="sw-tools-popup__header">
-                <span class="sw-tools-popup__title">Tools</span>
-                ${disabledCount > 0 && html`
-                    <span class="sw-tools-popup__badge">${disabledCount} disabled</span>`}
-            </div>
-            <div class="sw-tools-popup__body">
-                ${categories.length === 0 && html`
-                    <div class="sw-tools-popup__empty">No tools available</div>`}
-                ${categories.map(cat => {
-                    const allDisabled = cat.items.every(t => disabled.has(t.name));
-                    const someDisabled = cat.items.some(t => disabled.has(t.name));
-                    const isExpanded = expandedCats[cat.name] !== false; // default open
-
-                    return html`
-                        <div key=${cat.name} class="sw-tools-popup__category">
-                            <div class="sw-tools-popup__cat-header">
-                                <button class="sw-tools-popup__cat-toggle"
-                                        onClick=${() => _toggleCat(cat.name)}
-                                        aria-expanded=${isExpanded}>
-                                    <span class=${'sw-tools-popup__chevron' + (isExpanded ? ' sw-tools-popup__chevron--open' : '')}>
-                                        \u25B6
-                                    </span>
-                                    <span>${cat.name}</span>
-                                    <span class="sw-tools-popup__cat-count">${cat.items.length}</span>
-                                </button>
-                                <label class="sw-tools-popup__cat-switch">
-                                    <input type="checkbox"
-                                           checked=${!allDisabled}
-                                           indeterminate=${someDisabled && !allDisabled}
-                                           onChange=${() => onToggleCategory(cat.name)} />
-                                </label>
-                            </div>
-                            ${isExpanded && cat.items.map(tool => html`
-                                <label key=${tool.name} class="sw-tools-popup__tool">
-                                    <input type="checkbox"
-                                           checked=${!disabled.has(tool.name)}
-                                           onChange=${() => onToggle(tool.name)} />
-                                    <span class="sw-tools-popup__tool-name">${tool.name}</span>
-                                    ${tool.description && html`
-                                        <span class="sw-tools-popup__tool-desc">${tool.description}</span>`}
-                                </label>`)}
-                        </div>`;
-                })}
-            </div>
-        </div>`;
-}
-
-function _loadDisabled() {
-    try {
-        const arr = JSON.parse(localStorage.getItem(STORAGE_KEY));
-        return new Set(arr || []);
-    } catch (_) { return new Set(); }
-}
-
-function _saveDisabled(set) {
-    try { localStorage.setItem(STORAGE_KEY, JSON.stringify([...set])); } catch (_) {}
-}
--- a/src/js/sw/surfaces/chat/use-sidebar.js
+++ b/src/js/sw/surfaces/chat/use-sidebar.js
@@ -1,205 +0,0 @@
-// ==========================================
-// Chat Surface — useSidebar Hook
-// ==========================================
-// Loads and manages sidebar data: all channels (unified)
-// and folders. Subscribes to WS events for live updates.
-
-const { useState, useEffect, useCallback, useMemo, useRef } = window.hooks;
-
-const COLLAPSE_KEY = 'sw-chat-sidebar-collapsed';
-
-/**
- * @param {{ activeId: string|null }} opts
- */
-export function useSidebar(opts = {}) {
-    const { activeId } = opts;
-
-    const [allChannels, setAllChannels] = useState([]);
-    const [folders, setFolders] = useState([]);
-    const [search, setSearch] = useState('');
-    const [collapsed, setCollapsed] = useState(_loadCollapsed);
-    const [loading, setLoading] = useState(true);
-    const activeIdRef = useRef(activeId);
-    activeIdRef.current = activeId;
-
-    // ── Load data ───────────────────────────
-    const reload = useCallback(async () => {
-        if (!window.sw?.api?.channels?.list) return;
-
-        try {
-            const foldersPromise = window.sw.api.folders?.list
-                ? window.sw.api.folders.list().catch(() => [])
-                : Promise.resolve([]);
-
-            const [allResp, fResp] = await Promise.all([
-                window.sw.api.channels.list({ page: 1, per_page: 200, types: 'direct,dm,group,channel' }).catch(() => []),
-                foldersPromise,
-            ]);
-
-            const fresh = _extract(allResp);
-            // Zero unread for the active channel (mark-read already fired)
-            const aid = activeIdRef.current;
-            if (aid) {
-                const idx = fresh.findIndex(c => c.id === aid);
-                if (idx !== -1) fresh[idx] = { ...fresh[idx], unread_count: 0 };
-            }
-            setAllChannels(fresh);
-            setFolders(_extract(fResp));
-        } catch (_) {}
-
-        setLoading(false);
-    }, []);
-
-    useEffect(() => { reload(); }, [reload]);
-
-    // ── Clear unread badge when channel becomes active ──
-    useEffect(() => {
-        if (!activeId) return;
-        setAllChannels(prev => prev.map(c =>
-            c.id === activeId && c.unread_count > 0
-                ? { ...c, unread_count: 0 }
-                : c
-        ));
-    }, [activeId]);
-
-    // ── WebSocket live updates ──────────────
-    useEffect(() => {
-        if (!window.sw?.on) return;
-
-        const handlers = {
-            'channel.created': reload,
-            'channel.updated': reload,
-            'channel.deleted': reload,
-            'folder.created':  reload,
-            'folder.updated':  reload,
-            'folder.deleted':  reload,
-        };
-
-        Object.entries(handlers).forEach(([ev, fn]) => window.sw.on(ev, fn));
-        return () => {
-            Object.entries(handlers).forEach(([ev, fn]) => window.sw.off?.(ev, fn));
-        };
-    }, [reload]);
-
-    // ── Search filter ───────────────────────
-    const filtered = useMemo(() => {
-        if (!search) return allChannels;
-        const q = search.toLowerCase();
-        return allChannels.filter(c => (c.title || '').toLowerCase().includes(q));
-    }, [allChannels, search]);
-
-    // Group all channels by folder
-    const itemsByFolder = useMemo(() => {
-        const map = { '': [] };
-        for (const f of (folders || [])) map[f.id] = [];
-        for (const c of filtered) {
-            const fid = c.folder_id || '';
-            if (!map[fid]) map[fid] = [];
-            map[fid].push(c);
-        }
-        return map;
-    }, [filtered, folders]);
-
-    // Build nested folder tree (max 3 levels)
-    const folderTree = useMemo(() => {
-        if (!folders || !folders.length) return [];
-        const byId = {};
-        for (const f of folders) byId[f.id] = { ...f, children: [] };
-        const roots = [];
-        for (const f of folders) {
-            const node = byId[f.id];
-            if (f.parent_id && byId[f.parent_id]) {
-                byId[f.parent_id].children.push(node);
-            } else {
-                roots.push(node);
-            }
-        }
-        return roots;
-    }, [folders]);
-
-    // ── Collapse folders ────────────────────
-    const toggleCollapsed = useCallback((key) => {
-        setCollapsed(prev => {
-            const next = { ...prev, [key]: !prev[key] };
-            try { localStorage.setItem(COLLAPSE_KEY, JSON.stringify(next)); } catch (_) {}
-            return next;
-        });
-    }, []);
-
-    // ── CRUD helpers ────────────────────────
-    const createFolder = useCallback(async (name, parentId) => {
-        if (!window.sw?.api?.folders?.create) return;
-        await window.sw.api.folders.create(name, parentId ? { parent_id: parentId } : undefined);
-        reload();
-    }, [reload]);
-
-    const moveFolderTo = useCallback(async (folderId, parentId) => {
-        if (!window.sw?.api?.folders?.update) return;
-        await window.sw.api.folders.update(folderId, { parent_id: parentId || null });
-        reload();
-    }, [reload]);
-
-    const renameChat = useCallback(async (id, title) => {
-        await window.sw.api.channels.update(id, { title });
-        reload();
-    }, [reload]);
-
-    const deleteChat = useCallback(async (id) => {
-        await window.sw.api.channels.del(id);
-        reload();
-    }, [reload]);
-
-    const moveToFolder = useCallback(async (chatId, folderId) => {
-        await window.sw.api.channels.update(chatId, { folder_id: folderId || null });
-        reload();
-    }, [reload]);
-
-    const renameFolder = useCallback(async (id, name) => {
-        await window.sw.api.folders.update(id, { name });
-        reload();
-    }, [reload]);
-
-    const deleteFolder = useCallback(async (id) => {
-        await window.sw.api.folders.del(id);
-        reload();
-    }, [reload]);
-
-    return {
-        items: filtered,
-        itemsByFolder,
-        folders,
-        folderTree,
-        search,
-        setSearch,
-        collapsed,
-        toggleCollapsed,
-        loading,
-        reload,
-        // CRUD
-        createFolder,
-        renameChat,
-        deleteChat,
-        moveToFolder,
-        moveFolderTo,
-        renameFolder,
-        deleteFolder,
-    };
-}
-
-function _extract(resp) {
-    if (!resp) return [];
-    if (Array.isArray(resp)) return resp;
-    if (Array.isArray(resp.data)) return resp.data;
-    // Handle wrapped responses like { folders: [], channels: [] }
-    const vals = Object.values(resp);
-    for (const v of vals) {
-        if (Array.isArray(v)) return v;
-    }
-    return [];
-}
-
-function _loadCollapsed() {
-    try {
-        return JSON.parse(localStorage.getItem(COLLAPSE_KEY)) || {};
-    } catch (_) { return {}; }
-}
--- a/src/js/sw/surfaces/chat/use-workspace.js
+++ b/src/js/sw/surfaces/chat/use-workspace.js
@@ -1,83 +0,0 @@
-// ==========================================
-// Chat Surface — useWorkspace Hook
-// ==========================================
-// Coordinator hook: manages active conversation, sidebar state.
-// Persists active selection to sessionStorage for reload restore.
-
-const { useState, useCallback, useEffect } = window.hooks;
-
-const STORAGE_KEY = 'sw-chat-active';
-
-/**
- * @returns {{
- *   activeId: string|null,
- *   activeType: 'chat'|'channel'|null,
- *   sidebarOpen: boolean,
- *   setSidebarOpen: (v: boolean) => void,
- *   selectChat: (id: string) => void,
- *   selectChannel: (id: string) => void,
- *   clearSelection: () => void,
- * }}
- */
-export function useWorkspace() {
-    // Restore from sessionStorage
-    const stored = _loadStored();
-    const [activeId, setActiveId] = useState(stored.id);
-    const [activeType, setActiveType] = useState(stored.type);
-    const [channelType, setChannelType] = useState(stored.channelType || null);
-    const [sidebarOpen, setSidebarOpen] = useState(true);
-
-    // Persist on change
-    useEffect(() => {
-        if (activeId) {
-            try {
-                sessionStorage.setItem(STORAGE_KEY, JSON.stringify({ id: activeId, type: activeType, channelType }));
-            } catch (_) {}
-        } else {
-            sessionStorage.removeItem(STORAGE_KEY);
-        }
-    }, [activeId, activeType, channelType]);
-
-    const select = useCallback((id, chType) => {
-        setActiveId(id);
-        setChannelType(chType || 'direct');
-        // Map channel model type to workspace type
-        const wsType = (chType === 'channel' || chType === 'group') ? 'channel' : 'chat';
-        setActiveType(wsType);
-        // Auto-close sidebar on mobile
-        if (window.innerWidth < 768) setSidebarOpen(false);
-    }, []);
-
-    // Keep legacy aliases for any other callers
-    const selectChat = useCallback((id) => select(id, 'direct'), [select]);
-    const selectChannel = useCallback((id) => select(id, 'channel'), [select]);
-
-    const clearSelection = useCallback(() => {
-        setActiveId(null);
-        setActiveType(null);
-        setChannelType(null);
-    }, []);
-
-    return {
-        activeId,
-        activeType,
-        channelType,
-        sidebarOpen,
-        setSidebarOpen,
-        select,
-        selectChat,
-        selectChannel,
-        clearSelection,
-    };
-}
-
-function _loadStored() {
-    try {
-        const raw = sessionStorage.getItem(STORAGE_KEY);
-        if (raw) {
-            const obj = JSON.parse(raw);
-            return { id: obj.id || null, type: obj.type || null, channelType: obj.channelType || null };
-        }
-    } catch (_) {}
-    return { id: null, type: null, channelType: null };
-}
--- a/src/js/sw/surfaces/notes/index.js
+++ b/src/js/sw/surfaces/notes/index.js
@@ -1,90 +0,0 @@
-// ==========================================
-// Notes Surface — Root Component
-// ==========================================
-// Main notes surface: sidebar + workspace.
-// Follows the chat surface mount pattern.
-//
-// v0.37.11: New Preact surface replacing the legacy template mount.
-
-import { ToastContainer } from '../../primitives/toast.js';
-import { DialogStack }    from '../../shell/dialog-stack.js';
-import { useWorkspace }   from './use-workspace.js';
-import { useSidebar }     from './use-sidebar.js';
-import { Sidebar }        from './sidebar.js';
-import { NotesWorkspace } from './notes-workspace.js';
-
-const { render } = window.preact;
-const html = window.html;
-const { useRef, useCallback } = window.hooks;
-
-function NotesSurface() {
-    const workspace = useWorkspace();
-    const sidebar = useSidebar();
-    const notesRef = useRef(null);
-
-    const _onNewNote = useCallback(() => {
-        if (notesRef.current) notesRef.current.newNote();
-    }, []);
-
-    const _toggleSidebar = useCallback(() => {
-        workspace.setSidebarOpen(!workspace.sidebarOpen);
-    }, [workspace.sidebarOpen, workspace.setSidebarOpen]);
-
-    const _onFolderSelect = useCallback((path) => {
-        if (notesRef.current?.setFolder) notesRef.current.setFolder(path);
-    }, []);
-
-    const _onTagSelect = useCallback((tag) => {
-        if (notesRef.current?.setTagFilter) notesRef.current.setTagFilter(tag);
-    }, []);
-
-    const _onSearch = useCallback((query) => {
-        if (notesRef.current?.setSearchQuery) notesRef.current.setSearchQuery(query);
-    }, []);
-
-    const _onNoteChange = useCallback((note) => {
-        if (note?.id) {
-            workspace.selectNote(note.id);
-        }
-    }, [workspace.selectNote]);
-
-    return html`
-        <div class="sw-notes-surface">
-            ${/* Mobile sidebar overlay */''}
-            ${workspace.sidebarOpen && html`
-                <div class="sw-notes-surface__sidebar-overlay"
-                     onClick=${_toggleSidebar} />`}
-
-            ${/* Sidebar */''}
-            ${workspace.sidebarOpen && html`
-                <${Sidebar}
-                    sidebar=${sidebar}
-                    onNewNote=${_onNewNote}
-                    onCollapse=${_toggleSidebar}
-                    onFolderSelect=${_onFolderSelect}
-                    onTagSelect=${_onTagSelect}
-                    onSearch=${_onSearch} />`}
-
-            ${/* Main workspace */''}
-            <div class="sw-notes-surface__main">
-                <${NotesWorkspace}
-                    sidebarOpen=${workspace.sidebarOpen}
-                    onToggleSidebar=${_toggleSidebar}
-                    initialNoteId=${workspace.activeNoteId}
-                    onNoteChange=${_onNoteChange}
-                    handleRef=${notesRef} />
-            </div>
-        </div>
-        <${ToastContainer} />
-        <${DialogStack} />
-    `;
-}
-
-// ── Mount ────────────────────────────────────
-const mount = document.getElementById('notes-mount');
-if (mount) {
-    render(html`<${NotesSurface} />`, mount);
-    console.log('[notes] Surface mounted (v0.37.11)');
-}
-
-export { NotesSurface };
--- a/src/js/sw/surfaces/notes/notes-workspace.js
+++ b/src/js/sw/surfaces/notes/notes-workspace.js
@@ -1,56 +0,0 @@
-// ==========================================
-// Notes Surface — NotesWorkspace Component
-// ==========================================
-// Header bar (sidebar toggle) + NotesPane.
-// NotesPane runs standalone=false — the surface manages filters.
-//
-// v0.37.11
-
-import { NotesPane } from '../../components/notes-pane/index.js';
-import { NotificationBell } from '../../shell/notification-bell.js';
-
-const html = window.html;
-
-const PANEL_SVG = html`
-    <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <rect x="3" y="3" width="18" height="18" rx="2"/>
-        <line x1="9" y1="3" x2="9" y2="21"/>
-    </svg>`;
-
-/**
- * @param {{
- *   sidebarOpen: boolean,
- *   onToggleSidebar: () => void,
- *   initialNoteId?: string,
- *   onNoteChange?: (note: object|null) => void,
- *   handleRef?: { current: any },
- * }} props
- */
-export function NotesWorkspace({
-    sidebarOpen, onToggleSidebar, initialNoteId, onNoteChange, handleRef,
-}) {
-    return html`
-        <div class="sw-notes-surface__workspace">
-            <div class="sw-notes-surface__workspace-header">
-                <div class="sw-notes-surface__workspace-header-left">
-                    ${!sidebarOpen && html`
-                        <button class="sw-notes-surface__sidebar-toggle"
-                                onClick=${onToggleSidebar}
-                                title="Show sidebar"
-                                aria-label="Show sidebar">
-                            ${PANEL_SVG}
-                        </button>`}
-                </div>
-                <div class="sw-notes-surface__workspace-header-right">
-                    <${NotificationBell} />
-                </div>
-            </div>
-            <${NotesPane}
-                standalone=${false}
-                initialNoteId=${initialNoteId}
-                handleRef=${handleRef}
-                onNoteChange=${onNoteChange}
-                className="sw-notes-surface__notes-pane" />
-        </div>`;
-}
--- a/src/js/sw/surfaces/notes/sidebar-folders.js
+++ b/src/js/sw/surfaces/notes/sidebar-folders.js
@@ -1,71 +0,0 @@
-// ==========================================
-// Notes Surface — SidebarFolders Component
-// ==========================================
-// Collapsible folder tree for the notes sidebar.
-// v0.37.11
-
-const html = window.html;
-
-const CHEVRON_SVG = html`
-    <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
-        <polyline points="9 18 15 12 9 6"/>
-    </svg>`;
-
-const FOLDER_SVG = html`
-    <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/>
-    </svg>`;
-
-/**
- * @param {{
- *   folders: Array<{ path: string, count: number }>,
- *   activeFolder: string,
- *   collapsed: boolean,
- *   onToggle: () => void,
- *   onSelect: (path: string) => void,
- * }} props
- */
-export function SidebarFolders({ folders, activeFolder, collapsed, onToggle, onSelect }) {
-    const totalCount = folders.reduce((sum, f) => sum + (f.count || 0), 0);
-
-    return html`
-        <div class="sw-notes-surface__section">
-            <button class="sw-notes-surface__section-header"
-                    onClick=${onToggle}
-                    aria-expanded=${!collapsed}>
-                <span class=${'sw-notes-surface__chevron' + (collapsed ? '' : ' sw-notes-surface__chevron--open')}>
-                    ${CHEVRON_SVG}
-                </span>
-                <span class="sw-notes-surface__section-label">Folders</span>
-                ${totalCount > 0 && html`
-                    <span class="sw-notes-surface__section-count">${totalCount}</span>`}
-            </button>
-            ${!collapsed && html`
-                <div class="sw-notes-surface__section-body" role="listbox">
-                    ${/* "All Notes" clears folder filter */''}
-                    <button class=${'sw-notes-surface__item' + (!activeFolder ? ' sw-notes-surface__item--active' : '')}
-                            onClick=${() => onSelect('')}
-                            role="option"
-                            aria-selected=${!activeFolder}>
-                        <span class="sw-notes-surface__item-icon">${FOLDER_SVG}</span>
-                        <span class="sw-notes-surface__item-title">All Notes</span>
-                    </button>
-                    ${folders.map(f => html`
-                        <button key=${f.path}
-                                class=${'sw-notes-surface__item' + (activeFolder === f.path ? ' sw-notes-surface__item--active' : '')}
-                                onClick=${() => onSelect(f.path)}
-                                role="option"
-                                aria-selected=${activeFolder === f.path}
-                                title=${f.path}>
-                            <span class="sw-notes-surface__item-icon">${FOLDER_SVG}</span>
-                            <span class="sw-notes-surface__item-title">${f.path}</span>
-                            ${f.count > 0 && html`
-                                <span class="sw-notes-surface__item-count">${f.count}</span>`}
-                        </button>`)}
-                    ${folders.length === 0 && html`
-                        <div class="sw-notes-surface__empty">No folders</div>`}
-                </div>`}
-        </div>`;
-}
--- a/src/js/sw/surfaces/notes/sidebar-tags.js
+++ b/src/js/sw/surfaces/notes/sidebar-tags.js
@@ -1,52 +0,0 @@
-// ==========================================
-// Notes Surface — SidebarTags Component
-// ==========================================
-// Collapsible tag cloud for the notes sidebar.
-// v0.37.11
-
-const html = window.html;
-
-const CHEVRON_SVG = html`
-    <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
-        <polyline points="9 18 15 12 9 6"/>
-    </svg>`;
-
-/**
- * @param {{
- *   tags: Array<[string, number]>,
- *   activeTag: string,
- *   collapsed: boolean,
- *   onToggle: () => void,
- *   onSelect: (tag: string) => void,
- * }} props
- */
-export function SidebarTags({ tags, activeTag, collapsed, onToggle, onSelect }) {
-    return html`
-        <div class="sw-notes-surface__section">
-            <button class="sw-notes-surface__section-header"
-                    onClick=${onToggle}
-                    aria-expanded=${!collapsed}>
-                <span class=${'sw-notes-surface__chevron' + (collapsed ? '' : ' sw-notes-surface__chevron--open')}>
-                    ${CHEVRON_SVG}
-                </span>
-                <span class="sw-notes-surface__section-label">Tags</span>
-                ${tags.length > 0 && html`
-                    <span class="sw-notes-surface__section-count">${tags.length}</span>`}
-            </button>
-            ${!collapsed && html`
-                <div class="sw-notes-surface__section-body">
-                    <div class="sw-notes-surface__tag-cloud">
-                        ${tags.length === 0 && html`
-                            <div class="sw-notes-surface__empty">No tags</div>`}
-                        ${tags.map(([tag, count]) => html`
-                            <span key=${tag}
-                                  class=${'sw-notes-surface__tag-chip' + (activeTag === tag ? ' sw-notes-surface__tag-chip--active' : '')}
-                                  onClick=${() => onSelect(activeTag === tag ? '' : tag)}
-                                  title=${tag + ' (' + count + ')'}>
-                                ${tag}
-                            </span>`)}
-                    </div>
-                </div>`}
-        </div>`;
-}
--- a/src/js/sw/surfaces/notes/sidebar.js
+++ b/src/js/sw/surfaces/notes/sidebar.js
@@ -1,121 +0,0 @@
-// ==========================================
-// Notes Surface — Sidebar Component
-// ==========================================
-// Search bar, new note, folder tree, tag cloud.
-// Footer has UserMenu — same pattern as chat sidebar.
-//
-// v0.37.11
-
-import { SidebarFolders } from './sidebar-folders.js';
-import { SidebarTags }    from './sidebar-tags.js';
-import { UserMenu }       from '../../shell/user-menu.js';
-
-const html = window.html;
-const { useCallback, useRef } = window.hooks;
-
-const PLUS_SVG = html`
-    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <line x1="12" y1="5" x2="12" y2="19"/>
-        <line x1="5" y1="12" x2="19" y2="12"/>
-    </svg>`;
-
-const SEARCH_SVG = html`
-    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <circle cx="11" cy="11" r="8"/>
-        <line x1="21" y1="21" x2="16.65" y2="16.65"/>
-    </svg>`;
-
-const COLLAPSE_SVG = html`
-    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-         stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-        <rect x="3" y="3" width="18" height="18" rx="2"/>
-        <line x1="9" y1="3" x2="9" y2="21"/>
-    </svg>`;
-
-/**
- * @param {{
- *   sidebar: ReturnType<import('./use-sidebar.js').useSidebar>,
- *   onNewNote: () => void,
- *   onCollapse: () => void,
- *   onFolderSelect: (path: string) => void,
- *   onTagSelect: (tag: string) => void,
- *   onSearch: (query: string) => void,
- * }} props
- */
-export function Sidebar({ sidebar, onNewNote, onCollapse, onFolderSelect, onTagSelect, onSearch }) {
-    const searchTimerRef = useRef(null);
-
-    const _onSearchInput = useCallback((e) => {
-        const val = e.target.value;
-        sidebar.setSearch(val);
-        clearTimeout(searchTimerRef.current);
-        searchTimerRef.current = setTimeout(() => {
-            onSearch(val.trim());
-        }, 300);
-    }, [sidebar.setSearch, onSearch]);
-
-    const _onFolderSelect = useCallback((path) => {
-        sidebar.setActiveFolder(path);
-        onFolderSelect(path);
-    }, [sidebar.setActiveFolder, onFolderSelect]);
-
-    const _onTagSelect = useCallback((tag) => {
-        sidebar.setActiveTag(tag);
-        onTagSelect(tag);
-    }, [sidebar.setActiveTag, onTagSelect]);
-
-    return html`
-        <div class="sw-notes-surface__sidebar" role="navigation" aria-label="Notes sidebar">
-            ${/* Header: new note + collapse */''}
-            <div class="sw-notes-surface__sidebar-header">
-                <button class="sw-notes-surface__new-note-btn"
-                        onClick=${onNewNote}
-                        title="New note"
-                        aria-label="Create new note">
-                    ${PLUS_SVG}
-                    <span>New Note</span>
-                </button>
-                <button class="sw-notes-surface__collapse-btn"
-                        onClick=${onCollapse}
-                        title="Collapse sidebar"
-                        aria-label="Collapse sidebar">
-                    ${COLLAPSE_SVG}
-                </button>
-            </div>
-
-            ${/* Search */''}
-            <div class="sw-notes-surface__search-wrap">
-                <span class="sw-notes-surface__search-icon">${SEARCH_SVG}</span>
-                <input class="sw-notes-surface__search"
-                       type="text"
-                       placeholder="Search notes\u2026"
-                       value=${sidebar.search}
-                       onInput=${_onSearchInput}
-                       aria-label="Search notes" />
-            </div>
-
-            ${/* Scrollable content */''}
-            <div class="sw-notes-surface__sidebar-body">
-                <${SidebarFolders}
-                    folders=${sidebar.folders}
-                    activeFolder=${sidebar.activeFolder}
-                    collapsed=${sidebar.collapsed.folders}
-                    onToggle=${() => sidebar.toggleCollapsed('folders')}
-                    onSelect=${_onFolderSelect} />
-
-                <${SidebarTags}
-                    tags=${sidebar.tags}
-                    activeTag=${sidebar.activeTag}
-                    collapsed=${sidebar.collapsed.tags}
-                    onToggle=${() => sidebar.toggleCollapsed('tags')}
-                    onSelect=${_onTagSelect} />
-            </div>
-
-            ${/* Footer: UserMenu only */''}
-            <div class="sw-notes-surface__sidebar-footer">
-                <${UserMenu} placement="up-right" />
-            </div>
-        </div>`;
-}
--- a/src/js/sw/surfaces/notes/use-sidebar.js
+++ b/src/js/sw/surfaces/notes/use-sidebar.js
@@ -1,122 +0,0 @@
-// ==========================================
-// Notes Surface — useSidebar Hook
-// ==========================================
-// Loads folders and tags for the sidebar.
-// Subscribes to WS events for live updates.
-//
-// v0.37.11: New Preact surface.
-
-const { useState, useEffect, useCallback, useMemo } = window.hooks;
-
-const COLLAPSE_KEY = 'sw-notes-sidebar-collapsed';
-
-/**
- * @returns {{
- *   folders: Array<{ path: string, count: number }>,
- *   tags: Array<[string, number]>,
- *   activeFolder: string,
- *   activeTag: string,
- *   search: string,
- *   setActiveFolder: (f: string) => void,
- *   setActiveTag: (t: string) => void,
- *   setSearch: (q: string) => void,
- *   collapsed: { folders: boolean, tags: boolean },
- *   toggleCollapsed: (key: string) => void,
- *   loading: boolean,
- * }}
- */
-export function useSidebar() {
-    const [folders, setFolders] = useState([]);
-    const [allNotes, setAllNotes] = useState([]);
-    const [activeFolder, setActiveFolder] = useState('');
-    const [activeTag, setActiveTag] = useState('');
-    const [search, setSearch] = useState('');
-    const [collapsed, setCollapsed] = useState(_loadCollapsed);
-    const [loading, setLoading] = useState(true);
-
-    // ── Load data ───────────────────────────
-    const reload = useCallback(async () => {
-        if (!window.sw?.api?.notes) return;
-
-        try {
-            const [fResp, nResp] = await Promise.all([
-                window.sw.api.notes.folders().catch(() => []),
-                window.sw.api.notes.list({ per_page: 200 }).catch(() => []),
-            ]);
-
-            setFolders(_extract(fResp));
-            setAllNotes(_extract(nResp));
-        } catch (_) {}
-
-        setLoading(false);
-    }, []);
-
-    useEffect(() => { reload(); }, [reload]);
-
-    // ── WebSocket live updates ──────────────
-    useEffect(() => {
-        if (!window.sw?.on) return;
-
-        const events = [
-            'note.created', 'note.updated', 'note.deleted',
-        ];
-
-        events.forEach(ev => window.sw.on(ev, reload));
-        return () => {
-            events.forEach(ev => window.sw.off?.(ev, reload));
-        };
-    }, [reload]);
-
-    // ── Aggregate tags from notes ───────────
-    const tags = useMemo(() => {
-        const counts = {};
-        for (const n of allNotes) {
-            for (const t of (n.tags || [])) {
-                counts[t] = (counts[t] || 0) + 1;
-            }
-        }
-        return Object.entries(counts)
-            .sort((a, b) => b[1] - a[1])
-            .slice(0, 30);
-    }, [allNotes]);
-
-    // ── Collapse sections ───────────────────
-    const toggleCollapsed = useCallback((key) => {
-        setCollapsed(prev => {
-            const next = { ...prev, [key]: !prev[key] };
-            try { localStorage.setItem(COLLAPSE_KEY, JSON.stringify(next)); } catch (_) {}
-            return next;
-        });
-    }, []);
-
-    return {
-        folders,
-        tags,
-        activeFolder,
-        activeTag,
-        search,
-        setActiveFolder,
-        setActiveTag,
-        setSearch,
-        collapsed,
-        toggleCollapsed,
-        loading,
-    };
-}
-
-function _extract(resp) {
-    if (!resp) return [];
-    if (Array.isArray(resp)) return resp;
-    if (Array.isArray(resp.data)) return resp.data;
-    const vals = Object.values(resp);
-    for (const v of vals) {
-        if (Array.isArray(v)) return v;
-    }
-    return [];
-}
-
-function _loadCollapsed() {
-    try {
-        return JSON.parse(localStorage.getItem(COLLAPSE_KEY)) || {};
-    } catch (_) { return {}; }
-}
--- a/src/js/sw/surfaces/notes/use-workspace.js
+++ b/src/js/sw/surfaces/notes/use-workspace.js
@@ -1,59 +0,0 @@
-// ==========================================
-// Notes Surface — useWorkspace Hook
-// ==========================================
-// Coordinator hook: manages sidebar state and active note.
-// Persists active selection to sessionStorage for reload restore.
-//
-// v0.37.11: New Preact surface.
-
-const { useState, useCallback, useEffect } = window.hooks;
-
-const STORAGE_KEY = 'sw-notes-active';
-
-/**
- * @returns {{
- *   activeNoteId: string|null,
- *   sidebarOpen: boolean,
- *   setSidebarOpen: (v: boolean) => void,
- *   selectNote: (id: string) => void,
- *   clearSelection: () => void,
- * }}
- */
-export function useWorkspace() {
-    const stored = _loadStored();
-    const [activeNoteId, setActiveNoteId] = useState(stored);
-    const [sidebarOpen, setSidebarOpen] = useState(true);
-
-    // Persist on change
-    useEffect(() => {
-        if (activeNoteId) {
-            try { sessionStorage.setItem(STORAGE_KEY, activeNoteId); } catch (_) {}
-        } else {
-            sessionStorage.removeItem(STORAGE_KEY);
-        }
-    }, [activeNoteId]);
-
-    const selectNote = useCallback((id) => {
-        setActiveNoteId(id);
-        // Auto-close sidebar on mobile
-        if (window.innerWidth < 768) setSidebarOpen(false);
-    }, []);
-
-    const clearSelection = useCallback(() => {
-        setActiveNoteId(null);
-    }, []);
-
-    return {
-        activeNoteId,
-        sidebarOpen,
-        setSidebarOpen,
-        selectNote,
-        clearSelection,
-    };
-}
-
-function _loadStored() {
-    try {
-        return sessionStorage.getItem(STORAGE_KEY) || null;
-    } catch (_) { return null; }
-}
--- a/src/js/sw/surfaces/projects/detail.js
+++ b/src/js/sw/surfaces/projects/detail.js
@@ -1,580 +0,0 @@
-/**
- * ProjectDetail — two-column detail view with inline chat + metadata sidebar.
- *
- * Props:
- *   project   — project object
- *   onBack    — () => void  (return to list)
- *   onUpdate  — (deleted?: boolean) => void
- *
- * Left panel toggles: conversation list ↔ embedded ChatPane.
- * Right sidebar: collapsible sections (Description, Instructions, KBs, Notes, Files).
- */
-const html = window.html;
-const h = window.preact.h;
-const { useState, useEffect, useCallback, useRef } = window.hooks;
-
-import { ChatPane } from '../../components/chat-pane/index.js';
-import { UserMenu } from '../../shell/user-menu.js';
-
-const COLORS = ['#4f8cff','#34d399','#f59e0b','#ef4444','#a78bfa','#ec4899','#06b6d4','#8b5cf6'];
-
-function fmtDate(d) {
-    if (!d) return '\u2014';
-    return new Date(d).toLocaleString(undefined, { dateStyle: 'short', timeStyle: 'short' });
-}
-function formatBytes(b) {
-    if (!b) return '0 B';
-    if (b < 1024) return b + ' B';
-    if (b < 1048576) return (b / 1024).toFixed(1) + ' KB';
-    return (b / 1048576).toFixed(1) + ' MB';
-}
-function relTime(dateStr) {
-    if (!dateStr) return '';
-    const DIVS = [[60,'second'],[60,'minute'],[24,'hour'],[30,'day'],[12,'month'],[Infinity,'year']];
-    let val = Math.floor((Date.now() - new Date(dateStr).getTime()) / 1000);
-    if (val < 10) return 'just now';
-    for (const [div, unit] of DIVS) {
-        if (val < div) { const n = Math.floor(val); return `${n} ${unit}${n!==1?'s':''} ago`; }
-        val /= div;
-    }
-    return '';
-}
-
-export function ProjectDetail({ project, onBack, onUpdate }) {
-    const BASE = window.__BASE__ || '';
-    const chatRef = useRef(null);
-
-    // ── State ──
-    const [activeChannelId, setActiveChannelId] = useState(null);
-    const [assoc, setAssoc] = useState({ channels: [], kbs: [], notes: [], files: [] });
-    const [editingName, setEditingName] = useState(false);
-    const [nameVal, setNameVal] = useState(project.name || '');
-    const [menuOpen, setMenuOpen] = useState(false);
-    const [sections, setSections] = useState({ desc: true, instructions: false, kbs: false, notes: false, files: false });
-    const [desc, setDesc] = useState(project.description || '');
-    const [instructions, setInstructions] = useState(project.settings?.instructions || '');
-    const [descDirty, setDescDirty] = useState(false);
-    const [instrDirty, setInstrDirty] = useState(false);
-    const [starred, setStarred] = useState(!!project.settings?.starred);
-
-    // Picker state
-    const [pickerOpen, setPickerOpen] = useState('');
-    const [pickerItems, setPickerItems] = useState([]);
-    const [pickerLoading, setPickerLoading] = useState(false);
-
-    // Drag state for files
-    const [dragActive, setDragActive] = useState(false);
-
-    // ── Load associations ──
-    const loadAssoc = useCallback(async () => {
-        const id = project.id;
-        const [ch, kb, nt, fi] = await Promise.all([
-            sw.api.projects.channels(id).then(r => r?.data || r || []).catch(() => []),
-            sw.api.projects.kbs(id).then(r => r?.data || r || []).catch(() => []),
-            sw.api.projects.notes(id).then(r => r?.data || r || []).catch(() => []),
-            sw.api.projects.files(id).then(r => r?.data || r?.files || r || []).catch(() => []),
-        ]);
-        setAssoc({ channels: ch, kbs: kb, notes: nt, files: fi });
-    }, [project.id]);
-
-    useEffect(() => { loadAssoc(); }, [loadAssoc]);
-
-    // ── Toggle section ──
-    function toggleSection(key) {
-        setSections(prev => ({ ...prev, [key]: !prev[key] }));
-    }
-
-    // ── Name editing ──
-    async function saveName() {
-        const name = nameVal.trim();
-        if (!name || name === project.name) { setEditingName(false); return; }
-        try {
-            await sw.api.projects.update(project.id, { name });
-            sw.toast('Renamed', 'success');
-            setEditingName(false);
-            onUpdate();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    // ── Description / Instructions save ──
-    async function saveDesc() {
-        try {
-            await sw.api.projects.update(project.id, { description: desc });
-            sw.toast('Description saved', 'success');
-            setDescDirty(false);
-            onUpdate();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    async function saveInstructions() {
-        try {
-            const settings = { ...(project.settings || {}), instructions };
-            await sw.api.projects.update(project.id, { settings });
-            sw.toast('Instructions saved', 'success');
-            setInstrDirty(false);
-            onUpdate();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    // ── Star toggle ──
-    async function toggleStar() {
-        const next = !starred;
-        setStarred(next);
-        try {
-            const settings = { ...(project.settings || {}), starred: next };
-            await sw.api.projects.update(project.id, { settings });
-        } catch (e) { sw.toast(e.message, 'error'); setStarred(!next); }
-    }
-
-    // ── Context menu actions ──
-    async function handleColor(c) {
-        try {
-            await sw.api.projects.update(project.id, { color: c });
-            sw.toast('Color updated', 'success');
-            setMenuOpen(false);
-            onUpdate();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    async function toggleArchive() {
-        try {
-            await sw.api.projects.update(project.id, { is_archived: !project.is_archived });
-            sw.toast(project.is_archived ? 'Unarchived' : 'Archived', 'success');
-            setMenuOpen(false);
-            onUpdate();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    async function deleteProject() {
-        setMenuOpen(false);
-        if (!await sw.confirm('Delete this project? This cannot be undone.', true)) return;
-        try {
-            await sw.api.projects.del(project.id);
-            sw.toast('Project deleted', 'success');
-            onUpdate(true);
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    // ── Picker helpers ──
-    async function openPicker(type) {
-        if (pickerOpen === type) { setPickerOpen(''); return; }
-        setPickerOpen(type);
-        setSections(prev => ({ ...prev, [type]: true }));
-        setPickerLoading(true);
-        setPickerItems([]);
-        try {
-            let items = [];
-            if (type === 'kbs') {
-                const r = await sw.api.knowledge.list();
-                const all = r?.data || r || [];
-                const attached = new Set(assoc.kbs.map(k => k.id || k.kb_id));
-                items = all.filter(k => !attached.has(k.id));
-            } else if (type === 'notes') {
-                const r = await sw.api.notes.list();
-                const all = r?.data || r || [];
-                const attached = new Set(assoc.notes.map(n => n.id || n.note_id));
-                items = all.filter(n => !attached.has(n.id));
-            }
-            setPickerItems(items);
-        } catch (e) { sw.toast(e.message, 'error'); }
-        setPickerLoading(false);
-    }
-
-    async function pickItem(type, item) {
-        try {
-            if (type === 'kbs') await sw.api.projects.addKb(project.id, item.id, false);
-            else if (type === 'notes') await sw.api.projects.addNote(project.id, item.id);
-            sw.toast('Added', 'success');
-            setPickerOpen('');
-            loadAssoc();
-            onUpdate();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    // ── Remove handlers ──
-    async function removeKb(kbId) {
-        try { await sw.api.projects.removeKb(project.id, kbId); sw.toast('Removed', 'success'); loadAssoc(); onUpdate(); }
-        catch (e) { sw.toast(e.message, 'error'); }
-    }
-    async function removeNote(noteId) {
-        try { await sw.api.projects.removeNote(project.id, noteId); sw.toast('Removed', 'success'); loadAssoc(); onUpdate(); }
-        catch (e) { sw.toast(e.message, 'error'); }
-    }
-    async function removeChannel(chId) {
-        try { await sw.api.projects.removeChannel(project.id, chId); sw.toast('Removed', 'success'); loadAssoc(); onUpdate(); }
-        catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    // ── File state ──
-    const [expandedDirs, setExpandedDirs] = useState({});
-    const [uploading, setUploading] = useState('');
-
-    // ── File upload ──
-    const ARCHIVE_EXTS = ['.zip', '.tar.gz', '.tgz'];
-
-    async function uploadFiles(files) {
-        const total = files.length;
-        let done = 0;
-        setUploading(`Uploading 0 of ${total}\u2026`);
-        for (const file of files) {
-            try {
-                const isArchive = ARCHIVE_EXTS.some(e => file.name.toLowerCase().endsWith(e));
-                if (isArchive && await sw.confirm(`Extract "${file.name}" contents into the project?`)) {
-                    const r = await sw.api.projects.uploadArchive(project.id, file);
-                    sw.toast(`Extracted ${r?.files_extracted || 0} files`, 'success');
-                } else {
-                    await sw.api.projects.uploadFile(project.id, file);
-                    sw.toast(`Uploaded ${file.name}`, 'success');
-                }
-            } catch (e) {
-                const msg = e.status === 413 ? 'Storage quota exceeded' : e.message;
-                sw.toast(`${file.name}: ${msg}`, 'error');
-            }
-            done++;
-            setUploading(`Uploading ${done} of ${total}\u2026`);
-        }
-        setUploading('');
-        loadAssoc();
-    }
-
-    function handleUploadClick() {
-        const input = document.createElement('input');
-        input.type = 'file';
-        input.multiple = true;
-        input.onchange = () => { if (input.files.length) uploadFiles(input.files); };
-        input.click();
-    }
-
-    function handleDrop(e) {
-        e.preventDefault();
-        setDragActive(false);
-        if (e.dataTransfer.files.length) uploadFiles(e.dataTransfer.files);
-    }
-
-    // ── File actions ──
-    async function downloadFile(path) {
-        try {
-            const token = sw.auth?.token?.();
-            const base = window.__BASE__ || '';
-            const url = `${base}/api/v1/projects/${project.id}/files/download?path=${encodeURIComponent(path)}`;
-            const res = await fetch(url, { headers: token ? { Authorization: `Bearer ${token}` } : {} });
-            if (!res.ok) throw new Error('Download failed');
-            const blob = await res.blob();
-            const a = document.createElement('a');
-            a.href = URL.createObjectURL(blob);
-            a.download = path.split('/').pop() || 'download';
-            a.click();
-            URL.revokeObjectURL(a.href);
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    async function deleteFile(path) {
-        const name = path.split('/').pop() || path;
-        if (!await sw.confirm(`Delete "${name}"?`, true)) return;
-        try {
-            await sw.api.projects.deleteFile(project.id, path);
-            sw.toast('Deleted', 'success');
-            loadAssoc();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    async function createFolder() {
-        const name = await sw.prompt('Folder name:');
-        if (!name) return;
-        try {
-            await sw.api.projects.mkdir(project.id, name);
-            sw.toast(`Created "${name}"`, 'success');
-            loadAssoc();
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    async function downloadAll() {
-        try {
-            const token = sw.auth?.token?.();
-            const base = window.__BASE__ || '';
-            const url = `${base}/api/v1/projects/${project.id}/archive/download?format=zip`;
-            const res = await fetch(url, { headers: token ? { Authorization: `Bearer ${token}` } : {} });
-            if (!res.ok) throw new Error('Download failed');
-            const blob = await res.blob();
-            const a = document.createElement('a');
-            a.href = URL.createObjectURL(blob);
-            a.download = `${project.name || 'project'}.zip`;
-            a.click();
-            URL.revokeObjectURL(a.href);
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    // ── File tree builder ──
-    function buildTree(files) {
-        if (!files || !files.length) return [];
-        // Sort: directories first, then alpha
-        const sorted = [...files].sort((a, b) => {
-            if (a.is_directory !== b.is_directory) return a.is_directory ? -1 : 1;
-            return (a.path || '').localeCompare(b.path || '');
-        });
-        // Group into top-level entries (split by first path segment)
-        const root = [];
-        const dirMap = {};
-        for (const f of sorted) {
-            const parts = (f.path || f.filename || '').split('/').filter(Boolean);
-            if (parts.length <= 1) {
-                root.push({ ...f, name: parts[0] || f.filename, children: f.is_directory ? [] : null, depth: 0 });
-                if (f.is_directory) dirMap[f.path] = root[root.length - 1];
-            } else {
-                // Find parent dir in root
-                const parentPath = parts.slice(0, -1).join('/');
-                const parent = dirMap[parentPath];
-                const entry = { ...f, name: parts[parts.length - 1], children: f.is_directory ? [] : null, depth: parts.length - 1 };
-                if (parent) {
-                    parent.children.push(entry);
-                } else {
-                    root.push(entry);
-                }
-                if (f.is_directory) dirMap[f.path] = entry;
-            }
-        }
-        return root;
-    }
-
-    function fileIcon(f) {
-        if (f.is_directory) return '\uD83D\uDCC1';
-        const ct = f.content_type || '';
-        if (ct.startsWith('image/')) return '\uD83D\uDDBC\uFE0F';
-        if (ct === 'application/pdf') return '\uD83D\uDCC4';
-        if (ct.startsWith('text/')) return '\uD83D\uDCC3';
-        return '\uD83D\uDCCE';
-    }
-
-    function renderFileTree(entries) {
-        if (!entries || !entries.length) return null;
-        return entries.map(f => {
-            const isDir = f.is_directory;
-            const expanded = expandedDirs[f.path];
-            const indent = (f.depth || 0) * 16;
-            return html`<div key=${f.path || f.name}>
-                <div class="sw-projects__file-row" style=${'padding-left:' + (8 + indent) + 'px'}>
-                    ${isDir && html`<span class=${'sw-projects__file-chevron' + (expanded ? ' sw-projects__file-chevron--open' : '')}
-                        onClick=${() => setExpandedDirs(prev => ({ ...prev, [f.path]: !prev[f.path] }))}>\u25B6</span>`}
-                    <span class="sw-projects__file-icon">${fileIcon(f)}</span>
-                    <span class="sw-projects__file-name"
-                        onClick=${isDir
-                            ? () => setExpandedDirs(prev => ({ ...prev, [f.path]: !prev[f.path] }))
-                            : () => downloadFile(f.path)}
-                        title=${isDir ? 'Toggle folder' : 'Click to download'}>
-                        ${f.name}
-                    </span>
-                    ${!isDir && html`<span class="sw-projects__file-meta">${formatBytes(f.size_bytes)}</span>`}
-                    ${isDir && f.children && html`<span class="sw-projects__file-meta">${f.children.length} items</span>`}
-                    <button class="sw-projects__file-delete" onClick=${() => deleteFile(f.path)} title="Delete">\u00D7</button>
-                </div>
-                ${isDir && expanded && f.children && renderFileTree(f.children)}
-            </div>`;
-        });
-    }
-
-    // ── New conversation ──
-    async function newConversation() {
-        try {
-            const ch = await sw.api.channels.create({ type: 'direct', title: 'New Chat' });
-            const chId = ch?.id || ch?.data?.id;
-            if (chId) {
-                await sw.api.projects.addChannel(project.id, chId);
-                await loadAssoc();
-                setActiveChannelId(chId);
-            }
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    // ── Render: Picker dropdown ──
-    function renderPicker(type, emptyHint) {
-        if (pickerOpen !== type) return null;
-        return html`<div class="sw-projects__picker">
-            ${pickerLoading && html`<div class="sw-projects__picker-hint">Loading\u2026</div>`}
-            ${!pickerLoading && pickerItems.length === 0 && html`<div class="sw-projects__picker-hint">${emptyHint}</div>`}
-            ${!pickerLoading && pickerItems.map(item => html`
-                <div key=${item.id} class="sw-projects__picker-item" onClick=${() => pickItem(type, item)}>
-                    ${item.title || item.name || item.id}
-                </div>
-            `)}
-        </div>`;
-    }
-
-    // ── Render: Collapsible section ──
-    function renderSection(key, title, count, content, addAction) {
-        const open = sections[key];
-        return html`<div class="sw-projects__section">
-            <div class="sw-projects__section-header" onClick=${e => { if (e.target.closest('.sw-projects__section-add')) return; toggleSection(key); }}>
-                <div>
-                    <span class="sw-projects__section-title">${title}</span>
-                    ${count != null && html`<span class="sw-projects__section-count">${count}</span>`}
-                </div>
-                <div class="sw-projects__section-actions">
-                    ${addAction && html`<button class="sw-projects__section-add"
-                        onClick=${e => { e.stopPropagation(); addAction(); }}>+</button>`}
-                    <span class=${'sw-projects__section-chevron' + (open ? ' sw-projects__section-chevron--open' : '')}>\u25B6</span>
-                </div>
-            </div>
-            ${open && html`<div class="sw-projects__section-body">${content}</div>`}
-        </div>`;
-    }
-
-    // ── Render: Left panel ──
-    function renderLeftPanel() {
-        if (activeChannelId) {
-            return html`<div class="sw-projects__chat-wrap">
-                <div class="sw-projects__chat-back" onClick=${() => setActiveChannelId(null)}>
-                    \u2190 Back to conversations
-                </div>
-                <${ChatPane}
-                    channelId=${activeChannelId}
-                    standalone=${false}
-                    handleRef=${chatRef}
-                    className="sw-projects__chat-pane" />
-            </div>`;
-        }
-
-        return html`<div class="sw-projects__conversations">
-            <div class="sw-projects__conv-header">
-                <span style="font-size:13px;font-weight:600;color:var(--text-2);">Conversations</span>
-                <button class="sw-projects__new-btn" style="font-size:12px;padding:5px 12px;" onClick=${newConversation}>+ New</button>
-            </div>
-            <div class="sw-projects__conv-list">
-                ${assoc.channels.length === 0 && html`
-                    <div class="sw-projects__conv-empty">
-                        No conversations yet.<br/>
-                        <button class="sw-projects__new-btn" style="margin-top:12px;font-size:12px;padding:5px 12px;" onClick=${newConversation}>Start a conversation</button>
-                    </div>
-                `}
-                ${assoc.channels.map(ch => {
-                    const chId = ch.id || ch.channel_id;
-                    return html`<div key=${chId} class="sw-projects__conv-item" onClick=${() => setActiveChannelId(chId)}>
-                        <div class="sw-projects__conv-title">${ch.title || ch.name || chId}</div>
-                        <div class="sw-projects__conv-meta">Last message ${relTime(ch.updated_at)}</div>
-                    </div>`;
-                })}
-            </div>
-        </div>`;
-    }
-
-    // ── Render: Right sidebar ──
-    function renderSidebar() {
-        return html`<div class="sw-projects__sidebar">
-            ${renderSection('desc', 'Description', null, html`
-                <textarea class="sw-projects__section-textarea" rows="3"
-                    value=${desc}
-                    onInput=${e => { setDesc(e.target.value); setDescDirty(true); }}
-                    placeholder="Add a project description\u2026" />
-                ${descDirty && html`<button class="sw-projects__new-btn" style="margin-top:6px;font-size:12px;padding:4px 10px;" onClick=${saveDesc}>Save</button>`}
-            `)}
-
-            ${renderSection('instructions', 'Instructions', null, html`
-                <textarea class="sw-projects__section-textarea" rows="4"
-                    value=${instructions}
-                    onInput=${e => { setInstructions(e.target.value); setInstrDirty(true); }}
-                    placeholder="Add instructions to tailor responses\u2026" />
-                ${instrDirty && html`<button class="sw-projects__new-btn" style="margin-top:6px;font-size:12px;padding:4px 10px;" onClick=${saveInstructions}>Save</button>`}
-            `)}
-
-            ${renderSection('kbs', 'Knowledge Bases', assoc.kbs.length, html`
-                ${assoc.kbs.length === 0 && html`<div class="sw-projects__section-hint">No knowledge bases linked.</div>`}
-                ${assoc.kbs.map(kb => html`
-                    <div key=${kb.id || kb.kb_id} class="sw-projects__section-item">
-                        <span class="sw-projects__section-item-name">${kb.name || kb.kb_id}</span>
-                        <button class="sw-projects__section-item-remove" onClick=${() => removeKb(kb.id || kb.kb_id)}>Remove</button>
-                    </div>
-                `)}
-                ${renderPicker('kbs', 'No knowledge bases available.')}
-            `, () => openPicker('kbs'))}
-
-            ${renderSection('notes', 'Notes', assoc.notes.length, html`
-                ${assoc.notes.length === 0 && html`<div class="sw-projects__section-hint">No notes linked.</div>`}
-                ${assoc.notes.map(n => html`
-                    <div key=${n.id || n.note_id} class="sw-projects__section-item">
-                        <span class="sw-projects__section-item-name">${n.title || n.note_id}</span>
-                        <span class="sw-projects__section-item-meta">${fmtDate(n.created_at || n.added_at)}</span>
-                        <button class="sw-projects__section-item-remove" onClick=${() => removeNote(n.id || n.note_id)}>Remove</button>
-                    </div>
-                `)}
-                ${renderPicker('notes', 'No notes available.')}
-            `, () => openPicker('notes'))}
-
-            ${renderSection('files', 'Files', assoc.files.filter(f => !f.is_directory).length, html`
-                <div class="sw-projects__file-browser">
-                    ${assoc.files.length > 0 && html`
-                        <div class="sw-projects__file-actions-bar">
-                            <button class="sw-projects__file-action-btn" onClick=${createFolder}
-                                title="New folder">\uD83D\uDCC1 New folder</button>
-                            <button class="sw-projects__file-action-btn" onClick=${downloadAll}
-                                title="Download all as ZIP">\u2B07 Download all</button>
-                        </div>
-                    `}
-                    ${renderFileTree(buildTree(assoc.files))}
-                </div>
-                <div class=${'sw-projects__dropzone' + (dragActive ? ' sw-projects__dropzone--active' : '')}
-                     onClick=${handleUploadClick}
-                     onDragOver=${e => { e.preventDefault(); setDragActive(true); }}
-                     onDragLeave=${() => setDragActive(false)}
-                     onDrop=${handleDrop}>
-                    ${uploading ? uploading
-                      : dragActive ? 'Drop files here'
-                      : assoc.files.length === 0
-                        ? 'Add PDFs, documents, or other text to reference in this project.'
-                        : 'Drop files or click to upload more'}
-                </div>
-            `, handleUploadClick)}
-        </div>`;
-    }
-
-    // ── Main render ──
-    return html`<div class="sw-projects__detail">
-        <div class="sw-projects__detail-header">
-            <${UserMenu} placement="down-right" />
-            <a class="sw-projects__back" onClick=${onBack}>\u2190 All projects</a>
-            ${editingName
-                ? html`<input class="sw-projects__detail-name-input"
-                    value=${nameVal}
-                    onInput=${e => setNameVal(e.target.value)}
-                    onBlur=${saveName}
-                    onKeyDown=${e => { if (e.key === 'Enter') saveName(); if (e.key === 'Escape') setEditingName(false); }}
-                    autoFocus />`
-                : html`<h2 class="sw-projects__detail-name"
-                    onClick=${() => { setNameVal(project.name || ''); setEditingName(true); }}>
-                    ${(project.icon ? project.icon + ' ' : '') + project.name}
-                  </h2>`
-            }
-            <div class="sw-projects__header-actions">
-                <button class=${'sw-projects__icon-btn' + (starred ? ' sw-projects__icon-btn--active' : '')}
-                        onClick=${toggleStar} title="Star project">
-                    ${starred ? '\u2605' : '\u2606'}
-                </button>
-                <div style="position:relative">
-                    <button class="sw-projects__icon-btn"
-                            onClick=${() => setMenuOpen(!menuOpen)} title="More options">\u22EF</button>
-                    ${menuOpen && html`
-                        <div class="sw-projects__ctx-menu">
-                            <button class="sw-projects__ctx-item"
-                                onClick=${() => { setMenuOpen(false); setNameVal(project.name || ''); setEditingName(true); }}>Rename</button>
-                            <div class="sw-projects__color-row">
-                                ${COLORS.map(c => html`
-                                    <span key=${c}
-                                          class=${'sw-projects__color-swatch' + (project.color === c ? ' sw-projects__color-swatch--active' : '')}
-                                          style=${'background:' + c}
-                                          onClick=${() => handleColor(c)} />
-                                `)}
-                            </div>
-                            <div class="sw-projects__ctx-divider" />
-                            <button class="sw-projects__ctx-item" onClick=${toggleArchive}>
-                                ${project.is_archived ? 'Unarchive' : 'Archive'}</button>
-                            <button class="sw-projects__ctx-item sw-projects__ctx-item--danger"
-                                onClick=${deleteProject}>Delete</button>
-                        </div>
-                    `}
-                </div>
-            </div>
-        </div>
-        <div class="sw-projects__detail-body">
-            ${renderLeftPanel()}
-            ${renderSidebar()}
-        </div>
-    </div>`;
-}
--- a/src/js/sw/surfaces/projects/index.js
+++ b/src/js/sw/surfaces/projects/index.js
@@ -1,93 +0,0 @@
-/**
- * ProjectsSurface — root view-switching component.
- *
- * No selectedId → card grid list (ProjectsList)
- * With selectedId → detail view (ProjectDetail)
- *
- * Globals: __PROJECT_ID__ (deep-link), __BASE__ (base path)
- */
-const html = window.html;
-const { useState, useEffect, useCallback } = window.hooks;
-const { render } = window.preact;
-
-import { ToastContainer } from '../../primitives/toast.js';
-import { DialogStack } from '../../shell/dialog-stack.js';
-import { ProjectsList } from './list.js';
-import { ProjectDetail } from './detail.js';
-
-function ProjectsSurface() {
-    const BASE = window.__BASE__ || '';
-    const deepLinkId = window.__PROJECT_ID__ || '';
-
-    const [projects, setProjects] = useState([]);
-    const [selectedId, setSelectedId] = useState(deepLinkId || '');
-    const [loading, setLoading] = useState(true);
-
-    const load = useCallback(async () => {
-        try {
-            const resp = await sw.api.projects.list();
-            const list = resp?.data || resp || [];
-            setProjects(list);
-            if (deepLinkId && !list.find(p => p.id === deepLinkId)) {
-                setSelectedId('');
-            }
-        } catch (e) { sw.toast(e.message, 'error'); }
-        finally { setLoading(false); }
-    }, [deepLinkId]);
-
-    useEffect(() => { load(); }, [load]);
-
-    const selected = projects.find(p => p.id === selectedId) || null;
-
-    function selectProject(id) {
-        setSelectedId(id);
-        history.replaceState(null, '', BASE + '/projects/' + id);
-    }
-
-    function goBack() {
-        setSelectedId('');
-        history.replaceState(null, '', BASE + '/projects');
-    }
-
-    async function createProject(name) {
-        try {
-            const proj = await sw.api.projects.create({ name });
-            sw.toast('Project created', 'success');
-            await load();
-            if (proj?.id) selectProject(proj.id);
-        } catch (e) { sw.toast(e.message, 'error'); }
-    }
-
-    const handleUpdate = useCallback((deleted) => {
-        if (deleted) { setSelectedId(''); history.replaceState(null, '', BASE + '/projects'); }
-        load();
-    }, [load, BASE]);
-
-    return html`
-        <div class="sw-projects">
-            ${selected
-                ? html`<${ProjectDetail}
-                    key=${selectedId}
-                    project=${selected}
-                    onBack=${goBack}
-                    onUpdate=${handleUpdate} />`
-                : html`<${ProjectsList}
-                    projects=${projects}
-                    loading=${loading}
-                    onSelect=${selectProject}
-                    onCreate=${createProject} />`
-            }
-        </div>
-        <${ToastContainer} />
-        <${DialogStack} />
-    `;
-}
-
-// ── Mount ────────────────────────────────
-const mount = document.getElementById('projects-mount');
-if (mount) {
-    render(html`<${ProjectsSurface} />`, mount);
-    console.log('[projects] Surface mounted');
-}
-
-export { ProjectsSurface };
--- a/src/js/sw/surfaces/projects/list.js
+++ b/src/js/sw/surfaces/projects/list.js
@@ -1,124 +0,0 @@
-/**
- * ProjectsList — card grid view for all projects.
- *
- * Props:
- *   projects  — array of project objects
- *   loading   — boolean
- *   onSelect  — (id: string) => void
- *   onCreate  — (name: string) => void
- */
-const html = window.html;
-const { useState, useMemo } = window.hooks;
-
-import { UserMenu } from '../../shell/user-menu.js';
-
-// ── Relative time helper ────────────────────
-const DIVISIONS = [
-    [60, 'second'], [60, 'minute'], [24, 'hour'],
-    [30, 'day'], [12, 'month'], [Infinity, 'year'],
-];
-function relativeTime(dateStr) {
-    if (!dateStr) return '';
-    let val = Math.floor((Date.now() - new Date(dateStr).getTime()) / 1000);
-    if (val < 10) return 'just now';
-    for (const [div, unit] of DIVISIONS) {
-        if (val < div) {
-            const n = Math.floor(val);
-            return `Updated ${n} ${unit}${n !== 1 ? 's' : ''} ago`;
-        }
-        val /= div;
-    }
-    return '';
-}
-
-export function ProjectsList({ projects, loading, onSelect, onCreate }) {
-    const [search, setSearch] = useState('');
-    const [sort, setSort] = useState('activity');
-
-    const filtered = useMemo(() => {
-        const q = search.toLowerCase().trim();
-        let list = projects;
-        if (q) {
-            list = list.filter(p =>
-                (p.name || '').toLowerCase().includes(q) ||
-                (p.description || '').toLowerCase().includes(q)
-            );
-        }
-        if (sort === 'activity') {
-            list = [...list].sort((a, b) =>
-                new Date(b.updated_at || 0) - new Date(a.updated_at || 0)
-            );
-        } else {
-            list = [...list].sort((a, b) =>
-                (a.name || '').localeCompare(b.name || '')
-            );
-        }
-        return list;
-    }, [projects, search, sort]);
-
-    async function handleCreate() {
-        const name = await sw.prompt('Project name:');
-        if (name && name.trim()) onCreate(name.trim());
-    }
-
-    if (loading) {
-        return html`<div class="sw-projects__list">
-            <div class="sw-projects__empty">Loading projects\u2026</div>
-        </div>`;
-    }
-
-    return html`
-        <div class="sw-projects__list">
-            <div class="sw-projects__list-header">
-                <${UserMenu} placement="down-right" />
-                <h1 class="sw-projects__list-title">Projects</h1>
-                <button class="sw-projects__new-btn" onClick=${handleCreate}>+ New project</button>
-            </div>
-
-            <div class="sw-projects__search-wrap">
-                <span class="sw-projects__search-icon">\u{1F50D}</span>
-                <input class="sw-projects__search"
-                       type="text"
-                       placeholder="Search projects\u2026"
-                       value=${search}
-                       onInput=${e => setSearch(e.target.value)} />
-            </div>
-
-            <div class="sw-projects__sort">
-                <span>Sort by</span>
-                <select value=${sort} onChange=${e => setSort(e.target.value)}>
-                    <option value="activity">Activity</option>
-                    <option value="name">Name</option>
-                </select>
-            </div>
-
-            ${filtered.length === 0 && !loading && html`
-                <div class="sw-projects__empty">
-                    ${search ? 'No projects match your search.' : 'No projects yet.'}
-                    ${!search && html`<div style="margin-top:12px;">
-                        <button class="sw-projects__new-btn" onClick=${handleCreate}>+ Create your first project</button>
-                    </div>`}
-                </div>
-            `}
-
-            <div class="sw-projects__grid">
-                ${filtered.map(p => html`
-                    <div key=${p.id}
-                         class="sw-projects__card"
-                         style=${p.color ? `border-left: 3px solid ${p.color}` : ''}
-                         onClick=${() => onSelect(p.id)}>
-                        <div class="sw-projects__card-name">
-                            ${p.icon ? html`<span>${p.icon}</span>` : ''}
-                            <span>${p.name}</span>
-                            ${p.is_archived && html`<span class="sw-projects__card-badge">archived</span>`}
-                        </div>
-                        ${p.description && html`
-                            <div class="sw-projects__card-desc">${p.description}</div>
-                        `}
-                        <div class="sw-projects__card-meta">${relativeTime(p.updated_at)}</div>
-                    </div>
-                `)}
-            </div>
-        </div>
-    `;
-}