index.tsx (1110B)
1 import { Inter } from 'next/font/google' 2 import { IntlProvider, useIntl } from 'react-intl' 3 import English from "@/../content/compiled-locales/en.json"; 4 import Japanese from "@/../content/compiled-locales/ja.json"; 5 import { useEffect } from 'react'; 6 import { useState } from 'react'; 7 import { Purple } from '@/components/pages/purple'; 8 9 export default function HomePage() { 10 // Automatically detect the user's locale based on their browser settings 11 const [language, setLanguage] = useState("en"); 12 const [messages, setMessages] = useState(English); 13 14 useEffect(() => { 15 setLanguage(navigator.language); 16 }, []); 17 18 useEffect(() => { 19 switch (language) { 20 case "en": 21 setMessages(English); 22 break; 23 case "ja": 24 // TODO: Add Japanese translations and then switch to "Japanese" below 25 setMessages(English); 26 break; 27 default: 28 setMessages(English); 29 break; 30 } 31 }, [language]); 32 33 return (<> 34 <IntlProvider 35 locale={language} 36 messages={messages} 37 onError={() => null}> 38 <Purple /> 39 </IntlProvider> 40 </>) 41 } 42