From bfea2b77ab43c9e3cd918174c06ed4fbd2a90f3c Mon Sep 17 00:00:00 2001
From: Asis Ferrer <aferrer@aferrer.dev>
Date: Mon, 15 Jun 2026 00:47:25 +0200
Subject: [PATCH] feat(i18n): localize inventory assignments UI

---
 .../assignments/[assignmentId]/edit/page.tsx  |   9 +-
 .../_components/edit.assignment.form.tsx      |  18 +-
 .../_components/new.assignment.form.tsx       |  22 ++-
 .../assignments/_components/return.button.tsx |   3 +
 src/app/(dashboard)/assignments/new/page.tsx  |  19 +-
 src/app/(dashboard)/assignments/page.tsx      |  31 ++-
 .../recipients/[recipientId]/page.tsx         |   3 +-
 src/i18n/dictionaries/en.ts                   |  40 ++++
 src/i18n/dictionaries/es.ts                   |  40 ++++
 .../assignments/assignment-form-pages.test.ts | 177 ++++++++++++++++++
 .../app/assignments/assignment-pages.test.ts  | 124 ++++++++++++
 .../app/recipients/recipient-pages.test.ts    |   6 +-
 tests/unit/i18n/dictionaries.test.ts          |  84 +++++++++
 13 files changed, 540 insertions(+), 36 deletions(-)
 create mode 100644 tests/unit/app/assignments/assignment-form-pages.test.ts
 create mode 100644 tests/unit/app/assignments/assignment-pages.test.ts

