import { shallowMount } from "@vue/test-utils";
import { getMountOptions } from "@/helpers/unit-test-helper.js";

import appointmentReview from "@/layouts/payment-method/review-dropdown/review-sections/appointment-review/appointment-review";

const testConstants = {
    cms: {
        header: {
            text: "Appointment Details",
        },
    },
    appointment: {
        apptWordingText:
            "September 10, 2025 arriving between 9:00 AM — 11:00 AM at 123 Main St, anytown, OH 43215",
    },
    displayContent: {
        apptWordingText:
            "September 10, 2025 arriving between 9:00 AM — 11:00 AM at 123 Main St, anytown, OH 43215",
    },
};

let cmsContent;

describe("Appointment Review Block", () => {
    beforeEach(() => {
        cmsContent = {
            AppointmentWidget: {
                HeaderText: testConstants.cms.header.text,
            },
        };
    });

    test("Should display header text from cms", async () => {
        // Arrange
        let props = generateDefaultProps();

        const { wrapper } = setupMocks({
            propsData: props,
        });

        // Act
        await wrapper.vm.$nextTick();

        // Assert
        expect(wrapper.vm.headerText).toEqual(testConstants.cms.header.text);
    });

    test("Should render correct display content", async () => {
        // Arrange
        let props = generateDefaultProps();

        const { wrapper } = setupMocks({
            propsData: props,
        });

        // Act
        await wrapper.vm.$nextTick();

        // Assert
        expect(wrapper.vm.displayContent).toEqual([testConstants.displayContent.apptWordingText]);
    });

    test("Should emit edit-clicked when editClicked method is called", async () => {
        // Arrange
        let props = generateDefaultProps();

        const { wrapper } = setupMocks({
            propsData: props,
        });

        // Act
        wrapper.vm.editClicked();
        await wrapper.vm.$nextTick();

        // Assert
        expect(wrapper.emitted("edit-clicked")).toBeTruthy();
    });
});

function generateDefaultProps() {
    return {
        cmsWidgetName: "AppointmentWidget",
        apptWordingText: testConstants.appointment.apptWordingText,
    };
}

function setupMocks(customMountOptions) {
    const mountOptions = getMountOptions(customMountOptions);

    const mockMixin = {
        methods: {
            getCmsContent: jest.fn((widgetName, cmsFieldName) => {
                return cmsContent?.[widgetName]?.[cmsFieldName] ?? "";
            }),
        },
    };

    mountOptions.global.mixins = [mockMixin];

    const wrapper = shallowMount(appointmentReview, mountOptions);
    wrapper.vm.setCmsContent = jest.fn();
    return { wrapper };
}
