diff --git a/worker/src/portal.ts b/worker/src/portal.ts index 4816121..4fe142e 100644 --- a/worker/src/portal.ts +++ b/worker/src/portal.ts @@ -5,6 +5,13 @@ const copyIcon = ``; const vncIcon = ``; const codeIcon = ``; +const portalBrand = "๐Ÿฆ€ crabbox"; + +interface PortalHeaderOptions { + variant?: "top" | "bar"; + meta: string; + actions?: string; +} export interface PortalLeaseBridgeStatus { webVNCBridgeConnected: boolean; @@ -43,13 +50,10 @@ export function portalHome(leases: LeaseRecord[], request: Request): Response { return html( "Crabbox Portal", `
-
-
-

๐Ÿฆ€ crabbox

-

${escapeHTML(new URL(request.url).host)}

-
- log out -
+ ${portalHeader({ + meta: escapeHTML(new URL(request.url).host), + actions: `log out`, + })}

leases

@@ -81,6 +85,7 @@ export function portalLeaseDetail( bridgeStatus: PortalLeaseBridgeStatus, ): Response { const slug = lease.slug || lease.id; + const target = lease.target || "linux"; const active = lease.state === "active"; const runRows = runs.length ? runs.map((run) => runRow(run)).join("") @@ -106,16 +111,13 @@ export function portalLeaseDetail( return html( `${slug} lease`, `
-
-
-

${escapeHTML(slug)}

-

${escapeHTML(lease.provider)} ${escapeHTML(lease.target)} lease ${escapeHTML(lease.id)}

-
-
+ ${portalHeader({ + meta: `${escapeHTML(slug)} ยท ${escapeHTML(lease.provider)} ${escapeHTML(target)} lease ${escapeHTML(lease.id)}`, + actions: ` leases log out -
-
+ `, + })}
@@ -124,7 +126,7 @@ export function portalLeaseDetail(
${metaHTMLRow("provider", providerBadge(lease.provider))} - ${metaHTMLRow("target", targetBadge(lease.target, lease.windowsMode))} + ${metaHTMLRow("target", targetBadge(target, lease.windowsMode))} ${metaRow("class", lease.class)} ${metaRow("host", lease.host || "pending")} ${metaRow("ssh", lease.sshPort ? `${lease.sshUser || "crabbox"}@${lease.host || "host"}:${lease.sshPort}` : "pending")} @@ -203,17 +205,14 @@ export function portalRunDetail( return html( `${run.id} run`, `
-
-
-

${escapeHTML(run.id)}

-

${escapeHTML(run.slug || run.leaseID)} ${escapeHTML(run.command.join(" "))}

-
-
+ ${portalHeader({ + meta: `${escapeHTML(run.id)} ยท ${escapeHTML(run.slug || run.leaseID)} ${escapeHTML(run.command.join(" "))}`, + actions: ` lease leases log out -
-
+ `, + })}
@@ -303,6 +302,7 @@ export function portalRunDetail( export function portalVNC(lease: LeaseRecord): Response { const nonce = scriptNonce(); const slug = lease.slug || lease.id; + const target = lease.target || "linux"; const title = `WebVNC ${slug}`; const wsPath = `/portal/leases/${encodeURIComponent(lease.id)}/vnc/viewer`; const statusPath = `/portal/leases/${encodeURIComponent(lease.id)}/vnc/status`; @@ -312,19 +312,17 @@ export function portalVNC(lease: LeaseRecord): Response { return html( title, `
-
-
-

${escapeHTML(slug)}

-

${providerBadge(lease.provider)}${targetBadge(lease.target, lease.windowsMode)}${escapeHTML(lease.id)}

-
-
+ ${portalHeader({ + variant: "bar", + meta: `WebVNC ${escapeHTML(slug)}${providerBadge(lease.provider)}${targetBadge(target, lease.windowsMode)}${escapeHTML(lease.id)}`, + actions: ` waiting for bridge leases log out -
-
+ `, + })}