gitfor/platform

import { createFileRoute } from "@tanstack/react-router";
import { getPages } from "~/fns/pages";
import { Panel } from "~/ui/Panel";
import { PagesDomainForm, PagesSourceForm } from "~/components/PagesSettings";
import { PagesDeployments } from "~/components/PagesDeployments";
import { Callout } from "~/ui/Callout";
import { ExternalLink } from "~/ui/TextLink";

export const Route = createFileRoute("/$owner/$repo/settings/pages")({
  loader: ({ params }) => getPages({ data: { owner: params.owner, repo: params.repo } }),
  component: PagesSettingsPage,
});

function PagesSettingsPage() {
  const data = Route.useLoaderData();
  const params = Route.useParams();
  if (!data.enabled) {
    return (
      <Panel title="Pages">
        <p className="p-4 text-sm text-gray-500">
          Pages hosting is not configured on this forge. Set <code className="font-mono">PAGES_DOMAIN</code> to a domain
          separate from the forge to enable it.
        </p>
      </Panel>
    );
  }
  if (!data.public) {
    return (
      <Panel title="Pages">
        <p className="p-4 text-sm text-gray-500">Pages can only publish public repositories.</p>
      </Panel>
    );
  }
  return (
    <>
      {data.site?.activeDeploymentId && data.url && (
        <Callout tone="success" className="px-4 py-3">
          Your site is live at{" "}
          <ExternalLink href={data.url} target="_blank" rel="noreferrer" tone="success" mono>
            {data.site.customDomain ? `https://${data.site.customDomain}/` : data.url}