Skip to main content
Glama
NewLanguageContext.jsx2.41 kB
import React, { createContext, useContext, useEffect } from 'react'; import { useTranslation } from 'react-i18next'; const LanguageContext = createContext(); export const useLanguage = () => { const context = useContext(LanguageContext); if (!context) { throw new Error('useLanguage must be used within a LanguageProvider'); } return context; }; export const LanguageProvider = ({ children }) => { const { i18n, t } = useTranslation(); const availableLanguages = [ { code: 'en', name: 'English', flag: '🇺🇸' }, { code: 'zh', name: '中文', flag: '🇨🇳' }, { code: 'es', name: 'Español', flag: '🇪🇸' }, { code: 'ko', name: '한국어', flag: '🇰🇷' }, { code: 'ja', name: '日本語', flag: '🇯🇵' }, { code: 'th', name: 'ไทย', flag: '🇹🇭' }, { code: 'vi', name: 'Tiếng Việt', flag: '🇻🇳' }, { code: 'pt', name: 'Português', flag: '🇵🇹' }, { code: 'tr', name: 'Türkçe', flag: '🇹🇷' }, { code: 'hi', name: 'हिंदी', flag: '🇮🇳' }, { code: 'it', name: 'Italiano', flag: '🇮🇹' }, { code: 'fr', name: 'Français', flag: '🇫🇷' }, { code: 'de', name: 'Deutsch', flag: '🇩🇪' }, { code: 'ru', name: 'Русский', flag: '🇷🇺' } ]; const changeLanguage = (lang) => { console.log('changeLanguage called with:', lang); i18n.changeLanguage(lang); // Update URL const params = new URLSearchParams(window.location.search); if (lang === 'en') { params.delete('lang'); } else { params.set('lang', lang); } const hash = window.location.hash || '#projects'; const queryString = params.toString(); const newUrl = `${window.location.pathname}${queryString ? `?${queryString}` : ''}${hash}`; window.history.replaceState({}, '', newUrl); }; // Set initial language from URL on mount useEffect(() => { const params = new URLSearchParams(window.location.search); const urlLang = params.get('lang'); if (urlLang && availableLanguages.some(lang => lang.code === urlLang)) { i18n.changeLanguage(urlLang); } }, [i18n, availableLanguages]); const value = { currentLanguage: i18n.language, changeLanguage, t, availableLanguages }; return ( <LanguageContext.Provider value={value}> {children} </LanguageContext.Provider> ); };

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/cjo4m06/mcp-shrimp-task-manager'

If you have feedback or need assistance with the MCP directory API, please join our Discord server