"use client";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { I18nextProvider } from "react-i18next";
import { useState, type ReactNode } from "react";

import { getI18n } from "@/config/i18n";
import { LanguageProvider } from "@/store/language-context";
import { UserPaymentProvider } from "@/store/user-payment";

/**
 * نفس شجرة المزوّدات في main.tsx الأصلي:
 * QueryClientProvider → LanguageProvider → UserPaymentProvider
 * (+ I18nextProvider بنسخة مستقلة لكل طلب على الخادم)
 */
export default function Providers({ lang, children }: { lang: string; children: ReactNode }) {
    const [queryClient] = useState(
        () =>
            new QueryClient({
                defaultOptions: {
                    queries: {
                        staleTime: 6 * 60 * 1000,
                        gcTime: 6 * 60 * 100,
                    },
                },
            })
    );
    const [i18n] = useState(() => getI18n(lang));

    return (
        <QueryClientProvider client={queryClient}>
            <I18nextProvider i18n={i18n}>
                <LanguageProvider initialLang={lang}>
                    <UserPaymentProvider>{children}</UserPaymentProvider>
                </LanguageProvider>
            </I18nextProvider>
        </QueryClientProvider>
    );
}
