Add shared catalog for shared-webapp/ui translations and merge at runtime

Author: tjementum

.claude/rules/frontend/translations.md

@@ -14,13 +14,16 @@ Guidelines for implementing translations and internationalization in the fronten
 3. Always use plain English text in translation markers
 4. Don't hardcode text without proper translation wrappers
 5. Use "Sentence case" for everything (buttons, menus, headings, etc.)
-6. **Lingui macros work in `shared-webapp/ui` components**. The SWC plugin runs in source-build mode across all workspace packages, and each self-contained system's `createLinguiConfig()` includes `shared-webapp/ui/**/*.{ts,tsx}` in its extraction scope. This means every shared UI component auto-generates catalog entries in every self-contained system (main, account, back-office) independently. Prefer macros over threading translatable text through props -- only accept a text prop when a consumer genuinely needs to override the default (e.g., context-specific wording). Note: shared strings must be translated in every self-contained system's `*.po` files -- translation workflow must keep all three self-contained systems in sync
+6. **Catalogs are split between the shared component library and each self-contained system**:
+   - Markers in `application/shared-webapp/ui/**` extract to `application/shared-webapp/ui/translations/locale/{locale}.po` — one shared catalog used by every app
+   - Markers in `application/<system>/WebApp/**` extract to that system's `shared/translations/locale/{locale}.po`
+   - At runtime, `createFederatedTranslation` merges them: shared underneath, system on top, federated remote (e.g. account loaded into main) on top of that
+   - Translate each shared string **once** in the shared catalog, not in every system's catalog
+   - Prefer Lingui macros inside `shared-webapp/ui` components over threading translatable text through props -- only accept a text prop when a consumer genuinely needs to override the default (e.g., context-specific wording)
 7. Translation workflow:
