From 9b9729eea668759abfaf361bb0ba187b80bac75d Mon Sep 17 00:00:00 2001
From: Sami Nouidri <sami.nouidri@swisstopo.ch>
Date: Thu, 9 Jan 2025 15:52:26 +0100
Subject: [PATCH] PB-1327: Refactored 'DropdownItem' to translate the button
 title internally.

This involves translating the title in the getter, such that when called, it is
up-to-date with the current language context in web-mapviewer.
---
 src/modules/menu/components/help/ReportProblemButton.vue | 8 ++++----
 src/utils/components/DropdownButton.vue                  | 7 ++++++-
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/modules/menu/components/help/ReportProblemButton.vue b/src/modules/menu/components/help/ReportProblemButton.vue
index dbefaf074..0a8d14c09 100644
--- a/src/modules/menu/components/help/ReportProblemButton.vue
+++ b/src/modules/menu/components/help/ReportProblemButton.vue
@@ -25,22 +25,22 @@ const store = useStore()
 const feedbackCategories = [
     new DropdownItem(
         'feedback_category_background_map',
-        i18n.t('feedback_category_background_map'),
+        'feedback_category_background_map',
         'feedback_category_background_map'
     ),
     new DropdownItem(
         'feedback_category_thematic_map',
-        i18n.t('feedback_category_thematic_map'),
+        'feedback_category_thematic_map',
         'feedback_category_thematic_map'
     ),
     new DropdownItem(
         'feedback_category_application_service',
-        i18n.t('feedback_category_application_service'),
+        'feedback_category_application_service',
         'feedback_category_application_service'
     ),
     new DropdownItem(
         'feedback_category_other',
-        i18n.t('feedback_category_other'),
+        'feedback_category_other',
         'feedback_category_other'
     ),
 ]
diff --git a/src/utils/components/DropdownButton.vue b/src/utils/components/DropdownButton.vue
index 12d69625e..4d20784de 100644
--- a/src/utils/components/DropdownButton.vue
+++ b/src/utils/components/DropdownButton.vue
@@ -46,6 +46,7 @@
 
 <script>
 import { Dropdown } from 'bootstrap'
+import { useI18n } from 'vue-i18n'
 
 import { useTippyTooltip } from '@/utils/composables/useTippyTooltip'
 import { randomIntBetween } from '@/utils/numberUtils'
@@ -62,12 +63,16 @@ export class DropdownItem {
         this._description = description
     }
 
+    _translate(title) {
+        return useI18n().t(title)
+    }
+
     get id() {
         return this._id
     }
 
     get title() {
-        return this._title
+        return this._translate(this._title)
     }
     get value() {
         return this._value