import { test, expect } from './helpers/fixtures.js'

const WHITELISTED_KEYS = ['homepage.wiki_feature']

test.describe('Admin site content page', () => {
  test('page loads for admin', async ({ adminPage }) => {
    await adminPage.goto('/admin/site-content')
    await expect(adminPage.getByRole('heading', { name: 'Site Content' })).toBeVisible({
      timeout: 15000,
    })
  })

  test('renders one block per whitelisted key', async ({ adminPage }) => {
    await adminPage.goto('/admin/site-content')
    await adminPage.waitForLoadState('networkidle')
    await expect(adminPage.getByRole('heading', { name: 'Site Content' })).toBeVisible({
      timeout: 15000,
    })

    const blocks = adminPage.locator('.content-block')
    await expect(blocks).toHaveCount(WHITELISTED_KEYS.length)

    for (const key of WHITELISTED_KEYS) {
      await expect(adminPage.locator('.block-key', { hasText: key })).toBeVisible()
    }
  })

  test('edit, save, persist, and reflect on public page', async ({ adminPage }) => {
    const key = 'homepage.wiki_feature'

    await adminPage.goto('/admin/site-content')
    await adminPage.waitForLoadState('networkidle')
    await expect(adminPage.getByRole('heading', { name: 'Site Content' })).toBeVisible({
      timeout: 15000,
    })

    const original = await adminPage.evaluate(
      async (k) => await (await fetch(`/api/site-content/${k}`)).json(),
      key,
    )
    const originalTitle = original.title || ''
    const originalBody = original.body || ''

    const stamp = Date.now()
    const newTitle = `e2e title ${stamp}`
    const newBody = `e2e body paragraph ${stamp}`

    const block = adminPage.locator('.content-block', {
      has: adminPage.locator('.block-key', { hasText: key }),
    })
    await expect(block).toBeVisible()

    const titleInput = block.locator('input[type="text"]')
    const bodyTextarea = block.locator('textarea')

    await titleInput.fill(newTitle)
    await bodyTextarea.fill(newBody)
    await block.getByRole('button', { name: 'Save' }).click()

    await expect(block.locator('.block-meta')).toContainText('Updated', { timeout: 10000 })

    await adminPage.reload()
    await adminPage.waitForLoadState('networkidle')
    const reloadedBlock = adminPage.locator('.content-block', {
      has: adminPage.locator('.block-key', { hasText: key }),
    })
    await expect(reloadedBlock.locator('input[type="text"]')).toHaveValue(newTitle)
    await expect(reloadedBlock.locator('textarea')).toHaveValue(newBody)

    await adminPage.goto('/')
    await adminPage.waitForLoadState('networkidle')
    await expect(adminPage.getByText(newBody)).toBeVisible({ timeout: 15000 })

    await adminPage.evaluate(
      async ({ k, t, b }) => {
        await fetch(`/api/admin/site-content/${k}`, {
          method: 'PUT',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({ title: t, body: b }),
        })
      },
      { k: key, t: originalTitle, b: originalBody },
    )
  })
})