Chore/internationalization (#42)

New: dark mode New: internationalization New: error page
garciafdezpatricia · Jul 2, 2024 · 31b777a · 31b777a
1 parent 3ec0943
commit 31b777a
Show file tree

Hide file tree

Showing 78 changed files with 1,686 additions and 392 deletions.
diff --git a/client/i18n.js b/client/i18n.js
@@ -0,0 +1,27 @@
+import i18n from 'i18next';
+import { initReactI18next } from 'react-i18next';
+
+import Backend from 'i18next-http-backend';
+// don't want to use this?
+// have a look at the Quick start guide 
+// for passing in lng and translations on init
+
+i18n
+  .use(Backend)
+  // pass the i18n instance to react-i18next.
+  .use(initReactI18next)
+  // init i18next
+  .init({
+    lng: 'en',
+    fallbackLng: 'en',
+    debug: true,
+    interpolation: {
+      escapeValue: false,
+    },
+    backend: {
+      loadPath: `${process.env.NEXT_PUBLIC_FRONT_URL}/static/locales/{{lng}}/translation.json`,
+    },
+  });
+
+
+export default i18n;
diff --git a/client/package-lock.json b/client/package-lock.json
diff --git a/client/package.json b/client/package.json
@@ -15,13 +15,18 @@
     "@uidotdev/usehooks": "^2.4.1",
     "axios": "^1.6.7",
     "dayjs": "^1.11.10",
+    "i18next": "^23.11.5",
+    "i18next-http-backend": "^2.5.2",
     "jwt-decode": "^4.0.0",
     "next": "14.1.0",
     "react": "^18",
     "react-big-calendar": "^1.10.1",
     "react-dom": "^18",
+    "react-error-boundary": "^4.0.13",
     "react-hot-toast": "^2.4.1",
+    "react-i18next": "^14.1.2",
     "react-icons": "^5.0.1",
+    "react-responsive": "^10.0.0",
     "sass": "^1.70.0",
     "uuidv4": "^6.2.13"
   },

diff --git a/client/pages/_app.tsx b/client/pages/_app.tsx
@@ -11,6 +11,9 @@ import { SessionProvider } from "@/src/components/Context/SolidContext";
 import { useEffect, useState } from "react";
 import { useRouter } from "next/router";
 import Loader from "@/src/components/Loading/Loading";
+import '../i18n';
+import { ErrorBoundary } from "react-error-boundary";
+import Fallback from "@/src/components/Error/Error";
 
 export default function MyApp({ Component, pageProps }: AppProps) {
 
@@ -33,26 +36,28 @@ export default function MyApp({ Component, pageProps }: AppProps) {
   }, [router]);
 
   return (
-    <SessionProvider>
-      <TaskProvider>
-        <EventProvider>
-          <GoogleProvider>
-            <GithubProvider>
+    <ErrorBoundary FallbackComponent={Fallback} onReset={() => (location.href = '/')}>
+      <SessionProvider>
+        <TaskProvider>
+          <EventProvider>
+            <GoogleProvider>
+              <GithubProvider>
 
-                <SideMenu>
-                  <MenuSideBar />
-                  {loading ?
-                    <Loader />
-                    :
-                    <Component {...pageProps} />
-                  }
-                </SideMenu>
-              <Toaster />
-
-            </GithubProvider>
-          </GoogleProvider>
-        </EventProvider>
-      </TaskProvider>
-    </SessionProvider>
+                  <SideMenu>
+                    <MenuSideBar />
+                    {loading ?
+                      <Loader />
+                      :
+                      <Component {...pageProps} />
+                    }
+                  </SideMenu>
+                <Toaster />
+
+              </GithubProvider>
+            </GoogleProvider>
+          </EventProvider>
+        </TaskProvider>
+      </SessionProvider>
+    </ErrorBoundary>
   );
 }