import { test, expect } from '@playwright/test';

const FRONTEND_URL = 'http://localhost:3000';

test.describe('Cross-app: Admin changes appear on Frontend', () => {
  test('new published post appears on frontend homepage', async ({ page }) => {
    const uid = Date.now().toString(36);
    const postTitle = `E2E Cross Post ${uid}`;

    // --- CREATE PUBLISHED POST IN ADMIN ---
    await page.goto('/posts/new');
    await expect(page.locator('h1')).toContainText('New Post');

    await page.locator('#title').fill(postTitle);

    const editor = page.locator('.ProseMirror');
    await editor.click();
    await editor.fill('Cross-app E2E test content for verification on the frontend.');

    await page.locator('#category').fill('E2E Cross');

    // Set status to published so it appears on the public frontend
    const statusSelect = page.locator('select').first();
    await statusSelect.selectOption('published');

    await page.getByRole('button', { name: 'Create post' }).click();
    await expect(page.locator('h1')).toContainText('Edit Post', { timeout: 15_000 });

    // --- VERIFY ON FRONTEND ---
    await page.goto(FRONTEND_URL, { waitUntil: 'networkidle' });

    // The NewsSection fetches featured/recent posts; our new published post should appear
    await expect(page.getByText(postTitle)).toBeVisible({ timeout: 15_000 });

    // --- CLEANUP: delete the post via admin ---
    await page.goto('/posts');
    await expect(page.getByText(postTitle)).toBeVisible({ timeout: 10_000 });
    const row = page.locator('tr', { has: page.getByText(postTitle, { exact: false }) });
    await row.locator('button').filter({ has: page.locator('svg') }).last().click();
    await expect(page.getByText('Delete confirmation')).toBeVisible();
    await page.locator('.fixed button', { hasText: 'Delete' }).last().click();
    await expect(page.getByText(/deleted/i)).toBeVisible({ timeout: 10_000 });
  });

  test('new service appears on frontend homepage', async ({ page }) => {
    const uid = Date.now().toString(36);
    const serviceTitle = `E2E Cross Service ${uid}`;

    // --- CREATE SERVICE IN ADMIN ---
    await page.goto('/services/new');
    await expect(page.locator('h1')).toContainText('New Service');

    await page.locator('#title').fill(serviceTitle);
    await page.locator('#short-description').fill('Cross-app test service description.');
    await page.locator('#full-description').fill('Full description for cross-app E2E test.');

    // Ensure status is active (default)
    await page.getByRole('button', { name: 'Create service' }).click();
    await expect(page.locator('h1')).toContainText('Edit Service', { timeout: 15_000 });

    // --- VERIFY ON FRONTEND ---
    await page.goto(FRONTEND_URL, { waitUntil: 'networkidle' });

    // The ServicesSection fetches active services from the API
    await expect(page.getByText(serviceTitle)).toBeVisible({ timeout: 15_000 });

    // --- CLEANUP: delete the service via admin ---
    await page.goto('/services');
    await expect(page.getByText(serviceTitle)).toBeVisible({ timeout: 10_000 });
    const row = page.locator('tr', { has: page.getByText(serviceTitle, { exact: false }) });
    const actionsCell = row.locator('td').last();
    await actionsCell.locator('button').last().click();
    await expect(page.getByText('Delete confirmation')).toBeVisible();
    await page.locator('.fixed button', { hasText: 'Delete' }).last().click();
    await expect(page.getByText(/deleted/i)).toBeVisible({ timeout: 10_000 });
  });

  test('updated hero title appears on frontend', async ({ page }) => {
    // --- READ CURRENT SETTINGS ---
    await page.goto('/settings');
    await expect(page.locator('h1')).toContainText('Site Settings');

    const heroTitleInput = page.locator('#title').first();
    await expect(heroTitleInput).toBeVisible({ timeout: 10_000 });
    const originalTitle = await heroTitleInput.inputValue();

    const testTitle = `E2E Hero Title ${Date.now()}`;

    // --- UPDATE HERO TITLE IN ADMIN ---
    await heroTitleInput.clear();
    await heroTitleInput.fill(testTitle);

    await page.getByRole('button', { name: 'Save all settings' }).first().click();
    await expect(page.getByText('Settings saved')).toBeVisible({ timeout: 10_000 });

    // --- VERIFY ON FRONTEND ---
    await page.goto(FRONTEND_URL, { waitUntil: 'networkidle' });
    await expect(page.getByText(testTitle)).toBeVisible({ timeout: 15_000 });

    // --- RESTORE ORIGINAL TITLE ---
    await page.goto('/settings');
    await expect(page.locator('h1')).toContainText('Site Settings');

    const titleInput = page.locator('#title').first();
    await expect(titleInput).toBeVisible({ timeout: 10_000 });
    await titleInput.clear();
    await titleInput.fill(originalTitle);

    await page.getByRole('button', { name: 'Save all settings' }).first().click();
    await expect(page.getByText('Settings saved')).toBeVisible({ timeout: 10_000 });
  });
});
