'use client'

import { useEffect } from 'react'
import { usePathname, useRouter } from 'next/navigation'

import { useHeaderStore } from '@/store/header'
import { usePopupController } from '@/store/popupController'
import { useSideNavState } from '@/store/sideNavState'
import { useSessionStore } from '@/store/session'
import { tracking } from '@/libs/tracking'
import Spinner from '@/components/ui/common/Spinner'
import { useSpinnerStore } from '@/store/spinnerStore'

declare global {
  interface Window {
    neoAlert: (msg?: string, alertBtn?: Function) => void
    neoConfirm: (msg?: string, alertBtn2Yes?: Function, alertBtn2No?: Function) => boolean
  }
}

interface EdgeProviderProps {
  children: React.ReactNode
  sessionData: string
}

export default function EdgeProvider({ children, sessionData }: EdgeProviderProps) {
  const router = useRouter()
  const pathname = usePathname()
  const { setBackBtn } = useHeaderStore()
  const { reset } = useSideNavState()
  const { setAlertMsg, setAlertBtn, setAlert, setAlert2, setAlert2BtnYes, setAlert2BtnNo } = usePopupController()
  const { session, setSession } = useSessionStore()
  const { isShow, setIsShow } = useSpinnerStore()

  /**
   * 사용자 이벤트 트래킹 처리
   *
   */
  // const handlePageEvent = (path: string) => {
  //   tracking({
  //     url: path,
  //     data: '',
  //   })
  // }

  /**
   * alert 함수 - window.alert 함수 대체
   * @param msg
   * @param alertBtn
   */
  const alertFunc = (msg: string, alertBtn: Function) => {
    console.log('🚀 ~ alertFunc ~ msg:', msg)
    setAlertMsg(msg)
    setAlertBtn(alertBtn)
    setAlert(true)
  }
  /**
   * alert2 함수 - window.confirm 함수 대체
   * @param msg alert 메시지
   * @param alertBtn2Yes alert 확인 버튼 클릭시 실행되는 함수
   * @param alertBtn2No alert 취소 버튼 클릭시 실행되는 함수
   */
  const alertFunc2 = (msg: string, alertBtn2Yes: Function, alertBtn2No: Function) => {
    console.log('🚀 ~ alertFunc ~ msg:', msg)
    setAlertMsg(msg)
    setAlert2BtnYes(alertBtn2Yes)
    setAlert2BtnNo(alertBtn2No)
    setAlert2(true)
  }

  useEffect(() => {
    //alert 함수 변경해서 바인딩
    window.alert = function (msg, alertBtn = () => setAlert(false)) {
      alertFunc(msg, alertBtn)
    }
    window.neoAlert = function (msg?: string, alertBtn = () => setAlert(false)) {
      if (!msg) return
      alertFunc(msg, alertBtn)
    }
    // confirm 함수 변경해서 바인딩
    window.neoConfirm = function (msg: string | undefined, alertBtn2Yes?: Function, alertBtn2No?: Function) {
      if (!msg) return false
      alertFunc2(msg, alertBtn2Yes || (() => {}), alertBtn2No || (() => {}))
      return false
    }
    if (sessionData === '') {
      router.push('/login')
    } else {
      if (pathname === '/login') {
        router.push('/')
      }
    }
    // 서버 세션이 있으면 zuatand 세션 데이터 갱신
    if (sessionData && sessionData !== '') {
      setSession({
        ...session,
        ...JSON.parse(sessionData),
      })
    }
  }, [])

  /**
   * 헤더 뒤로가기 버튼 컨트롤
   * 사이드바 초기화 컨트롤
   */
  useEffect(() => {
    if (pathname === '/') {
      setBackBtn(false)
    } else {
      setBackBtn(true)
    }
    //사이드바 초기화
    reset()
    // 페이지 이벤트 트래킹
    // handlePageEvent(pathname)
  }, [pathname])

  return (
    <>
      {children}
      {isShow && <Spinner />}
    </>
  )
}
