import moment from 'moment';
import { useCallback, useEffect, useState } from 'react';
import { useUserInfo } from '@/entities/user/lib/use-user-info';
import { FavoriteWrapper } from '@/entities/home/ui/favorite-wrapper';
import { DayStatusBox } from '@/entities/home/ui/day-status-box';
import { HomeBottomBanner } from '@/entities/home/ui/home-bottom-banner';
import { AuthRegister } from '@/entities/home/ui/auth-reguster';
import { FooterItemActiveKey } from '@/entities/common/model/types';
import { useStore } from '@/shared/model/store';
import { StorageKeys } from '@/shared/constants/local-storage';
import { setLocalStorage, getLocalStorage } from '@/shared/lib/web-view-bridge';
import { useAppBridge } from '@/hooks/useAppBridge';

import { HeaderType } from '@/entities/common/model/types';
import { 
	useSetHeaderTitle,
	useSetHeaderType,
	useSetFooterMode,
  useSetFooterCurrentPage
} from '@/widgets/sub-layout/use-sub-layout';

export const HomePage = () => {
  const { callLogin } = useUserInfo();
  const { openBiometricRegistrationPopup } = useAppBridge();
  useSetHeaderTitle('');
  useSetHeaderType(HeaderType.Home);
  useSetFooterMode(true);
  useSetFooterCurrentPage(FooterItemActiveKey.Home);

  const today = moment().format('YYYYMMDD').toString();
  let bannerToday = getLocalStorage(StorageKeys.BottomBannerClose);
  
  const [bottomBannerOn, setBottomBannerOn] = useState<boolean>(false);
  const [authRegisterOn, setAuthRegisterOn] = useState<boolean>(false);
  const [loginSuccess, setLoginSuccess] = useState<boolean>(false);
  
  /*
  const userParmas = {
    id: 'thenaun12',
    password: 'answjddl1!'
  };
  */
  
  const userParmas = {
    id: 'nictest00',
    password: 'nictest00'
  };
  
  const handleLogin = useCallback(async () =>{
    let appStart = getLocalStorage(StorageKeys.AppStart);

    if(!!appStart){
      useStore.getState().UserStore.resetUserInfo();
      let tokenType = getLocalStorage(StorageKeys.TokenType);
      let accessToken = getLocalStorage(StorageKeys.AccessToken);
      let refreshToken = getLocalStorage(StorageKeys.RefreshToken);
      let accessTokenExpiresIn = getLocalStorage(StorageKeys.AccessTokenExpiresIn);
      let refreshTokenExpiresIn = getLocalStorage(StorageKeys.RefreshTokenExpiresIn);
      let menuGrants = getLocalStorage(StorageKeys.TokenType);
      // let usrid = getLocalStorage(StorageKeys.Usrid);
      
      useStore.getState().UserStore.setUserInfo({
        tokenType: tokenType,
        accessToken: accessToken,
        refreshToken: refreshToken,
        accessTokenExpiresIn: accessTokenExpiresIn,
        refreshTokenExpiresIn: refreshTokenExpiresIn,
        menuGrants: menuGrants,
        // usrid: usrid
      });
      setLoginSuccess(true);
    }
    else{
      callLogin(userParmas).then(() => {
        setLoginSuccess(true);
      });
    }
    
  }, []);

  const checkBottomBannerOpen = () => {
    if(!!bannerToday){
      bannerToday = bannerToday.toString();
    }
    let sw = (today !== bannerToday);
    setBottomBannerOn(sw);
  };
  const checkAuthRegisterOpen = () => {
    openBiometricRegistrationPopup().then((isOpen) => {
      if(isOpen){
        setAuthRegisterOn(true);
      }
    });
  };
  
  
  useEffect(() => {
    handleLogin();
    checkBottomBannerOpen();
    checkAuthRegisterOpen();
  }, []);
  
  const setBottomBannerEffect = (mode: boolean) => {
    setBottomBannerOn(mode);
    if(mode === false){
      if(authRegisterOn){
        setAuthRegisterOn(false);
        setTimeout(() => {
          setAuthRegisterOn(true);
        }, 500)
      }
    }
  };

  /*useLoginMutation
  const [userInfo] = useStore(
    useShallow((state) => [state.userSlice.userInfo]),
  );

  */
  // useRefreshUserInfo();
  return (
    <>
      <main>
        {/*<!-- 탭 컨텐츠 영역 -->*/}
        <div className="tab-content blue">
          <div className="tab-pane dashboard active">
            <FavoriteWrapper></FavoriteWrapper>
            { !!loginSuccess && 
              <DayStatusBox></DayStatusBox>
            }
          </div>
        </div>
      </main>
      <HomeBottomBanner 
        setBottomBannerOn={ setBottomBannerEffect }
        bottomBannerOn={ bottomBannerOn }
      ></HomeBottomBanner>
      { (!bottomBannerOn) &&
        <AuthRegister
          setAuthRegisterOn={ setAuthRegisterOn }
          authRegisterOn={ authRegisterOn }
        ></AuthRegister>
      }
    </>
  );
};
