fix i18n (#196)

Fixes SSR for i18n. Looks like we were passing the wrong path for the
locales dir and also not exporting an `handle` from `root.tsx`

frontend/packages/data-portal/app/entry.server.tsx

@@ -9,14 +9,13 @@ import type { EntryContext } from '@remix-run/node'
 import { RemixServer } from '@remix-run/react'
 import { createInstance } from 'i18next'
 import Backend from 'i18next-fs-backend'
-import { resolve } from 'path'
 import { renderToString } from 'react-dom/server'
 import { I18nextProvider, initReactI18next } from 'react-i18next'
 
 import { createEmotionCache } from 'app/utils/createEmotionCache'
 
 import { i18n } from './i18next'
-import { i18next } from './i18next.server'
+import { i18next, LOCALES_PATH } from './i18next.server'
 import { theme } from './theme'
 
 export default async function handleRequest(
@@ -39,7 +38,7 @@ export default async function handleRequest(
       ...i18n,
       lng,
       ns,
-      backend: { loadPath: resolve('./public/locales/{{lng}}/{{ns}}.json') },
+      backend: { loadPath: LOCALES_PATH },
     })
 
   function MuiRemixServer() {

frontend/packages/data-portal/app/i18next.server.ts

@@ -1,10 +1,18 @@
-import { resolve } from 'node:path'
+import { dirname, resolve } from 'node:path'
+import { fileURLToPath } from 'node:url'
 
 import Backend from 'i18next-fs-backend'
 import { RemixI18Next } from 'remix-i18next'
 
 import { i18n } from './i18next'
 
+const DIRNAME = dirname(fileURLToPath(import.meta.url))
+
+export const LOCALES_PATH = resolve(
+  DIRNAME,
+  '../public/locales/{{lng}}/{{ns}}.json',
+)
+
 export const i18next = new RemixI18Next({
   detection: {
     supportedLanguages: i18n.supportedLngs,
@@ -16,7 +24,7 @@ export const i18next = new RemixI18Next({
   i18next: {
     ...i18n,
     backend: {
-      loadPath: resolve('./public/locales/{{lng}}/{{ns}}.json'),
+      loadPath: LOCALES_PATH,
     },
   },
 

frontend/packages/data-portal/app/root.tsx

@@ -127,6 +127,10 @@ export const links: LinksFunction = () => [
   ...(cssBundleHref ? [{ rel: 'stylesheet', href: cssBundleHref }] : []),
 ]
 
+export const handle = {
+  i18n: 'translation',
+}
+
 // https://remix.run/api/conventions#default-export
 // https://remix.run/api/conventions#route-filenames
 export default function App() {