From bb8ae993ebe6b9de8a18c4d36498e9f7bea13c98 Mon Sep 17 00:00:00 2001
From: Jeppe Bundgaard <jb@truckwash.dk>
Date: Tue, 17 Feb 2026 12:44:45 +0100
Subject: [PATCH] Localize user dashboard and enhance translation support

- Replaced hardcoded dashboard text in `UserDashboard.vue` with dynamic translations using `$t`.
- Added new translation keys in `en.json` and `da.json` for user dashboard actions, descriptions, and messages.
- Improved multilingual support for subuser actions, empty state messages, and contact information.
---
 src/i18n/locales/da.json               | 19 ++++++++++++
 src/i18n/locales/en.json               | 19 ++++++++++++
 src/views/dashboards/UserDashboard.vue | 42 +++++++++++++-------------
 3 files changed, 59 insertions(+), 21 deletions(-)

diff --git a/src/i18n/locales/da.json b/src/i18n/locales/da.json
index 29fb5297..88ef77e2 100644
--- a/src/i18n/locales/da.json
+++ b/src/i18n/locales/da.json
@@ -198,5 +198,24 @@
     "my_vehicles": "Mine køretøjer",
     "my_bookings": "Mine bookinger",
     "my_invoices": "Mine fakturaer"
+  },
+  "user_home": {
+    "welcome": "Velkommen",
+    "select_customer": "Vælg kunde",
+    "select_customer_desc": "Som underbruger skal du vælge hvilken kunde du vil arbejde på vegne af.",
+    "empty_state_title": "Det ser tomt ud her",
+    "empty_state_desc": "Du har ikke adgang til nogen genveje. Kontakt din administrator for at få tildelt rettigheder.",
+    "start_wash": "Start vask",
+    "start_wash_desc": "Gå direkte til afdelingens vaskebaner og start en vask for dit køretøj. Vælg dit køretøj og den ønskede vasketype for at komme i gang.",
+    "book_wash": "Book vask",
+    "book_wash_desc": "Book en vask i én af vores afdelinger - med mulighed for safety seal.",
+    "create_vehicle": "Opret køretøj",
+    "create_vehicle_desc": "Tilføj et køretøj der skal kunne vaske hos Truck Wash.",
+    "download_certificates": "Download vaskecertifikater",
+    "download_certificates_desc": "Download vaske certifikater for dine tidligere vaske.",
+    "download_invoices": "Download fakturaer",
+    "download_invoices_desc": "Download dine tidligere fakturaer.",
+    "contact_info_prefix": "Ved problemer kontakt os på telefon",
+    "contact_info_or_email": "eller email"
   }
 }
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index ecf52289..082dbf4d 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -198,5 +198,24 @@
     "my_vehicles": "My Vehicles",
     "my_bookings": "My Bookings",
     "my_invoices": "My Invoices"
+  },
+  "user_home": {
+    "welcome": "Welcome",
+    "select_customer": "Select customer",
+    "select_customer_desc": "As a sub-user, you must select which customer you want to work on behalf of.",
+    "empty_state_title": "It looks empty here",
+    "empty_state_desc": "You do not have access to any shortcuts. Contact your administrator to be assigned permissions.",
+    "start_wash": "Start wash",
+    "start_wash_desc": "Go directly to the department's wash lanes and start a wash for your vehicle. Select your vehicle and the desired wash type to get started.",
+    "book_wash": "Book wash",
+    "book_wash_desc": "Book a wash at one of our departments - with the option for safety seal.",
+    "create_vehicle": "Create vehicle",
+    "create_vehicle_desc": "Add a vehicle that should be able to wash at Truck Wash.",
+    "download_certificates": "Download wash certificates",
+    "download_certificates_desc": "Download wash certificates for your previous washes.",
+    "download_invoices": "Download invoices",
+    "download_invoices_desc": "Download your previous invoices.",
+    "contact_info_prefix": "For problems contact us by phone",
+    "contact_info_or_email": "or email"
   }
 }
