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

test.describe('WFBO Agent Commissions Tab', () => {

    /**
     * Iterates WFBO user rows and returns the URL for the first user whose
     * transactions page shows the Commissions tab (i.e. a Master Agent or Agent).
     */
    async function findAgentTransactionsUrl(page: Page): Promise<string | null> {
        await page.goto(`${BASE_URL}/wfbo/users`);
        const rows = page.locator('[data-testid^="user-row-"]');
        const count = await rows.count();

        const rowIds: string[] = [];
        for (let i = 0; i < count; i++) {
            const rowId = (await rows.nth(i).getAttribute('data-testid'))?.replace('user-row-', '');
            if (rowId) rowIds.push(rowId);
        }

        for (const rowId of rowIds) {
            const url = `${BASE_URL}/wfbo/users/${rowId}/transactions`;
            await page.goto(url);

            if (await page.locator('[data-testid="tab-commissions"]').isVisible()) {
                return url;
            }
        }
        return null;
    }

    /**
     * Returns the URL for the first user whose transactions page does NOT
     * show the Commissions tab (i.e. a plain player or staff user).
     */
    async function findNonAgentTransactionsUrl(page: Page): Promise<string | null> {
        await page.goto(`${BASE_URL}/wfbo/users`);
        const rows = page.locator('[data-testid^="user-row-"]');
        const count = await rows.count();

        const rowIds: string[] = [];
        for (let i = 0; i < count; i++) {
            const rowId = (await rows.nth(i).getAttribute('data-testid'))?.replace('user-row-', '');
            if (rowId) rowIds.push(rowId);
        }

        for (const rowId of rowIds) {
            const url = `${BASE_URL}/wfbo/users/${rowId}/transactions`;
            await page.goto(url);

            if (!await page.locator('[data-testid="tab-commissions"]').isVisible()) {
                return url;
            }
        }
        return null;
    }

    test.beforeEach(async ({ page }) => {
        await loginAs(page, ADMIN.mobile, ADMIN.password);
    });

    // ── Commissions tab visibility ─────────────────────────────────────────────

    test('commissions tab is visible for agent users', async ({ page }) => {
        const url = await findAgentTransactionsUrl(page);
        expect(url, 'No agent user found in fixture data').not.toBeNull();

        await expect(page.locator('[data-testid="tab-commissions"]')).toBeVisible();
    });

    test('commissions tab is not visible for non-agent users', async ({ page }) => {
        const url = await findNonAgentTransactionsUrl(page);
        expect(url, 'All fixture users appear to be agents').not.toBeNull();

        await expect(page.locator('[data-testid="tab-commissions"]')).not.toBeVisible();
    });

    // ── Commissions tab navigation ─────────────────────────────────────────────

    test('clicking commissions tab shows commissions table', async ({ page }) => {
        const url = await findAgentTransactionsUrl(page);
        expect(url).not.toBeNull();

        await page.click('[data-testid="tab-commissions"]');

        await expect(page.locator('[data-testid="user-commissions-table-card"]')).toBeVisible();
        await expect(page.locator('[data-testid="user-commissions-table"]')).toBeVisible();
    });

    test('commissions table shows expected column headers', async ({ page }) => {
        const url = await findAgentTransactionsUrl(page);
        expect(url).not.toBeNull();

        await page.click('[data-testid="tab-commissions"]');

        const table = page.locator('[data-testid="user-commissions-table"]');
        await expect(table.locator('th', { hasText: 'Player' })).toBeVisible();
        await expect(table.locator('th', { hasText: 'Mobile #' })).toBeVisible();
        await expect(table.locator('th', { hasText: 'Game' })).toBeVisible();
        await expect(table.locator('th', { hasText: 'Ref #' })).toBeVisible();
        await expect(table.locator('th', { hasText: 'Detail' })).toBeVisible();
        await expect(table.locator('th', { hasText: 'Bet Amount' })).toBeVisible();
        await expect(table.locator('th', { hasText: 'Commission' })).toBeVisible();
        await expect(table.locator('th', { hasText: 'Status' })).toBeVisible();
    });

    test('commissions tab shows count badge', async ({ page }) => {
        const url = await findAgentTransactionsUrl(page);
        expect(url).not.toBeNull();

        const tab = page.locator('[data-testid="tab-commissions"]');
        await expect(tab.locator('.tab-count')).toBeVisible();
    });

    test('commissions table shows empty message when no commissions', async ({ page }) => {
        const url = await findAgentTransactionsUrl(page);
        expect(url).not.toBeNull();

        await page.click('[data-testid="tab-commissions"]');

        const table = page.locator('[data-testid="user-commissions-table"]');
        const rows = table.locator('tbody tr[data-testid^="commission-row-"]');
        const emptyCell = table.locator('td.td-empty');

        const rowCount = await rows.count();
        if (rowCount === 0) {
            await expect(emptyCell).toBeVisible();
            await expect(emptyCell).toContainText('No commissions found');
        } else {
            await expect(rows.first()).toBeVisible();
        }
    });

    // ── Bets tab: no Commission column (commissions are on their own tab) ────────

    test('bets tab does not have a Commission column', async ({ page }) => {
        const url = await findAgentTransactionsUrl(page);
        expect(url).not.toBeNull();

        await page.goto(url + '?type=bets');

        const table = page.locator('[data-testid="user-bets-table"]');
        await expect(table.locator('th', { hasText: 'Commission' })).not.toBeVisible();
    });

});