webapp/src/renderer/_default.page.server.tsx

68 lines
1.9 KiB
TypeScript
Raw Normal View History

import type { Language } from '../context/localize'
2024-02-04 11:25:21 +00:00
import type { PageContext } from './types'
import i18next from 'i18next'
import ICU from 'i18next-icu'
2023-11-04 15:37:28 +00:00
import { generateHydrationScript, getAssets, renderToString } from 'solid-js/web'
2024-02-04 11:25:21 +00:00
import { dangerouslySkipEscape, escapeInject } from 'vike/server'
import en from '../../public/locales/en/translation.json'
import ru from '../../public/locales/ru/translation.json'
2023-02-17 09:21:02 +00:00
import { App } from '../components/App'
import { initRouter } from '../stores/router'
export const passToClient = ['pageProps', 'lng', 'documentProps', 'is404']
2023-02-17 09:21:02 +00:00
const getLng = (pageContext: PageContext): Language => {
const { urlParsed, cookies } = pageContext
if (urlParsed.search.lng) {
return urlParsed.search.lng === 'en' ? 'en' : 'ru'
}
if (cookies?.lng === 'en') {
return 'en'
}
return 'ru'
}
export const render = async (pageContext: PageContext) => {
const lng = getLng(pageContext)
if (!i18next.isInitialized) {
2023-05-01 18:32:32 +00:00
// eslint-disable-next-line import/no-named-as-default-member
await i18next.use(ICU).init({
2023-02-17 09:21:02 +00:00
// debug: true,
supportedLngs: ['ru', 'en'],
fallbackLng: lng,
initImmediate: false,
lng,
resources: {
ru: { translation: ru },
en: { translation: en },
},
2023-02-17 09:21:02 +00:00
})
} else if (i18next.language !== lng) {
2023-11-04 15:37:28 +00:00
// eslint-disable-next-line import/no-named-as-default-member
await i18next.changeLanguage(lng)
2023-02-17 09:21:02 +00:00
}
2023-11-18 15:20:15 +00:00
initRouter(pageContext.urlParsed.pathname, pageContext.urlParsed.search)
2023-02-17 09:21:02 +00:00
pageContext.lng = lng
2023-11-18 15:20:15 +00:00
const rootContent = renderToString(() => <App {...pageContext.pageProps} is404={pageContext.is404} />)
2023-02-17 09:21:02 +00:00
return escapeInject`<!DOCTYPE html>
<html lang="${lng}">
<head>
2023-11-04 15:37:28 +00:00
${dangerouslySkipEscape(getAssets())}
2023-02-17 09:21:02 +00:00
</head>
<body>
<div id="root">${dangerouslySkipEscape(rootContent)}</div>
${dangerouslySkipEscape(generateHydrationScript())}
2023-02-17 09:21:02 +00:00
</body>
</html>`
}