4db402f258
Changes: - Add DEFAULT_WAIT_SECONDS = 50 (replaces config.default_wait_seconds) - Add DEFAULT_EMPTY_RESPONSE = 'call this tool... ' (replaces config.default_empty_response) - Remove wait and empty response fields from WebUI Settings panel (only agent_stale_after_seconds remains configurable) Rationale: These values are fundamental to the 60s timeout mitigation strategy and should not be user-configurable. The 50s wait with 5s keepalives is the optimal balance for staying under the Copilot 60s wall-clock limit while providing responsive progress feedback.
185 lines
8.0 KiB
HTML
185 lines
8.0 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>local-mcp — Instruction Queue</title>
|
|
<meta name="description" content="Localhost MCP instruction queue management" />
|
|
<link rel="icon" type="image/svg+xml" href="/static/assets/favicon.svg" />
|
|
<link rel="shortcut icon" href="/static/assets/favicon.svg" />
|
|
<link rel="stylesheet" href="/static/css/base.css" />
|
|
<link rel="stylesheet" href="/static/css/layout.css" />
|
|
<link rel="stylesheet" href="/static/css/components.css" />
|
|
<!-- Apply theme before paint to avoid flash of wrong theme -->
|
|
<script>
|
|
(function(){
|
|
var t = localStorage.getItem('local-mcp-theme') ||
|
|
(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
|
|
document.documentElement.dataset.theme = t;
|
|
})();
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- ── Header ──────────────────────────────────────────────────────────── -->
|
|
<header class="page-header">
|
|
<div class="header-brand">
|
|
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="var(--cyan)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<rect x="2" y="3" width="20" height="14" rx="2"/>
|
|
<line x1="8" y1="21" x2="16" y2="21"/>
|
|
<line x1="12" y1="17" x2="12" y2="21"/>
|
|
</svg>
|
|
<span class="header-brand-name">local<span>-mcp</span></span>
|
|
</div>
|
|
|
|
<div class="header-indicators">
|
|
<div id="led-server" class="led led--muted">
|
|
<span class="led__dot"></span>
|
|
<span class="led__label">Connecting…</span>
|
|
</div>
|
|
<div id="led-agent" class="led led--muted">
|
|
<span class="led__dot"></span>
|
|
<span class="led__label">Agent Idle</span>
|
|
</div>
|
|
<button id="theme-toggle" class="btn btn--ghost btn--icon" title="Toggle theme" aria-label="Toggle theme">
|
|
<!-- icon injected by theme.js -->
|
|
<svg class="icon" viewBox="0 0 24 24"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></svg>
|
|
</button>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- ── Main ────────────────────────────────────────────────────────────── -->
|
|
<main class="page-main">
|
|
|
|
<!-- Composer -->
|
|
<section class="area-composer fade-in">
|
|
<div class="panel">
|
|
<div class="panel-header">
|
|
<span class="panel-title">
|
|
<svg class="icon icon--sm" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
|
|
New Instruction
|
|
</span>
|
|
<span class="subtle" style="font-size:var(--text-xs)">Enter to send · Shift+Enter for newline</span>
|
|
</div>
|
|
<div class="panel-body">
|
|
<form id="composer-form">
|
|
<div class="form-row">
|
|
<textarea
|
|
id="composer-input"
|
|
class="textarea"
|
|
placeholder="Type an instruction… (Enter to send, Shift+Enter for newline)"
|
|
rows="3"
|
|
autocomplete="off"
|
|
spellcheck="false"
|
|
></textarea>
|
|
<button id="composer-submit" type="submit" class="btn btn--primary" style="height:fit-content;align-self:flex-end">
|
|
<svg class="icon" viewBox="0 0 24 24"><line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9 22 2"/></svg>
|
|
Send
|
|
</button>
|
|
</div>
|
|
</form>
|
|
<!-- Quick shortcut chips -->
|
|
<div id="shortcuts-container" class="shortcuts-container"></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Pending queue -->
|
|
<section class="area-queue fade-in fade-in--delay-1">
|
|
<div class="panel">
|
|
<div class="panel-header">
|
|
<span class="panel-title">
|
|
<svg class="icon icon--sm" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
|
Pending Queue
|
|
</span>
|
|
<span id="pending-badge" class="badge badge--muted">0</span>
|
|
</div>
|
|
<div class="panel-body panel-body--flush">
|
|
<div id="pending-list">
|
|
<div class="empty-state">
|
|
<div class="empty-state__icon">◈</div>
|
|
Loading…
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Consumed history -->
|
|
<section class="area-history fade-in fade-in--delay-2">
|
|
<div class="panel">
|
|
<div class="panel-header">
|
|
<span class="panel-title">
|
|
<svg class="icon icon--sm" viewBox="0 0 24 24"><polyline points="9 11 12 14 22 4"/><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"/></svg>
|
|
Consumed
|
|
</span>
|
|
<div style="display:flex;align-items:center;gap:var(--space-2)">
|
|
<span id="consumed-badge" class="badge badge--muted">0</span>
|
|
<button id="clear-history-btn" class="btn btn--ghost btn--sm" title="Clear all consumed instructions" style="display:none">
|
|
<svg class="icon icon--sm" viewBox="0 0 24 24"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/><path d="M10 11v6"/><path d="M14 11v6"/><path d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"/></svg>
|
|
Clear
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="panel-body panel-body--flush">
|
|
<div id="consumed-list">
|
|
<div class="empty-state">
|
|
<div class="empty-state__icon">◈</div>
|
|
Loading…
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Sidebar -->
|
|
<aside class="area-sidebar">
|
|
|
|
<!-- Server / Agent Status -->
|
|
<div class="panel fade-in fade-in--delay-1">
|
|
<div class="panel-header">
|
|
<span class="panel-title">
|
|
<svg class="icon icon--sm" viewBox="0 0 24 24"><rect x="2" y="2" width="20" height="8" rx="2"/><rect x="2" y="14" width="20" height="8" rx="2"/><line x1="6" y1="6" x2="6.01" y2="6"/><line x1="6" y1="18" x2="6.01" y2="18"/></svg>
|
|
Status
|
|
</span>
|
|
</div>
|
|
<div class="panel-body" id="status-panel-body">
|
|
<div class="stat-row"><span class="stat-label">Loading…</span></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Config -->
|
|
<div class="panel fade-in fade-in--delay-2">
|
|
<div class="panel-header">
|
|
<span class="panel-title">
|
|
<svg class="icon icon--sm" viewBox="0 0 24 24"><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>
|
|
Settings
|
|
</span>
|
|
</div>
|
|
<div class="panel-body">
|
|
<form id="config-form">
|
|
<div class="config-field">
|
|
<label class="config-label" for="cfg-stale">Agent Stale After (sec)</label>
|
|
<input id="cfg-stale" class="input input--sm" type="number" min="5" max="600" value="30" />
|
|
<span class="config-hint">Inactivity before agent shown as idle</span>
|
|
</div>
|
|
<button id="cfg-save" type="submit" class="btn btn--ghost btn--sm" style="width:100%">
|
|
<svg class="icon icon--sm" viewBox="0 0 24 24"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"/><polyline points="17 21 17 13 7 13 7 21"/><polyline points="7 3 7 8 15 8"/></svg>
|
|
Save Settings
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
</aside>
|
|
|
|
</main>
|
|
|
|
<!-- Toast container -->
|
|
<div id="toast-container"></div>
|
|
|
|
<script type="module" src="/static/js/app.js"></script>
|
|
</body>
|
|
</html>
|
|
|