"use client";

import { createContext, useContext, type ReactNode } from "react";
import type { Locale } from "./config";
import type { Dictionary } from "./dictionary-type";
import { getDictionary } from "./get-dictionary";

interface I18nContextValue {
  locale: Locale;
  t: Dictionary;
}

const I18nContext = createContext<I18nContextValue | null>(null);

/**
 * Stellt Locale + Uebersetzungswoerterbuch fuer Client Components bereit.
 * Nimmt bewusst nur die Locale (ein String) als Prop entgegen und loest das
 * Dictionary selbst per getDictionary() auf, statt das fertige Objekt vom
 * Server-Layout hereinzureichen — Dictionaries enthalten Funktionswerte
 * (z.B. fuer Pluralformen), und Funktionen lassen sich nicht als Props von
 * Server an Client Components uebergeben (RSC-Serialisierungsgrenze).
 * Server Components rufen stattdessen direkt getDictionary(await
 * getLocale()) auf, ohne diesen Provider zu benoetigen.
 */
export function I18nProvider({ locale, children }: { locale: Locale; children: ReactNode }) {
  const dict = getDictionary(locale);
  return <I18nContext.Provider value={{ locale, t: dict }}>{children}</I18nContext.Provider>;
}

export function useI18n(): I18nContextValue {
  const ctx = useContext(I18nContext);
  if (!ctx) throw new Error("useI18n muss innerhalb von <I18nProvider> verwendet werden.");
  return ctx;
}