279 lines
26 KiB
Svelte
279 lines
26 KiB
Svelte
<script lang="ts">
|
|
import { contextHref } from '$lib/navigation-context.js';
|
|
import { timeFormat } from '$ui/stores/time-zone.js';
|
|
import { onMount } from 'svelte';
|
|
import { page } from '$app/stores';
|
|
import { artifactVersionLabel } from '$lib/artifact-version.js';
|
|
import type { BetaTestView } from '$lib/beta-plan.js';
|
|
import type { BetaPromotionPreview } from '$lib/beta-promotion.js';
|
|
import { requirementSummary } from '$lib/beta-plan-summary.js';
|
|
import type { ActivityEvent } from '$lib/operation-flow.js';
|
|
import { betaStatus } from '$ui/betas.js';
|
|
import { betaUpdates } from '$ui/beta-updates.js';
|
|
import { confirmAction } from '$ui/confirm.js';
|
|
import type { BetaRevision } from '$lib/beta-revision.js';
|
|
import BetaRevisionDialog from '$ui/components/BetaRevisionDialog.svelte';
|
|
import BetaTestProgress from '$ui/components/BetaTestProgress.svelte';
|
|
import ServerIdentity from '$ui/components/ServerIdentity.svelte';
|
|
import HistoricalServerIdentity from '$ui/components/HistoricalServerIdentity.svelte';
|
|
import OperationHistory from '$ui/components/OperationHistory.svelte';
|
|
import StatusBadge from '$ui/components/primitives/StatusBadge.svelte';
|
|
import Button from '$ui/components/primitives/Button.svelte';
|
|
import Dialog from '$ui/components/primitives/Dialog.svelte';
|
|
import SectionHeader from '$ui/components/primitives/SectionHeader.svelte';
|
|
import Breadcrumbs from '$ui/components/primitives/Breadcrumbs.svelte';
|
|
import EmptyState from '$ui/components/primitives/EmptyState.svelte';
|
|
|
|
interface BetaRow { id:number; state:string; opened_at:string; closed_at:string|null; wait_for_health:number; wait_for_match:number; notes?:string|null; }
|
|
interface BetaServer { server:string; server_deleted_at?:string|null; stage:string; error:string|null; deployed_at:string|null; restarted_at:string|null; healthy_at:string|null; match_seen_at:string|null; provisioning_id:string|null; }
|
|
interface BetaFile { id:number; name:string; kind:string; target_rel_path:string; version:{id:number; version:number; release_version:string|null; sha256:string}|null; }
|
|
interface Promotion { id:string; pending:number; failed:number; }
|
|
let test = $state<BetaTestView|null>(null);
|
|
let beta = $state<BetaRow|null>(null);
|
|
let scripts = $state<BetaFile[]>([]);
|
|
let servers = $state<BetaServer[]>([]);
|
|
let events = $state<ActivityEvent[]>([]);
|
|
let activityBefore = $state<number|null>(null), nextBefore = $state<number|null>(null), activityLoading = $state(false);
|
|
let activityRequest = 0;
|
|
let promotion = $state<Promotion|null>(null);
|
|
let rollbackCampaign = $state<{ id: string }|null>(null);
|
|
let loading = $state(true), loadError = $state(''), flash = $state(''), success = $state('');
|
|
let acting = $state<string|null>(null), request = 0;
|
|
let reviewOpen = $state(false), preview = $state<BetaPromotionPreview|null>(null), reviewError = $state('');
|
|
let now = $state(Date.now());
|
|
let revision = $state({ revision: 1, started_at: '' }), revisions = $state<BetaRevision[]>([]);
|
|
let testProgress = $state<{ action: (action: string) => Promise<void> }>();
|
|
let testBusy = $state(false), moreActionsOpen = $state(false);
|
|
let legacyExpanded = $state<Record<string, boolean>>({});
|
|
let updateOpen = $state(false), updateRevision = $state(1), updateFiles = $state<BetaFile[]>([]);
|
|
function openUpdate() { updateRevision = revision.revision; updateFiles = [...scripts]; updateOpen = true; }
|
|
const id = $derived(Number($page.params.id));
|
|
const closed = $derived(beta?.state === 'promoted' || beta?.state === 'rolled-back');
|
|
const hasDeletedServers = $derived(servers.some(server => server.server_deleted_at));
|
|
const deadline = $derived(beta && test ? new Date(Date.parse(revision.started_at || beta.opened_at) + test.plan.timeoutHours * 3600000) : null);
|
|
const remaining = $derived(deadline ? Math.max(0, Math.ceil((deadline.getTime() - now) / 60000)) : 0);
|
|
const deadlineText = $derived(remaining > 0 ? `${Math.floor(remaining / 60)}h ${remaining % 60}m remaining` : 'Testing window ended');
|
|
const passed = $derived(test?.servers.filter(server => server.passed).length ?? 0);
|
|
const presentation = $derived(betaStatus({ state: beta?.state ?? 'running', testOutcome: test?.outcome, servers }));
|
|
const testExpired = $derived(test?.outcome === 'inconclusive' || (!!deadline && test?.outcome !== 'passed' && deadline.getTime() <= now));
|
|
const retryBlocked = $derived(servers.some(server => server.error?.startsWith('deploy:')));
|
|
const busy = $derived(acting !== null || testBusy);
|
|
const ranked = $derived([...servers].sort((a,b) => (a.stage === 'failed' ? 0 : a.stage === 'ready' ? 2 : 1) - (b.stage === 'failed' ? 0 : b.stage === 'ready' ? 2 : 1) || a.server.localeCompare(b.server)));
|
|
const blocker = $derived(closed ? ''
|
|
: hasDeletedServers ? 'A test server was deleted. Roll back and reuse the plan to test the current servers.'
|
|
: test?.outcome === 'inconclusive' ? 'The testing window ended without enough evidence. Update the beta for a new revision, or roll back.'
|
|
: test?.outcome === 'paused' ? 'Testing is paused. The original deadline still applies.'
|
|
: presentation.key === 'ready' ? '' : test?.reason || ranked.find(server => server.stage === 'failed')?.error
|
|
|| ranked.find(server => server.stage !== 'ready')?.error
|
|
|| (ranked.length ? outstanding(test?.servers.find(server => !server.passed)?.server ?? ranked[0].server) : 'Waiting for test servers.'));
|
|
|
|
function testAction(action: string) { moreActionsOpen = false; void testProgress?.action(action); }
|
|
|
|
async function load() {
|
|
const current = ++request, requestedId = id;
|
|
try {
|
|
const res = await fetch(`/api/betas/${requestedId}`);
|
|
if (!res.ok) throw new Error(res.status === 404 ? 'Beta not found.' : 'Could not refresh beta. Showing the last loaded results.');
|
|
const body = await res.json();
|
|
if (current !== request || requestedId !== id) return;
|
|
test = body.test; beta = body.beta; scripts = body.scripts; servers = body.servers;
|
|
if (activityBefore === null) { events = body.events; nextBefore = body.eventsNextBefore ?? null; }
|
|
promotion = body.promotion ?? null;
|
|
rollbackCampaign = body.rollback ?? null;
|
|
revision = body.revision; revisions = body.revisions ?? [];
|
|
now = Date.now(); loadError = '';
|
|
} catch (error) { if (current === request && requestedId === id) loadError = (error as Error).message; }
|
|
finally { if (current === request && requestedId === id) loading = false; }
|
|
}
|
|
$effect(() => { id; activityRequest++; activityBefore = null; activityLoading = false; beta = null; loading = true; loadError = ''; flash = ''; success = ''; reviewOpen = false; updateOpen = false; moreActionsOpen = false; legacyExpanded = {}; void load(); });
|
|
onMount(() => {
|
|
const stop = betaUpdates(load, () => id);
|
|
const clock = setInterval(() => { now = Date.now(); }, 30000);
|
|
return () => { stop(); clearInterval(clock); request++; activityRequest++; };
|
|
});
|
|
async function loadActivity(before: number|null) {
|
|
const current = ++activityRequest, requestedId = id;
|
|
activityLoading = true;
|
|
try {
|
|
const res = await fetch(`/api/betas/${id}/events` + (before === null ? '' : `?before=${before}`));
|
|
if (!res.ok) throw new Error('Could not load beta activity.');
|
|
const body = await res.json();
|
|
if (current !== activityRequest || requestedId !== id) return;
|
|
activityBefore = before; events = body.events; nextBefore = body.nextBefore; loadError = '';
|
|
} catch (error) { if (current === activityRequest) loadError = (error as Error).message; }
|
|
finally { if (current === activityRequest) activityLoading = false; }
|
|
}
|
|
async function reviewPromotion() {
|
|
reviewOpen = true; preview = null; reviewError = ''; acting = 'preview';
|
|
try {
|
|
const response = await fetch(`/api/betas/${id}/promote`), body = await response.json();
|
|
if (!response.ok) throw new Error(body.error ?? 'Could not prepare promotion review.');
|
|
preview = body.preview;
|
|
} catch (error) { reviewError = (error as Error).message; }
|
|
finally { acting = null; }
|
|
}
|
|
async function promote() {
|
|
if (!preview) return;
|
|
acting = 'promote'; reviewError = ''; flash = ''; success = '';
|
|
try {
|
|
const response = await fetch(`/api/betas/${id}/promote`, {method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({previewToken:preview.token})});
|
|
const body = await response.json();
|
|
if (!response.ok || !body.ok) {
|
|
if (body.kind === 'preview-changed' && body.details) preview = body.details;
|
|
throw new Error(body.error ?? 'Promotion could not be started.');
|
|
}
|
|
reviewOpen = false;
|
|
success = `Promotion created. ${body.result.awaitingActivation ?? 0} servers await activation${body.result.failedServers?.length ? `; ${body.result.failedServers.length} servers need attention` : ''}.`;
|
|
await load();
|
|
} catch (error) { reviewError = (error as Error).message; }
|
|
finally { acting = null; }
|
|
}
|
|
async function rollback() {
|
|
const reject = beta?.state === 'ready-promote';
|
|
const restarts = test?.plan.rollbackRestart === 'manual' ? 'Resume the rollback campaign when ready; files stay unchanged until safety checks pass.' : 'Files are restored just before restarting, after safety checks pass.';
|
|
if (!await confirmAction({title:reject?'Reject beta?':'Roll back beta?',message:`Restore the original files on ${servers.filter(server => !server.server_deleted_at).length} beta servers${reject ? ' and mark these versions as test-failed' : ''}. ${restarts}`,confirmLabel:reject?'Reject beta':'Roll back',danger:true})) return;
|
|
acting = 'rollback'; flash = ''; success = '';
|
|
try {
|
|
const response = await fetch(`/api/betas/${id}/rollback`,{method:'POST'}), body = await response.json();
|
|
if (!response.ok || !body.ok) throw new Error(body.error ?? 'Rollback failed.');
|
|
success = `Rollback queued. ${restarts}`; await load();
|
|
} catch(error) { flash = (error as Error).message; }
|
|
finally { acting = null; }
|
|
}
|
|
async function retry(server:string) {
|
|
acting = `retry:${server}`; flash = '';
|
|
try {
|
|
const response = await fetch(`/api/betas/${id}/retry`,{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({server})}), body = await response.json();
|
|
if (!response.ok || !body.ok) throw new Error(body.error ?? 'Retry failed.');
|
|
await load();
|
|
} catch(error) { flash = (error as Error).message; }
|
|
finally { acting = null; }
|
|
}
|
|
function outstanding(server:string) {
|
|
const progress = test?.servers.find(row => row.server === server)?.progress.find(item => !item.passed);
|
|
const requirement = test?.plan.requirements.find(item => item.id === progress?.id);
|
|
return requirement ? requirementSummary(requirement) : 'Waiting for deployment and fresh observations.';
|
|
}
|
|
</script>
|
|
|
|
<svelte:head><title>Beta #{id} | Electric Cherry</title></svelte:head>
|
|
{#if loadError}<div class="ui-error" role="alert">{loadError}<Button size="sm" onclick={load}>Retry</Button></div>{/if}
|
|
{#if loading}<EmptyState title="Loading beta…" />
|
|
{:else if !beta && !loadError}<EmptyState title="Beta not found" description="Return to Betas to find another test." />
|
|
{:else if beta}
|
|
<div class="page">
|
|
<SectionHeader title={beta.notes || `Beta #${beta.id}`} subtitle={beta.notes ? `Beta #${beta.id}` : undefined}>
|
|
{#snippet crumbs()}<Breadcrumbs items={[{label:'Betas',href:'/betas'},{label:`#${id}`}]} />{/snippet}
|
|
</SectionHeader>
|
|
<section class="decision" aria-label="Beta summary">
|
|
<div class="summary-heading">
|
|
<div><h2>{presentation.label}</h2><p class="summary-count">{test && test.servers.length ? `${passed}/${servers.length} test servers passed` : test && !closed ? 'Awaiting test results' : 'Test results not recorded'}</p></div>
|
|
<div class="actions">
|
|
{#if beta.state === 'promoted' && promotion}<Button variant="primary" href={contextHref(`/campaigns/${encodeURIComponent(promotion.id)}`, $page.url)}>View campaign</Button>
|
|
{:else if beta.state === 'rolled-back' && rollbackCampaign}<Button variant="primary" href={contextHref(`/campaigns/${encodeURIComponent(rollbackCampaign.id)}`, $page.url)}>View rollback campaign</Button>
|
|
{:else if closed}<Button variant="primary" href={contextHref(`/betas/new?reuse=${id}`, $page.url)}>Reuse files and test plan</Button>
|
|
{:else if presentation.key === 'ready'}<Button variant="primary" onclick={reviewPromotion} disabled={hasDeletedServers || busy}>Review promotion</Button>
|
|
{:else if presentation.key === 'attention'}<Button variant="primary" href="#test-servers">Review {servers.some(server => server.stage === 'failed') || test?.outcome === 'failed' ? 'failures' : 'issues'}</Button>
|
|
{:else if presentation.key === 'paused' && !testExpired}<Button variant="primary" onclick={() => testAction('resume')} disabled={busy}>Resume testing</Button>{/if}
|
|
{#if !closed || promotion || rollbackCampaign}<details class="more-actions" bind:open={moreActionsOpen}>
|
|
<summary>More actions</summary>
|
|
<div class="action-menu">
|
|
{#if !closed}
|
|
<Button variant="ghost" onclick={() => { moreActionsOpen = false; openUpdate(); }} disabled={hasDeletedServers || busy}>Update beta</Button>
|
|
{#if test && !hasDeletedServers}
|
|
{#if ['active','passed'].includes(test.outcome) && !testExpired}<Button variant="ghost" disabled={busy} onclick={() => testAction('pause')}>{test.outcome === 'passed' ? 'Pause health monitoring' : 'Pause testing'}</Button>{/if}
|
|
{#if ['paused','failed'].includes(test.outcome) && !testExpired}<Button variant="ghost" disabled={busy || retryBlocked} onclick={() => testAction('retry')}>Start fresh attempt</Button>{/if}
|
|
{/if}
|
|
<Button variant="danger" onclick={() => { moreActionsOpen = false; void rollback(); }} disabled={busy} loading={acting === 'rollback'}>{beta.state === 'ready-promote' ? 'Reject beta' : 'Roll back beta'}</Button>
|
|
{:else}<Button variant="ghost" href={contextHref(`/betas/new?reuse=${id}`, $page.url)}>Reuse files and test plan</Button>{/if}
|
|
</div>
|
|
</details>{/if}
|
|
</div>
|
|
</div>
|
|
{#if blocker}<p class:reason={presentation.key === 'attention'}>{blocker}</p>{/if}
|
|
{#if retryBlocked && !closed && ['paused','failed'].includes(test?.outcome ?? '')}<p class="muted">Deployment was incomplete. Roll back before opening a fresh beta.</p>{/if}
|
|
{#if promotion && (promotion.pending || promotion.failed)}<p class="muted">{#if promotion.pending}{promotion.pending} awaiting activation{/if}{#if promotion.pending && promotion.failed} · {/if}{#if promotion.failed}{promotion.failed} need attention{/if}</p>{/if}
|
|
{#if deadline && !closed && test?.outcome !== 'passed'}
|
|
<details class="deadline" class:urgent={remaining <= 120}><summary>{deadlineText}</summary><p>Deadline: <time datetime={deadline.toISOString()}>{$timeFormat.dateTime(deadline)}</time>. Waiting, pausing, and retrying use the same testing window. Deploying a new revision starts a fresh window.</p></details>
|
|
{/if}
|
|
{#if flash}<p role="alert" class="ui-error">{flash}</p>{/if}
|
|
{#if success}<p role="status">{success}</p>{/if}
|
|
</section>
|
|
<div id="test-servers">
|
|
{#if test}
|
|
{#key id}<BetaTestProgress bind:this={testProgress} bind:busy={testBusy} {test} betaId={id} {closed} deployments={servers} deletedParticipants={hasDeletedServers} deadline={deadline?.toISOString()} retryBlocked={retryBlocked ? 'Deployment was incomplete. Roll back before opening a fresh beta.' : undefined} onUpdate={load} />{/key}
|
|
{:else}
|
|
<section aria-labelledby="servers-heading"><h2 id="servers-heading">Test servers</h2>
|
|
<div class="table-scroll"><table><thead><tr><th scope="col">Server</th><th scope="col">Deployment</th><th scope="col">Test result</th><th scope="col">Details</th></tr></thead><tbody>
|
|
{#each ranked as server (server.server)}
|
|
{@const expanded = legacyExpanded[server.server] ?? server.stage === 'failed'}
|
|
<tr><td><HistoricalServerIdentity name={server.server} deletedAt={server.server_deleted_at} href={contextHref(`/servers/${encodeURIComponent(server.server)}`, $page.url)} /></td><td><StatusBadge state={server.stage} /></td><td class="muted">Not recorded</td><td><button class="text-button" aria-expanded={expanded} aria-controls={`legacy-server-${server.server}`} onclick={() => legacyExpanded = { ...legacyExpanded, [server.server]: !expanded }}>{expanded ? 'Hide' : 'Details'}</button></td></tr>
|
|
<tr hidden={!expanded} id={`legacy-server-${server.server}`}><td colspan="4">
|
|
<p class="muted">Files {server.deployed_at ? 'installed' : 'pending'} · Restart {server.restarted_at ? 'submitted' : 'pending'}{#if beta.wait_for_health} · Health {server.healthy_at ? 'verified' : 'pending'}{/if}{#if beta.wait_for_match} · Match {server.match_seen_at ? 'observed' : 'pending'}{/if}</p>
|
|
{#if server.error}<p class:reason={server.stage === 'failed'}>{server.error}</p>{/if}
|
|
<div class="actions">{#if !server.server_deleted_at}<a href={contextHref(`/servers/${encodeURIComponent(server.server)}?tab=diagnostics`, $page.url)}>Diagnostics</a><a href={contextHref(`/servers/${encodeURIComponent(server.server)}?tab=logs`, $page.url)}>Open logs</a>{/if}{#if server.provisioning_id}<a href={contextHref(`/provisioning/${encodeURIComponent(server.provisioning_id)}`, $page.url)}>View provisioning</a>{/if}
|
|
{#if server.stage === 'failed' && !server.server_deleted_at && !closed}<Button size="sm" onclick={() => retry(server.server)} disabled={busy} loading={acting === `retry:${server.server}`}>Retry server</Button>{/if}</div>
|
|
</td></tr>
|
|
{:else}<tr><td colspan="4" class="muted">No servers recorded.</td></tr>{/each}
|
|
</tbody></table></div>
|
|
</section>
|
|
{/if}
|
|
</div>
|
|
<details class="ui-panel"><summary>Files and versions ({scripts.length})</summary><div class="file-list">{#each scripts as file}<details><summary><a href={contextHref(`/${file.kind === 'baseline' ? 'configs' : file.kind + 's'}/${file.id}`, $page.url)}>{file.name}</a> · {artifactVersionLabel(file.version)}</summary><p><code>{file.target_rel_path}</code></p>{#if file.version}<p class="muted">SHA <code>{file.version.sha256}</code></p>{/if}</details>{/each}</div></details>
|
|
<details class="ui-panel"><summary>Beta details</summary><div class="timing"><span>Revision {revision.revision}</span><span>Started {$timeFormat.dateTime(beta.opened_at)}</span>{#if revision.revision > 1}<span>Revision started {$timeFormat.dateTime(revision.started_at)}</span>{/if}{#if beta.closed_at}<span>Finished {$timeFormat.dateTime(beta.closed_at)}</span>{/if}</div></details>
|
|
{#if revisions.length}
|
|
<details class="ui-panel"><summary>Revision history ({revisions.length})</summary><div class="revision-list">
|
|
{#each revisions as item}<details><summary>Revision {item.revision} · {item.revision === revision.revision ? 'Current' : item.results?.test?.outcome ?? item.results?.state ?? 'Superseded'} · {$timeFormat.dateTime(item.started_at)}</summary>
|
|
{#if item.notes}<p>{item.notes}</p>{/if}
|
|
<div class="file-list">{#each item.files as file}<div><a href={`/api/betas/${id}/revisions/${item.revision}/files/${file.script_id}`} download={file.path.split('/').pop()}>{file.name} · {artifactVersionLabel(file)}</a><code>{file.path}</code><span>{file.sha256.slice(0,12)}</span></div>{/each}</div>
|
|
{#if item.results?.test}<BetaTestProgress test={item.results.test} betaId={id} closed={true} onUpdate={load} />
|
|
{:else if item.results}<ul>{#each item.results.servers as server}<li>{server.server} · {server.stage}{server.error ? ` · ${server.error}` : ''}</li>{/each}</ul>{/if}
|
|
</details>{/each}
|
|
</div></details>
|
|
{/if}
|
|
<OperationHistory {events} active={!closed} showOverview={false}>
|
|
{#snippet footer()}<div class="ui-toolbar" aria-label="Activity pagination">{#if activityBefore !== null}<Button size="sm" disabled={activityLoading} onclick={() => loadActivity(null)}>Latest activity</Button>{/if}{#if nextBefore !== null}<Button size="sm" disabled={activityLoading} onclick={() => loadActivity(nextBefore)}>Older activity</Button>{/if}</div>{/snippet}
|
|
</OperationHistory>
|
|
</div>
|
|
{/if}
|
|
|
|
<BetaRevisionDialog bind:open={updateOpen} betaId={id} revision={updateRevision} files={updateFiles} servers={servers.map(server => server.server)} timeoutHours={test?.plan.timeoutHours} onUpdate={load} />
|
|
|
|
<Dialog bind:open={reviewOpen} title="Review promotion" description="Review the exact files and server eligibility before installing the promoted versions." busy={acting === 'promote'} wide>
|
|
{#if acting === 'preview'}<p role="status">Preparing promotion impact…</p>{/if}
|
|
{#if reviewError}<p class="ui-error" role="alert">{reviewError}</p>{/if}
|
|
{#if preview}
|
|
<p><strong>{preview.servers.filter(server => server.tested).length} tested servers</strong> and <strong>{preview.servers.filter(server => !server.tested).length} additional eligible servers</strong>.</p>
|
|
<p>Confirming creates a campaign and queues the file changes. Each server waits until empty and restart capacity is available, then captures rollback snapshots, installs its files, and restarts. Tested servers keep their pre-beta snapshots and only need another activation if their configuration changed or earlier queued work could replace the tested files. Eligibility follows each file's current scope.</p>
|
|
<p class="muted">Reviewed {$timeFormat.dateTime(preview.createdAt)}. If targets, versions, or composed settings change, you must review again.</p>
|
|
{#each preview.blockers as blocker}<p class="ui-error" role="alert">{blocker}</p>{/each}
|
|
<div class="file-list">{#each preview.files as file}<details open><summary>{file.name} · {artifactVersionLabel(file)} · {file.servers.length} servers</summary><p><code>{file.path}</code> · {file.scope} · SHA {file.sha256.slice(0,12)}</p><ul>{#each file.servers as name}<li><ServerIdentity {name}/><span>{preview.servers.find(server => server.name === name)?.tested ? 'Already tested' : 'Additional target · restart when empty'}</span></li>{/each}</ul></details>{/each}</div>
|
|
{#if preview.configWrites.length}<details><summary>Composed configuration files ({preview.configWrites.length})</summary>{#each preview.configWrites as write}<p>{write.server} · {write.path} · {write.sha256?.slice(0,12) ?? write.error}</p>{/each}</details>{/if}
|
|
{:else if acting !== 'preview'}<Button onclick={reviewPromotion}>Retry preview</Button>{/if}
|
|
{#snippet actions()}<Button onclick={() => reviewOpen = false} disabled={acting === 'promote'}>Cancel</Button>{#if preview}<Button onclick={reviewPromotion} disabled={acting !== null}>Refresh review</Button><Button variant="primary" onclick={promote} loading={acting === 'promote'} disabled={acting !== null || !!preview.blockers.length}>Promote to {preview.servers.length} servers</Button>{/if}{/snippet}
|
|
</Dialog>
|
|
|
|
<style>
|
|
.revision-list { display:grid; gap:20px; margin-top:16px; }
|
|
.page { display:grid; gap:24px; min-width:0; }
|
|
h2 { margin:0; font-size: var(--text-md); } p { line-height:1.6; overflow-wrap:anywhere; }
|
|
a { color:var(--accent-primary-hover); }
|
|
.decision { background:var(--surface); border:1px solid var(--border-subtle); border-radius:var(--radius-md); padding:20px 24px; }
|
|
.decision > p { margin:12px 0 0; }
|
|
.summary-heading,.actions,.timing { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
|
|
.summary-heading { justify-content:space-between; }
|
|
.summary-count { color:var(--text-secondary); font-size:var(--text-sm); margin:6px 0 0; }
|
|
.timing,.muted { color:var(--text-secondary); font-size: var(--text-sm); }.timing { margin-top:16px; }
|
|
.reason { border-left:3px solid var(--state-warning); padding-left:12px; }
|
|
.deadline { margin-top:12px; font-size:var(--text-sm); color:var(--text-secondary); }.deadline p { max-width:760px; }.deadline.urgent > summary { color:var(--state-warning); }
|
|
.more-actions { position:relative; }.more-actions > summary { padding:10px 12px; color:var(--text-secondary); font-size:var(--text-sm); }
|
|
.action-menu { position:absolute; top:100%; right:0; z-index:2; display:grid; gap:8px; min-width:220px; padding:12px; background:var(--surface-overlay); border:1px solid var(--border-strong); border-radius:var(--radius-md); box-shadow:0 8px 24px #0006; }
|
|
.table-scroll { overflow-x:auto; margin-top:16px; } table { width:100%; border-collapse:collapse; font-size:var(--text-sm); text-align:left; } th { padding:10px 12px; border-bottom:1px solid var(--border-strong); color:var(--text-tertiary); font-size:var(--text-xs); } td { padding:16px 12px; border-bottom:1px solid var(--border-subtle); }
|
|
.text-button { background:transparent; border:0; color:var(--text-secondary); font:inherit; cursor:pointer; }
|
|
.file-list { display:grid; gap:12px; margin-top:16px; }
|
|
.file-list > div { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
|
|
.file-list code { overflow-wrap:anywhere; } .file-list li { margin:10px 0; } .file-list li span { margin-left:12px; font-size: var(--text-xs); color:var(--text-secondary); }
|
|
details > summary { cursor:pointer; font-weight:600; } #test-servers { scroll-margin-top:80px; min-width:0; }
|
|
@media(max-width:720px) { table { min-width:620px; }.decision { padding:16px; }.timing { align-items:flex-start; flex-direction:column; }.action-menu { right:auto; left:0; } }
|
|
</style>
|