51 lines
1.7 KiB
JavaScript
51 lines
1.7 KiB
JavaScript
import React, { createContext, useContext, useState, useEffect } from 'react';
|
|
|
|
// Import translation JSON files directly
|
|
import en from '../lang/en.json';
|
|
import hi from '../lang/hi.json';
|
|
import sw from '../lang/sw.json';
|
|
import tl from '../lang/tl.json';
|
|
import ta from '../lang/ta.json';
|
|
|
|
const LanguageContext = createContext();
|
|
|
|
const translations = { en, hi, sw, tl, ta };
|
|
|
|
export const languages = [
|
|
{ code: 'en', name: 'English', nativeName: 'English', flag: '🇬🇧' },
|
|
{ code: 'hi', name: 'Hindi', nativeName: 'हिन्दी', flag: '🇮🇳' },
|
|
{ code: 'sw', name: 'Swahili', nativeName: 'Kiswahili', flag: '🇰🇪' },
|
|
{ code: 'tl', name: 'Tagalog', nativeName: 'Tagalog', flag: '🇵🇭' },
|
|
{ code: 'ta', name: 'Tamil', nativeName: 'தமிழ்', flag: '🇮🇳' }
|
|
];
|
|
|
|
export function LanguageProvider({ children }) {
|
|
const [locale, setLocale] = useState(() => {
|
|
return localStorage.getItem('app_locale') || 'en';
|
|
});
|
|
|
|
useEffect(() => {
|
|
localStorage.setItem('app_locale', locale);
|
|
document.documentElement.lang = locale;
|
|
}, [locale]);
|
|
|
|
const t = (key, fallback = '') => {
|
|
const langData = translations[locale] || translations['en'];
|
|
return langData[key] || translations['en'][key] || fallback || key;
|
|
};
|
|
|
|
return (
|
|
<LanguageContext.Provider value={{ locale, setLocale, t, languages }}>
|
|
{children}
|
|
</LanguageContext.Provider>
|
|
);
|
|
}
|
|
|
|
export function useTranslation() {
|
|
const context = useContext(LanguageContext);
|
|
if (!context) {
|
|
throw new Error('useTranslation must be used within a LanguageProvider');
|
|
}
|
|
return context;
|
|
}
|