i18n

Author: igorweber

__tests__/index.test.jsx

@@ -8,7 +8,7 @@ jest.mock('next/router', () => require('next-router-mock'));
 describe("Home", () => {
 
   beforeEach(() => {
-    mockRouter.locale = "no"
+    mockRouter.locale = "nb"
   });
 
   it("renders a heading", () => {

next.config.js

@@ -4,8 +4,8 @@ const nextConfig = {
   swcMinify: true,
   output: 'standalone',
   i18n: {
-    locales: ['no', 'en'],
-    defaultLocale: 'no',
+    locales: ['nb', 'en'],
+    defaultLocale: 'nb',
     localeDetection: false
   },
 };

src/allTexts.ts

@@ -8,12 +8,12 @@ export type TextsType = {
 }
 
 export type LocalesType = {
-  no: TextsType;
+  nb: TextsType;
   en: TextsType;
 }
 
 const allTexts: LocalesType = {
-  "no": {
+  "nb": {
     "menuSend": "Send",
     "menuHistory": "Tidligere meldekort",
     "menuAbout": "Om meldekort",

src/pages/_document.tsx

@@ -3,18 +3,30 @@ import {
   Components as DecoratorComponents,
   Env,
   fetchDecoratorReact,
-  Props as DecoratorProps,
+  Locale,
+  Props as DecoratorProps
 } from "@navikt/nav-dekoratoren-moduler/ssr";
 
-const dekoratorProps: DecoratorProps = {
-  env: process.env.NAV_DEKORATOREN_ENV as Env,
-  chatbotVisible: true,
-};
-
 export default class MyDocument extends Document<DecoratorComponents> {
   static async getInitialProps(ctx: DocumentContext) {
     const initialProps = await Document.getInitialProps(ctx);
 
+    const dekoratorProps: DecoratorProps = {
+      env: process.env.NAV_DEKORATOREN_ENV as Env,
+      chatbotVisible: true,
+      availableLanguages: [
+        {
+          locale: "nb",
+          url: "/"
+        },
+        {
+          locale: "en",
+          url: "/en"
+        }
+      ],
+      language: (ctx.locale || "nb") as Locale
+    };
+
     const Dekorator: DecoratorComponents = await fetchDecoratorReact({
       ...dekoratorProps,
     }).catch((err) => {

styles/globals.css

@@ -33,3 +33,13 @@ main {
   padding: 0 2rem;
   margin: 2rem auto 2rem;
 }
+
+.decorator-utils-container {
+  margin-bottom: -2.5rem;
+}
+
+@media (min-width: 1100px) {
+  .decorator-utils-container {
+    margin-bottom: -5.9rem;
+  }
+}