// @vitest-environment jsdom
//
// About page (`/about` = en, `/de/about` = de). Same shape as the home test:
// localized meta() read from the real catalog + localized body render via a
// mocked @voltro/i18n that resolves against the real catalogs.

import { afterEach, describe, expect, test, vi } from 'vitest'
import { act, createElement, type ReactNode } from 'react'
import { createRoot, type Root } from 'react-dom/client'
import en from '../../locales/en'
import de from '../../locales/de'

const catalogs: Record<string, Record<string, string>> = { en, de }
let currentLocale = 'en'

vi.mock('@voltro/i18n', () => ({
  // The locale catalogs call these at module top-level; identity mirrors the
  // real (compile-time-only) implementations so importing them doesn't throw.
  defineCatalog: <T,>(c: T): T => c,
  defineLocale:
    () =>
    <T,>(c: T): T =>
      c,
  T: ({ id }: { id: string }) => catalogs[currentLocale]?.[id] ?? id,
}))

const { default: About, meta, renderMode } = await import('./page')

;(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true

let container: HTMLDivElement
let root: Root

const render = (node: ReactNode): void => {
  container = document.createElement('div')
  document.body.appendChild(container)
  act(() => {
    root = createRoot(container)
    root.render(node)
  })
}

afterEach(() => {
  currentLocale = 'en'
  if (root) act(() => root.unmount())
  container?.remove()
  document.body.innerHTML = ''
})

describe('about — config + localized meta', () => {
  test('is a static page', () => {
    expect(renderMode).toBe('static')
  })

  test('meta() is localized per locale', () => {
    expect(meta({ locale: 'en' }).title).toBe('About — Voltro i18n')
    expect(meta({ locale: 'de' }).title).toBe('Über — Voltro i18n')
  })
})

describe('about — localized render', () => {
  test('renders the English title + body for locale en', () => {
    currentLocale = 'en'
    render(createElement(About))
    expect(container.querySelector('h1')!.textContent).toBe('About this template')
    expect(container.textContent).toContain('URL-prefix i18n strategy')
  })

  test('renders the German title + body for locale de', () => {
    currentLocale = 'de'
    render(createElement(About))
    expect(container.querySelector('h1')!.textContent).toBe('Über dieses Template')
    expect(container.textContent).toContain('URL-Prefix-i18n-Strategie')
  })
})