#428

frontend/src/main.tsx

@@ -1,13 +1,17 @@
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { createRoot } from 'react-dom/client'
+import { QueryClient, QueryClientProvider, hydrate } from '@tanstack/react-query'
+import { createRoot, hydrateRoot } from 'react-dom/client'
 import { HelmetProvider } from 'react-helmet-async'
 import { I18nextProvider } from 'react-i18next'
 
 import '@/index.css'
 import App from '@/App'
-import { i18n } from '@/lib/i18n'
+import { createUII18n } from '@/lib/i18n'
+import { prepareHelpPage } from '@/lib/help'
+import { currentViewingLocale } from '@/lib/locales'
 import { applyClientAnimationMode, getClientAnimationMode } from '@/lib/settings'
 
+import type { DehydratedState } from '@tanstack/react-query'
+
 const helmetContext = { }
 
 const client = new QueryClient ({
@@ -16,13 +20,31 @@ const client = new QueryClient ({
 		   gcTime:    30 * 60 * 1000,
 		   retry:     1 } } })
 
-applyClientAnimationMode (getClientAnimationMode ())
 
-createRoot (document.getElementById ('root')!).render (
-    <HelmetProvider context={helmetContext}>
-      <QueryClientProvider client={client}>
-	<I18nextProvider i18n={i18n}>
-	  <App/>
-	</I18nextProvider>
-      </QueryClientProvider>
-    </HelmetProvider>)
+const start = async () => {
+  const bootstrap = document.getElementById ('ssr-state')
+  if (bootstrap?.textContent)
+  {
+    const data = JSON.parse (bootstrap.textContent) as { state: DehydratedState }
+    hydrate (client, data.state)
+    await prepareHelpPage (client, new URL (window.location.href))
+  }
+  const instance = createUII18n (currentViewingLocale ())
+  const app = (
+      <HelmetProvider context={helmetContext}>
+	<QueryClientProvider client={client}>
+	  <I18nextProvider i18n={instance}>
+	    <App/>
+	  </I18nextProvider>
+	</QueryClientProvider>
+      </HelmetProvider>)
+  const root = document.getElementById ('root')!
+  if (bootstrap != null)
+    hydrateRoot (root, app)
+  else
+    createRoot (root).render (app)
+  applyClientAnimationMode (getClientAnimationMode ())
+}
+
+
+void start ()