diff --git a/src/views/dashboards/UserDashboard.vue b/src/views/dashboards/UserDashboard.vue
index e0e21d32..188ecf66 100644
--- a/src/views/dashboards/UserDashboard.vue
+++ b/src/views/dashboards/UserDashboard.vue
@@ -130,8 +130,8 @@ const classes = computed(() => {
         <span class="icon is-large has-text-info">
           <i class="fas fa-users fa-2x"></i>
         </span>
-        <h2 class="title is-4 mt-3">Vælg kunde</h2>
-        <p class="subtitle is-6">Som underbruger skal du vælge hvilken kunde du vil arbejde på vegne af.</p>
+        <h2 class="title is-4 mt-3">{{ $t('user_home.select_customer') }}</h2>
+        <p class="subtitle is-6">{{ $t('user_home.select_customer_desc') }}</p>
       </div>
       <SubuserGrantSelector :showLabel="false" />
     </div>
@@ -141,15 +141,15 @@ const classes = computed(() => {
       <span class="icon is-large has-text-grey-light">
         <i class="fas fa-inbox fa-3x"></i>
       </span>
-      <h2 class="title is-4 mt-4 has-text-grey">Det ser tomt ud her</h2>
-      <p class="subtitle is-6 has-text-grey">Du har ikke adgang til nogen genveje. Kontakt din administrator for at få tildelt rettigheder.</p>
+      <h2 class="title is-4 mt-4 has-text-grey">{{ $t('user_home.empty_state_title') }}</h2>
+      <p class="subtitle is-6 has-text-grey">{{ $t('user_home.empty_state_desc') }}</p>
     </div>
 
     <!-- Main dashboard content -->
     <div v-else class="columns is-vcentered mb-4 is-multiline">
       <div class="column is-12">
         <span class="is-auto-size-text is-size-6 has-text-weight-bold">
-          Velkommen {{ SessionUser.getName() }}
+          {{ $t('user_home.welcome') }} {{ SessionUser.getName() }}
         </span>
       </div>
       <div class="column is-half-desktop is-hidden-desktop is-12-tablet" v-show="IS_DEV">
@@ -157,7 +157,7 @@ const classes = computed(() => {
         <WhiteBoxCard :force-state="true" :defaultOpen="true" :toggleable="false" :loading="false">
           <template #header>
             <div class="card-header-title has-text-link has-text-weight-bold">
-              Start vask
+              {{ $t('user_home.start_wash') }}
             </div>
             <div class="card-header-icon has-text-link">
               <i class="fas fa-soap"></i>
@@ -165,13 +165,13 @@ const classes = computed(() => {
           </template>
           <template #content>
             <div class="identical-height-spacer" :style="{ minHeight: cardMinHeight + 'px' }">
-              Gå direkte til afdelingens vaskebaner og start en vask for dit køretøj. Vælg dit køretøj og den ønskede vasketype for at komme i gang.
+              {{ $t('user_home.start_wash_desc') }}
             </div>
           </template>
           <template #footer>
             <div class="card-footer-item">
               <router-link to="/user/wash/start" class="button is-link is-fullwidth">
-                Start vask
+                {{ $t('user_home.start_wash') }}
               </router-link>
             </div>
           </template>
@@ -182,7 +182,7 @@ const classes = computed(() => {
         <WhiteBoxCard :force-state="true" :defaultOpen="true" :toggleable="false" :loading="false">
           <template #header>
             <div class="card-header-title" :class="classes.title">
-              Book vask
+              {{ $t('user_home.book_wash') }}
             </div>
             <div class="card-header-icon">
               <i class="fas fa-calendar-check"></i>
@@ -190,14 +190,14 @@ const classes = computed(() => {
           </template>
           <template #content>
             <div class="identical-height-spacer" :style="{ minHeight: cardMinHeight + 'px' }">
-              Book en vask i én af vores afdelinger - med mulighed for safety seal.
+              {{ $t('user_home.book_wash_desc') }}
             </div>
             <!--<b-loading :is-full-page="false" :model-value="true" :can-cancel="true"/>-->
           </template>
           <template #footer>
             <div class="card-footer-item">
               <router-link to="/user/bookings/book" class="button is-link is-fullwidth" :class="classes.button">
-                Book vask
+                {{ $t('user_home.book_wash') }}
               </router-link>
             </div>
           </template>
@@ -208,7 +208,7 @@ const classes = computed(() => {
         <WhiteBoxCard :force-state="true" :defaultOpen="true" :toggleable="false" :loading="false">
           <template #header>
             <div class="card-header-title" :class="classes.title">
-              Opret køretøj
+              {{ $t('user_home.create_vehicle') }}
             </div>
             <div class="card-header-icon">
               <i class="fas fa-truck"></i>
@@ -216,14 +216,14 @@ const classes = computed(() => {
           </template>
           <template #content>
             <div class="identical-height-spacer" :style="{ minHeight: cardMinHeight + 'px' }">
-              Tilføj et køretøj der skal kunne vaske hos Truck Wash.
+              {{ $t('user_home.create_vehicle_desc') }}
             </div>
             <!--<b-loading :is-full-page="false" :model-value="true" :can-cancel="true"/>-->
           </template>
           <template #footer>
             <div class="card-footer-item">
               <router-link to="/user/vehicles" class="button is-link is-fullwidth" :class="classes.button">
-                Opret køretøj
+                {{ $t('user_home.create_vehicle') }}
               </router-link>
             </div>
           </template>
@@ -234,7 +234,7 @@ const classes = computed(() => {
         <WhiteBoxCard :force-state="true" :defaultOpen="true" :toggleable="false" :loading="false">
           <template #header>
             <div class="card-header-title" :class="classes.title">
-              Download vaskecertifikater
+              {{ $t('user_home.download_certificates') }}
             </div>
             <div class="card-header-icon">
               <i class="fas fa-file-download"></i>
@@ -242,14 +242,14 @@ const classes = computed(() => {
             </template>
           <template #content>
             <div class="identical-height-spacer" :style="{ minHeight: cardMinHeight + 'px' }">
-              Download vaske certifikater for dine tidligere vaske.
+              {{ $t('user_home.download_certificates_desc') }}
             </div>
             <!--<b-loading :is-full-page="false" :model-value="true" :can-cancel="true"/>-->
           </template>
           <template #footer>
             <div class="card-footer-item">
               <router-link to="/user/orders" class="button is-link is-fullwidth" :class="classes.button">
-                Download vaskecertifikater
+                {{ $t('user_home.download_certificates') }}
               </router-link>
             </div>
           </template>
@@ -260,7 +260,7 @@ const classes = computed(() => {
         <WhiteBoxCard :force-state="true" :defaultOpen="true" :toggleable="false" :loading="false">
           <template #header>
             <div class="card-header-title" :class="classes.title">
-              Download fakturaer
+              {{ $t('user_home.download_invoices') }}
             </div>
             <div class="card-header-icon">
               <i class="fas fa-file-invoice-dollar"></i>
@@ -268,14 +268,14 @@ const classes = computed(() => {
           </template>
           <template #content>
             <div class="identical-height-spacer" :style="{ minHeight: cardMinHeight + 'px' }">
-              Download dine tidligere fakturaer.
+              {{ $t('user_home.download_invoices_desc') }}
             </div>
             <!--<b-loading :is-full-page="false" :model-value="true" :can-cancel="true"/>-->
           </template>
           <template #footer>
             <div class="card-footer-item">
               <router-link to="/user/invoices" class="button is-link is-fullwidth" :class="classes.button">
-                Download fakturaer
+                {{ $t('user_home.download_invoices') }}
               </router-link>
             </div>
           </template>
@@ -283,7 +283,7 @@ const classes = computed(() => {
       </div>
       <div class="column is-12">
         <span class="is-size-6 has-text-weight-bold">
-          Ved problemer kontakt os på telefon <a href="tel:+4543717886"><span class="has-text-link">43 71 78 86</span></a> eller email <a href="mailto:cph@truckwash.dk"><span class="has-text-link">cph@truckwash.dk</span></a>.
+          {{ $t('user_home.contact_info_prefix') }} <a href="tel:+4543717886"><span class="has-text-link">43 71 78 86</span></a> {{ $t('user_home.contact_info_or_email') }} <a href="mailto:cph@truckwash.dk"><span class="has-text-link">cph@truckwash.dk</span></a>.
         </span>
       </div>
     </div>