// Components
import orderConfirmation from '@/layouts/order-confirmation/order-confirmation.vue';

// Supporting Files
import { getMountOptions } from '@/helpers/unit-test-helper.js';
import { useMainStore } from '@/store/index.js';
import settleAllPromises from '@/helpers/layout-helper.js';
import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
import { mount } from '@vue/test-utils';
import { createTestingPinia } from '@pinia/testing';

jest.mock('@/helpers/layout-helper.js', () => jest.fn());

jest.mock('@/helpers/cms-content-helper', () => ({
    fetchCmsContentForPage: jest.fn()
}));
const wordingText = 'wording Text {custom:address}';

const mockMixin = {
    methods: {
        getCmsContent: jest.fn().mockImplementation(() => wordingText),
        setCmsContent: jest.fn()
    }
};

const footerStub = {
    render: () => {},
    methods: {
        updateButtonText: jest.fn()
    }
};

const headerStub = {
    render: () => {}
};

const initialStore = {
    order: {
        schedule: {
            date: '2024-03-01',
            startTime: '09:00',
            endTime: '10:00'
        },
        serviceLocation: {
            address: '123 Test Way',
            address2: '#1',
            city: 'Mesa',
            state: 'AZ',
            zipCode: '12345',
            appointmentType: 'Inshop',
            provider: {
                address: {
                    streetAddress: '123 Safelite Street',
                    city: 'Mesa',
                    state: 'AZ',
                    zipCode: '12345'
                }
            }
        }
    }
};

function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRun = () => {}) {
    const mountOptions = getMountOptions({
        router: {
            navigate: jest.fn(),
            navigateToExternalUrl: jest.fn()
        }
    });

    mountOptions.global.stubs = {
        siteFooter: footerStub,
        siteHeader: headerStub
    };

    const testingPinia = createTestingPinia({
        initialState: {
            main: mainInitialState
        }
    });
    useMainStore(testingPinia);
    methodToRun();

    mountOptions.global.plugins = [testingPinia];
    mountOptions.mixins = [mockMixin];
    mountOptions.data = () => (
        initialData
    );

    const apiResponses = {
        supportingItems: []
    };
    const apiPromise = Promise.resolve(apiResponses);
    settleAllPromises.mockImplementation(() => apiPromise);
    fetchCmsContentForPage.mockImplementation(() => Promise.resolve());

    const wrapper = mount(orderConfirmation, mountOptions);
    return { wrapper };
}