-   - Translation files are in `shared/translations/locale/` (e.g., `da-DK.po`, `en-US.po`)
-   - After adding/changing `<Trans>` or t\`\` markers, the `*.po` files are auto-generated/updated by the build system
-   - Don't manually add or remove entries to `*.po` files
-   - After auto-generation, translate all new/updated entries in `*.po` files for all supported languages
-   - Only translate `msgstr` values—never change `msgid` values
+   - After adding/changing `<Trans>` or t\`\` markers, the `*.po` files are auto-regenerated on build
+   - Don't manually add or remove `msgid` entries -- only translate `msgstr` values
+   - After auto-generation, translate all new/updated entries for all supported languages
 8. **Use correct language-specific characters** in translations -- e.g., Danish requires æøå/ÆØÅ, not ae/oe/aa substitutes. Never approximate with ASCII equivalents
 9. Don't translate fully dynamic content such as variable values or dynamic text
 9. **Domain terminology consistency**:

application/account/WebApp/routes/components/-components/PreviewAvatarMenu.tsx

@@ -2,6 +2,7 @@ import { t } from "@lingui/core/macro";
 import { useLingui } from "@lingui/react";
 import { Trans } from "@lingui/react/macro";
 import { preferredLocaleKey } from "@repo/infrastructure/translations/constants";
+import localeMap from "@repo/infrastructure/translations/i18n.config.json";
 import { type Locale, translationContext } from "@repo/infrastructure/translations/TranslationContext";
 import { Avatar, AvatarFallback } from "@repo/ui/components/Avatar";
 import {
@@ -81,7 +82,9 @@ function FakeProfileCard() {
 export function PreviewAvatarMenu() {
   const isCollapsed = useContext(collapsedContext);
   const { theme, setTheme, resolvedTheme } = useTheme();
-  const { setLocale, getLocaleInfo, locales } = use(translationContext);
+  const { setLocale } = use(translationContext);
+  const locales = Object.keys(localeMap) as Locale[];
+  const getLocaleInfo = (locale: Locale) => localeMap[locale];
   const { i18n } = useLingui();
   const currentLocale = i18n.locale as Locale;
   const [currentZoomLevel, setCurrentZoomLevel] = useState("1");

application/account/WebApp/shared/translations/locale/da-DK.po

@@ -13,10 +13,6 @@ msgstr ""
 "Plural-Forms: \n"
 "X-Generator: @lingui/cli\n"
 
-#. placeholder {0}: -diffDays
-msgid "{0, plural, one {# day ago} other {# days ago}}"
-msgstr "{0, plural, one {for # dag siden} other {for # dage siden}}"
-
 #. placeholder {0}: result.value
 msgid "{0, plural, one {# hour ago} other {# hours ago}}"
 msgstr "{0, plural, one {# time siden} other {# timer siden}}"
@@ -64,9 +60,6 @@ msgstr "{0}/måned"
 msgid "{deletedCount} users permanently deleted"
 msgstr "{deletedCount} brugere slettet permanent"
 
-msgid "{diffDays, plural, one {In # day} other {In # days}}"
-msgstr "{diffDays, plural, one {Om # dag} other {Om # dage}}"
-
 msgid "{price}/month"
 msgstr "{price}/måned"
 
@@ -479,9 +472,6 @@ msgstr "Bunddrawer"
 msgid "Bottom sheet"
 msgstr "Bundsheet"
 
-msgid "Breadcrumb"
-msgstr "Brødkrumme"
-
 msgid "Breadcrumb — custom separator"
 msgstr "Brødkrumme — brugerdefineret skilletegn"
 
@@ -665,12 +655,6 @@ msgstr "By"
 msgid "Clear"
 msgstr "Ryd"
 
-msgid "Clear date"
-msgstr "Ryd dato"
-
-msgid "Clear dates"
-msgstr "Ryd datoer"
-
 msgid "Clear filters"
 msgstr "Ryd filtre"
 
@@ -683,15 +667,9 @@ msgstr "Klik på en række for at åbne sidepanelet. Brug Shift eller Cmd/Ctrl s
 msgid "Close"
 msgstr "Luk"
 
-msgid "Close menu"
-msgstr "Luk menu"
-
 msgid "Close recipe details"
 msgstr "Luk opskriftsdetaljer"
 
-msgid "Close sidebar"
-msgstr "Luk sidemenu"
-
 msgid "Close user profile"
 msgstr "Luk brugerprofil"
 
@@ -794,9 +772,6 @@ msgstr "Land"
 msgid "Create"
 msgstr "Opret"
 
-msgid "Create <0>{search}</0>"
-msgstr "Opret <0>{search}</0>"
-
 msgid "Create new account"
 msgstr "Opret ny konto"
 
@@ -893,9 +868,6 @@ msgstr "Afslå"
 msgid "Declining..."
 msgstr "Afslår..."
 
-msgid "Decrease"
-msgstr "Formindsk"
-
 msgid "Default"
 msgstr "Standard"
 
@@ -1023,9 +995,6 @@ msgstr "Slip et billede i et vilkårligt kort — AspectRatio holder feltet fast
 msgid "Drop anywhere to add to the gallery"
 msgstr "Slip et vilkårligt sted for at tilføje til galleriet"
 
-msgid "Drop files here, or click to browse"
-msgstr "Slip filer her, eller klik for at vælge"
-
 msgid "Drop your filter controls here. The sheet handles scrolling and dismissal."
 msgstr "Placér dine filterkontroller her. Sheet håndterer scrolling og lukning."
 
@@ -1266,12 +1235,6 @@ msgstr "Gå til kontoindstillinger"
 msgid "Go to home"
 msgstr "Gå til forsiden"
 
-msgid "Go to next page"
-msgstr "Gå til næste side"
-
-msgid "Go to previous page"
-msgstr "Gå til forrige side"
-
 msgid "Google"
 msgstr "Google"
 
@@ -1323,9 +1286,6 @@ msgstr "I selve appen er sidemenuen fixed-positioneret, gemmer sin tilstand og b
 msgid "Include cooking notes"
 msgstr "Inkluder tilberedningsnoter"
 
-msgid "Increase"
-msgstr "Forøg"
-
 msgid "Indeterminate"
 msgstr "Ubestemt"
 
@@ -1524,9 +1484,6 @@ msgstr "Linkvarianter"
 msgid "LinkedIn"
 msgstr "LinkedIn"
 
-msgid "Loading"
-msgstr ""
-
 msgid "Loading..."
 msgstr "Indlæser..."
 
@@ -1647,9 +1604,6 @@ msgstr "Midte"
 msgid "Mobile"
 msgstr "Mobil"
 
-msgid "Mobile navigation menu"
-msgstr "Mobilnavigationsmenu"
-
 msgid "Mobile-first sheet with a drag handle and swipe-to-dismiss. Reach for it when content is short and the user should be able to flick it away. Left and right drawers are narrow by default; top and bottom span the full width unless you constrain DrawerContent with mx-auto and max-w-*."
 msgstr "Mobile-first panel med trækhåndtag og swipe-to-dismiss. Brug det når indholdet er kort og brugeren skal kunne flicke det væk. Venstre- og højre-drawers er smalle som standard; top og bund spænder fuld bredde med mindre du begrænser DrawerContent med mx-auto og max-w-*."
 
@@ -1668,9 +1622,6 @@ msgstr "Flere eksportmuligheder"
 msgid "More merge options"
 msgstr "Flere fletmuligheder"
 
-msgid "More pages"
-msgstr "Flere sider"
-
 msgid "More save options"
 msgstr "Flere gemgemuligheder"
 
@@ -1812,15 +1763,9 @@ msgstr "Kun ejere kan ændre brugerroller"
 msgid "Only trusted personnel access data through Azure AD authentication"
 msgstr "Kun betroet personale får adgang til data gennem Azure AD autentificering"
 
-msgid "Open calendar"
-msgstr ""
-
 msgid "Open command palette"
 msgstr "Åbn kommandopalette"
 
-msgid "Open navigation menu"
-msgstr "Åbn navigationsmenu"
-
 msgid "Open side pane"
 msgstr "Åbn sidepanel"
 
@@ -1872,9 +1817,6 @@ msgstr "Siden blev ikke fundet"
 msgid "Page Views"
 msgstr "Sidevisninger"
 
-msgid "Pagination"
-msgstr "Paginering"
-
 msgid "Palak paneer"
 msgstr "Palak paneer"
 
@@ -2192,9 +2134,6 @@ msgstr "Justerbar app-skal"
 msgid "Resizable panels"
 msgstr "Justerbare paneler"
 
-msgid "Resize sidebar"
-msgstr "Ændr bredde på sidepanel"
-
 msgid "Responsive layout"
 msgstr "Responsivt layout"
 
@@ -2343,9 +2282,6 @@ msgstr "Vælg land"
 msgid "Select dates"
 msgstr "Vælg datoer"
 
-msgid "Select time zone"
-msgstr "Vælg tidszone"
-
 msgid "Select with groups"
 msgstr "Vælg med grupper"
 
@@ -2424,9 +2360,6 @@ msgstr "Vis detaljer"
 msgid "Show dismissable banner"
 msgstr "Vis afliveligt banner"
 
-msgid "Show more"
-msgstr "Vis flere"
-
 msgid "Show search filters"
 msgstr "Vis søgefiltre"
 
@@ -2484,9 +2417,6 @@ msgstr "Enkelt-udfoldning vs multi-udfoldning"
 msgid "Skeleton"
 msgstr "Skelet"
 
-msgid "Skip to main content"
-msgstr "Spring til hovedindhold"
-
 msgid "SLA"
 msgstr "SLA"
 
@@ -2722,9 +2652,6 @@ msgstr "Titel"
 msgid "To delete your account, please contact our support team."
 msgstr "For at slette din konto bedes du kontakte vores supportteam."
 
-msgid "Today"
-msgstr "I dag"
-
 msgid "Toggle bold"
 msgstr "Skift fed"
 
@@ -2737,18 +2664,12 @@ msgstr "Skiftegruppe"
 msgid "Toggle italic"
 msgstr "Skift kursiv"
 
-msgid "Toggle sidebar"
-msgstr "Skift sidepanel"
-
 msgid "Toggle underline"
 msgstr "Skift understregning"
 
 msgid "Tom yum soup"
 msgstr "Tom yum-suppe"
 
-msgid "Tomorrow"
-msgstr "I morgen"
-
 msgid "Tonkotsu ramen"
 msgstr "Tonkotsu ramen"