Artifacts

import { Target } from "lucide-react";
import { PageHeader } from "@/components/layout/page-header";
import { StatusBadge } from "@/components/shared/status-badge";
import { RecordRow, RecordList } from "@/components/shared/record-row";
import { EmptyState } from "@/components/shared/empty-state";
import { getMissions } from "@/lib/content/missions";
import { getWorkOrdersForMission } from "@/lib/content/work-orders";

export const dynamic = "force-dynamic";
export const metadata = { title: "Mission Sessions" };

export default function MissionsPage() {
  const missions = getMissions();

  return (
    <div>
      <PageHeader
        eyebrow="Operate"
        title="Mission Sessions"
        description="A mission session is a bounded campaign of work. Open one to see the work orders it drives."
      />

      {missions.length === 0 ? (
        <EmptyState
          icon={Target}
          title="No mission sessions"
          description="Create a mission by adding a mission.md under a missions/ folder anywhere in the repository."
          hint="holdings/missions/MS-XXXX/mission.md"
        />
      ) : (
        <RecordList>
          {missions.map((m) => {
            const woCount = getWorkOrdersForMission(m.id).length;
            return (
              <RecordRow
                key={m.id}
                href={`/missions/${m.id}`}
                id={m.id.split("-").slice(0, 2).join("-")}
                title={m.title.replace(/^[A-Z]+-\d+\s*[—-]\s*/, "")}
                description={m.mission}
                badges={
                  <>
                    <span className="text-xs text-muted-foreground">
                      {woCount} work order{woCount === 1 ? "" : "s"}
                    </span>
                    <StatusBadge status={m.status} />
                  </>
                }
              />
            );
          })}
        </RecordList>
      )}
    </div>
  );
}