mirror of
https://github.com/garrytan/gstack.git
synced 2026-05-06 05:35:46 +02:00
Garry Tan
0ae5838eb4
$B connect (default): headed Chromium + extension with Activity + Refs tabs only. No separate agent spawned. Clean, no confusion. $B connect --chat: same + Chat tab with standalone claude -p agent. Shows experimental banner: "Standalone mode — this is a separate agent from your workspace." Implementation: - cli.ts: parse --chat, set BROWSE_SIDEBAR_CHAT env, conditionally spawn sidebar-agent - server.ts: gate /sidebar-* routes behind chatEnabled, return 403 when disabled, include chatEnabled in /health response - sidepanel.js: applyChatEnabled() hides/shows Chat tab + banner - background.js: forward chatEnabled from health response - sidepanel.html/css: experimental banner with amber styling Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
85 lines
3.3 KiB
HTML
85 lines
3.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<link rel="stylesheet" href="sidepanel.css">
|
|
</head>
|
|
<body>
|
|
<!-- Connection status banner -->
|
|
<div class="conn-banner" id="conn-banner" style="display:none">
|
|
<span class="conn-banner-text" id="conn-banner-text">Reconnecting...</span>
|
|
<div class="conn-banner-actions" id="conn-banner-actions" style="display:none">
|
|
<button class="conn-btn" id="conn-reconnect">Reconnect</button>
|
|
<button class="conn-btn conn-copy" id="conn-copy" title="Copy command">/connect-chrome</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Chat Tab (default, full height) -->
|
|
<main id="tab-chat" class="tab-content active">
|
|
<div class="chat-messages" id="chat-messages">
|
|
<div class="chat-loading" id="chat-loading">
|
|
<div class="chat-loading-spinner"></div>
|
|
<p>Connecting...</p>
|
|
</div>
|
|
<div class="chat-welcome" id="chat-welcome" style="display:none">
|
|
<div class="chat-welcome-icon">G</div>
|
|
<p>Send a message to Claude Code.</p>
|
|
<p class="muted">Your agent will see it and act on it.</p>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Debug: Activity Tab (hidden by default) -->
|
|
<main id="tab-activity" class="tab-content" role="log" aria-live="polite">
|
|
<div class="empty-state" id="empty-state">
|
|
<p>Waiting for commands...</p>
|
|
<p class="muted">Run a browse command to see activity here.</p>
|
|
</div>
|
|
<div id="activity-feed"></div>
|
|
</main>
|
|
|
|
<!-- Debug: Refs Tab (hidden by default) -->
|
|
<main id="tab-refs" class="tab-content">
|
|
<div class="empty-state" id="refs-empty">
|
|
<p>No refs yet</p>
|
|
<p class="muted">Run <code>snapshot</code> to see element refs.</p>
|
|
</div>
|
|
<div id="refs-list"></div>
|
|
<div class="refs-footer" id="refs-footer"></div>
|
|
</main>
|
|
|
|
<!-- Experimental chat banner (shown when chatEnabled) -->
|
|
<div id="experimental-banner" class="experimental-banner" style="display: none;">
|
|
⚠ Standalone mode — this is a separate agent from your workspace
|
|
</div>
|
|
|
|
<!-- Command Bar -->
|
|
<div class="command-bar">
|
|
<input type="text" class="command-input" id="command-input" placeholder="Message Claude Code..." autocomplete="off" spellcheck="false">
|
|
<button class="send-btn" id="send-btn" title="Send">↑</button>
|
|
</div>
|
|
|
|
<!-- Footer with connection + debug toggle -->
|
|
<footer>
|
|
<div class="footer-left">
|
|
<button class="debug-toggle" id="debug-toggle" title="Toggle debug panels">debug</button>
|
|
<button class="footer-btn" id="clear-chat" title="Clear chat">clear</button>
|
|
</div>
|
|
<div class="footer-right">
|
|
<span class="dot" id="footer-dot"></span>
|
|
<span class="footer-port" id="footer-port" title="Click to change port"></span>
|
|
<input type="text" class="port-input" id="port-input" placeholder="34567" autocomplete="off" style="display:none">
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Debug tab bar (hidden by default) -->
|
|
<nav class="tabs debug-tabs" id="debug-tabs" role="tablist" style="display:none">
|
|
<button class="tab" role="tab" data-tab="activity">Activity</button>
|
|
<button class="tab" role="tab" data-tab="refs">Refs</button>
|
|
<button class="tab close-debug" id="close-debug" title="Close debug">×</button>
|
|
</nav>
|
|
|
|
<script src="sidepanel.js"></script>
|
|
</body>
|
|
</html>
|