import { test, expect } from '@playwright/test';
import {
    BASE_URL,
    USER,
    ADMIN,
    loginAs,
    ensureLiveRacingEnabled,
    createArena,
    createEventShowUrl,
    addRace,
    addHorses,
    offerMultiBetTypeCombos,
    publishEvent,
} from '../helpers';

// The bet slip's "Race" row for a multi-race bet is a compact label: two legs
// read "Race 1 & 2" (Daily / Extra Double), three or more a first-last range
// "Race 1 - 4" (Daily Double + 1, Pick 4/5/6, WTA) - on the combo tabs too.
// See populateSummary() and .wizard-combo-tab in
// templates/play/live-racing/event.html.twig.

test.describe('Live Racing wizard — multi-race bet slip race label', () => {
    test.setTimeout(240_000);

    test('shows "Race A & B" for two legs and "Race first - last" for three or more', async ({ page }) => {
        await loginAs(page, ADMIN.mobile, ADMIN.password);
        await ensureLiveRacingEnabled(page);

        const arena = await createArena(page, 'LRRaceLabel', {
            daily_double: '10',
            extra_double: '10',
            daily_double_plus_1: '10',
            pick_4: '10',
        });
        const { eventUrl, eventId } = await createEventShowUrl(page, arena);
        // Add every race before any horses - addRace() finds its row by race
        // number text, which a sibling row's horse count could also match.
        const races = [];
        for (let n = 1; n <= 4; n++) {
            races.push(await addRace(page, eventUrl, n));
        }
        for (const race of races) {
            await addHorses(page, race.raceUrl, 2);
        }
        const [r1, r2, r3, r4] = races.map(race => race.raceId);
        // Two Daily Double and two DD+1 combos so their combo tabs render too.
        await offerMultiBetTypeCombos(page, eventUrl, 'daily_double', [[r1, r2], [r3, r4]]);
        await offerMultiBetTypeCombos(page, eventUrl, 'extra_double', [[r1, r3]]);
        await offerMultiBetTypeCombos(page, eventUrl, 'daily_double_plus_1', [[r1, r2, r3], [r2, r3, r4]]);
        await offerMultiBetTypeCombos(page, eventUrl, 'pick_4', [[r1, r2, r3, r4]]);
        await publishEvent(page, eventUrl);

        await loginAs(page, USER.mobile, USER.password);
        await page.goto(`${BASE_URL}/play/live-racing/${eventId}`);

        const expected: Record<string, string> = {
            daily_double: 'Race 1 & 2',
            extra_double: 'Race 1 & 3',
            daily_double_plus_1: 'Race 1 - 3',
            pick_4: 'Race 1 - 4',
        };
        for (const [key, label] of Object.entries(expected)) {
            await page.click(`[data-testid="tab-bet-key-${key}"]`);
            await expect(page.locator('[data-testid="wizard-summary-race"]')).toHaveText(label);
        }

        // Combo tabs use the same compact label.
        await page.click('[data-testid="tab-bet-key-daily_double"]');
        await expect(page.locator('[data-testid="wizard-combo-tabs-daily_double"] .wizard-combo-tab > span:not(.wizard-combo-tab__status)'))
            .toHaveText(['Race 1 & 2', 'Race 3 & 4']);
        await page.click('[data-testid="tab-bet-key-daily_double_plus_1"]');
        await expect(page.locator('[data-testid="wizard-combo-tabs-daily_double_plus_1"] .wizard-combo-tab > span:not(.wizard-combo-tab__status)'))
            .toHaveText(['Race 1 - 3', 'Race 2 - 4']);
    });
});