'use client'

import { createContext, useContext, useState, useCallback, type ReactNode } from 'react'

interface LoadingContextValue {
  isLoading: boolean
  setLoaded: () => void
}

export const LoadingContext = createContext<LoadingContextValue>({
  isLoading: true,
  setLoaded: () => {},
})

export function useLoading() {
  return useContext(LoadingContext)
}

export function LoadingProvider({ children }: { children: ReactNode }) {
  const [isLoading, setIsLoading] = useState(true)

  const setLoaded = useCallback(() => {
    setIsLoading(false)
    document.body.classList.add('is-loaded')
  }, [])

  return (
    <LoadingContext.Provider value={{ isLoading, setLoaded }}>
      {children}
    </LoadingContext.Provider>
  )
}