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(() => ({
  findAllPaginated: vi.fn(),
  findById: vi.fn(),
  findAllByRecipient: vi.fn(),
  getI18n: vi.fn(),
}))

vi.mock("@/i18n/server", () => ({
  getI18n: mocks.getI18n,
}))

vi.mock("@/services/recipient.service", () => ({
  RecipientService: {
    findAllPaginated: mocks.findAllPaginated,
    findById: mocks.findById,
  },
}))

vi.mock("@/services/assignment.service", () => ({
  AssignmentService: {
    findAllByRecipient: mocks.findAllByRecipient,
  },
}))

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("recipient pages localization", () => {
  beforeEach(() => {
    vi.clearAllMocks()
    mocks.getI18n.mockResolvedValue({ dictionary: es, locale: "es" })
  })

  it("renders the recipient list in Spanish while keeping stored department values display-only", async () => {
    const { default: RecipientsPage } = await import(
      "@/app/(dashboard)/recipients/page"
    )

    mocks.findAllPaginated.mockResolvedValue({
      data: [
        {
          id: "recipient-1",
          username: "ada",
          firstName: "Ada",
          lastName: "Lovelace",
          email: "ada@example.test",
          phone: "1234",
          department: "ENGINEERING",
        },
      ],
      totalPages: 1,
    })

    const html = renderToStaticMarkup(
      await RecipientsPage({ searchParams: Promise.resolve({}) }),
    )

    expect(html).toContain("Destinatarios")
    expect(html).toContain("Agregar destinatario")
    expect(html).toContain("Usuario")
    expect(html).toContain("Nombre")
    expect(html).toContain("Correo electrónico")
    expect(html).toContain("Teléfono")
    expect(html).toContain("Departamento")
    expect(html).toContain("Acciones")
    expect(html).toContain("Ada Lovelace")
    expect(html).toContain("Ingeniería")
    expect(html).toContain('aria-label="Ver destinatario"')
    expect(html).toContain('aria-label="Editar destinatario"')
    expect(html).not.toContain(">ENGINEERING<")
  })

  it("renders the localized recipient empty state when no recipients exist", async () => {
    const { default: RecipientsPage } = await import(
      "@/app/(dashboard)/recipients/page"
    )

    mocks.findAllPaginated.mockResolvedValue({
      data: [],
      totalPages: 0,
    })

    const html = renderToStaticMarkup(
      await RecipientsPage({ searchParams: Promise.resolve({}) }),
    )

    expect(html).toContain("No se encontraron destinatarios.")
  })

  it("renders localized recipient-owned detail labels and keeps assignments copy unchanged", async () => {
    const { default: RecipientInfoPage } = await import(
      "@/app/(dashboard)/recipients/[recipientId]/page"
    )

    mocks.findById.mockResolvedValue({
      id: "recipient-1",
      username: "ada",
      firstName: "Ada",
      lastName: "Lovelace",
      email: "ada@example.test",
      phone: "1234",
      department: "DRIVER",
    })
    mocks.findAllByRecipient.mockResolvedValue([
      {
        id: "assignment-1",
        item: { name: "Laptop" },
        asset: { serialNumber: "SN-001" },
        quantity: 1,
      },
    ])

    const html = renderToStaticMarkup(
      await RecipientInfoPage({
        params: Promise.resolve({ recipientId: "recipient-1" }),
      }),
    )

    expect(html).toContain("Usuario")
    expect(html).toContain("Correo electrónico")
    expect(html).toContain("Teléfono")
    expect(html).toContain("Departamento")
    expect(html).toContain("Chofer")
    expect(html).toContain("ada")
    expect(html).toContain("ada@example.test")
    expect(html).toContain("Assignments")
    expect(html).toContain("Laptop")
    expect(html).not.toContain(">DRIVER<")
    expect(html).not.toContain("Asignaciones")
  })

  it("renders a localized recipient detail not-found message", async () => {
    const { default: RecipientInfoPage } = await import(
      "@/app/(dashboard)/recipients/[recipientId]/page"
    )

    mocks.findById.mockResolvedValue(null)
    mocks.findAllByRecipient.mockResolvedValue([])

    const html = renderToStaticMarkup(
      await RecipientInfoPage({
        params: Promise.resolve({ recipientId: "missing-recipient" }),
      }),
    )

    expect(html).toContain("Destinatario no encontrado")
  })
})