Z8MB1E
0f7d3a57e3
Adds a Personnel nav group with Contacts (searchable NPC directory with profile pages showing listings and employment) and Statistics pages; moves Wiki under Intelligence and checks off the corresponding TODO item. Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
51 lines
1.8 KiB
TypeScript
51 lines
1.8 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import type { GameNpc } from "@/payload-types";
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
|
|
|
interface NpcCardProps {
|
|
readonly npc: GameNpc;
|
|
}
|
|
|
|
export function NpcCard({ npc }: NpcCardProps) {
|
|
const factionName =
|
|
typeof npc.faction === "object" && npc.faction !== null ? npc.faction.name : null;
|
|
|
|
return (
|
|
<Link href={`/personnel/contacts/${npc.id}`} className="block h-full">
|
|
<Card className="h-full transition-colors hover:bg-accent/50">
|
|
<CardHeader className="gap-2">
|
|
<CardTitle className="text-base">{npc.name}</CardTitle>
|
|
<p className="text-sm text-muted-foreground">
|
|
{npc.occupation ?? "Occupation not recorded"}
|
|
</p>
|
|
<div className="flex flex-wrap items-center gap-1.5">
|
|
{npc.isInGame === true && (
|
|
<Badge variant="secondary" className="border-emerald-500/30 text-emerald-500">
|
|
In Game
|
|
</Badge>
|
|
)}
|
|
{npc.isGenerated === true && (
|
|
<Badge variant="outline" className="border-amber-500/40 text-amber-500">
|
|
Generated
|
|
</Badge>
|
|
)}
|
|
{npc.vendor?.enabled === true && (
|
|
<Badge variant="outline" className="border-violet-500/40 text-violet-500">
|
|
Vendor
|
|
</Badge>
|
|
)}
|
|
</div>
|
|
</CardHeader>
|
|
<CardContent className="flex flex-col gap-2 text-sm">
|
|
<div className="flex items-center justify-between gap-3">
|
|
<span className="text-muted-foreground">Faction</span>
|
|
<span className="truncate text-right">{factionName ?? "Unaffiliated"}</span>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
</Link>
|
|
);
|
|
}
|