Changeset 0.37.10 (#222)
Co-authored-by: gobha <jasafpro@gmail.com> Co-committed-by: gobha <jasafpro@gmail.com>
This commit is contained in:
@@ -12,12 +12,10 @@
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/layout.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/primitives.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/modals.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/chat.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/panels.css?v={{.Version}}">
|
||||
{{/* chat.css removed in v0.37.10 — replaced by sw-chat-surface.css + sw-chat-pane.css */}}
|
||||
{{/* panels.css, pane-container.css, chat-pane.css removed in v0.37.10 */}}
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/surfaces.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/splash.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/pane-container.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/chat-pane.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/sw-chat-pane.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/sw-notes-pane.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/user-menu.css?v={{.Version}}">
|
||||
@@ -94,28 +92,22 @@
|
||||
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/sb.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/app-state.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/api.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}">
|
||||
// Hydrate auth tokens for all surfaces (chat surface also calls this in init)
|
||||
API.loadTokens();
|
||||
</script>
|
||||
{{/* api.js removed in v0.37.10. Extension surfaces using Switchboard.init()
|
||||
should migrate to the Preact SDK (sw/sdk/). */}}
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/events.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/ui-primitives.js?v={{.Version}}"></script>
|
||||
<script nonce="{{.CSPNonce}}" src="{{.BasePath}}/vendor/marked.min.js"></script>
|
||||
<script nonce="{{.CSPNonce}}" src="{{.BasePath}}/vendor/purify.min.js"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/ui-format.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/virtual-scroll.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/ui-core.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/pages.js?v={{.Version}}"></script>
|
||||
{{/* ui-core.js + pages.js removed in v0.37.10 */}}
|
||||
{{/* v0.25.0: Component scripts — available on all surfaces */}}
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/user-menu.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/model-selector.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/file-tree.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/code-editor.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/chat-pane.js?v={{.Version}}"></script>
|
||||
{{/* note-panel.js + note-graph.js removed in v0.37.9 — see sw/components/notes-pane/ */}}
|
||||
{{/* chat-pane.js + pane-container.js removed in v0.37.10 — see sw/components/chat-pane/ */}}
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/drag-resize.js?v={{.Version}}"></script>
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/pane-container.js?v={{.Version}}"></script>
|
||||
{{/* v0.28.5: SDK — composition layer over globals. Must load after all
|
||||
primitives/components it wraps, before extensions.js. */}}
|
||||
<script type="module" nonce="{{.CSPNonce}}" src="{{.BasePath}}/js/switchboard-sdk.js?v={{.Version}}"></script>
|
||||
|
||||
@@ -1,52 +1,14 @@
|
||||
{{/*
|
||||
Chat surface (Phase 1 bridge).
|
||||
Server renders the page shell with full SPA scaffold.
|
||||
Existing SPA JS (app.js, ui-core.js, chat.js, etc.) populates
|
||||
these pre-built DOM elements with data.
|
||||
|
||||
v0.22.6 fix: The original index.html contained the full scaffold
|
||||
(1,296 lines). When it was replaced with a redirect stub, this
|
||||
template needed the scaffold — but it was shipped empty.
|
||||
This template restores the required DOM structure.
|
||||
Chat surface (v0.37.10 — Preact).
|
||||
Replaced the ~387-line SPA scaffold with a single mount point.
|
||||
Preact ChatSurface component handles all rendering.
|
||||
*/}}
|
||||
|
||||
{{define "surface-chat"}}
|
||||
|
||||
{{/* ── Splash / Auth Gate ───────────────────────
|
||||
Server-rendered surfaces use /login for auth, so the splash
|
||||
is hidden by default. Kept as a DOM node so showSplash()/
|
||||
hideSplash() in app.js don't crash on null. */}}
|
||||
<div id="splashGate" class="splash" style="display:none;">
|
||||
<div class="splash-hero">
|
||||
<div id="brandHeadline" class="splash-title"></div>
|
||||
<div id="brandTagline" class="splash-subtitle"></div>
|
||||
<div id="brandPills" class="splash-pills"></div>
|
||||
</div>
|
||||
<div class="splash-auth">
|
||||
<div id="splashError" class="splash-error" style="display:none;"></div>
|
||||
<div class="auth-tabs">
|
||||
<button id="authTabLogin" class="auth-tab active" onclick="sb.call('switchAuthTab','login')">Sign In</button>
|
||||
<button id="authTabRegister" class="auth-tab" onclick="sb.call('switchAuthTab','register')">Register</button>
|
||||
</div>
|
||||
<div id="authLoginForm">
|
||||
<input type="text" id="authLogin" placeholder="Username or email" autocomplete="username">
|
||||
<input type="password" id="authPassword" placeholder="Password" autocomplete="current-password">
|
||||
<button id="authLoginBtn" onclick="sb.call('handleLogin')">Sign In</button>
|
||||
</div>
|
||||
<div id="authRegisterForm" style="display:none;">
|
||||
<input type="text" id="authUsername" placeholder="Username" autocomplete="username">
|
||||
<input type="text" id="authEmail" placeholder="Email" autocomplete="email">
|
||||
<input type="password" id="authRegPassword" placeholder="Password" autocomplete="new-password">
|
||||
<button id="authRegisterBtn" onclick="sb.call('handleRegister')">Create Account</button>
|
||||
</div>
|
||||
<div id="authError" class="auth-error"></div>
|
||||
<div id="brandAuthFooter" class="auth-footer"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* ── Crash Catcher (visible without devtools) ── */}}
|
||||
<div id="crashBanner" style="display:none;position:fixed;top:0;left:0;right:0;z-index:99999;background:#b00020;color:#fff;padding:12px 20px;font-family:monospace;font-size:13px;max-height:40vh;overflow-y:auto;">
|
||||
<strong>⚠ Init Error</strong> <button onclick="this.parentElement.style.display='none'" style="float:right;background:none;border:1px solid #fff;color:#fff;cursor:pointer;padding:2px 8px;border-radius:3px">✕</button>
|
||||
<strong>Init Error</strong> <button onclick="this.parentElement.style.display='none'" style="float:right;background:none;border:1px solid #fff;color:#fff;cursor:pointer;padding:2px 8px;border-radius:3px">X</button>
|
||||
<pre id="crashDetail" style="margin:8px 0 0;white-space:pre-wrap;font-size:12px;"></pre>
|
||||
</div>
|
||||
<script nonce="{{$.CSPNonce}}">
|
||||
@@ -68,354 +30,38 @@ window.addEventListener('unhandledrejection', function(e) {
|
||||
});
|
||||
</script>
|
||||
|
||||
{{/* ── App Container ───────────────────────── */}}
|
||||
<div id="appContainer" class="app" style="display:none;height:100%;">
|
||||
|
||||
{{/* Fallback banner (admin-only, shown by Events role.fallback) */}}
|
||||
<div id="roleFallbackBanner" class="role-fallback-banner" style="display:none;"></div>
|
||||
|
||||
<div class="app-body">
|
||||
|
||||
{{/* ── Sidebar ─────────────────────── */}}
|
||||
<div id="sidebar" class="sidebar">
|
||||
<div class="sidebar-top">
|
||||
{{/* Brand — click toggles sidebar */}}
|
||||
<div class="sb-brand" onclick="sb.call('UI.toggleSidebar')" role="button" tabindex="0">
|
||||
<div id="brandSidebarLogo" class="sb-logo">
|
||||
<img src="{{.BasePath}}/favicon-32.png" alt="" class="brand-logo-img">
|
||||
</div>
|
||||
<span id="brandSidebarText" class="brand-text">Switchboard</span>
|
||||
<span id="brandWordmark" class="brand-text" style="display:none;"></span>
|
||||
</div>
|
||||
|
||||
{{/* New Chat button */}}
|
||||
<button id="newChatBtn" class="sb-btn" onclick="sb.call('newChat')" title="New chat">
|
||||
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
|
||||
<span class="sb-label">New Chat</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{{/* Search (outside sidebar-top, below brand section) */}}
|
||||
<div id="sidebarSearch" class="sidebar-search">
|
||||
<svg class="search-icon" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
|
||||
<input type="text" id="chatSearchInput" placeholder="Search chats…" autocomplete="off">
|
||||
<button id="chatSearchClear" class="sidebar-search-clear" title="Clear search">✕</button>
|
||||
</div>
|
||||
|
||||
{{/* Sidebar toggle (hidden on desktop, used by JS for mobile) */}}
|
||||
<button id="sidebarToggle" class="sb-btn sidebar-toggle" title="Toggle sidebar">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
|
||||
</button>
|
||||
|
||||
{{/* Sidebar Tabs (Chats / Files) */}}
|
||||
{{/* Sidebar Tabs (kept hidden — only Files tab used by EditorMode) */}}
|
||||
<div id="sidebarTabs" class="sidebar-tabs" style="display:none;">
|
||||
<button class="sidebar-tab active" data-tab="chats">Chats</button>
|
||||
<button id="sidebarFilesTab" class="sidebar-tab" data-tab="files" style="display:none;">Files</button>
|
||||
</div>
|
||||
|
||||
{{/* Three-section nav: Projects / Channels / Chats */}}
|
||||
<div id="sidebarNav" class="sidebar-nav sidebar-tab-panel" data-tab-panel="chats">
|
||||
{{/* Projects section */}}
|
||||
<div class="sb-section" id="sbSectionProjects">
|
||||
<div class="sb-section-header" onclick="sb.call('UI.toggleSidebarSection','projects')">
|
||||
<span class="sb-section-arrow" id="sbArrowProjects">▾</span>
|
||||
<span class="sb-section-label">Projects</span>
|
||||
<button class="sb-section-add" title="New project"
|
||||
onclick="sb.callEvent(event,'createProject')">
|
||||
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="sb-section-body" id="sbBodyProjects">
|
||||
{{/* Populated by UI.renderProjectsSection() */}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* Channels section (DMs + named channels) */}}
|
||||
<div class="sb-section" id="sbSectionChannels">
|
||||
<div class="sb-section-header" onclick="sb.call('UI.toggleSidebarSection','channels')">
|
||||
<span class="sb-section-arrow" id="sbArrowChannels">▾</span>
|
||||
<span class="sb-section-label">Channels</span>
|
||||
<button class="sb-section-add" title="New channel"
|
||||
onclick="sb.callEvent(event,'newChannelOrDM')">
|
||||
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="sb-section-body" id="sbBodyChannels">
|
||||
{{/* Populated by UI.renderChannelsSection() */}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* Chats section (personal AI chats + folders) */}}
|
||||
<div class="sb-section" id="sbSectionChats">
|
||||
<div class="sb-section-header" onclick="sb.call('UI.toggleSidebarSection','chats')">
|
||||
<span class="sb-section-arrow" id="sbArrowChats">▾</span>
|
||||
<span class="sb-section-label">Chats</span>
|
||||
<div class="sb-section-add-group" onclick="event.stopPropagation();">
|
||||
<button class="sb-section-add" title="New chat" onclick="sb.call('newChat');">
|
||||
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
|
||||
</button>
|
||||
<button class="sb-section-add" title="New folder" onclick="sb.call('newFolder');">
|
||||
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><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>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sb-section-body" id="sbBodyChats"
|
||||
ondragover="event.preventDefault();event.dataTransfer.dropEffect='move';this.classList.add('drag-over')"
|
||||
ondragleave="this.classList.remove('drag-over')"
|
||||
ondrop="onChatSectionDrop(event)">
|
||||
{{/* Populated by UI.renderChatList() */}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* Legacy chatHistory id kept for JS compatibility during transition */}}
|
||||
<div id="chatHistory" style="display:none;"></div>
|
||||
|
||||
{{/* Files panel (editor mode) */}}
|
||||
<div class="sidebar-tab-panel" data-tab-panel="files" style="display:none;"></div>
|
||||
|
||||
{{/* User / bottom */}}
|
||||
<div class="sidebar-bottom">
|
||||
{{if .SurfaceEnabled "notes"}}
|
||||
<button id="notesBtn" class="sb-btn sidebar-notes-btn">
|
||||
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg>
|
||||
<span class="sb-label">Notes</span>
|
||||
</button>
|
||||
{{end}}
|
||||
{{/* v0.27.0: Extension surface nav items (editor is now a package) */}}
|
||||
{{range .ExtensionSurfaces}}
|
||||
<a href="{{$.BasePath}}{{.Route}}" class="sb-btn sidebar-extension-btn" title="{{.Title}}" data-surface-id="{{.ID}}">
|
||||
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></svg>
|
||||
<span class="sb-label">{{.Title}}</span>
|
||||
</a>
|
||||
{{end}}
|
||||
<div class="sidebar-bottom-divider"></div>
|
||||
{{template "user-menu" dict "ID" ""}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* Sidebar overlay (mobile) */}}
|
||||
<div id="sidebarOverlay" class="sidebar-overlay" style="display:none;"></div>
|
||||
|
||||
{{/* Mobile menu button */}}
|
||||
<button id="mobileMenuBtn" class="mobile-menu-btn">
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
|
||||
</button>
|
||||
|
||||
{{/* ── Workspace ───────────────────── */}}
|
||||
<div class="workspace">
|
||||
<div class="workspace-primary workspace-pane">
|
||||
|
||||
{{/* Chat header: model selector + caps + tokens + panel + notif */}}
|
||||
<div class="chat-header">
|
||||
{{template "model-selector" dict "ID" ""}}
|
||||
<div class="chat-header-right">
|
||||
<span id="chatTokenCount" class="token-count" title="Estimated token count"></span>
|
||||
<span id="summarizedHistory" class="summarized-badge" style="display:none;" title="Earlier messages are summarized">📋 Summarized</span>
|
||||
<button id="summarizeBtn" class="action-btn" style="display:none;" title="Summarize older messages">
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg>
|
||||
</button>
|
||||
{{/* Panel toggle */}}
|
||||
<button id="panelToggleBtn" class="action-btn" title="Toggle side panel" onclick="sb.call('PanelRegistry.toggle','preview')">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"/><line x1="15" y1="3" x2="15" y2="21"/></svg>
|
||||
</button>
|
||||
{{/* Notification bell (inline, not fixed) */}}
|
||||
<div id="notifWrap" class="notif-wrap">
|
||||
<button class="notif-bell" onclick="sb.call('Notifications.toggleDropdown')">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"/><path d="M13.73 21a2 2 0 0 1-3.46 0"/></svg>
|
||||
<span id="notifBadge" class="notif-badge" style="display:none;">0</span>
|
||||
</button>
|
||||
<div id="notifDropdown" class="notif-dropdown" style="display:none;">
|
||||
<div id="notifPanelList"></div>
|
||||
<div id="notifPanelMore" style="text-align:center;padding:8px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* v0.23.2: Channel context banner — shown for DMs and named channels */}}
|
||||
<div id="channelContextBanner" class="channel-context-banner" style="display:none;"></div>
|
||||
|
||||
{{/* v0.27.0: Workflow stage indicator — shown for workflow channels */}}
|
||||
<div id="workflowStageBar" class="workflow-stage-bar" style="display:none;"></div>
|
||||
|
||||
{{/* Messages */}}
|
||||
<div id="chatMessages" class="msg-container">
|
||||
{{/* Populated by UI.renderMessages() */}}
|
||||
</div>
|
||||
|
||||
{{/* Context warning */}}
|
||||
<div id="contextWarning" class="context-warning" style="display:none;">
|
||||
<span id="contextWarningText"></span>
|
||||
</div>
|
||||
|
||||
{{/* File strip */}}
|
||||
<div id="fileStrip" class="file-strip"></div>
|
||||
|
||||
{{/* Streaming tools display */}}
|
||||
<div id="streamTools" class="stream-tools" style="display:none;"></div>
|
||||
|
||||
{{/* Input area (centered, padded bottom) */}}
|
||||
<div class="chat-input-area">
|
||||
{{/* Input toolbar (attach, tools toggle, KB) */}}
|
||||
<div class="input-toolbar">
|
||||
<button id="attachBtn" class="action-btn attach-btn" title="Attach file">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"/></svg>
|
||||
</button>
|
||||
{{/* Tools toggle */}}
|
||||
<div class="tools-toggle-wrap" style="display:none;">
|
||||
<button id="toolsToggleBtn" class="action-btn tools-toggle-btn" title="Tools">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/></svg>
|
||||
</button>
|
||||
<div id="toolsPopup" class="popup tools-popup"></div>
|
||||
</div>
|
||||
{{/* Knowledge Bases toggle */}}
|
||||
<div class="kb-toggle-wrap">
|
||||
<button id="kbToggleBtn" class="action-btn kb-toggle-btn" title="Knowledge Bases">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/></svg>
|
||||
</button>
|
||||
<div id="kbPopup" class="popup kb-popup"></div>
|
||||
</div>
|
||||
{{/* tools-toggle.js + knowledge-ui.js show/populate these at init */}}
|
||||
</div>
|
||||
|
||||
{{/* Input wrap: CM6 editor + send/stop */}}
|
||||
<div class="input-wrap">
|
||||
<div id="messageInputWrap">
|
||||
{{/* CM6 mounts here (chat.js). Fallback textarea below. */}}
|
||||
<textarea id="messageInput" placeholder="Type a message…" rows="1"></textarea>
|
||||
</div>
|
||||
<div class="input-actions">
|
||||
<span id="inputTokenCount" class="input-token-count"></span>
|
||||
<button id="sendBtn" class="action-btn send-btn" title="Send message">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9 22 2"/></svg>
|
||||
</button>
|
||||
<button id="stopBtn" class="action-btn stop-btn" title="Stop generating">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chat-footer">
|
||||
<span class="chat-version">Switchboard v{{.Version}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* Resize handle */}}
|
||||
<div id="workspaceHandle" class="workspace-handle"></div>
|
||||
|
||||
{{/* Side panel (secondary pane) */}}
|
||||
<div id="workspaceSecondary" class="workspace-secondary workspace-pane">
|
||||
<div class="side-panel-header">
|
||||
<span id="sidePanelLabel" class="side-panel-label"></span>
|
||||
<div class="side-panel-header-actions">
|
||||
<span id="sidePanelPanelActions"></span>
|
||||
<button id="sidePanelFullscreenBtn" class="side-panel-btn" title="Toggle fullscreen" onclick="sb.call('toggleSidePanelFullscreen')">
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="15 3 21 3 21 9"/><polyline points="9 21 3 21 3 15"/><line x1="21" y1="3" x2="14" y2="10"/><line x1="3" y1="21" x2="10" y2="14"/></svg>
|
||||
</button>
|
||||
<button class="side-panel-btn" title="Close panel" onclick="sb.call('PanelRegistry.closeAll')">
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="sidePanelBody" class="side-panel-body">
|
||||
{{/* Preview panel page */}}
|
||||
<div id="sidePanelPreview" class="side-panel-page">
|
||||
<iframe id="previewFrame" class="preview-frame" sandbox="allow-scripts allow-same-origin" style="display:none;"></iframe>
|
||||
<div id="previewEmpty" class="preview-empty">
|
||||
<p>Open a code block preview or extension output here.</p>
|
||||
</div>
|
||||
</div>
|
||||
{{/* Notes and project panels are registered dynamically by their JS modules */}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/* ── Mount Point ────────────────────────── */}}
|
||||
<div id="chat-mount" style="height:100%;display:flex;">
|
||||
<div style="display:flex;align-items:center;justify-content:center;width:100%;color:var(--text-2,#999);font-size:14px;">
|
||||
Loading...
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* Side panel overlay (mobile) */}}
|
||||
<div id="sidePanelOverlay" class="side-panel-overlay" style="display:none;"></div>
|
||||
|
||||
{{/* ── Lightbox ────────────────────────────── */}}
|
||||
<div id="lightbox" class="lightbox" onclick="sb.call('closeLightbox')">
|
||||
<img id="lightboxImg" src="" alt="">
|
||||
</div>
|
||||
|
||||
{{/* ── Command Palette ─────────────────────── */}}
|
||||
<div id="cmdPalette" class="cmd-palette" style="display:none;">
|
||||
<div class="cmd-palette-inner">
|
||||
<input type="text" class="cmd-palette-input" placeholder="Type a command…" autocomplete="off">
|
||||
<div class="cmd-palette-results"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* ── Hidden File Input ─────── */}}
|
||||
<input type="file" id="fileInput" multiple style="display:none;">
|
||||
|
||||
{{/* Team Admin Modal — removed in v0.37.7. Team admin is now at /team-admin. */}}
|
||||
|
||||
{{/* ── Debug Modal moved to base.html (available on all surfaces) ── */}}
|
||||
|
||||
{{/* ── Notification bell is now inside .chat-header ── */}}
|
||||
|
||||
{{/* ── Routing Policy Form (shared) ────────── */}}
|
||||
<div id="routingPolicyForm" style="display:none;">
|
||||
<input type="hidden" id="rpId">
|
||||
<div class="form-group"><label>Name</label><input type="text" id="rpName"></div>
|
||||
<div class="form-group"><label>Priority</label><input type="number" id="rpPriority" value="100"></div>
|
||||
<div class="form-group"><label>Type</label><select id="rpType"><option value="weighted">Weighted</option><option value="failover">Failover</option><option value="round_robin">Round Robin</option></select></div>
|
||||
<div class="form-group"><label>Scope</label><select id="rpScope" onchange="Pages.routingScopeChanged(this)"><option value="global">Global</option><option value="team">Team</option></select></div>
|
||||
<div id="rpTeamGroup" class="form-group" style="display:none;"><label>Team</label><select id="rpTeamId"></select></div>
|
||||
<div class="form-group"><label>Config (JSON)</label><textarea id="rpConfig" rows="4">{}</textarea></div>
|
||||
<div class="form-group"><label><input type="checkbox" id="rpActive" checked> Active</label></div>
|
||||
<div style="display:flex;gap:8px;">
|
||||
<button id="rpSaveBtn" class="btn-primary" onclick="sb.call('Pages.saveRoutingPolicy')">Save</button>
|
||||
<button id="rpCancelBtn" class="btn-secondary" onclick="sb.call('Pages.hideRoutingForm')">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/* ── Auto-Compact Toggle (chat header option) */}}
|
||||
<div id="autoCompactToggle" style="display:none;">
|
||||
<label><input type="checkbox" id="autoCompactCheck"> Auto-compact</label>
|
||||
</div>
|
||||
|
||||
{{/* ── Fetch Models Button (admin) ─────────── */}}
|
||||
<button id="fetchModelsBtn" style="display:none;"></button>
|
||||
|
||||
{{end}}
|
||||
|
||||
{{define "css-chat"}}
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/persona-kb.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/memory.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/notifications.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/channel-models.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/notification-prefs.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/css/sw-chat-surface.css?v={{.Version}}">
|
||||
<link rel="stylesheet" href="{{.BasePath}}/branding/custom.css" onerror="this.remove()">
|
||||
{{end}}
|
||||
|
||||
{{define "scripts-chat"}}
|
||||
{{/* CM6 bundle — chat-specific (code input, extension editor) */}}
|
||||
<script nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/vendor/codemirror/codemirror.bundle.js?v={{$.Version}}" onerror="console.warn('[CM6] Bundle not available — falling back to textarea')"></script>
|
||||
{{/* App JS — order matches index.html (minus api/events/ui-primitives/ui-format already in base) */}}
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/extensions.js?v={{$.Version}}"></script>
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/panels.js?v={{$.Version}}"></script>
|
||||
{{/* ui-settings.js and ui-admin.js removed in v0.37.7 — team admin is now at /team-admin */}}
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/tokens.js?v={{$.Version}}"></script>
|
||||
{{/* notes.js removed in v0.37.9 — see sw/components/notes-pane/ */}}
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/files.js?v={{$.Version}}"></script>
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/tools-toggle.js?v={{$.Version}}"></script>
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/knowledge-ui.js?v={{$.Version}}"></script>
|
||||
{{/* memory-ui.js and persona-kb.js removed in v0.37.7 — no chat surface callers */}}
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/projects-ui.js?v={{$.Version}}"></script>
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/channel-models.js?v={{$.Version}}"></script>
|
||||
{{/* notification-prefs.js removed in v0.37.7 — now native Preact in settings */}}
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/notifications.js?v={{$.Version}}"></script>
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/chat.js?v={{$.Version}}"></script>
|
||||
{{/* settings-handlers.js, admin-handlers.js, workflow-admin.js removed in v0.37.7 */}}
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/workflow-api.js?v={{$.Version}}"></script>
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/workflow-queue.js?v={{$.Version}}"></script>
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/task-sidebar.js?v={{$.Version}}"></script>
|
||||
<script type="module" nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/js/app.js?v={{$.Version}}"></script>
|
||||
<script nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/vendor/marked.min.js"></script>
|
||||
<script nonce="{{$.CSPNonce}}" src="{{$.BasePath}}/vendor/purify.min.js"></script>
|
||||
<script type="module" nonce="{{$.CSPNonce}}">
|
||||
// v0.37.10: Preact boot — same pattern as settings/admin/team-admin surfaces.
|
||||
// Vendor modules: no ?v= query — hooks.module.js does a bare
|
||||
// import from "./preact.module.js" internally, so the URL must match.
|
||||
const { h, render } = await import('{{$.BasePath}}/js/sw/vendor/preact.module.js');
|
||||
const hooksModule = await import('{{$.BasePath}}/js/sw/vendor/hooks.module.js');
|
||||
const { default: htm } = await import('{{$.BasePath}}/js/sw/vendor/htm.module.js');
|
||||
const html = htm.bind(h);
|
||||
window.preact = window.preact || { h, render };
|
||||
window.hooks = window.hooks || hooksModule;
|
||||
window.html = window.html || html;
|
||||
|
||||
const { boot } = await import('{{$.BasePath}}/js/sw/sdk/index.js?v={{$.Version}}');
|
||||
await boot();
|
||||
|
||||
await import('{{$.BasePath}}/js/sw/surfaces/chat/index.js?v={{$.Version}}');
|
||||
</script>
|
||||
{{end}}
|
||||
|
||||
Reference in New Issue
Block a user