YKI:AKR:OTR:VKT(Frontend): react routing fix for front page (#648)

Also title translations
Opetushallitus · Mar 6, 2024 · 2ef6480 · 2ef6480
1 parent c841415
commit 2ef6480
Show file tree

Hide file tree

Showing 14 changed files with 211 additions and 60 deletions.
diff --git a/frontend/packages/akr/public/i18n/en-GB/common.json b/frontend/packages/akr/public/i18n/en-GB/common.json
@@ -4,7 +4,7 @@
       "acceptTerms": "Accept conditions",
       "akrLogoAlt": "Logo: Authorised translator’s examination system.",
       "appNameAbbreviation": "AKR",
-      "appTitle": "Register of authorised translators | Finnish National Agency for Education",
+      "appTitle": "Register of authorised translators - Finnish National Agency for Education",
       "back": "Back",
       "backToHomePage": "Back to front page",
       "cancel": "Cancel",
@@ -31,7 +31,14 @@
       "requiredFieldsInfo": "Fields marked with a star (*) are mandatory.",
       "save": "Save",
       "send": "Send",
-      "yes": "Yes"
+      "yes": "Yes",
+      "pageTitle": {
+        "frontPage": "Front page",
+        "notFound": "Page not found",
+        "clerkHomepage": "Administrator",
+        "accessibilityStatement": "Accessibility statement",
+        "privacyPolicy": "Privacy policy statement"
+      }
     }
   }
 }
diff --git a/frontend/packages/akr/public/i18n/fi-FI/common.json b/frontend/packages/akr/public/i18n/fi-FI/common.json
@@ -4,7 +4,7 @@
       "acceptTerms": "Hyväksy ehdot",
       "akrLogoAlt": "Logo: Auktorisoidun kääntäjän tutkintojärjestelmä.",
       "appNameAbbreviation": "AKR",
-      "appTitle": "Auktorisoitujen kääntäjien rekisteri | Opetushallitus",
+      "appTitle": "Auktorisoitujen kääntäjien rekisteri - Opetushallitus",
       "back": "Takaisin",
       "backToHomePage": "Takaisin etusivulle",
       "cancel": "Peruuta",
@@ -32,7 +32,14 @@
       "save": "Tallenna",
       "send": "Lähetä",
       "statistics": "Tilastot",
-      "yes": "Kyllä"
+      "yes": "Kyllä",
+      "pageTitle": {
+        "frontPage": "Etusivu",
+        "notFound": "Etsimääsi sivua ei löytynyt",
+        "clerkHomepage": "Virkailija",
+        "accessibilityStatement": "Saavutettavuusseloste",
+        "privacyPolicy": "Tietosuojaseloste"
+      }
     }
   }
 }
diff --git a/frontend/packages/akr/public/i18n/sv-SE/common.json b/frontend/packages/akr/public/i18n/sv-SE/common.json
@@ -4,7 +4,7 @@
       "acceptTerms": "Acceptera villkoren",
       "akrLogoAlt": "Logo: Examenssystemet för auktoriserade translatorer.",
       "appNameAbbreviation": "AKR",
-      "appTitle": "Register över auktoriserade translatorer | Utbildningsstyrelsen",
+      "appTitle": "Register över auktoriserade translatorer - Utbildningsstyrelsen",
       "back": "Tillbaka",
       "backToHomePage": "Tillbaka till framsidan",
       "cancel": "Avbryt",
@@ -31,7 +31,14 @@
       "requiredFieldsInfo": "Fält markerade med en stjärna (*) är obligatoriska.",
       "save": "Spara",
       "send": "Sänd",
-      "yes": "Ja"
+      "yes": "Ja",
+      "pageTitle": {
+        "frontPage": "Framsida",
+        "notFound": "Sidan hittades inte",
+        "clerkHomepage": "Administratör",
+        "accessibilityStatement": "Tillgänglighetsutlåtande",
+        "privacyPolicy": "Dataskyddsbeskrivning"
+      }
     }
   }
 }
