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 (
)
}