import path from 'path';
import { test, expect, type Page } from '@playwright/test';
import { BASE_URL, ADMIN, FINANCE, loginAs } from '../helpers';

const TEST_IMAGE = path.join(__dirname, '..', 'fixtures', 'test-banner.png');

// Administration ▸ Live Racing Banners: the same SiteBanner CRUD as Site
// Banners, with placement = live_racing. Shown in the Live Racing video slot
// while an event has no stream video (see front/live_racing_banner.spec.ts).

async function rowIdByTitle(page: Page, title: string): Promise<string> {
    const row = page.locator('[data-testid^="site-banner-row-"]', { hasText: title });
    await expect(row).toHaveCount(1);
    return ((await row.getAttribute('data-testid')) ?? '').replace('site-banner-row-', '');
}

test.describe('WFBO Live Racing Banners', () => {

    test('admin manages Live Racing banners separately from Site Banners', async ({ page }) => {
        const title = `LR Banner ${Date.now()}`;
        await loginAs(page, ADMIN.mobile, ADMIN.password);

        // Reachable from Administration ▸ Live Racing Banners
        await page.goto(`${BASE_URL}/wfbo`);
        await page.locator('button[aria-controls="admin-group-body"]').click();
        await page.locator('[data-testid="wfbo-nav-lr-banners"]').click();
        await expect(page).toHaveURL(/\/wfbo\/lr-banners$/);
        await expect(page.locator('[data-testid="wfbo-nav-lr-banners"]')).toHaveClass(/is-active/);
        await expect(page.locator('body')).toContainText('while an event has no stream video');

        // Create
        await page.click('[data-testid="btn-new-site-banner"]');
        await expect(page).toHaveURL(/\/wfbo\/lr-banners\/new$/);
        await expect(page.locator('body')).toContainText('Wide 16:9 image');
        await page.fill('[data-testid="input-title"]', title);
        await page.setInputFiles('[data-testid="input-image"]', TEST_IMAGE);
        await page.fill('[data-testid="input-link-url"]', 'https://example.com/lr-promo');
        await page.click('[data-testid="btn-submit"]');

        await expect(page).toHaveURL(/\/wfbo\/lr-banners$/);
        await expect(page.locator('[data-testid="flash-success"]').filter({ hasText: 'Live Racing banner added.' })).toHaveCount(1);
        const id = await rowIdByTitle(page, title);
        await expect(page.locator(`[data-testid="badge-status-${id}"]`)).toHaveText('Enabled');

        // Not listed under the home-page Site Banners, and not editable there.
        await page.goto(`${BASE_URL}/wfbo/site-banners`);
        await expect(page.locator('[data-testid^="site-banner-row-"]', { hasText: title })).toHaveCount(0);
        const cross = await page.goto(`${BASE_URL}/wfbo/site-banners/${id}/edit`);
        expect(cross?.status()).toBe(404);

        // Hide
        await page.goto(`${BASE_URL}/wfbo/lr-banners`);
        page.once('dialog', (d) => d.accept());
        await page.click(`[data-testid="btn-toggle-${id}"]`);
        await expect(page.locator(`[data-testid="badge-status-${id}"]`)).toHaveText('Disabled');

        // Edit
        await page.click(`[data-testid="btn-edit-${id}"]`);
        await expect(page).toHaveURL(new RegExp(`/wfbo/lr-banners/${id}/edit$`));
        await page.fill('[data-testid="input-title"]', `${title} (edited)`);
        await page.click('[data-testid="btn-submit"]');
        await expect(page).toHaveURL(/\/wfbo\/lr-banners$/);
        await expect(page.locator(`[data-testid="site-banner-row-${id}"]`)).toContainText(`${title} (edited)`);

        // Delete
        page.once('dialog', (d) => d.accept());
        await page.click(`[data-testid="btn-delete-${id}"]`);
        await expect(page.locator(`[data-testid="site-banner-row-${id}"]`)).toHaveCount(0);
    });

    test('finance-only user cannot open Live Racing banners', async ({ page }) => {
        await loginAs(page, FINANCE.mobile, FINANCE.password);
        await page.goto(`${BASE_URL}/wfbo/lr-banners`);
        await expect(page.locator('[data-testid="wfbo-sidebar"]')).not.toBeVisible();
    });

});