import { render } from '@testing-library/react';
import dayjs from 'dayjs';
import utc from 'dayjs/plugin/utc';
import React from 'react';
import DeliveryRulesTable from '../delivery-rules-table';
import type { TimeRule } from 'src/components/fingerprintRulesOAPanel/deliveryRules/delivery-rules';
import type { FingerprintRule, FingerprintRuleInput } from 'src/types';
import type {
    DeliveryRule,
    DeliveryRulesTableProps,
} from '../delivery-rules-table';

dayjs.extend(utc);

describe('<DeliveryRulesTable>', () => {
    const higherLevelRules = [
        {
            active: true,
            policy: 'Monetize',
            service: 'TikTok',
            territory: 'US',
            startDate: dayjs
                .utc('2023-01-02T00:00:00.000Z')
                .format('D MMM YYYY'),
            endDate: '-',
            createdDate: dayjs
                .utc('2023-01-01T00:00:00.000Z')
                .format('D MMM YYYY'),
            lastModifiedDate: dayjs
                .utc('2023-01-01T00:00:00.000Z')
                .format('D MMM YYYY'),
            createdBy: {
                profileId: '123',
                profileType: 'ContentProfile',
                profileName: 'Name',
            },
            lastModifiedBy: {
                profileId: '123',
                profileType: 'ContentProfile',
                profileName: 'Name',
            },
        },
    ] as FingerprintRule[];
    const currentRules = [
        {
            active: true,
            policy: 'Monetize',
            service: 'TikTok',
            territory: 'FR',
            startDate: dayjs
                .utc('2023-01-02T00:00:00.000Z')
                .format('D MMM YYYY'),
            endDate: '-',
            createdDate: dayjs
                .utc('2023-01-01T00:00:00.000Z')
                .format('D MMM YYYY'),
            lastModifiedDate: dayjs
                .utc('2023-01-01T00:00:00.000Z')
                .format('D MMM YYYY'),
            createdBy: {
                profileId: '123',
                profileType: 'ContentProfile',
                profileName: 'Name',
            },
            lastModifiedBy: {
                profileId: '123',
                profileType: 'ContentProfile',
                profileName: 'Name',
            },
        },
    ] as FingerprintRule[];
    const tableRules = [
        {
            countryName: 'France',
            active: true,
            policy: 'Monetize',
            service: 'TikTok',
            territory: 'FR',
            startDate: dayjs
                .utc('2023-01-02T00:00:00.000Z')
                .format('D MMM YYYY'),
            endDate: '-',
            createdDate: dayjs
                .utc('2023-01-01T00:00:00.000Z')
                .format('D MMM YYYY'),
            lastModifiedDate: dayjs
                .utc('2023-01-01T00:00:00.000Z')
                .format('D MMM YYYY'),
            createdBy: {
                profileId: '123',
                profileType: 'ContentProfile',
                profileName: 'Name',
            },
            lastModifiedBy: {
                profileId: '123',
                profileType: 'ContentProfile',
                profileName: 'Name',
            },
            level: 'Subaccount',
        },
    ] as DeliveryRule[];
    const territories = [
        {
            territoryCodeA2: 'FR',
            territoryName: 'France',
            continent: 'Europe',
        },
        {
            territoryCodeA2: 'US',
            territoryName: 'United States of America',
            continent: 'North America',
        },
    ];

    const defaultProps: DeliveryRulesTableProps = {
        accountType: 'Subaccount',
        higherLevelRules,
        tableRules,
        currentRules,
        current: true,
        scheduled: false,
        expired: false,
        onDeleteRow: (message: string, rules: FingerprintRuleInput[]) =>
            undefined,
        onEditRow: (
            rules: FingerprintRuleInput[],
            timeFilter: TimeRule | null,
            message?: string
        ) => undefined,
        editable: true,
        territories,
    };

    const renderWrapper = (props: Partial<DeliveryRulesTableProps> = {}) =>
        render(<DeliveryRulesTable {...defaultProps} {...props} />);

    test('renders current table', () => {
        const { container } = renderWrapper();
        expect(container).toMatchSnapshot();
    });

    test('renders empty state table', () => {
        const { container } = renderWrapper({
            tableRules: [],
        });
        expect(container).toMatchSnapshot();
    });

    test('renders no action when rules are from a different level', () => {
        const { container } = renderWrapper({
            tableRules: [
                {
                    countryName: 'France',
                    active: true,
                    policy: 'Monetize',
                    service: 'TikTok',
                    territory: 'FR',
                    startDate: dayjs
                        .utc('2023-01-02T00:00:00.000Z')
                        .format('D MMM YYYY'),
                    endDate: '-',
                    createdDate: dayjs
                        .utc('2023-01-01T00:00:00.000Z')
                        .format('D MMM YYYY'),
                    lastModifiedDate: dayjs
                        .utc('2023-01-01T00:00:00.000Z')
                        .format('D MMM YYYY'),
                    createdBy: {
                        profileId: '123',
                        profileType: 'ContentProfile',
                        profileName: 'Name',
                    },
                    lastModifiedBy: {
                        profileId: '123',
                        profileType: 'ContentProfile',
                        profileName: 'Name',
                    },
                    level: 'Account',
                },
            ],
        });
        expect(container).toMatchSnapshot();
    });
    test('renders only delete action when rules are carveout', () => {
        const { container } = renderWrapper({
            tableRules: [
                {
                    countryName: 'France',
                    active: true,
                    policy: 'Carve-out',
                    service: 'TikTok',
                    territory: 'FR',
                    startDate: dayjs
                        .utc('2023-01-02T00:00:00.000Z')
                        .format('D MMM YYYY'),
                    endDate: '-',
                    createdDate: dayjs
                        .utc('2023-01-01T00:00:00.000Z')
                        .format('D MMM YYYY'),
                    lastModifiedDate: dayjs
                        .utc('2023-01-01T00:00:00.000Z')
                        .format('D MMM YYYY'),
                    createdBy: {
                        profileId: '123',
                        profileType: 'ContentProfile',
                        profileName: 'Name',
                    },
                    lastModifiedBy: {
                        profileId: '123',
                        profileType: 'ContentProfile',
                        profileName: 'Name',
                    },
                    level: 'Subaccount',
                },
            ],
        });
        expect(container).toMatchSnapshot();
    });
});