import * as React from "react" import { useParams } from "react-router" import { AdminRecordDetail, AdminRecordNotFound, type AdminRecordField, } from "@/components/admin/admin-record-detail" import { ADMIN_PEOPLE, ADMIN_PERSON_TYPE_LABEL, adminPersonUsage, } from "@/lib/mock/admin-directory" import { initialsFromDisplayName } from "@/lib/initials-from-name" const BACK_TO = { label: "People", href: "/people" } export default function AdminPersonDetailPage() { const { personId = "" } = useParams() const person = React.useMemo( () => ADMIN_PEOPLE.find(row => row.id === personId), [personId], ) const usage = React.useMemo(() => (person ? adminPersonUsage(person) : []), [person]) if (!person) { return ( ) } const fields: AdminRecordField[] = [ { label: "Workspace ID", value: person.personCode, mono: true }, { label: "Type", value: ADMIN_PERSON_TYPE_LABEL[person.type] }, { label: "Email", value: ( {person.email} ), }, { label: "Program", value: person.program }, person.type === "student" ? { label: "Cohort", value: person.cohort } : { label: "Department", value: person.department }, ] const subtitle = person.type === "student" ? `${person.program}, ${person.cohort}` : `${ADMIN_PERSON_TYPE_LABEL[person.type]}, ${person.department || person.program}` return ( ) }