refactor: rename recipients route to people, update all frontend references

2026-06-16 11:26:21 +02:00
parent d67f31cf54
commit ecc3cf1b55
37 changed files with 553 additions and 194 deletions
@@ -0,0 +1,113 @@
+import { Eye, Pencil } from "lucide-react"
+import Link from "next/link"
+
+import PageHeader from "@/components/common/pageheader"
+import PaginationButtons from "@/components/common/pagination"
+import { Button } from "@/components/ui/button"
+import type { Person } from "@/generated/prisma/client"
+import { getI18n } from "@/i18n/server"
+import { PersonService } from "@/services/person.service"
+
+import { formatPersonDepartment } from "./_components/person.copy"
+
+export default async function PeoplePage(props: {
+  searchParams?: Promise<{
+    page?: string
+    search?: string
+  }>
+}) {
+  const searchParams = await props.searchParams
+  const currentPage = searchParams?.page ? parseInt(searchParams.page, 10) : 1
+  const search = searchParams?.search || ""
+  const { data: people, totalPages } = await PersonService.findAllPaginated({
+    page: currentPage,
+    pageSize: 10,
+    search,
+  })
+  const { dictionary } = await getI18n()
+  const copy = dictionary.inventory.people
+
+  return (
+    <div className="flex flex-col gap-4">
+      <PageHeader
+        title={copy.list.title}
+        link="/people/new"
+        addLabel={copy.list.addLabel}
+        data={people}
+        search={search}
+      />
+      {people.length === 0 && <div>{copy.list.empty}</div>}
+      {people.length > 0 && (
+        <div className="overflow-x-auto">
+          <table className="text-muted-foreground w-full text-left text-sm">
+            <thead className="border-b">
+              <tr>
+                <th scope="col" className="p-4">
+                  {copy.list.columns.name}
+                </th>
+                <th scope="col" className="p-4">
+                  {copy.list.columns.email}
+                </th>
+                <th scope="col" className="p-4">
+                  {copy.list.columns.phone}
+                </th>
+                <th scope="col" className="p-4">
+                  {copy.list.columns.department}
+                </th>
+                <th scope="col" className="p-4">
+                  {copy.list.columns.actions}
+                </th>
+              </tr>
+            </thead>
+            <tbody>
+              {people.map((person: Person) => (
+                <tr key={person.id} className="border-b">
+                  <td className="p-4">
+                    {`${person.firstName} ${person.lastName}`}
+                  </td>
+                  <td className="p-4">{person.email}</td>
+                  <td className="p-4">{person.phone}</td>
+                  <td className="p-4">
+                    {formatPersonDepartment(
+                      person.department,
+                      copy.departments,
+                      copy.fallback,
+                    )}
+                  </td>
+                  <td className="flex items-center gap-2 p-4">
+                    <Link href={`/people/${person.id}`} passHref>
+                      <Button
+                        variant="outline"
+                        size="icon"
+                        aria-label={copy.list.actions.view}
+                      >
+                        <Eye />
+                      </Button>
+                    </Link>
+                    <Link href={`/people/${person.id}/edit`} passHref>
+                      <Button
+                        className="btn btn-primary"
+                        variant="outline"
+                        size="icon"
+                        aria-label={copy.list.actions.edit}
+                      >
+                        <Pencil />
+                      </Button>
+                    </Link>
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+            <tfoot className="border-t">
+              <tr>
+                <td colSpan={5} className="p-4 text-center text-sm">
+                  <PaginationButtons totalPages={totalPages} />
+                </td>
+              </tr>
+            </tfoot>
+          </table>
+        </div>
+      )}
+    </div>
+  )
+}