From 00a011c2ba4c2c36d96cf2107fedf87a9deaf0af Mon Sep 17 00:00:00 2001
From: Bjorn de Jong <bjorn.de.jong@scania.com>
Date: Tue, 29 Jul 2025 17:20:31 +0200
Subject: [PATCH] fix: improve language switcher for scalable multi-language
 support

- Replace binary logic with configuration object for better scalability
- Add support for any number of languages without code changes
- Use language configuration mapping for maintainable language handling
- Replace hardcoded titles with i18n translation keys for proper localization
---
 components/language-switcher.vue                | 14 ++++++++++----
 components/users/group/members.vue              |  2 +-
 components/users/group/policies.vue             |  2 +-
 components/users/group/set-policies-mutiple.vue |  2 +-
 4 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/components/language-switcher.vue b/components/language-switcher.vue
index a7bd541..1a00e18 100644
--- a/components/language-switcher.vue
+++ b/components/language-switcher.vue
@@ -2,9 +2,9 @@
   <n-dropdown :options="options" trigger="click" @select="handleSelect">
     <n-button :text="true" block>
       <template #icon>
-        <Icon :name="isChineseLocale ? 'ri:translate-2' : 'ri:translate'" />
+        <Icon :name="currentLanguage.icon" />
       </template>
-      {{ isChineseLocale ? '中文' : 'English' }}
+      {{ currentLanguage.text }}
     </n-button>
   </n-dropdown>
 </template>
@@ -17,8 +17,14 @@ import { useI18n } from 'vue-i18n'
 
 const { locale, setLocale } = useI18n()
 
-const isChineseLocale = computed(() => {
-  return locale.value === 'zh'
+const languageConfig = {
+  en: { text: 'English', icon: 'ri:translate' },
+  zh: { text: '中文', icon: 'ri:translate-2' },
+  tr: { text: 'Türkçe', icon: 'ri:translate' }
+} as const
+
+const currentLanguage = computed(() => {
+  return languageConfig[locale.value as keyof typeof languageConfig] || languageConfig.en
 })
 
 const options = ref<DropdownOption[]>([
diff --git a/components/users/group/members.vue b/components/users/group/members.vue
index c507814..2b99eb4 100644
--- a/components/users/group/members.vue
+++ b/components/users/group/members.vue
@@ -64,7 +64,7 @@ interface RowData {
 
 const columns: DataTableColumns<RowData> = [
   {
-    title: '名称',
+    title: t('Name'),
     align: 'left',
     key: 'name',
     filter(value, row) {
diff --git a/components/users/group/policies.vue b/components/users/group/policies.vue
index 18f3818..d92f5e9 100644
--- a/components/users/group/policies.vue
+++ b/components/users/group/policies.vue
@@ -63,7 +63,7 @@ interface RowData {
 
 const columns: DataTableColumns<RowData> = [
   {
-    title: '策略',
+    title: t('Name'),
     align: 'left',
     key: 'name',
     filter(value, row) {
diff --git a/components/users/group/set-policies-mutiple.vue b/components/users/group/set-policies-mutiple.vue
index 75b818f..977d773 100644
--- a/components/users/group/set-policies-mutiple.vue
+++ b/components/users/group/set-policies-mutiple.vue
@@ -80,7 +80,7 @@ const columns: DataTableColumns<RowData> = [
     type: 'selection',
   },
   {
-    title: '策略',
+    title: t('Name'),
     align: 'left',
     key: 'name',
     filter(value, row) {