"use client"

import * as React from "react"
import { type JSX, useEffect, useState } from "react"
import { ThemeProvider as NextThemesProvider } from "next-themes"
import { type ThemeProviderProps } from "next-themes/dist/types"

export function ThemeProvider({ children, ...props }: ThemeProviderProps): JSX.Element {
  const [isClient, setIsClient] = useState(false)
  useEffect(() => {
    setIsClient(true)
  }, [])
  return isClient ? <NextThemesProvider {...props}>{children}</NextThemesProvider> : <>{children}</>
}
