feat: rename matrix-accounts page to credentials, add github PAT tab
Part 2 of hyperhive#1970 (backend/CLI landed in PR #2378). Renames /matrix-accounts.html -> /credentials.html and restructures it with a sub-tab strip (MATRIX / GITHUB), reusing the shared @hive/shared/tabs.js tab strip already used by /logs.html. MATRIX tab carries over the existing account list + login form unchanged. GITHUB tab adds a single-PAT provisioning form: status line (present/absent, read from GET /api/github-account), a security-warning banner (dedicated bot account + minimally-scoped token), a link to generate a PAT at github.com/settings/tokens, and a paste-token form posting to POST /api/github-account. Both tabs share one agent picker. Updated docs/web-ui.md + docs/web-ui/dashboard.md to describe the new page shape, and the H0M3 hub tile (index.html) to point at the renamed page.
This commit is contained in:
iris
parent
ad0752822a
commit
5c2cae41a2
8 changed files with 376 additions and 148 deletions
132
frontend/packages/dashboard/src/credentials.html
Normal file
132
frontend/packages/dashboard/src/credentials.html
Normal file
|
|
@ -0,0 +1,132 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>hyperhive // CR3D3NTIALS</title>
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
|
||||
<link rel="stylesheet" href="/static/colors.css">
|
||||
<link rel="stylesheet" href="/static/theme.css">
|
||||
<link rel="stylesheet" href="/static/common.css">
|
||||
<link rel="stylesheet" href="/static/credentials.css">
|
||||
</head>
|
||||
<body class="cred-shell">
|
||||
|
||||
<!-- Minimal chrome: back link + sub-tab strip, same pattern as
|
||||
logs.html (MATRIX / GITHUB instead of AGENT/SYSTEM/AUDIT). Back
|
||||
link points to the H0M3 hub (served at /). -->
|
||||
<header class="page-header">
|
||||
<a class="page-back" href="/">← home</a>
|
||||
<nav class="hive-tabbar cred-tabbar" id="cred-tabbar" role="tablist">
|
||||
<a class="hive-tab" id="cred-tab-matrix" href="#matrix" role="tab"
|
||||
aria-controls="cred-pane-matrix" data-tab="matrix">
|
||||
<span class="cred-tab-label">MATRIX</span>
|
||||
</a>
|
||||
<a class="hive-tab" id="cred-tab-github" href="#github" role="tab"
|
||||
aria-controls="cred-pane-github" data-tab="github">
|
||||
<span class="cred-tab-label">GITHUB</span>
|
||||
</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="cred-main">
|
||||
|
||||
<!-- Agent picker: shared across both tabs (one agent selected at a
|
||||
time drives both the matrix account list and the github status). -->
|
||||
<h3>◇ agent</h3>
|
||||
<label class="ma-field">
|
||||
<span>agent</span>
|
||||
<select id="ma-agent"></select>
|
||||
</label>
|
||||
|
||||
<!-- MATRIX tab: unchanged from the old /matrix-accounts.html, just
|
||||
moved under a tab pane. -->
|
||||
<section class="cred-pane" id="cred-pane-matrix" data-tab-pane="matrix"
|
||||
role="tabpanel" aria-labelledby="cred-tab-matrix">
|
||||
<p class="meta">provision or log in an <strong>external</strong> matrix account for an agent and store its access token. the token is written to the agent's <code>matrixAccounts.<account>.tokenFile</code> by the host coordinator — it is never displayed back on this page.</p>
|
||||
|
||||
<h3>◇ provisioned accounts</h3>
|
||||
<p class="meta">accounts that have a stored token (provision one below to add it here); a config-declared account that hasn't been provisioned yet won't appear until it has a token. status reflects whether a <em>token is stored</em>, not a live session — a true online/offline indicator is a follow-up that needs the daemon's account registry.</p>
|
||||
<div id="ma-list" class="ma-list"><p class="meta">select an agent to see its matrix accounts.</p></div>
|
||||
|
||||
<h3>◇ provision / log in</h3>
|
||||
<form id="ma-form" class="ma-form" autocomplete="off">
|
||||
<label class="ma-field">
|
||||
<span>account name</span>
|
||||
<input type="text" name="account" placeholder="e.g. public" required>
|
||||
</label>
|
||||
<label class="ma-field">
|
||||
<span>homeserver</span>
|
||||
<input type="text" name="homeserver" placeholder="https://matrix.org" required>
|
||||
</label>
|
||||
|
||||
<fieldset class="ma-mode">
|
||||
<legend>login method</legend>
|
||||
<label><input type="radio" name="mode" value="password" checked> password</label>
|
||||
<label><input type="radio" name="mode" value="token"> existing token</label>
|
||||
</fieldset>
|
||||
|
||||
<div id="ma-pw-fields" class="ma-modefields">
|
||||
<label class="ma-field">
|
||||
<span>user id</span>
|
||||
<input type="text" name="user_id" placeholder="@user:matrix.org" autocomplete="username">
|
||||
</label>
|
||||
<label class="ma-field">
|
||||
<span>password</span>
|
||||
<input type="password" name="password" autocomplete="new-password">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div id="ma-token-fields" class="ma-modefields" hidden>
|
||||
<label class="ma-field">
|
||||
<span>access token</span>
|
||||
<input type="password" name="token" autocomplete="off">
|
||||
</label>
|
||||
<label class="ma-field">
|
||||
<span>user id <span class="meta">(optional — derived via whoami)</span></span>
|
||||
<input type="text" name="user_id" placeholder="@user:matrix.org">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-spawn">log in & store token</button>
|
||||
<p id="ma-result" class="ma-result" aria-live="polite"></p>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
<!-- GITHUB tab: single-account PAT paste. No login flow — the
|
||||
operator pastes an existing PAT for a dedicated bot account.
|
||||
Security-warning banner + a link to generate a PAT. -->
|
||||
<section class="cred-pane" id="cred-pane-github" data-tab-pane="github"
|
||||
role="tabpanel" aria-labelledby="cred-tab-github" hidden>
|
||||
<div class="cred-warning">
|
||||
⚠ use a <strong>dedicated bot account</strong>, not a human's —
|
||||
and a <strong>minimally-scoped</strong> personal access token (only
|
||||
the repos/scopes the agent actually needs, e.g. <code>repo</code> +
|
||||
<code>workflow</code>). the container boundary is the enforcement:
|
||||
anything within the token's scopes is reachable if the agent is
|
||||
ever compromised. the token is injected into the agent's state dir
|
||||
and is <strong>never displayed back</strong> on this page.
|
||||
</div>
|
||||
|
||||
<h3>◇ status</h3>
|
||||
<div id="gh-status" class="gh-status"><p class="meta">select an agent to see its github credential status.</p></div>
|
||||
|
||||
<h3>◇ provision</h3>
|
||||
<p class="meta">generate a token at
|
||||
<a href="https://github.com/settings/tokens" target="_blank" rel="noopener">github.com/settings/tokens</a>
|
||||
and paste it below. one account per agent — pasting a new token replaces the stored one.</p>
|
||||
<form id="gh-form" class="ma-form" autocomplete="off">
|
||||
<label class="ma-field">
|
||||
<span>personal access token</span>
|
||||
<input type="password" name="token" autocomplete="off" required>
|
||||
</label>
|
||||
<button type="submit" class="btn btn-spawn">store token</button>
|
||||
<p id="gh-result" class="ma-result" aria-live="polite"></p>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<script type="module" src="/static/credentials.js" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in a new issue