| 1 | /** Small pieces every page about deployments shares. */ |
| 2 | import type { AnchorHTMLAttributes } from "react"; |
| 3 | |
| 4 | import type { DeployStatus } from "@g1t/contracts"; |
| 5 | |
| 6 | export const DEPLOY_STATUS: Record<DeployStatus, { label: string; tone: string }> = { |
| 7 | queued: { label: "Queued", tone: "text-muted" }, |
| 8 | building: { label: "Building", tone: "text-warn" }, |
| 9 | ready: { label: "Live", tone: "text-success" }, |
| 10 | replaced: { label: "Replaced", tone: "text-faint" }, |
| 11 | down: { label: "Down", tone: "text-faint" }, |
| 12 | failed: { label: "Failed", tone: "text-danger" }, |
| 13 | skipped: { label: "Skipped", tone: "text-faint" }, |
| 14 | }; |
| 15 | |
| 16 | export function StatusDot({ status, label }: { status: DeployStatus; label?: string }) { |
| 17 | const { label: word, tone } = DEPLOY_STATUS[status]; |
| 18 | return ( |
| 19 | <span className={`inline-flex items-center gap-1.5 text-xs font-medium ${tone}`}> |
| 20 | <span className={`size-1.5 rounded-full bg-current ${status === "building" || status === "queued" ? "animate-pulse" : ""}`} /> |
| 21 | {label ?? word} |
| 22 | </span> |
| 23 | ); |
| 24 | } |
| 25 | |
| 26 | /** An address on g1t.page without its scheme. */ |
| 27 | export function host(url: string): string { |
| 28 | return url.replace(/^https?:\/\//, ""); |
| 29 | } |
| 30 | |
| 31 | /** |
| 32 | * A link to where something runs: a g1t.page address, an environment's |
| 33 | * URL, a preview, a project's homepage. It always opens in a new tab, so |
| 34 | * the page about it stays open behind it. `rel` adds to noopener and |
| 35 | * noreferrer (nofollow, say), never replaces them. |
| 36 | */ |
| 37 | export function DeployLink({ rel, ...props }: AnchorHTMLAttributes<HTMLAnchorElement> & { href: string }) { |
| 38 | return <a {...props} target="_blank" rel={rel ? `noopener noreferrer ${rel}` : "noopener noreferrer"} />; |
| 39 | } |