import { renderToStaticMarkup } from "react-dom/server"
import { beforeEach, describe, expect, it, vi } from "vitest"

import { en } from "@/i18n/dictionaries/en"
import { es } from "@/i18n/dictionaries/es"

const mocks = vi.hoisted(() => ({
  getI18n: vi.fn(),
  findById: vi.fn(),
  createNewRecipient: vi.fn(),
  updateRecipient: vi.fn(),
  push: vi.fn(),
  toastError: vi.fn(),
  toastSuccess: vi.fn(),
}))

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

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

vi.mock("@/actions/recipient.actions", () => ({
  createNewRecipient: mocks.createNewRecipient,
  updateRecipient: mocks.updateRecipient,
}))

vi.mock("next/navigation", () => ({
  useRouter: () => ({
    push: mocks.push,
  }),
}))

vi.mock("sonner", () => ({
  toast: {
    error: mocks.toastError,
    success: mocks.toastSuccess,
  },
}))

describe("recipient form pages localization", () => {
  beforeEach(() => {
    vi.clearAllMocks()
    mocks.getI18n.mockResolvedValue({ dictionary: es, locale: "es" })
  })

  it("renders the new recipient page with localized form copy and canonical department option values", async () => {
    const { default: NewRecipientPage } = await import(
      "@/app/(dashboard)/recipients/new/page"
    )

    const html = renderToStaticMarkup(await NewRecipientPage())

    expect(html).toContain("Agregar destinatario")
    expect(html).toContain("Usuario")
    expect(html).toContain('placeholder="Usuario"')
    expect(html).toContain("Nombre")
    expect(html).toContain("Apellido")
    expect(html).toContain("Selecciona un departamento")
    expect(html).toContain('option value="ENGINEERING"')
    expect(html).toContain(">Ingeniería</option>")
    expect(html).toContain("Correo electrónico")
    expect(html).toContain("Teléfono")
    expect(html).toContain("Crear destinatario")
  })

  it("renders the edit recipient page with localized heading and submit text", async () => {
    const { default: RecipientEditPage } = await import(
      "@/app/(dashboard)/recipients/[recipientId]/edit/page"
    )

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

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

    expect(html).toContain("Editar destinatario")
    expect(html).toContain("Actualizar destinatario")
    expect(html).toContain('placeholder="Correo electrónico"')
    expect(html).toContain(">Ingeniería</option>")
  })

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

    mocks.findById.mockResolvedValue(null)

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

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

  it("wires English recipient form submit copy through the new page", async () => {
    const { default: NewRecipientPage } = await import(
      "@/app/(dashboard)/recipients/new/page"
    )

    mocks.getI18n.mockResolvedValueOnce({ dictionary: en, locale: "en" })

    const html = renderToStaticMarkup(await NewRecipientPage())

    expect(html).toContain("Create Recipient")
  })
})