describe('OrderConfirmation.vue', () => {
    describe('Rendering', () => {
        test('Should render Site Header', () => {
            // Arrange
            const { wrapper } = getMountedComponent(initialStore);

            // Act
            const siteHeader = wrapper.findComponent(headerStub);

            // Assert
            expect(siteHeader.exists()).toBe(true);
        });
        test('If Advanced flow, should display Site Footer', () => {
            // Arrange
            const testStore = {
                order: {
                    schedule: {
                        date: '2019-01-01',
                        startTime: '09:00'
                    },
                    serviceLocation: {
                        appointmentType: 'Inshop'
                    }
                },
                issConfig: {
                    successReturnURL: 'testURL'
                }
            };
            const { wrapper } = getMountedComponent(testStore);

            // Act
            const siteFooter = wrapper.findComponent({ ref: 'siteFooter' });

            // Assert
            expect(siteFooter.exists()).toBe(true);
        });
        test('If Essential flow, should not display Site Footer', () => {
            // Arrange
            const { wrapper } = getMountedComponent(initialStore);

            // Act
            const siteFooter = wrapper.findComponent({ ref: 'siteFooter' });

            // Assert
            expect(siteFooter.isVisible()).toBe(false);
        });
    });
    describe('Navigation', () => {
        test('If Advanced flow, forward button action navigates to carrier URL', () => {
            // Arrange
            const carrierReturnUrl = 'testURL';
            const testStore = {
                order: {
                    schedule: {
                        date: '2019-01-01',
                        startTime: '09:00'
                    },
                    serviceLocation: {
                        appointmentType: 'Inshop'
                    }
                },
                issConfig: {
                    successReturnURL: carrierReturnUrl
                }
            };
            const { wrapper } = getMountedComponent(testStore);

            // Act
            wrapper.vm.forwardButtonAction();

            // Assert
            expect(wrapper.vm.$router.navigateToExternalUrl).toHaveBeenCalledWith(carrierReturnUrl);
        });
    });
    describe('Computed properties', () => {
        test('appointmentDateFormatted should return date in expected format', () => {
            // Arrange
            const { wrapper } = getMountedComponent(initialStore);

            // Act
            const testValue = wrapper.vm.appointmentDateFormatted;

            // Assert
            expect(testValue).toEqual('Friday, March 1');
        });
        test('appointmentTimeFormatted should return Mobile time in expected format', () => {
            // Arrange
            const testStore = {
                order: {
                    schedule: {
                        date: '2019-01-01',
                        startTime: '09:00',
                        endTime: '10:00'
                    },
                    serviceLocation: {
                        appointmentType: 'Mobile'
                    }
                }
            };
            const { wrapper } = getMountedComponent(testStore);

            // Act
            const testValue = wrapper.vm.appointmentTimeFormatted;

            // Assert
            expect(testValue).toEqual('Between 9 AM - 10 AM');
        });
        test('appointmentTimeFormatted should return Drop Off time in expected format', () => {
            // Arrange
            const testStore = {
                order: {
                    schedule: {
                        date: '2019-01-01',
                        startTime: '09:00',
                        endTime: '10:00'
                    },
                    serviceLocation: {
                        appointmentType: 'Drop Off'
                    }
                }
            };
            const { wrapper } = getMountedComponent(testStore);

            // Act
            const testValue = wrapper.vm.appointmentTimeFormatted;

            // Assert
            expect(testValue).toEqual('Drop off before 9:30 AM');
        });
        test('appointmentTimeFormatted should return In Shop time in expected format', () => {
            // Arrange
            const { wrapper } = getMountedComponent(initialStore);

            // Act
            const testValue = wrapper.vm.appointmentTimeFormatted;

            // Assert
            expect(testValue).toEqual('at 9:00 AM');
        });
        test('appointmentWordingText should return Mobile text in expected format', () => {
            // Arrange
            const testStore = {
                order: {
                    schedule: {
                        date: '2019-01-01',
                        startTime: '09:00',
                        endTime: '10:00'
                    },
                    serviceLocation: {
                        address: '123 Test Way',
                        address2: '#1',
                        city: 'Mesa',
                        state: 'AZ',
                        zipCode: '12345',
                        appointmentType: 'Mobile'
                    }
                }
            };
            const { wrapper } = getMountedComponent(testStore);

            // Act
            const testValue = wrapper.vm.appointmentWordingText;

            // Assert
            expect(testValue).toEqual('wording Text <br/>123 Test Way, #1,<br/> Mesa, AZ 12345<br/>');
        });
        test('appointmentWordingText should return Drop Off text in expected format', () => {
            // Arrange
            const testStore = {
                order: {
                    schedule: {
                        date: '2019-01-01',
                        startTime: '09:00',
                        endTime: '10:00'
                    },
                    serviceLocation: {
                        provider: {
                            address: {
                                streetAddress: '123 Safelite Street',
                                city: 'Mesa',
                                state: 'AZ',
                                zipCode: '12345'
                            }
                        },
                        appointmentType: 'Drop Off'
                    }
                }
            };
            const { wrapper } = getMountedComponent(testStore);

            // Act
            const testValue = wrapper.vm.appointmentWordingText;

            // Assert
            expect(testValue).toEqual('wording Text <br/>123 Safelite Street,<br/> Mesa, AZ 12345<br/>');
        });
        test('appointmentWordingText should return In Shop text in expected format', () => {
            // Arrange
            const { wrapper } = getMountedComponent(initialStore);

            // Act
            const testValue = wrapper.vm.appointmentWordingText;

            // Assert
            expect(testValue).toEqual('wording Text <br/>123 Safelite Street,<br/> Mesa, AZ 12345<br/>');
        });
        test('serviceLocationFullAddress should return text in expected format', () => {
            // Arrange
            const { wrapper } = getMountedComponent(initialStore);

            // Act
            const testValue = wrapper.vm.serviceLocationFullAddress;

            // Assert
            expect(testValue).toEqual('<br/>123 Test Way, #1,<br/> Mesa, AZ 12345<br/>');
        });
        test('providerFullAddress should return text in expected format', () => {
            // Arrange
            const { wrapper } = getMountedComponent(initialStore);

            // Act
            const testValue = wrapper.vm.providerFullAddress;

            // Assert
            expect(testValue).toEqual('<br/>123 Safelite Street,<br/> Mesa, AZ 12345<br/>');
        });
    });
});