(() => {
  const { pageHelper, EventManager } = ShopbySkin;

  const signInHelper = pageHelper.signInHelper();

  signInHelper.initialize({
    helperKey: 'sign-in-form',
  });

  EventManager.on('PAGE_LOAD_COMPLETED', () => {
		setTimeout(() => {
			const providerType = localStorage.getItem('providerType');
			//console.log(`providerType : ${providerType}`);
			if ( providerType == 'NAVER' ){
				document.querySelector('.open-id-sign-in__item.type-naver .tooltip-button').style.display = 'block';
			} else if ( providerType == 'KAKAO' || providerType == 'KAKAO_SYNC' ){
				document.querySelector('.open-id-sign-in__item.type-kakao-sync .tooltip-button').style.display = 'block';
			}
		}, 300);
  });


  const containerEl = document.querySelector('open-id-sign-in');

  const getFromUrl = () => {
    const searchParams = new URLSearchParams(location.search);

    const from = searchParams.get('from');

    const mainUrl = '/';
    return decodeURIComponent(from || mainUrl);
  };

  const clickEventListener = ({ target }) => {
    const action = target.closest('[shopby-action]')?.getAttribute('shopby-action');

    if (action === 'OPEN_ID_CLICK') {
      const provider = target.closest('[shopby-provider]')?.getAttribute('shopby-provider');

      if (provider === 'app-card') {
        EventManager.fire('OPEN_LAYER_MODAL', {
          name: 'app-card-authenticate',
          classModifier: 'app-card-authenticate',
          isFull: false,
          data: {
            nextPath: getFromUrl(),
            previousPath: location.href,
            provider,
            redirectUri: `${location.origin}/callback/auth-callback.html`,
          },
        });

        return;
      }

      signInHelper.openIdSignIn({
        nextPath: getFromUrl(),
        previousPath: location.href,
        provider,
        redirectUri: `${location.origin}/callback/auth-callback.html`,
      });
    }
  };

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