Merged in feat/lokalise-rebuild (pull request #2993)

Feat/lokalise rebuild

* chore(lokalise): update translation ids

* chore(lokalise): easier to switch between projects

* chore(lokalise): update translation ids

* .

* .

* .

* .

* .

* .

* chore(lokalise): update translation ids

* chore(lokalise): update translation ids

* .

* .

* .

* chore(lokalise): update translation ids

* chore(lokalise): update translation ids

* .

* .

* chore(lokalise): update translation ids

* chore(lokalise): update translation ids

* chore(lokalise): new translations

* merge

* switch to errors for missing id's

* merge

* sync translations


Approved-by: Linus Flood

apps/partner-sas/app/[lang]/debug/page.tsx

@@ -1,54 +0,0 @@
-import { BookingWidget } from "@scandic-hotels/booking-flow/BookingWidget"
-import { parseBookingWidgetSearchParams } from "@scandic-hotels/booking-flow/utils/url"
-import { Typography } from "@scandic-hotels/design-system/Typography"
-
-import { bookingFlowConfig } from "@/constants/bookingFlowConfig"
-import { serverClient } from "@/lib/trpc"
-
-import { getIntl } from "@/i18n"
-import { getLang } from "@/i18n/serverContext"
-
-import { ClientComponent } from "../../../components/ClientComponent"
-
-type SearchParams<S = object> = {
-  searchParams: Promise<S & { [key: string]: string }>
-}
-
-export default async function Debug(props: SearchParams) {
-  const searchParams = await props.searchParams
-  const intl = await getIntl()
-  const lang = await getLang()
-  const caller = await serverClient()
-  const destinations = await caller.autocomplete.destinations({
-    lang,
-    includeTypes: ["hotels"],
-    query: "Göteborg",
-  })
-  const hotel = destinations.hits.hotels[0].name
-
-  const booking = parseBookingWidgetSearchParams(searchParams)
-
-  return (
-    <div style={{ padding: "20px" }}>
-      <Typography>
-        {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
-        <p>from booking-flow package:</p>
-      </Typography>
-      <BookingWidget booking={booking} lang={lang} config={bookingFlowConfig} />
-      <hr />
-      <Typography variant="Title/Decorative/lg">
-        {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
-        <p>hello world with data: {hotel}</p>
-      </Typography>
-      <Typography>
-        {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
-        <p>
-          translated:
-          {intl.formatMessage({ defaultMessage: "Map of the city" })}
-        </p>
-      </Typography>
-      <hr />
-      <ClientComponent />
-    </div>
-  )
-}

apps/partner-sas/app/[lang]/hotelreservation/(standard)/alternative-hotels/map/page.tsx

@@ -36,6 +36,7 @@ export async function generateMetadata({
 
   const title = intl.formatMessage(
     {
+      id: "alternativeHotels.title",
       defaultMessage: "Alternatives for {value}",
     },
     {

apps/partner-sas/app/[lang]/hotelreservation/(standard)/alternative-hotels/page.tsx

@@ -36,6 +36,7 @@ export async function generateMetadata({
 
   const title = intl.formatMessage(
     {
+      id: "alternativeHotels.title",
       defaultMessage: "Alternatives for {value}",
     },
     {

apps/partner-sas/components/ClientComponent.tsx

@@ -1,27 +0,0 @@
-/* eslint-disable formatjs/no-literal-string-in-jsx */
-"use client"
-import { useIntl } from "react-intl"
-
-import { Lang } from "@scandic-hotels/common/constants/language"
-import { trpc } from "@scandic-hotels/trpc/client"
-
-export function ClientComponent() {
-  const intl = useIntl()
-  const { data, isLoading } = trpc.autocomplete.destinations.useQuery({
-    lang: Lang.en,
-    includeTypes: ["hotels"],
-    query: "Malmö",
-  })
-
-  return (
-    <div>
-      <p>client component</p>
-      <p>Data: {JSON.stringify(data?.hits?.hotels[0]?.name)}</p>
-      <p>Is loading: {isLoading ? "Yes" : "No"}</p>
-      <p>Translated text: </p>
-      {intl.formatMessage({
-        defaultMessage: "All-day breakfast",
-      })}
-    </div>
-  )
-}

apps/partner-sas/components/Footer/Footer.tsx

@@ -33,6 +33,7 @@ export async function Footer() {
           <p>
             {intl.formatMessage(
               {
+                id: "footer.copyright",
                 defaultMessage:
                   "© {currentYear} Scandic Hotels all rights reserved",
               },

apps/partner-sas/components/LanguageSwitcher/index.tsx

@@ -180,6 +180,7 @@ function LanguageSwitcherContent({
           <Typography variant={"Title/Subtitle/md"}>
             <h3 className={styles.title}>
               {intl.formatMessage({
+                id: "common.selectYourLanguage",
                 defaultMessage: "Select your language",
               })}
             </h3>

apps/partner-sas/components/Menu/FooterMenu/index.tsx

@@ -38,17 +38,26 @@ export function FooterMenu() {
             href={routeToScandicWeb(customerService)[lang]}
             className={styles.link}
           >
-            {intl.formatMessage({ defaultMessage: "Contact us" })}
+            {intl.formatMessage({
+              id: "common.contactUs",
+              defaultMessage: "Contact us",
+            })}
           </Link>
         </Typography>
         <Typography variant="Body/Paragraph/mdRegular">
           <Link href={routeToScandicWeb(faq)[lang]} className={styles.link}>
-            {intl.formatMessage({ defaultMessage: "FAQ" })}
+            {intl.formatMessage({
+              id: "common.faq",
+              defaultMessage: "FAQ",
+            })}
           </Link>
         </Typography>
         <Typography variant="Body/Paragraph/mdRegular">
           <Link href={routeToScandicWeb(rates)[lang]} className={styles.link}>
-            {intl.formatMessage({ defaultMessage: "Rates" })}
+            {intl.formatMessage({
+              id: "partnerSas.footer.rates",
+              defaultMessage: "Rates",
+            })}
           </Link>
         </Typography>
         <Typography variant="Body/Paragraph/mdRegular">
@@ -56,7 +65,10 @@ export function FooterMenu() {
             href={routeToScandicWeb(policies)[lang]}
             className={styles.link}
           >
-            {intl.formatMessage({ defaultMessage: "Policies" })}
+            {intl.formatMessage({
+              id: "partnerSas.footer.policies",
+              defaultMessage: "Policies",
+            })}
           </Link>
         </Typography>
         <Typography variant="Body/Paragraph/mdRegular">
@@ -64,7 +76,10 @@ export function FooterMenu() {
             href={routeToScandicWeb(sasEuroBonus)[lang]}
             className={styles.link}
           >
-            {intl.formatMessage({ defaultMessage: "SAS EuroBonus" })}
+            {intl.formatMessage({
+              id: "partnerSas.sasEuroBonus",
+              defaultMessage: "SAS EuroBonus",
+            })}
           </Link>
         </Typography>
       </div>

apps/partner-sas/components/Menu/MobileMenu/index.tsx

@@ -14,9 +14,11 @@ export function MobileMenu({ children }: React.PropsWithChildren) {
   const intl = useIntl()
 
   const closeMsg = intl.formatMessage({
+    id: "header.closeMenu",
     defaultMessage: "Close menu",
   })
   const openMsg = intl.formatMessage({
+    id: "header.openMenu",
     defaultMessage: "Open menu",
   })
 
@@ -41,6 +43,7 @@ export function MobileMenu({ children }: React.PropsWithChildren) {
         <Dialog
           className={styles.dialog}
           aria-label={intl.formatMessage({
+            id: "header.menu",
             defaultMessage: "Menu",
           })}
         >

apps/partner-sas/components/Menu/NavigationMenu/index.tsx

@@ -38,7 +38,10 @@ export function NavigationMenu({ isMobile = false }: { isMobile?: boolean }) {
           {isMobile ? null : (
             <MaterialIcon icon="call" size={16} color={"CurrentColor"} />
           )}
-          {intl.formatMessage({ defaultMessage: "Contact us" })}
+          {intl.formatMessage({
+            id: "common.contactUs",
+            defaultMessage: "Contact us",
+          })}
         </Link>
       </Typography>
 

apps/partner-sas/components/Menu/UserMenu/index.tsx

@@ -65,7 +65,12 @@ export function UserMenu({ isMobile = false }: { isMobile?: boolean }) {
                   : "Body/Supporting text (caption)/smRegular"
               }
             >
-              <span>{intl.formatMessage({ defaultMessage: "Log in" })}</span>
+              <span>
+                {intl.formatMessage({
+                  id: "partnerSas.menu.login",
+                  defaultMessage: "Log in",
+                })}
+              </span>
             </Typography>
           )}
         </a>
@@ -102,6 +107,7 @@ export function UserMenu({ isMobile = false }: { isMobile?: boolean }) {
                           type="button"
                           className={styles.closeModalBtn}
                           aria-label={intl.formatMessage({
+                            id: "header.closeMenu",
                             defaultMessage: "Close menu",
                           })}
                           onPress={close}
@@ -158,7 +164,10 @@ function UserMenuContent({
           <Typography variant={"Title/Subtitle/md"}>
             <h3>
               {intl.formatMessage(
-                { defaultMessage: `Hi {fName} {lName}!` },
+                {
+                  id: "partnerSas.mobileMenu.greeting",
+                  defaultMessage: `Hi {fName} {lName}!`,
+                },
                 { fName: firstName, lName: lastName }
               )}
             </h3>
@@ -166,7 +175,12 @@ function UserMenuContent({
         )}
         <p className={styles.pointsDetails}>
           <Typography variant="Title/Overline/sm">
-            <span>{intl.formatMessage({ defaultMessage: "EB Points" })}</span>
+            <span>
+              {intl.formatMessage({
+                id: "partnerSas.menu.ebPointsTitle",
+                defaultMessage: "EB Points",
+              })}
+            </span>
           </Typography>
           <Typography variant="Title/Overline/sm">
             {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
@@ -176,6 +190,7 @@ function UserMenuContent({
             <span>
               {intl.formatMessage(
                 {
+                  id: "partnerSas.menu.ebPoints",
                   defaultMessage: "{points} points",
                 },
                 {
@@ -190,7 +205,10 @@ function UserMenuContent({
       <Typography variant={"Link/md"} className={styles.logoutLink}>
         {/* Link triggers rsc which doesn't reload complete page and shows logged in even after logout  */}
         <a href={`/${lang}/logout`}>
-          {intl.formatMessage({ defaultMessage: "Log out" })}
+          {intl.formatMessage({
+            id: "common.logOut",
+            defaultMessage: "Log out",
+          })}
         </a>
       </Typography>
     </>

apps/partner-sas/eslint.config.mjs

@@ -100,7 +100,7 @@ export default defineConfig([
       "formatjs/no-multiple-whitespaces": ["error"],
       "formatjs/no-multiple-plurals": ["error"],
       "formatjs/no-invalid-icu": ["error"],
-      "formatjs/no-id": ["error"],
+      "formatjs/enforce-id": ["error"],
       "formatjs/no-complex-selectors": ["error"],
       "formatjs/no-useless-message": ["error"],
       "formatjs/prefer-pound-in-plural": ["error"],

apps/partner-sas/i18n/dictionaries/pl.json

@@ -1,5 +1,5 @@
 {
-  "WcBpRV": [
+  "selectRate.roomSizeMinToMax": [
     {
       "type": 1,
       "value": "roomSizeMin"