import { createContext, useState, useEffect, useContext } from "react";

export const langContext = createContext();

export const LangProvider = ({ children }) => {
    const [lang, setLang] = useState("en"); // Estado para el idioma

    // Ahora 'event' es el objeto de evento de React
    const toggleLang = (event) => {
        // Extraemos el valor de la opción seleccionada (ej: "es" o "en")
        const newLang = event.target.value;
        console.log("Nuevo idioma seleccionado:", newLang);
        // Establecemos el estado 'lang' con el valor seleccionado
        setLang(newLang);
    }

    return (
        <langContext.Provider value={{ lang, toggleLang }}>
            {children}
        </langContext.Provider>
    );
};

export const useLang = () => useContext(langContext);