feat(#22): Use translation keys in files

legalconsenthub/app/components/VersionHistory.vue

@@ -4,9 +4,9 @@
       <UIcon name="i-lucide-loader-circle" class="animate-spin h-8 w-8" />
     </div>
 
-    <div v-else-if="error" class="text-red-500">Fehler beim Laden der Versionen: {{ error }}</div>
+    <div v-else-if="error" class="text-red-500">{{ $t('versions.loadError') }}: {{ error }}</div>
 
-    <div v-else-if="versions.length === 0" class="text-center py-8 text-gray-500">Keine Versionen verfügbar</div>
+    <div v-else-if="versions.length === 0" class="text-center py-8 text-gray-500">{{ $t('versions.empty') }}</div>
 
     <div v-else class="space-y-3">
       <UCard v-for="version in versions" :key="version.id" class="hover:shadow-md transition-shadow">
@@ -29,7 +29,7 @@
               size="sm"
               color="neutral"
               variant="outline"
-              label="Vergleichen"
+              :label="$t('versions.compare')"
               @click="openComparisonModal(version)"
             />
             <UButton
@@ -37,7 +37,7 @@
               size="sm"
               color="neutral"
               variant="outline"
-              label="Wiederherstellen"
+              :label="$t('versions.restore')"
               @click="openRestoreModal(version)"
             />
           </div>
@@ -76,6 +76,7 @@ const emit = defineEmits<{
 
 const { getVersions, restoreVersion } = useApplicationFormVersion()
 const toast = useToast()
+const { t: $t } = useI18n()
 
 const versions = ref<ApplicationFormVersionListItemDto[]>([])
 const loading = ref(false)
@@ -91,10 +92,10 @@ async function loadVersions() {
   try {
     versions.value = await getVersions(props.applicationFormId)
   } catch (e: unknown) {
-    error.value = e instanceof Error ? e.message : 'Unbekannter Fehler'
+    error.value = e instanceof Error ? e.message : $t('versions.unknownError')
     toast.add({
-      title: 'Fehler',
-      description: 'Versionen konnten nicht geladen werden',
+      title: $t('common.error'),
+      description: $t('versions.loadErrorDescription'),
       color: 'error'
     })
   } finally {
@@ -119,8 +120,8 @@ async function handleRestore() {
   try {
     await restoreVersion(props.applicationFormId, selectedVersion.value.versionNumber)
     toast.add({
-      title: 'Erfolg',
-      description: `Version v${selectedVersion.value.versionNumber} wurde wiederhergestellt`,
+      title: $t('common.success'),
+      description: $t('versions.restored', { number: selectedVersion.value.versionNumber }),
       color: 'success'
     })
     isRestoreModalOpen.value = false
@@ -128,8 +129,8 @@ async function handleRestore() {
     emit('restored')
   } catch {
     toast.add({
-      title: 'Fehler',
-      description: 'Version konnte nicht wiederhergestellt werden',
+      title: $t('common.error'),
+      description: $t('versions.restoreError'),
       color: 'error'
     })
   } finally {
@@ -154,18 +155,20 @@ function getStatusColor(status: ApplicationFormStatus) {
   }
 }
 
+const { t: $t } = useI18n()
+
 function getStatusLabel(status: ApplicationFormStatus): string {
   switch (status) {
     case 'DRAFT':
-      return 'Entwurf'
+      return $t('applicationForms.status.draft')
     case 'SUBMITTED':
-      return 'Eingereicht'
+      return $t('applicationForms.status.submitted')
     case 'APPROVED':
-      return 'Genehmigt'
+      return $t('applicationForms.status.approved')
     case 'REJECTED':
-      return 'Abgelehnt'
+      return $t('applicationForms.status.rejected')
     case 'SIGNED':
-      return 'Signiert'
+      return $t('applicationForms.status.signed')
     default:
       return status
   }