🌐 Introduce i18n

Only translate dashboard page for now

Closes #322

apps/builder/src/pages/_app.tsx

@@ -14,17 +14,14 @@ import { useRouter } from 'next/router'
 import { SupportBubble } from '@/components/SupportBubble'
 import { WorkspaceProvider } from '@/features/workspace'
 import { toTitleCase } from 'utils'
-import { Session } from 'next-auth'
 import { Plan } from 'db'
 import { trpc } from '@/lib/trpc'
 import { NewVersionPopup } from '@/components/NewVersionPopup'
+import { I18nProvider } from '@/locales'
 
 const { ToastContainer, toast } = createStandaloneToast(customTheme)
 
-const App = ({
-  Component,
-  pageProps: { session, ...pageProps },
-}: AppProps<{ session?: Session }>) => {
+const App = ({ Component, pageProps }: AppProps) => {
   useRouterProgressBar()
   const { query, pathname } = useRouter()
 
@@ -50,19 +47,21 @@ const App = ({
   return (
     <>
       <ToastContainer />
-      <ChakraProvider theme={customTheme}>
-        <SessionProvider session={session}>
-          <UserProvider>
-            <TypebotProvider typebotId={typebotId}>
-              <WorkspaceProvider typebotId={typebotId}>
-                <Component {...pageProps} />
-                <SupportBubble />
-                <NewVersionPopup />
-              </WorkspaceProvider>
-            </TypebotProvider>
-          </UserProvider>
-        </SessionProvider>
-      </ChakraProvider>
+      <I18nProvider locale={pageProps.locale}>
+        <ChakraProvider theme={customTheme}>
+          <SessionProvider session={pageProps.session}>
+            <UserProvider>
+              <TypebotProvider typebotId={typebotId}>
+                <WorkspaceProvider typebotId={typebotId}>
+                  <Component {...pageProps} />
+                  <SupportBubble />
+                  <NewVersionPopup />
+                </WorkspaceProvider>
+              </TypebotProvider>
+            </UserProvider>
+          </SessionProvider>
+        </ChakraProvider>
+      </I18nProvider>
     </>
   )
 }

apps/builder/src/pages/index.tsx

@@ -1,3 +1,4 @@
+import { getLocaleProps } from '@/locales'
 import { GetServerSidePropsContext } from 'next'
 import { getSession } from 'next-auth/react'
 
@@ -5,12 +6,28 @@ export default function Page() {
   return null
 }
 
-export const getServerSideProps = async (
-  context: GetServerSidePropsContext
-) => {
-  const session = await getSession(context)
-  if (!session?.user) {
-    return { redirect: { permanent: false, destination: '/signin' } }
+export const getServerSideProps = getLocaleProps(
+  async (context: GetServerSidePropsContext) => {
+    const session = await getSession(context)
+    if (!session?.user) {
+      return {
+        redirect: {
+          permanent: false,
+          destination:
+            context.locale !== context.defaultLocale
+              ? `/${context.locale}/signin`
+              : '/signin',
+        },
+      }
+    }
+    return {
+      redirect: {
+        permanent: false,
+        destination:
+          context.locale !== context.defaultLocale
+            ? `/${context.locale}/typebots`
+            : '/typebots',
+      },
+    }
   }
-  return { redirect: { permanent: false, destination: '/typebots' } }
-}
+)

apps/builder/src/pages/typebots.tsx

@@ -1,18 +1,21 @@
-import { NextPageContext } from 'next/types'
 import { DashboardPage } from '@/features/dashboard'
+import { getLocaleProps } from '@/locales'
+import { GetServerSidePropsContext } from 'next'
 
 export default function Page() {
   return <DashboardPage />
 }
 
-export async function getServerSideProps(context: NextPageContext) {
-  const redirectPath = context.query.redirectPath?.toString()
-  return redirectPath
-    ? {
-        redirect: {
-          permanent: false,
-          destination: redirectPath,
-        },
-      }
-    : { props: {} }
-}
+export const getServerSideProps = getLocaleProps(
+  async (context: GetServerSidePropsContext) => {
+    const redirectPath = context.query.redirectPath?.toString()
+    return redirectPath
+      ? {
+          redirect: {
+            permanent: false,
+            destination: redirectPath,
+          },
+        }
+      : { props: {} }
+  }
+)