'use client'

import { useHeaderStore } from '@/store/header'
import { usePopupController } from '@/store/popupController'
import { useSideNavState } from '@/store/sideNavState'
import { usePathname } from 'next/navigation'
import { useEffect } from 'react'

declare global {
  interface Window {
    alert2: (msg: string, alert2BtnYes?: () => void, alert2BtnNo?: () => void) => void
  }
}

export default function EdgeProvider({ children }: React.PropsWithChildren) {
  const pathname = usePathname()
  const { setBackBtn } = useHeaderStore()
  const { reset } = useSideNavState()
  const { setAlertMsg, setAlertBtn, setAlert, setAlert2, setAlert2BtnYes, setAlert2BtnNo } = usePopupController()

  const alertFunc = (msg: string, alertBtn: Function) => {
    console.log('🚀 ~ alertFunc ~ msg:', msg)
    setAlertMsg(msg)
    setAlertBtn(alertBtn)
    setAlert(true)
  }
  /**
   * alert2 함수
   * @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(() => {
    window.alert = function (msg, alertBtn = () => setAlert(false)) {
      alertFunc(msg, alertBtn)
    }

    window.alert2 = function (msg, alert2BtnYes = () => setAlert2(false), alert2BtnNo = () => setAlert2(false)) {
      alertFunc2(msg, alert2BtnYes, alert2BtnNo)
    }
  }, [])

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

  return <>{children}</>
}