gitfor/platform

import { deployPages, removePagesPreview, rollbackPages } from "~/fns/pages";
import { useAction } from "~/hooks/use-action";
import { Badge } from "~/ui/Badge";
import { EmptyState } from "~/ui/EmptyState";
import { formatBytes } from "~/lib/format";
import { Panel } from "~/ui/Panel";
import { RelativeTime } from "~/ui/RelativeTime";
import { Button } from "~/ui/Button";
import { ErrorBanner } from "~/ui/Callout";
import type { PagesData } from "./PagesSettings";
import { ExternalLink } from "~/ui/TextLink";

type RepoParams = { owner: string; repo: string };
type Deployment = PagesData["deployments"][number];

const STATUS_TONES = {
  queued: "neutral",
  building: "warning",
  active: "success",
  failed: "danger",
  superseded: "neutral",
} as const;

function DeploymentRow({
  deployment,
  activeId,
  onRollback,
  onRemovePreview,
}: {
  deployment: Deployment;
  activeId: string | null;
  onRollback: (id: string) => void;
  onRemovePreview: (prNumber: number) => void;
}) {
  const live = deployment.status === "active";
  const prNumber = deployment.prNumber;
  return (
    <li className="flex flex-wrap items-center gap-3 px-4 py-2.5 text-sm">
      <Badge tone={STATUS_TONES[deployment.status]}>{deployment.status}</Badge>
      <span className="text-gray-200">