🌍 Language Switching Demo

Test the multi-language functionality of cPiggyFX

🌍 Language Demo - Current Language

🏠 Home

Title: 🐷 cPiggyFX: Diversified FX Piggy Bank

Subtitle: Save in cCOP, grow in the world.

Create Button: Create a New Piggy

View Button: View My Piggies

βž• Create

Title: Create Your Piggy

Amount: Amount (cCOP)

Duration: Lock Duration

Risk Mode: Risk Mode

πŸ“Š Dashboard

Title: My Piggies

No Piggies: No Piggies found. Create your first one!

Status Active: Active

Claim: Claim

πŸ”§ Settings

Loading: Loading...

Error: Error

Success: Success

Cancel: Cancel

πŸ’‘ How it works:

  • β€’ IP Detection: Automatically detects your country and sets language
  • β€’ Browser Language: Falls back to your browser's preferred language
  • β€’ Manual Override: Use the language switcher to change anytime
  • β€’ Persistent: Your choice is saved in localStorage

πŸš€ Features Implemented

βœ… Automatic Detection

  • β€’ IP geolocation detection
  • β€’ Browser language preference
  • β€’ Country-based language mapping
  • β€’ Fallback to English

βœ… User Control

  • β€’ Manual language switching
  • β€’ Persistent user preferences
  • β€’ Real-time language updates
  • β€’ Smooth transitions

πŸ”§ Technical Implementation

Hook: useLanguageDetection - Detects language from IP, browser, and user preferences

Context: LanguageContext - Manages language state across the app

Component: LanguageSwitcher - UI for manual language selection

Translation: t() function - Retrieves text based on current language

Storage: localStorage - Persists user language choice