diff --git a/frontend/packages/akr/src/routers/AppRouter.tsx b/frontend/packages/akr/src/routers/AppRouter.tsx
@@ -1,4 +1,4 @@
-import { FC, useEffect } from 'react';
+import { FC } from 'react';
 import {
   createBrowserRouter,
   createRoutesFromElements,
@@ -11,6 +11,7 @@ import {
   NotifierContextProvider,
   ScrollToTop,
 } from 'shared/components';
+import { TitlePage } from 'shared/utils';
 
 import { Footer } from 'components/layouts/Footer';
 import { Header } from 'components/layouts/Header';
@@ -32,13 +33,17 @@ import { StatisticsPage } from 'pages/StatisticsPage';
 
 export const AppRouter: FC = () => {
   const translateCommon = useCommonTranslation();
+  const appTitle = translateCommon('appTitle');
 
   const ErrorToast = () => {
     useAPIErrorToast();
 
     return <></>;
   };
 
+  const createTitle = (title: string) =>
+    translateCommon('pageTitle.' + title) + ' - ' + appTitle;
+
   const Root = (
     <div className="app">
       <NotifierContextProvider>
@@ -56,49 +61,105 @@ export const AppRouter: FC = () => {
     </div>
   );
 
-  useEffect(() => {
-    document.title = translateCommon('appTitle');
-  }, [translateCommon]);
+  const FrontPage = (
+    <TitlePage title={createTitle('frontPage')}>
+      <PublicHomePage />
+    </TitlePage>
+  );
 
   const router = createBrowserRouter(
     createRoutesFromElements(
       <Route path={AppRoutes.PublicRoot} element={Root}>
-        <Route path={AppRoutes.PublicHomePage} element={<PublicHomePage />} />
-        <Route path={AppRoutes.ClerkHomePage} element={<ClerkHomePage />} />
+        <Route index={true} element={FrontPage} />
+        <Route path={AppRoutes.PublicHomePage} element={FrontPage} />
+        <Route
+          path={AppRoutes.ClerkHomePage}
+          element={
+            <TitlePage title={createTitle('clerkHomepage')}>
+              <ClerkHomePage />
+            </TitlePage>
+          }
+        />
         <Route
           path={AppRoutes.ExaminationDatesPage}
-          element={<ExaminationDatesPage />}
+          element={
+            <TitlePage title={createTitle('clerkHomepage')}>
+              <ExaminationDatesPage />
+            </TitlePage>
+          }
         />
         <Route
           path={AppRoutes.MeetingDatesPage}
-          element={<MeetingDatesPage />}
+          element={
+            <TitlePage title={createTitle('clerkHomepage')}>
+              <MeetingDatesPage />
+            </TitlePage>
+          }
+        />
+        <Route
+          path={AppRoutes.StatisticsPage}
+          element={
+            <TitlePage title={createTitle('clerkHomepage')}>
+              <StatisticsPage />
+            </TitlePage>
+          }
         />
-        <Route path={AppRoutes.StatisticsPage} element={<StatisticsPage />} />
         <Route
           path={AppRoutes.ClerkSendEmailPage}
-          element={<ClerkSendEmailPage />}
+          element={
+            <TitlePage title={createTitle('clerkHomepage')}>
+              <ClerkSendEmailPage />
+            </TitlePage>
+          }
         />
         <Route
           path={AppRoutes.ClerkTranslatorOverviewPage}
-          element={<ClerkTranslatorOverviewPage />}
+          element={
+            <TitlePage title={createTitle('clerkHomepage')}>
+              <ClerkTranslatorOverviewPage />
+            </TitlePage>
+          }
         />
         <Route
           path={AppRoutes.ClerkPersonSearchPage}
-          element={<ClerkPersonSearchPage />}
+          element={
+            <TitlePage title={createTitle('clerkHomepage')}>
+              <ClerkPersonSearchPage />
+            </TitlePage>
+          }
         />
         <Route
           path={AppRoutes.ClerkNewTranslatorPage}
-          element={<ClerkNewTranslatorPage />}
+          element={
+            <TitlePage title={createTitle('clerkHomepage')}>
+              <ClerkNewTranslatorPage />
+            </TitlePage>
+          }
         />
         <Route
           path={AppRoutes.AccessibilityStatementPage}
-          element={<AccessibilityStatementPage />}
+          element={
+            <TitlePage title={createTitle('accessibilityStatement')}>
+              <AccessibilityStatementPage />
+            </TitlePage>
+          }
         />
         <Route
           path={AppRoutes.PrivacyPolicyPage}
-          element={<PrivacyPolicyPage />}
+          element={
+            <TitlePage title={createTitle('privacyPolicy')}>
+              <PrivacyPolicyPage />
+            </TitlePage>
+          }
+        />
+        <Route
+          path={AppRoutes.NotFoundPage}
+          element={
+            <TitlePage title={createTitle('notFound')}>
+              <NotFoundPage />
+            </TitlePage>
+          }
         />
-        <Route path={AppRoutes.NotFoundPage} element={<NotFoundPage />} />
       </Route>,
     ),
   );

diff --git a/frontend/packages/otr/public/i18n/en-GB/common.json b/frontend/packages/otr/public/i18n/en-GB/common.json
@@ -3,7 +3,7 @@
     "common": {
       "allRegions": "Whole Finland",
       "appNameAbbreviation": "OTR",
-      "appTitle": "Register of legal interpreters | Finnish National Agency for Education",
+      "appTitle": "Register of legal interpreters - Finnish National Agency for Education",
       "back": "Back",
       "backToHomePage": "Back to front page",
       "cancel": "Cancel",
@@ -31,7 +31,14 @@
       "rowsPerPageLabel": "Results per page",
       "save": "Save",
       "searchResults": "Search results",
-      "yes": "Yes"
+      "yes": "Yes",
+      "pageTitle": {
+        "frontPage": "Front page",
+        "notFound": "Page not found",
+        "clerkHomepage": "Administrator",
+        "accessibilityStatement": "Accessibility statement",
+        "privacyPolicy": "Privacy policy statement"
+      }
     }
   }
 }
diff --git a/frontend/packages/otr/public/i18n/fi-FI/common.json b/frontend/packages/otr/public/i18n/fi-FI/common.json
@@ -3,7 +3,7 @@
     "common": {
       "allRegions": "Koko Suomi",
       "appNameAbbreviation": "OTR",
-      "appTitle": "Oikeustulkkirekisteri | Opetushallitus",
+      "appTitle": "Oikeustulkkirekisteri - Opetushallitus",
       "back": "Takaisin",
       "backToHomePage": "Takaisin etusivulle",
       "cancel": "Peruuta",
@@ -31,7 +31,14 @@
       "rowsPerPageLabel": "Tulokset per sivu",
       "save": "Tallenna",
       "searchResults": "Hakutulokset",
-      "yes": "Kyllä"
+      "yes": "Kyllä",
+      "pageTitle": {
+        "frontPage": "Etusivu",
+        "notFound": "Etsimääsi sivua ei löytynyt",
+        "clerkHomepage": "Virkailija",
+        "accessibilityStatement": "Saavutettavuusseloste",
+        "privacyPolicy": "Tietosuojaseloste"
+      }
     }
   }
 }
diff --git a/frontend/packages/otr/public/i18n/sv-SE/common.json b/frontend/packages/otr/public/i18n/sv-SE/common.json
@@ -3,7 +3,7 @@
     "common": {
       "allRegions": "Hela Finland",
       "appNameAbbreviation": "OTR",
-      "appTitle": "Registret över rättstolkar | Utbildningsstyrelsen",
+      "appTitle": "Registret över rättstolkar - Utbildningsstyrelsen",
       "back": "Tillbaka",
       "backToHomePage": "Tillbaka till framsidan",
       "cancel": "Avbryt",
@@ -31,7 +31,14 @@
       "rowsPerPageLabel": "Resultat per sida",
       "save": "Spara",
       "searchResults": "Sökresultat",
-      "yes": "Ja"
+      "yes": "Ja",
+      "pageTitle": {
+        "frontPage": "Framsida",
+        "notFound": "Sidan hittades inte",
+        "clerkHomepage": "Administratör",
+        "accessibilityStatement": "Tillgänglighetsutlåtande",
+        "privacyPolicy": "Dataskyddsbeskrivning"
+      }
     }
   }
 }