pr_01m47d15m3e54sn21z27rpy5n9/apps/web/app/components/deploy.tsx
| 1 | /** Small pieces every page about deployments shares. */ |
| 2 | import type { DeployStatus } from "@g1t/contracts"; |
| 3 | |
| 4 | export const DEPLOY_STATUS: Record<DeployStatus, { label: string; tone: string }> = { |
| 5 | queued: { label: "Queued", tone: "text-muted" }, |
| 6 | building: { label: "Building", tone: "text-warn" }, |
| 7 | ready: { label: "Live", tone: "text-accent" }, |
| 8 | failed: { label: "Failed", tone: "text-danger" }, |
| 9 | skipped: { label: "Skipped", tone: "text-faint" }, |
| 10 | }; |
| 11 | |
| 12 | export function StatusDot({ status, label }: { status: DeployStatus; label?: string }) { |
| 13 | const { label: word, tone } = DEPLOY_STATUS[status]; |
| 14 | return ( |
| 15 | <span className={`inline-flex items-center gap-1.5 text-xs font-medium ${tone}`}> |
| 16 | <span className={`size-1.5 rounded-full bg-current ${status === "building" || status === "queued" ? "animate-pulse" : ""}`} /> |
| 17 | {label ?? word} |
| 18 | </span> |
| 19 | ); |
| 20 | } |
| 21 | |
| 22 | /** An address on g1t.page without its scheme. */ |
| 23 | export function host(url: string): string { |
| 24 | return url.replace(/^https?:\/\//, ""); |
| 25 | } |