'use client'

import React, { useState } from 'react'
import { PersistQueryClientProvider } from '@tanstack/react-query-persist-client'
import { I18nProvider } from '@react-aria/i18n'
import { ThemeProvider as NextThemesProvider, type ThemeProviderProps } from 'next-themes'

import { getQueryClient, getQueryPersistOptions } from '@/lib/queryClient'

export interface ProvidersProps {
  children: React.ReactNode
  themeProps?: ThemeProviderProps
}

export function Providers({ children, themeProps }: ProvidersProps) {
  const [queryClient] = useState(() => getQueryClient())
  const [persistOptions] = useState(() => getQueryPersistOptions())

  return (
    <PersistQueryClientProvider
      client={queryClient}
      persistOptions={persistOptions}
    >
      <I18nProvider locale="fa-IR">
        <NextThemesProvider {...themeProps}>{children}</NextThemesProvider>
      </I18nProvider>
    </PersistQueryClientProvider>
  )
}