import { PropsWithChildren } from 'react';
import { PlayerProvider } from '@/components/providers/PlayerProvider';
import { TokenProvider } from '@/components/providers/TokenProvider';
import { TasksProvider } from '@/components/providers/TasksProvider';
import { ShopItemsProviver } from '@/components/providers/ShopItemsProvider';
import { ConfigProvider } from '@/components/providers/ConfigProvider';
import Navigation from '@/components/ui/navigation/Navigation';

export type ProvidersProps = {
    id: string;
};

export const Providers = ({ children, id }: PropsWithChildren & ProvidersProps) => {
    return (
        <TokenProvider>
            <TasksProvider>
                <ShopItemsProviver>
                    <ConfigProvider>
                        <PlayerProvider id={id}>
                            {children}
                            <Navigation id={id} />
                        </PlayerProvider>
                    </ConfigProvider>
                </ShopItemsProviver>
            </TasksProvider>
        </TokenProvider>
    );
};