stock-manager/tests/unit/app/users/user-form-pages.test.ts

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(() => ({
  createPersonUser: vi.fn(),
  getUserProfileById: vi.fn(),
  getI18n: vi.fn(),
  push: vi.fn(),
  toastError: vi.fn(),
  toastSuccess: vi.fn(),
}))

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

vi.mock("@/actions/person.actions", () => ({
  createPersonUserAction: mocks.createPersonUser,
}))

vi.mock("@/actions/user.actions", () => ({
  updateUserAction: vi.fn(),
  resetUserPasswordAction: vi.fn(),
}))

vi.mock("@/services/person.service", () => ({
  PersonService: {
    findById: vi.fn(),
  },
}))

vi.mock("@/services/user.service", () => ({
  getUserProfileById: mocks.getUserProfileById,
}))

vi.mock("next/navigation", () => ({
  useRouter: () => ({
    push: mocks.push,
  }),
  notFound: () => {
    throw new Error("NOT_FOUND")
  },
}))

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

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

  it("renders new user page with localized title and unified form labels in Spanish", async () => {
    const { default: NewUserPage } = await import(
      "@/app/(dashboard)/admin/users/new/page"
    )

    const html = renderToStaticMarkup(await NewUserPage())

    // Title
    expect(html).toContain("Nuevo usuario")

    // Person field labels
    expect(html).toContain("Nombre")
    expect(html).toContain("Apellido")
    expect(html).toContain("Departamento")
    expect(html).toContain("Teléfono")

    // User field labels
    expect(html).toContain("Correo electrónico")
    expect(html).toContain("Contraseña")
    expect(html).toContain("Rol")

    // Role labels (display) with canonical values
    expect(html).toContain("Administrador")
    expect(html).toContain("Gerente")
    expect(html).toContain("Personal")
    expect(html).toContain("Visor")
    expect(html).toContain("Sin cuenta de usuario")

    // Submit button text
    expect(html).toContain("Crear usuario")
  })

  it("renders new user page with English unified form labels in English locale", async () => {
    mocks.getI18n.mockResolvedValue({ dictionary: en, locale: "en" })

    const { default: NewUserPage } = await import(
      "@/app/(dashboard)/admin/users/new/page"
    )

    const html = renderToStaticMarkup(await NewUserPage())

    expect(html).toContain("New User")

    // Person fields
    expect(html).toContain("First Name")
    expect(html).toContain("Last Name")
    expect(html).toContain("Department")
    expect(html).toContain("Phone")

    // User fields
    expect(html).toContain("Email")
    expect(html).toContain("Password")
    expect(html).toContain("Role")

    expect(html).toContain("Create User")
    expect(html).toContain("Admin")
    expect(html).toContain("Manager")
    expect(html).toContain("Staff")
    expect(html).toContain("Viewer")
    expect(html).toContain("No user account")
  })

  it("keeps canonical role values in option value attributes including NO_USER, not localized labels", async () => {
    const { default: NewUserPage } = await import(
      "@/app/(dashboard)/admin/users/new/page"
    )

    const html = renderToStaticMarkup(await NewUserPage())

    // Canonical values must be in value attributes
    expect(html).toContain('value="ADMIN"')
    expect(html).toContain('value="MANAGER"')
    expect(html).toContain('value="STAFF"')
    expect(html).toContain('value="VIEWER"')
    expect(html).toContain('value="NO_USER"')
  })
})

describe("edit user form localization", () => {
  beforeEach(() => {
    vi.clearAllMocks()
    mocks.getI18n.mockResolvedValue({ dictionary: es, locale: "es" })
    mocks.getUserProfileById.mockResolvedValue({
      id: "user-1",
      name: "Ada Lovelace",
      email: "ada@example.test",
      role: "ADMIN",
      isActive: true,
    })
  })

  it("renders edit user page with localized title, form labels, and reset-password section in Spanish", async () => {
    const { default: EditUserPage } = await import(
      "@/app/(dashboard)/admin/users/[userId]/edit/page"
    )

    const html = renderToStaticMarkup(
      await EditUserPage({
        params: Promise.resolve({ userId: "user-1" }),
      }),
    )

    // Title
    expect(html).toContain("Editar usuario")

    // Form labels
    expect(html).toContain("Nombre")
    expect(html).toContain("Nueva contraseña")

    // Role labels with canonical values
    expect(html).toContain("Administrador")
    expect(html).toContain('value="ADMIN"')

    // Active user checkbox label
    expect(html).toContain("Usuario activo")

    // Submit button
    expect(html).toContain("Actualizar usuario")

    // Reset password section
    expect(html).toContain("Restablecer contraseña")
    expect(html).toContain("Nueva contraseña")
    expect(html).toContain("Mínimo 8 caracteres")
  })

  it("renders edit user page with English labels in English locale", async () => {
    mocks.getI18n.mockResolvedValue({ dictionary: en, locale: "en" })

    const { default: EditUserPage } = await import(
      "@/app/(dashboard)/admin/users/[userId]/edit/page"
    )

    const html = renderToStaticMarkup(
      await EditUserPage({
        params: Promise.resolve({ userId: "user-1" }),
      }),
    )

    expect(html).toContain("Edit User")
    expect(html).toContain("Active user")
    expect(html).toContain("Update User")
    expect(html).toContain("Reset password")
    expect(html).toContain("New password")
    expect(html).toContain("Reset Password")
  })

  it("renders edit user form with role option values as canonical enums regardless of locale", async () => {
    const { default: EditUserPage } = await import(
      "@/app/(dashboard)/admin/users/[userId]/edit/page"
    )

    const html = renderToStaticMarkup(
      await EditUserPage({
        params: Promise.resolve({ userId: "user-1" }),
      }),
    )

    // Canonical role values
    expect(html).toContain('value="ADMIN"')
    expect(html).toContain('value="MANAGER"')
    expect(html).toContain('value="STAFF"')
    expect(html).toContain('value="VIEWER"')

    // Spanish labels for roles
    expect(html).toContain("Administrador")
  })
})