feat: Add i18n support, new content block types, course export, and lesson interaction tracking.

web/experience/src/context/I18nContext.tsx

@@ -0,0 +1,61 @@
+"use client";
+
+import React, { createContext, useContext, useState, useEffect } from 'react';
+import en from '../lib/locales/en.json';
+import es from '../lib/locales/es.json';
+import pt from '../lib/locales/pt.json';
+
+const translations: Record<string, any> = { en, es, pt };
+
+interface I18nContextType {
+    language: string;
+    setLanguage: (lang: string) => void;
+    t: (path: string) => string;
+}
+
+const I18nContext = createContext<I18nContextType | undefined>(undefined);
+
+export function I18nProvider({ children }: { children: React.ReactNode }) {
+    const [language, setLanguageState] = useState('es'); // Default to Spanish for Experience as it's more localized by default
+
+    useEffect(() => {
+        const savedLang = localStorage.getItem('experience_language');
+        if (savedLang) {
+            setLanguageState(savedLang);
+        }
+    }, []);
+
+    const setLanguage = (lang: string) => {
+        setLanguageState(lang);
+        localStorage.setItem('experience_language', lang);
+    };
+
+    const t = (path: string): string => {
+        const keys = path.split('.');
+        let result = translations[language] || translations['es'];
+
+        for (const key of keys) {
+            if (result[key]) {
+                result = result[key];
+            } else {
+                return path;
+            }
+        }
+
+        return typeof result === 'string' ? result : path;
+    };
+
+    return (
+        <I18nContext.Provider value={{ language, setLanguage, t }}>
+            {children}
+        </I18nContext.Provider>
+    );
+}
+
+export function useTranslation() {
+    const context = useContext(I18nContext);
+    if (context === undefined) {
+        throw new Error('useTranslation must be used within an I18nProvider');
+    }
+    return context;
+}