(async () => {
  const { EventManager, utils } = ShopbySkin;

  ShopbySkin.EventManager.on('PAGE_LOAD_COMPLETED', async (commonData) => {
    profile = commonData.profile;

    // [KR] 모바일 서비스 이미지 배너로 대체
    const bannerId = 'mobileService';
    const { result: bannerData } = await callShopApi(
      `/display/banners/id/${bannerId}`,
    );
    const account = bannerData?.[0]?.accounts?.find(
      (account) => account?.accountName === 'PC',
    );
    const bannerContainer = document.querySelector('#mobileServiceArea');
    if (bannerContainer && account?.banners?.length) {
      let html = '';

      account.banners.sort(
        (a, b) => (a.displayOrder ?? 0) - (b.displayOrder ?? 0),
      );
      account.banners.forEach((b) => {
        if (!b?.imageUrl) return;

        const imgTag = `<img src="${b.imageUrl}" alt="${b.displayText || '배너 이미지'}" style="width:100%; height:auto;">`;

        if (b.landingUrl && b.landingUrl !== '/') {
          html += `<a href="${b.landingUrl}">${imgTag}</a>`;
        } else {
          html += imgTag;
        }
      });

      bannerContainer.innerHTML = html;
    }
  });

  const ACTION_HANDLER_MAP = {};

  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;
    }

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

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