damus.io

commit 2c18c0d0d951440e3a6c4869c10a3710efd78cf4
parent 7eb8fc8684e2ef1ab3702d24b9cea2bdd12eaab1
Author: Daniel D’Aquino <daniel@daquino.me>
Date:   Tue, 31 Oct 2023 04:53:27 +0000

Add language detection logic to main page

Signed-off-by: Daniel D’Aquino <daniel@daquino.me>
Signed-off-by: William Casarin <jb55@jb55.com>

Diffstat:
M
src/pages/index.tsx
 | 
28
++++++++++++++++++++++++++--

1 file changed, 26 insertions(+), 2 deletions(-)
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -15,14 +15,38 @@ import { Contribute } from '@/components/sections/Contribute';
 import { FinalCTA } from '@/components/sections/FinalCTA';
 import { Benefits } from '@/components/sections/Benefits';
 import { Home } from '@/components/pages/home';
+import { useEffect, useMemo } from 'react';
+import { useState } from 'react';
 
 const inter = Inter({ subsets: ['latin'] })
 
 export default function HomePage() {
+  // Automatically detect the user's locale based on their browser settings
+  const [language, setLanguage] = useState("en");
+  const [messages, setMessages] = useState(English);
+
+  useEffect(() => {
+    setLanguage(navigator.language);
+  }, []);
+
+  useEffect(() => {
+    switch (language) {
+      case "en":
+        setMessages(English);
+        break;
+      case "ja":
+        setMessages(Japanese);
+        break;
+      default:
+        setMessages(English);
+        break;
+    }
+  }, [language]);
+
   return (<>
     <IntlProvider
-            locale={"en"}
-            messages={English}
+            locale={language}
+            messages={messages}
             onError={() => null}>
       <Home/>
     </IntlProvider>