Context API

// AppContext
"use client";
import { createContext, useContext, useState, useCallback } from "react";

const AppContext = createContext(undefined);

export function AppProvider({ children }) {
  const [theme, setTheme] = useState("light");
  const [lang, setLang] = useState("ar");

  const t = useCallback((key) => {
    const texts = { ar: { title: "مرحباً" }, en: { title: "Hello" } };
    return texts[lang]?.[key] || key;
  }, [lang]);

  return (
    <AppContext.Provider value={{ theme, lang, t, toggleTheme: () => setTheme(p => p === "light" ? "dark" : "light"), toggleLang: () => setLang(p => p === "ar" ? "en" : "ar") }}>
      {children}
    </AppContext.Provider>
  );
}

export function useApp() {
  const ctx = useContext(AppContext);
  if (!ctx) throw new Error("useApp must be inside AppProvider");
  return ctx;
}