"use client";
import { LanguageContextType } from '@/types';
import { URL as URL_FROM_ENV } from '@/utils/url';
import { LANG_COOKIE } from '@/config/i18n';
import { createContext, useState, useContext, useEffect, useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import { useRouter } from 'next/navigation';

const LanguageContext = createContext<LanguageContextType | null>(null);

/**
 * نفس واجهة المزوّد الأصلي حرفياً: { lang, URL, changeLanguage }
 * الفرق الوحيد: اللغة تُحفظ في Cookie إلى جانب localStorage حتى يعرفها
 * الخادم فيصيّر الصفحة ووسوم SEO باللغة الصحيحة من أول طلب.
 */
const applyDirection = (newLang: string) => {
    const dir = newLang === 'ar' ? 'rtl' : 'ltr';
    document.documentElement.lang = newLang;
    document.documentElement.dir = dir;
    document.body.dir = dir;
    document.body.lang = newLang;
    document.body.className = dir;
};

const persist = (newLang: string) => {
    try { localStorage.setItem(LANG_COOKIE, newLang); } catch { /* ignore */ }
    document.cookie = `${LANG_COOKIE}=${newLang}; path=/; max-age=31536000; samesite=lax`;
};

export const LanguageProvider = ({ children, initialLang = 'ar' }: { children: React.ReactNode; initialLang?: string }) => {
    const { i18n } = useTranslation();
    const router = useRouter();

    const [lang, setLang] = useState(initialLang);
    const [URL, setURL] = useState(`${URL_FROM_ENV}/${initialLang}`);

    const updateLanguage = useCallback((newLang: string, refreshServer = true) => {
        i18n.changeLanguage(newLang);
        persist(newLang);

        setLang(newLang);
        setURL(`${URL_FROM_ENV}/${newLang}`);
        applyDirection(newLang);

        // يعيد توليد العنوان والوصف و JSON-LD والمحتوى المصيَّر على الخادم باللغة الجديدة
        if (refreshServer) router.refresh();
    }, [i18n, router]);

    const changeLanguage = useCallback((specificLang: string) => {
        const newLang = specificLang || (lang === 'ar' ? 'en' : 'ar');
        updateLanguage(newLang);
    }, [lang, updateLanguage]);

    useEffect(() => {
        // ترحيل المستخدمين الحاليين: لغتهم محفوظة في localStorage من نسخة Vite
        let stored: string | null = null;
        try { stored = localStorage.getItem(LANG_COOKIE); } catch { /* ignore */ }
        const hasCookie = document.cookie.split('; ').some((c) => c.startsWith(`${LANG_COOKIE}=`));
        const fromQuery = new URLSearchParams(window.location.search).get('lang');

        if (!fromQuery && !hasCookie && stored && stored !== lang && (stored === 'ar' || stored === 'en')) {
            updateLanguage(stored);
            return;
        }
        persist(lang);
        applyDirection(lang);

        const updatingForLocalStorage = (event: StorageEvent) => {
            if (event.key === LANG_COOKIE && event.newValue && event.newValue !== lang) {
                updateLanguage(event.newValue);
            }
        };

        window.addEventListener('storage', updatingForLocalStorage);
        return () => window.removeEventListener('storage', updatingForLocalStorage);
    }, [lang, updateLanguage]);

    return (
        <LanguageContext.Provider value={{ lang, URL, changeLanguage }}>
            {children}
        </LanguageContext.Provider>
    );
};

export const useLanguage = () => {
    const context = useContext(LanguageContext);
    if (!context) {
        throw new Error('useLanguage must be used within a LanguageProvider');
    }
    return context;
};