feat: Implement multi-language system (ID/EN) for member dashboard
- Create translation files (locales/id.ts, locales/en.ts) - Add LanguageContext with useLanguage hook - Add LanguageToggle component in sidebar - Default language: Indonesian (ID) - Translate WalletDialog and TransactionDialog - Language preference persisted in localStorage - Type-safe translations with autocomplete Next: Translate remaining pages (Overview, Wallets, Transactions, Profile)
This commit is contained in:
24
apps/web/src/components/LanguageToggle.tsx
Normal file
24
apps/web/src/components/LanguageToggle.tsx
Normal file
@@ -0,0 +1,24 @@
|
||||
import { useLanguage } from '@/contexts/LanguageContext'
|
||||
import { Button } from '@/components/ui/button'
|
||||
import { Languages } from 'lucide-react'
|
||||
|
||||
export function LanguageToggle() {
|
||||
const { language, setLanguage } = useLanguage()
|
||||
|
||||
const toggleLanguage = () => {
|
||||
setLanguage(language === 'id' ? 'en' : 'id')
|
||||
}
|
||||
|
||||
return (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={toggleLanguage}
|
||||
className="gap-2"
|
||||
title={language === 'id' ? 'Switch to English' : 'Ganti ke Bahasa Indonesia'}
|
||||
>
|
||||
<Languages className="h-4 w-4" />
|
||||
<span className="text-xs font-medium">{language === 'id' ? 'ID' : 'EN'}</span>
|
||||
</Button>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user