'use client'

import { createContext, useState } from 'react'
import { ErrorBoundary } from 'next/dist/client/components/error-boundary'
import { useCommonCode } from '@/hooks/common/useCommonCode'
import ServerError from './error'

import '@/styles/common.scss'
import GlobalSpinner from '@/components/common/spinner/GlobalSpinner'

export const QcastContext = createContext({
  qcastState: {},
  setQcastState: () => {},
  isGlobalLoading: false,
  setIsGlobalLoading: () => {},
})

export const QcastProvider = ({ children }) => {
  const [planSave, setPlanSave] = useState(false)
  const [isGlobalLoading, setIsGlobalLoading] = useState(false)
  const { commonCode, findCommonCode } = useCommonCode()

  const [qcastState, setQcastState] = useState({
    saleStoreId: '',
    saleStoreName: '',
    objectList: [],
    businessCharger: null,
    businessChargerMail: null,
  })

  // useEffect(() => {
  //   console.log('commonCode', commonCode)
  //   console.log(findCommonCode(113600))
  // }, [commonCode, findCommonCode])

  return (
    <>
      {isGlobalLoading && (
        <div className="fixed inset-0 bg-white z-50 flex items-center justify-center">
          <GlobalSpinner />
        </div>
      )}
      <QcastContext.Provider value={{ qcastState, setQcastState, isGlobalLoading, setIsGlobalLoading }}>
        <ErrorBoundary fallback={<ServerError />}>{children}</ErrorBoundary>
      </QcastContext.Provider>
    </>
  )
}