index.tsx (1187B)
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 import { PurpleCheckout } from '@/components/pages/purple-checkout'; 9 10 export default function HomePage() { 11 // Automatically detect the user's locale based on their browser settings 12 const [language, setLanguage] = useState("en"); 13 const [messages, setMessages] = useState(English); 14 15 useEffect(() => { 16 setLanguage(navigator.language); 17 }, []); 18 19 useEffect(() => { 20 switch (language) { 21 case "en": 22 setMessages(English); 23 break; 24 case "ja": 25 // TODO: Add Japanese translations and then switch to "Japanese" below 26 setMessages(English); 27 break; 28 default: 29 setMessages(English); 30 break; 31 } 32 }, [language]); 33 34 return (<> 35 <IntlProvider 36 locale={language} 37 messages={messages} 38 onError={() => null}> 39 <PurpleCheckout /> 40 </IntlProvider> 41 </>) 42 } 43