diff --git a/src/app/(dashboard)/assignments/[assignmentId]/edit/page.tsx b/src/app/(dashboard)/assignments/[assignmentId]/edit/page.tsx
index 9549158..15fc87b 100644
--- a/src/app/(dashboard)/assignments/[assignmentId]/edit/page.tsx
+++ b/src/app/(dashboard)/assignments/[assignmentId]/edit/page.tsx
@@ -18,9 +18,10 @@ export default async function EditAssignmentPage({
   const items = await ItemService.findAllWithStock()
   const assets = await AssetService.findAll()
   const { dictionary } = await getI18n()
+  const copy = dictionary.inventory.assignments
 
   if (!assignment) {
-    return <div>Assignment not found</div>
+    return <div>{copy.edit.notFound}</div>
   }
 
   let assignmentItem: Item = {} as Item
@@ -31,12 +32,16 @@ export default async function EditAssignmentPage({
   }
 
   return (
-    <div>
+    <div className="flex flex-col gap-4">
+      <div className="flex items-center justify-between gap-4">
+        <h1 className="text-2xl font-bold">{copy.edit.title}</h1>
+      </div>
       <AssignmentForm
         recipients={recipients}
         items={items}
         assets={assets}
         initialData={assignment as UpdateAssignmentFormType}
+        formCopy={copy.form}
         submitButtonCopy={dictionary.common.submitButton}
       />
     </div>
diff --git a/src/app/(dashboard)/assignments/_components/edit.assignment.form.tsx b/src/app/(dashboard)/assignments/_components/edit.assignment.form.tsx
index 3c4f841..b8f38f6 100644
--- a/src/app/(dashboard)/assignments/_components/edit.assignment.form.tsx
+++ b/src/app/(dashboard)/assignments/_components/edit.assignment.form.tsx
@@ -9,17 +9,21 @@ import {
   SubmitButton,
   type SubmitButtonCopy,
 } from "@/components/forms/submitButton"
+import type { Dictionary } from "@/i18n/dictionaries"
 import {
   type UpdateAssignmentFormType,
   updateAssignmentSchema,
 } from "@/schemas/assignment.schema"
 import type { Asset, Item, Recipient } from "@/types"
 
+type AssignmentFormCopy = Dictionary["inventory"]["assignments"]["form"]
+
 interface Props {
   recipients: Recipient[]
   items: Item[]
   assets: Asset[]
   initialData: UpdateAssignmentFormType
+  formCopy: AssignmentFormCopy
   submitButtonCopy: SubmitButtonCopy
 }
 
@@ -28,6 +32,7 @@ export default function EditAssignmentForm({
   items,
   assets,
   initialData,
+  formCopy,
   submitButtonCopy,
 }: Props) {
   const router = useRouter()
@@ -71,7 +76,7 @@ export default function EditAssignmentForm({
       <input type="hidden" {...register("id")} />
       <div className="flex flex-col gap-2">
         <label htmlFor="recipientId" className="mb-2 block text-lg">
-          Recipient
+          {formCopy.recipientLabel}
         </label>
         <select
           id="recipientId"
@@ -92,7 +97,7 @@ export default function EditAssignmentForm({
       </div>
       <div className="flex flex-col gap-2">
         <label htmlFor="itemId" className="mb-2 block text-lg">
-          Item
+          {formCopy.itemLabel}
         </label>
         <select
           id="itemId"
@@ -111,7 +116,7 @@ export default function EditAssignmentForm({
       </div>
       <div className="flex flex-col gap-2">
         <label htmlFor="assetId" className="mb-2 block text-lg">
-          Asset
+          {formCopy.assetLabel}
         </label>
         <select
           id="assetId"
@@ -120,7 +125,7 @@ export default function EditAssignmentForm({
             errors.assetId ? "border-error" : ""
           }`}
         >
-          <option value="">Select an asset</option>
+          <option value="">{formCopy.assetPlaceholder}</option>
           {itemId
             ? assets.map((asset) => (
                 <option key={asset.id} value={asset.id}>
@@ -135,7 +140,7 @@ export default function EditAssignmentForm({
       </div>
       <div className="flex flex-col gap-2">
         <label htmlFor="quantity" className="mb-2 block text-lg">
-          Quantity
+          {formCopy.quantityLabel}
         </label>
         <input
           type="number"
@@ -143,6 +148,7 @@ export default function EditAssignmentForm({
           disabled={!itemId || assets.length > 0}
           min={1}
           max={itemId ? items.find((item) => item.id === itemId)?.stock : 0}
+          placeholder={formCopy.quantityPlaceholder}
           defaultValue={1}
           {...register("quantity")}
           className={`w-full rounded-lg border px-4 py-2 ${
@@ -159,7 +165,7 @@ export default function EditAssignmentForm({
         isSubmitSuccessful={isSubmitSuccessful}
         disabled={!itemId || (assets.length > 0 && !assetId)}
       >
-        Update Assignment
+        {formCopy.updateSubmit}
       </SubmitButton>
     </form>
   )
diff --git a/src/app/(dashboard)/assignments/_components/new.assignment.form.tsx b/src/app/(dashboard)/assignments/_components/new.assignment.form.tsx
index dee973e..da0d5c0 100644
--- a/src/app/(dashboard)/assignments/_components/new.assignment.form.tsx
+++ b/src/app/(dashboard)/assignments/_components/new.assignment.form.tsx
@@ -10,16 +10,20 @@ import {
   SubmitButton,
   type SubmitButtonCopy,
 } from "@/components/forms/submitButton"
+import type { Dictionary } from "@/i18n/dictionaries"
 import {
   type CreateAssignmentFormType,
   createAssignmentSchema,
 } from "@/schemas/assignment.schema"
 import type { Asset, Item, Recipient } from "@/types"
 
+type AssignmentFormCopy = Dictionary["inventory"]["assignments"]["form"]
+
 interface Props {
   recipients: Recipient[]
   items: Item[]
   assets: Asset[]
+  formCopy: AssignmentFormCopy
   submitButtonCopy: SubmitButtonCopy
 }
 
@@ -27,6 +31,7 @@ export default function CreateAssignmentForm({
   recipients,
   items,
   assets,
+  formCopy,
   submitButtonCopy,
 }: Props) {
   const router = useRouter()
@@ -69,7 +74,7 @@ export default function CreateAssignmentForm({
     <form className="flex flex-col gap-4" onSubmit={handleSubmit(onSubmit)}>
       <div className="flex flex-col gap-2">
         <label htmlFor="recipientId" className="mb-2 block text-lg">
-          Recipient
+          {formCopy.recipientLabel}
         </label>
         <select
           id="recipientId"
@@ -78,7 +83,7 @@ export default function CreateAssignmentForm({
             errors.recipientId ? "border-error" : ""
           }`}
         >
-          <option value="">Select a recipient</option>
+          <option value="">{formCopy.recipientPlaceholder}</option>
           {recipients.map((recipient) => (
             <option key={recipient.id} value={recipient.id}>
               {recipient.firstName} {recipient.lastName}
@@ -91,7 +96,7 @@ export default function CreateAssignmentForm({
       </div>
       <div className="flex flex-col gap-2">
         <label htmlFor="itemId" className="mb-2 block text-lg">
-          Item
+          {formCopy.itemLabel}
         </label>
         <select
           id="itemId"
@@ -100,7 +105,7 @@ export default function CreateAssignmentForm({
             errors.itemId ? "border-error" : ""
           }`}
         >
-          <option value="">Select an item</option>
+          <option value="">{formCopy.itemPlaceholder}</option>
           {items.map((item) => (
             <option key={item.id} value={item.id}>
               {item.name}
@@ -112,7 +117,7 @@ export default function CreateAssignmentForm({
       {itemId && itemAssets.length !== 0 && (
         <div className="flex flex-col gap-2">
           <label htmlFor="assetId" className="mb-2 block text-lg">
-            Asset
+            {formCopy.assetLabel}
           </label>
           <select
             id="assetId"
@@ -124,7 +129,7 @@ export default function CreateAssignmentForm({
                 : ""
             }`}
           >
-            <option value="">Select an asset</option>
+            <option value="">{formCopy.assetPlaceholder}</option>
             {itemId
               ? itemAssets.map((asset) => (
                   <option key={asset.id} value={asset.id}>
@@ -140,7 +145,7 @@ export default function CreateAssignmentForm({
       )}
       <div className="flex flex-col gap-2">
         <label htmlFor="quantity" className="mb-2 block text-lg">
-          Quantity
+          {formCopy.quantityLabel}
         </label>
         <input
           type="number"
@@ -148,6 +153,7 @@ export default function CreateAssignmentForm({
           disabled={!itemId || itemAssets.length > 0}
           min={1}
           max={itemId ? items.find((item) => item.id === itemId)?.stock : 0}
+          placeholder={formCopy.quantityPlaceholder}
           defaultValue={1}
           {...register("quantity")}
           className={`w-full rounded-lg border px-4 py-2 ${
@@ -166,7 +172,7 @@ export default function CreateAssignmentForm({
         isSubmitSuccessful={isSubmitSuccessful}
         disabled={!itemId || (itemAssets.length > 0 && !assetId)}
       >
-        Create Assignment
+        {formCopy.createSubmit}
       </SubmitButton>
     </form>
   )
diff --git a/src/app/(dashboard)/assignments/_components/return.button.tsx b/src/app/(dashboard)/assignments/_components/return.button.tsx
index e31d3c2..530d471 100644
--- a/src/app/(dashboard)/assignments/_components/return.button.tsx
+++ b/src/app/(dashboard)/assignments/_components/return.button.tsx
@@ -10,8 +10,10 @@ import type { ReturnAssignmentFormType } from "@/schemas/assignment.schema"
 
 export default function ReturnButton({
   assignmentId,
+  ariaLabel,
 }: {
   assignmentId: string
+  ariaLabel: string
 }) {
   const router = useRouter()
   const [isPending, startTransition] = useTransition()
@@ -42,6 +44,7 @@ export default function ReturnButton({
         className="btn btn-error"
         size="icon"
         variant="outline"
+        aria-label={ariaLabel}
         disabled={isPending}
       >
         <ArrowLeft />
diff --git a/src/app/(dashboard)/assignments/new/page.tsx b/src/app/(dashboard)/assignments/new/page.tsx
index fd76a94..5097a61 100644
--- a/src/app/(dashboard)/assignments/new/page.tsx
+++ b/src/app/(dashboard)/assignments/new/page.tsx
@@ -10,13 +10,20 @@ export default async function NewAssignmentPage() {
   const items = await ItemService.findAllWithStock()
   const assets = await AssetService.findAllAvailable()
   const { dictionary } = await getI18n()
+  const copy = dictionary.inventory.assignments
 
   return (
-    <AssignmentForm
-      recipients={recipients}
-      items={items}
-      assets={assets}
-      submitButtonCopy={dictionary.common.submitButton}
-    />
+    <div className="flex flex-col gap-4">
+      <div className="flex items-center justify-between gap-4">
+        <h1 className="text-2xl font-bold">{copy.new.title}</h1>
+      </div>
+      <AssignmentForm
+        recipients={recipients}
+        items={items}
+        assets={assets}
+        formCopy={copy.form}
+        submitButtonCopy={dictionary.common.submitButton}
+      />
+    </div>
   )
 }
diff --git a/src/app/(dashboard)/assignments/page.tsx b/src/app/(dashboard)/assignments/page.tsx
index 775e0c5..734d82e 100644
--- a/src/app/(dashboard)/assignments/page.tsx
+++ b/src/app/(dashboard)/assignments/page.tsx
@@ -4,6 +4,7 @@ import Link from "next/link"
 import PageHeader from "@/components/common/pageheader"
 import PaginationButtons from "@/components/common/pagination"
 import { Button } from "@/components/ui/button"
+import { getI18n } from "@/i18n/server"
 import { AssignmentService } from "@/services/assignment.service"
 
 import ReturnButton from "./_components/return.button"
@@ -22,35 +23,38 @@ export default async function AssignmentsPage(props: {
       page: currentPage,
       search,
     })
+  const { dictionary } = await getI18n()
+  const copy = dictionary.inventory.assignments
 
   return (
     <div className="flex flex-col gap-4">
       <PageHeader
-        title="Assignments"
+        title={copy.list.title}
         link="/assignments/new"
         search={search}
         data={assignments}
+        addLabel={copy.list.addLabel}
       />
-      {assignments.length === 0 && <div>No assignments found</div>}
+      {assignments.length === 0 && <div>{copy.list.empty}</div>}
       {assignments.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">
-                  Recipient
+                  {copy.list.columns.recipient}
                 </th>
                 <th scope="col" className="p-4">
-                  Item
+                  {copy.list.columns.item}
                 </th>
                 <th scope="col" className="p-4">
-                  Serial Number
+                  {copy.list.columns.serialNumber}
                 </th>
                 <th scope="col" className="p-4">
-                  Quantity
+                  {copy.list.columns.quantity}
                 </th>
                 <th scope="col" className="p-4">
-                  Actions
+                  {copy.list.columns.actions}
                 </th>
               </tr>
             </thead>
@@ -75,7 +79,8 @@ export default async function AssignmentsPage(props: {
                     </Link>
                   </td>
                   <td className="p-4">
-                    {assignment?.asset?.serialNumber || "N/A"}
+                    {assignment?.asset?.serialNumber ||
+                      copy.fallback.missingValue}
                   </td>
                   <td className="p-4">{assignment?.quantity}</td>
                   <td className="p-4">
@@ -84,11 +89,17 @@ export default async function AssignmentsPage(props: {
                         href={`/assignments/${assignment.id}/edit`}
                         passHref
                       >
-                        <Button variant="outline">
+                        <Button
+                          variant="outline"
+                          aria-label={copy.list.actions.edit}
+                        >
                           <Pencil />
                         </Button>
                       </Link>
-                      <ReturnButton assignmentId={assignment.id} />
+                      <ReturnButton
+                        assignmentId={assignment.id}
+                        ariaLabel={copy.list.actions.return}
+                      />
                     </div>
                   </td>
                 </tr>
diff --git a/src/app/(dashboard)/recipients/[recipientId]/page.tsx b/src/app/(dashboard)/recipients/[recipientId]/page.tsx
index fa9edc9..059cef2 100644
--- a/src/app/(dashboard)/recipients/[recipientId]/page.tsx
+++ b/src/app/(dashboard)/recipients/[recipientId]/page.tsx
@@ -13,6 +13,7 @@ export default async function RecipientInfoPage({
   const { recipientId } = await params
   const { dictionary } = await getI18n()
   const copy = dictionary.inventory.recipients
+  const assignmentCopy = dictionary.inventory.assignments
   const recipient = await RecipientService.findById(recipientId)
   const assignments = await AssignmentService.findAllByRecipient(recipientId)
 
@@ -62,7 +63,7 @@ export default async function RecipientInfoPage({
       {assignments.length > 0 && (
         <Card className="rounded-sm shadow-none">
           <CardHeader>
-            <CardTitle>Assignments</CardTitle>
+            <CardTitle>{assignmentCopy.list.title}</CardTitle>
           </CardHeader>
           <CardContent>
             <div className="flex flex-col gap-y-2 text-sm">
diff --git a/src/i18n/dictionaries/en.ts b/src/i18n/dictionaries/en.ts
index 3ee1365..4a3808e 100644
--- a/src/i18n/dictionaries/en.ts
+++ b/src/i18n/dictionaries/en.ts
@@ -255,6 +255,46 @@ export const en = {
         invalidUpdateStatus: "Invalid status",
       },
     },
+    assignments: {
+      list: {
+        title: "Assignments",
+        addLabel: "Add Assignment",
+        empty: "No assignments found.",
+        columns: {
+          recipient: "Recipient",
+          item: "Item",
+          serialNumber: "Serial Number",
+          quantity: "Quantity",
+          actions: "Actions",
+        },
+        actions: {
+          edit: "Edit assignment",
+          return: "Return assignment",
+        },
+      },
+      new: {
+        title: "New Assignment",
+      },
+      edit: {
+        title: "Edit Assignment",
+        notFound: "Assignment not found",
+      },
+      form: {
+        recipientLabel: "Recipient",
+        recipientPlaceholder: "Select a recipient",
+        itemLabel: "Item",
+        itemPlaceholder: "Select an item",
+        assetLabel: "Asset",
+        assetPlaceholder: "Select an asset",
+        quantityLabel: "Quantity",
+        quantityPlaceholder: "1",
+        createSubmit: "Create Assignment",
+        updateSubmit: "Update Assignment",
+      },
+      fallback: {
+        missingValue: "N/A",
+      },
+    },
     recipients: {
       list: {
         title: "Recipients",
diff --git a/src/i18n/dictionaries/es.ts b/src/i18n/dictionaries/es.ts
index 0214d7c..abe45e6 100644
--- a/src/i18n/dictionaries/es.ts
+++ b/src/i18n/dictionaries/es.ts
@@ -259,6 +259,46 @@ export const es = {
         invalidUpdateStatus: "Estado inválido",
       },
     },
+    assignments: {
+      list: {
+        title: "Asignaciones",
+        addLabel: "Agregar asignación",
+        empty: "No se encontraron asignaciones.",
+        columns: {
+          recipient: "Destinatario",
+          item: "Artículo",
+          serialNumber: "Número de serie",
+          quantity: "Cantidad",
+          actions: "Acciones",
+        },
+        actions: {
+          edit: "Editar asignación",
+          return: "Devolver asignación",
+        },
+      },
+      new: {
+        title: "Nueva asignación",
+      },
+      edit: {
+        title: "Editar asignación",
+        notFound: "Asignación no encontrada",
+      },
+      form: {
+        recipientLabel: "Destinatario",
+        recipientPlaceholder: "Selecciona un destinatario",
+        itemLabel: "Artículo",
+        itemPlaceholder: "Selecciona un artículo",
+        assetLabel: "Activo",
+        assetPlaceholder: "Selecciona un activo",
+        quantityLabel: "Cantidad",
+        quantityPlaceholder: "1",
+        createSubmit: "Crear asignación",
+        updateSubmit: "Actualizar asignación",
+      },
+      fallback: {
+        missingValue: "No disponible",
+      },
+    },
     recipients: {
       list: {
         title: "Destinatarios",
diff --git a/tests/unit/app/assignments/assignment-form-pages.test.ts b/tests/unit/app/assignments/assignment-form-pages.test.ts
new file mode 100644
index 0000000..f2d6a41
--- /dev/null
+++ b/tests/unit/app/assignments/assignment-form-pages.test.ts
@@ -0,0 +1,177 @@
+import { renderToStaticMarkup } from "react-dom/server"
+import { beforeEach, describe, expect, it, vi } from "vitest"
+
+import { es } from "@/i18n/dictionaries/es"
+
+const mocks = vi.hoisted(() => ({
+  getI18n: vi.fn(),
+  findAllRecipients: vi.fn(),
+  findAllItemsWithStock: vi.fn(),
+  findAllAvailableAssets: vi.fn(),
+  findAllItems: vi.fn(),
+  findItemById: vi.fn(),
+  findAllAssets: vi.fn(),
+  findAssignmentById: vi.fn(),
+  createAssignment: vi.fn(),
+  updateAssignment: vi.fn(),
+  push: vi.fn(),
+  toastError: vi.fn(),
+  toastSuccess: vi.fn(),
+}))
+
+vi.mock("@/i18n/server", () => ({
+  getI18n: mocks.getI18n,
+}))
+
+vi.mock("@/services/recipient.service", () => ({
+  RecipientService: {
+    findAll: mocks.findAllRecipients,
+  },
+}))
+
+vi.mock("@/services/item.service", () => ({
+  ItemService: {
+    findAllWithStock: mocks.findAllItemsWithStock,
+    findAll: mocks.findAllItems,
+    findById: mocks.findItemById,
+  },
+}))
+
+vi.mock("@/services/asset.service", () => ({
+  AssetService: {
+    findAllAvailable: mocks.findAllAvailableAssets,
+    findAll: mocks.findAllAssets,
+  },
+}))
+
+vi.mock("@/services/assignment.service", () => ({
+  AssignmentService: {
+    findById: mocks.findAssignmentById,
+  },
+}))
+
+vi.mock("@/actions/assignment.actions", () => ({
+  createAssignment: mocks.createAssignment,
+  updateAssignment: mocks.updateAssignment,
+}))
+
+vi.mock("next/navigation", () => ({
+  useRouter: () => ({
+    push: mocks.push,
+  }),
+}))
+
+vi.mock("sonner", () => ({
+  toast: {
+    error: mocks.toastError,
+    success: mocks.toastSuccess,
+  },
+}))
+
+describe("assignment form pages localization", () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    mocks.getI18n.mockResolvedValue({ dictionary: es, locale: "es" })
+    mocks.findAllRecipients.mockResolvedValue([
+      {
+        id: "recipient-1",
+        firstName: "Ada",
+        lastName: "Lovelace",
+      },
+    ])
+    mocks.findAllItemsWithStock.mockResolvedValue([
+      {
+        id: "item-1",
+        name: "Laptop",
+        stock: 5,
+      },
+    ])
+    mocks.findAllItems.mockResolvedValue([
+      {
+        id: "item-1",
+        name: "Laptop",
+        stock: 5,
+      },
+    ])
+    mocks.findAllAvailableAssets.mockResolvedValue([
+      {
+        id: "asset-1",
+        itemId: "item-1",
+        serialNumber: "SN-001",
+      },
+    ])
+    mocks.findAllAssets.mockResolvedValue([
+      {
+        id: "asset-1",
+        itemId: "item-1",
+        serialNumber: "SN-001",
+      },
+    ])
+    mocks.findItemById.mockResolvedValue({
+      id: "item-1",
+      name: "Laptop",
+      stock: 5,
+    })
+  })
+
+  it("renders the new assignment page with localized heading and form copy", async () => {
+    const { default: NewAssignmentPage } = await import(
+      "@/app/(dashboard)/assignments/new/page"
+    )
+
+    const html = renderToStaticMarkup(await NewAssignmentPage())
+
+    expect(html).toContain("Nueva asignación")
+    expect(html).toContain("Destinatario")
+    expect(html).toContain(
+      'option value="">Selecciona un destinatario</option>',
+    )
+    expect(html).toContain("Artículo")
+    expect(html).toContain('option value="">Selecciona un artículo</option>')
+    expect(html).toContain("Cantidad")
+    expect(html).toContain('placeholder="1"')
+    expect(html).toContain("Crear asignación")
+    expect(html).toContain("Ada Lovelace")
+    expect(html).toContain("Laptop")
+  })
+
+  it("renders the edit assignment page with localized heading, not-found copy, and submit text", async () => {
+    const { default: EditAssignmentPage } = await import(
+      "@/app/(dashboard)/assignments/[assignmentId]/edit/page"
+    )
+
+    mocks.findAssignmentById.mockResolvedValue({
+      id: "assignment-1",
+      recipientId: "recipient-1",
+      itemId: "item-1",
+      assetId: "asset-1",
+      quantity: 1,
+    })
+
+    const html = renderToStaticMarkup(
+      await EditAssignmentPage({
+        params: Promise.resolve({ assignmentId: "assignment-1" }),
+      }),
+    )
+
+    expect(html).toContain("Editar asignación")
+    expect(html).toContain("Destinatario")
+    expect(html).toContain("Artículo")
+    expect(html).toContain("Activo")
+    expect(html).toContain('option value="">Selecciona un activo</option>')
+    expect(html).toContain("Actualizar asignación")
+    expect(html).toContain("Ada Lovelace")
+    expect(html).toContain("Laptop")
+    expect(html).toContain("SN-001")
+
+    mocks.findAssignmentById.mockResolvedValueOnce(null)
+
+    const notFoundHtml = renderToStaticMarkup(
+      await EditAssignmentPage({
+        params: Promise.resolve({ assignmentId: "missing-assignment" }),
+      }),
+    )
+
+    expect(notFoundHtml).toContain("Asignación no encontrada")
+  })
+})
diff --git a/tests/unit/app/assignments/assignment-pages.test.ts b/tests/unit/app/assignments/assignment-pages.test.ts
new file mode 100644
index 0000000..0a088a5
--- /dev/null
+++ b/tests/unit/app/assignments/assignment-pages.test.ts
@@ -0,0 +1,124 @@
+import { createElement } from "react"
+import { renderToStaticMarkup } from "react-dom/server"
+import { beforeEach, describe, expect, it, vi } from "vitest"
+
+import { es } from "@/i18n/dictionaries/es"
+
+const mocks = vi.hoisted(() => ({
+  findAllWithRecipientPaginated: vi.fn(),
+  getI18n: vi.fn(),
+  refresh: vi.fn(),
+  returnAssignment: vi.fn(),
+  toastError: vi.fn(),
+  toastSuccess: vi.fn(),
+}))
+
+vi.mock("@/i18n/server", () => ({
+  getI18n: mocks.getI18n,
+}))
+
+vi.mock("@/services/assignment.service", () => ({
+  AssignmentService: {
+    findAllWithRecipientPaginated: mocks.findAllWithRecipientPaginated,
+  },
+}))
+
+vi.mock("@/actions/assignment.actions", () => ({
+  returnAssignment: mocks.returnAssignment,
+}))
+
+vi.mock("next/navigation", () => ({
+  useRouter: () => ({
+    refresh: mocks.refresh,
+  }),
+}))
+
+vi.mock("sonner", () => ({
+  toast: {
+    error: mocks.toastError,
+    success: mocks.toastSuccess,
+  },
+}))
+
+vi.mock("@/components/common/pageheader", () => ({
+  default: ({ title, addLabel }: { title: string; addLabel?: string }) =>
+    createElement(
+      "header",
+      null,
+      [title, addLabel].filter(Boolean).join(" | "),
+    ),
+}))
+
+vi.mock("@/components/common/pagination", () => ({
+  default: ({ totalPages }: { totalPages: number }) =>
+    createElement("nav", { "aria-label": "Pagination" }, totalPages),
+}))
+
+describe("assignment pages localization", () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    mocks.getI18n.mockResolvedValue({ dictionary: es, locale: "es" })
+  })
+
+  it("renders the assignment list in Spanish with localized action labels and unchanged assignment data", async () => {
+    const { default: AssignmentsPage } = await import(
+      "@/app/(dashboard)/assignments/page"
+    )
+
+    mocks.findAllWithRecipientPaginated.mockResolvedValue({
+      data: [
+        {
+          id: "assignment-1",
+          quantity: 2,
+          recipient: {
+            id: "recipient-1",
+            firstName: "Ada",
+            lastName: "Lovelace",
+          },
+          item: {
+            id: "item-1",
+            name: "Laptop",
+          },
+          asset: {
+            serialNumber: null,
+          },
+        },
+      ],
+      totalPages: 1,
+    })
+
+    const html = renderToStaticMarkup(
+      await AssignmentsPage({ searchParams: Promise.resolve({}) }),
+    )
+
+    expect(html).toContain("Asignaciones")
+    expect(html).toContain("Agregar asignación")
+    expect(html).toContain("Destinatario")
+    expect(html).toContain("Artículo")
+    expect(html).toContain("Número de serie")
+    expect(html).toContain("Cantidad")
+    expect(html).toContain("Acciones")
+    expect(html).toContain("Ada Lovelace")
+    expect(html).toContain("Laptop")
+    expect(html).toContain("No disponible")
+    expect(html).toContain('aria-label="Editar asignación"')
+    expect(html).toContain('aria-label="Devolver asignación"')
+  })
+
+  it("renders the localized assignment empty state when no assignments exist", async () => {
+    const { default: AssignmentsPage } = await import(
+      "@/app/(dashboard)/assignments/page"
+    )
+
+    mocks.findAllWithRecipientPaginated.mockResolvedValue({
+      data: [],
+      totalPages: 0,
+    })
+
+    const html = renderToStaticMarkup(
+      await AssignmentsPage({ searchParams: Promise.resolve({}) }),
+    )
+
+    expect(html).toContain("No se encontraron asignaciones.")
+  })
+})
diff --git a/tests/unit/app/recipients/recipient-pages.test.ts b/tests/unit/app/recipients/recipient-pages.test.ts
index a0bf867..918969c 100644
--- a/tests/unit/app/recipients/recipient-pages.test.ts
+++ b/tests/unit/app/recipients/recipient-pages.test.ts
@@ -104,7 +104,7 @@ describe("recipient pages localization", () => {
     expect(html).toContain("No se encontraron destinatarios.")
   })
 
-  it("renders localized recipient-owned detail labels and keeps assignments copy unchanged", async () => {
+  it("renders localized recipient-owned detail labels and localizes the embedded assignments title only", async () => {
     const { default: RecipientInfoPage } = await import(
       "@/app/(dashboard)/recipients/[recipientId]/page"
     )
@@ -140,10 +140,10 @@ describe("recipient pages localization", () => {
     expect(html).toContain("Chofer")
     expect(html).toContain("ada")
     expect(html).toContain("ada@example.test")
-    expect(html).toContain("Assignments")
+    expect(html).toContain("Asignaciones")
     expect(html).toContain("Laptop")
     expect(html).not.toContain(">DRIVER<")
-    expect(html).not.toContain("Asignaciones")
+    expect(html).not.toContain("Assignments")
   })
 
   it("renders a localized recipient detail not-found message", async () => {
diff --git a/tests/unit/i18n/dictionaries.test.ts b/tests/unit/i18n/dictionaries.test.ts
index d2e6b99..b05a2a5 100644
--- a/tests/unit/i18n/dictionaries.test.ts
+++ b/tests/unit/i18n/dictionaries.test.ts
@@ -408,6 +408,90 @@ describe("i18n dictionaries", () => {
     })
   })
 
+  it("provides localized assignment copy for English and Spanish", () => {
+    expect(getDictionary("en").inventory.assignments).toEqual({
+      list: {
+        title: "Assignments",
+        addLabel: "Add Assignment",
+        empty: "No assignments found.",
+        columns: {
+          recipient: "Recipient",
+          item: "Item",
+          serialNumber: "Serial Number",
+          quantity: "Quantity",
+          actions: "Actions",
+        },
+        actions: {
+          edit: "Edit assignment",
+          return: "Return assignment",
+        },
+      },
+      new: {
+        title: "New Assignment",
+      },
+      edit: {
+        title: "Edit Assignment",
+        notFound: "Assignment not found",
+      },
+      form: {
+        recipientLabel: "Recipient",
+        recipientPlaceholder: "Select a recipient",
+        itemLabel: "Item",
+        itemPlaceholder: "Select an item",
+        assetLabel: "Asset",
+        assetPlaceholder: "Select an asset",
+        quantityLabel: "Quantity",
+        quantityPlaceholder: "1",
+        createSubmit: "Create Assignment",
+        updateSubmit: "Update Assignment",
+      },
+      fallback: {
+        missingValue: "N/A",
+      },
+    })
+
+    expect(getDictionary("es").inventory.assignments).toEqual({
+      list: {
+        title: "Asignaciones",
+        addLabel: "Agregar asignación",
+        empty: "No se encontraron asignaciones.",
+        columns: {
+          recipient: "Destinatario",
+          item: "Artículo",
+          serialNumber: "Número de serie",
+          quantity: "Cantidad",
+          actions: "Acciones",
+        },
+        actions: {
+          edit: "Editar asignación",
+          return: "Devolver asignación",
+        },
+      },
+      new: {
+        title: "Nueva asignación",
+      },
+      edit: {
+        title: "Editar asignación",
+        notFound: "Asignación no encontrada",
+      },
+      form: {
+        recipientLabel: "Destinatario",
+        recipientPlaceholder: "Selecciona un destinatario",
+        itemLabel: "Artículo",
+        itemPlaceholder: "Selecciona un artículo",
+        assetLabel: "Activo",
+        assetPlaceholder: "Selecciona un activo",
+        quantityLabel: "Cantidad",
+        quantityPlaceholder: "1",
+        createSubmit: "Crear asignación",
+        updateSubmit: "Actualizar asignación",
+      },
+      fallback: {
+        missingValue: "No disponible",
+      },
+    })
+  })
+
   it("provides localized inventory asset UI copy for English and Spanish", () => {
     expect(getDictionary("en").inventory.assets).toEqual({
       list: {