(() => {
    const { pageHelper, utils, EventManager, constants } = ShopbySkin;
    const { initialize } = pageHelper.productListHelper();

    const urlQueryParams = utils.getQueryParams();

    initialize({
        ...urlQueryParams,
    });

    EventManager.on('QUERY_PRODUCT_DETAIL', async (product) => {
        const cateInfo = product.categories?.[0]?.['categories'];

        if (true === Array.isArray(cateInfo)) {
            const categoryNo = cateInfo[cateInfo.length - 1].categoryNo;

            if ( !urlQueryParams.categoryNo ) {
                let url = new URL(location.href);

                url.searchParams.set('categoryNo', categoryNo);

                location.replace(url.href);
            }
            else {
                document.body.style.display = 'block';
            }
        }
        else {
            document.body.style.display = 'block';
        }
    });

    const productListActionMap = {
        // NOTE: 좋아요버튼 클릭
        PRODUCT_LIKE_BTN: ({ event }) => {
            event?.preventDefault?.();

            const btn = event.target.closest('[shopby-product-no]');
            const productNo = Number(btn.getAttribute('shopby-product-no') ?? 0);

            utils.isSignIn()
                ? EventManager.fire('MUTATE_LIKE_PRODUCT', {
                    productNo,
                    onSuccess: (like) => {
                        like ? btn.classList.add('is-active') : btn.classList.remove('is-active');
                    },
                })
                : EventManager.fire('MODAL_CONFIRM_OPEN', {
                    message: `로그인하셔야 본 서비스를 이용하실 수 있습니다.`,
                    noticeType: constants.NOTICE_MODAL_TYPE.WARNING,
                    onConfirm: () => {
                        const nextUrl = `${location.origin}/pages/sign-in/sign-in.html`;

                        location.href = `${nextUrl}?from=${encodeURIComponent(location.href)}`;
                    },
                });
        },
        OPEN_PRODUCT_OPTION_MODAL: ({ event, btn }) => {

            event?.preventDefault?.();

            const btns = event.target.closest('[shopby-product-no]');
            const productNo = Number(btns.getAttribute('shopby-product-no') ?? 0);
            const isSoldOut = utils.convertStringBooleanToBoolean(btns.getAttribute('shopby-is-sold-out'));


            // sold out이면 팝업 안 뜨게 하기
            if (isSoldOut) return;

            EventManager.fire('OPEN_LAYER_MODAL', {
                name: 'select-product-option',
                title: '옵션 선택',
                isFull: true,
                modalAddClass: 'select-product-option-modal',
                data: {
                    productNo,
                },
            });

        },
        MOVE_PRODUCT_DETAIL: ({ event }) => {
            if (!utils.isAdultVerified(event)) {
                EventManager.fire('MODAL_CONFIRM_OPEN', {
                    message: '성인인증이 필요한 상품입니다.',
                    noticeType: 'CAUTION',
                    onConfirm: () => {
                        location.href = '/pages/intro/adult-certification.html?go-back=true';
                    },
                });
            }
        },
    };

    const clickEventListener = (e) => {
        if (!e?.target) {
            return;
        }

        const btn = e?.target?.closest?.('[shopby-action]') || e?.target?.parentElement?.closest?.('[shopby-action]');
        const action = btn?.getAttribute('shopby-action');

        if (!btn) {
            return;
        }

        productListActionMap[action]?.({
            event: e,
        });
    };

    EventManager.on('PAGE_LOAD_COMPLETED', () => {
        // 외부스크립트 등록 기능. 삭제금지
        ShopbyExternalScript?.setPageScriptType(urlQueryParams?.keywords ? 'PRODUCT_SEARCH' : 'PRODUCT_LIST');

        if ('3' === urlQueryParams?.depth) {
            document.querySelector('[slot="childCategories"]').remove();
        }

        const intervalId = setInterval(() => {
            const breadcrumbCategory = document.querySelector(".page-content-top__breadcrumb-category");
            const homeItem = document.querySelector(".page-home");

            if (breadcrumbCategory && homeItem) {
                breadcrumbCategory.addEventListener("mouseenter", () => {
                    homeItem.classList.add("active");
                });

                breadcrumbCategory.addEventListener("mouseleave", () => {
                    homeItem.classList.remove("active");
                });

                clearInterval(intervalId);
            }
        }, 100);

    });

    document.addEventListener('click', clickEventListener);
})();