diff --git a/frontend/src/contexts/LanguageContext.tsx b/frontend/src/contexts/LanguageContext.tsx new file mode 100644 index 00000000..58574f33 --- /dev/null +++ b/frontend/src/contexts/LanguageContext.tsx @@ -0,0 +1,89 @@ +import React, { createContext, useContext, useState, useEffect, ReactNode } from 'react'; +import AsyncStorage from '@react-native-async-storage/async-storage'; +import { translations, supportedLocales } from '../config/i18n'; + +type Locale = typeof supportedLocales[number]; + +interface LanguageContextType { + locale: Locale; + setLocale: (locale: Locale) => Promise; + t: (key: string, params?: Record) => string; +} + +const LanguageContext = createContext(undefined); + +const STORAGE_KEY = 'appLanguage'; + +export function LanguageProvider({ children }: { children: ReactNode }) { + const [locale, setLocaleState] = useState('en'); + + useEffect(() => { + loadSavedLanguage(); + }, []); + + const loadSavedLanguage = async () => { + try { + const saved = await AsyncStorage.getItem(STORAGE_KEY); + if (saved && supportedLocales.includes(saved as Locale)) { + setLocaleState(saved as Locale); + } + } catch (error) { + console.error('Error loading saved language:', error); + } + }; + + const setLocale = async (newLocale: Locale) => { + try { + await AsyncStorage.setItem(STORAGE_KEY, newLocale); + setLocaleState(newLocale); + } catch (error) { + console.error('Error saving language:', error); + } + }; + + const t = (key: string, params?: Record): string => { + const keys = key.split('.'); + let value: any = translations[locale]; + + for (const k of keys) { + if (value && typeof value === 'object') { + value = value[k]; + } else { + value = translations['en']; + for (const k of keys) { + if (value && typeof value === 'object') { + value = value[k]; + } else { + return key; + } + } + break; + } + } + + if (typeof value === 'string') { + if (params) { + Object.keys(params).forEach((paramKey) => { + value = value.replace(`{{${paramKey}}}`, params[paramKey]); + }); + } + return value; + } + + return key; + }; + + return ( + + {children} + + ); +} + +export function useLanguage() { + const context = useContext(LanguageContext); + if (!context) { + throw new Error('useLanguage must be used within LanguageProvider'); + } + return context; +}