'use client'

import { ReactNode, useEffect } from 'react'
import { setGlobalApolloClient, UserProvider } from './user-context'
import { ThemeProvider } from '@/components/theme-provider'
import { ApolloProvider } from '@apollo/client'
import { createApolloClient } from '@/lib/apollo-client'
import { MapProvider } from './map-context'

export function ClientProviders({ children }: { children: ReactNode }) {
    const client = createApolloClient();
    useEffect(() => {
        setGlobalApolloClient(client);
    }, [client]);

    return (
        <ThemeProvider>
            <ApolloProvider client={client}>
                <MapProvider>
                    <UserProvider>
                        {children}
                    </UserProvider>
                </MapProvider>
            </ApolloProvider>
        </ThemeProvider>
    )
}