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

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