feat(vocab): enhance vocabulary label handling in VocabLessonView

- Refactored VocabLessonView to utilize computed properties for vocabulary preparation labels, improving localization and maintainability.
- Updated the logic for target and gloss labels to prioritize course-specific language names, enhancing user experience and clarity in vocabulary presentation.
- Improved the orientation logic for target-gloss pairs to ensure accurate representation of vocabulary items, contributing to better learning outcomes.

frontend/src/views/social/VocabLessonView.vue

@@ -126,11 +126,11 @@
               </p>
               <div class="vocab-prep-card">
                 <div class="vocab-prep-card__row">
-                  <span class="vocab-prep-card__label">{{ $t('socialnetwork.vocab.courses.vocabPrepTargetLabel') }}</span>
+                  <span class="vocab-prep-card__label">{{ prepTargetLabel }}</span>
                   <div class="vocab-prep-card__target">{{ currentPrepItem.target }}</div>
                 </div>
                 <div class="vocab-prep-card__row">
-                  <span class="vocab-prep-card__label">{{ $t('socialnetwork.vocab.courses.vocabPrepGlossLabel') }}</span>
+                  <span class="vocab-prep-card__label">{{ prepGlossLabel }}</span>
                   <div class="vocab-prep-card__gloss">{{ currentPrepItem.gloss || '—' }}</div>
                 </div>
               </div>
@@ -1295,14 +1295,54 @@ export default {
         .map((p) => this.normalizeCorePatternEntry(p))
         .filter(Boolean);
     },
+    prepTargetLabel() {
+      return String(
+        this.lesson?.course?.languageName
+        || this.lesson?.languageName
+        || this.$t('socialnetwork.vocab.courses.vocabPrepTargetLabel')
+      ).toUpperCase();
+    },
+    prepGlossLabel() {
+      return String(
+        this.lesson?.course?.nativeLanguageName
+        || this.lesson?.nativeLanguageName
+        || this.$t('socialnetwork.vocab.courses.vocabPrepGlossLabel')
+      ).toUpperCase();
+    },
     prepItems() {
       // Vorbereitung nur mit echten Paaren (Zielsprache + Übersetzung),
       // damit weder leere Gloss-Zeilen noch übergroße Listen entstehen.
       const out = [];
       const seen = new Set();
-      const pushUnique = (target, gloss) => {
+      const nativeHints = new Set(
+        (this.importantVocab || [])
+          .map((x) => this.normalizeLessonVocabTerm(x?.learning))
+          .filter(Boolean)
+      );
+      const targetHints = new Set(
+        (this.importantVocab || [])
+          .map((x) => this.normalizeLessonVocabTerm(x?.reference))
+          .filter(Boolean)
+      );
+      const orientPair = (target, gloss) => {
         const t = String(target || '').trim();
         const g = String(gloss || '').trim();
+        if (!t || !g) return { target: t, gloss: g };
+        const nt = this.normalizeLessonVocabTerm(t);
+        const ng = this.normalizeLessonVocabTerm(g);
+        const tLooksNative = nativeHints.has(nt) && !targetHints.has(nt);
+        const gLooksTarget = targetHints.has(ng) && !nativeHints.has(ng);
+        const tLooksTarget = targetHints.has(nt) && !nativeHints.has(nt);
+        const gLooksNative = nativeHints.has(ng) && !targetHints.has(ng);
+        if (tLooksNative && gLooksTarget && !(tLooksTarget && gLooksNative)) {
+          return { target: g, gloss: t };
+        }
+        return { target: t, gloss: g };
+      };
+      const pushUnique = (target, gloss) => {
+        const oriented = orientPair(target, gloss);
+        const t = String(oriented.target || '').trim();
+        const g = String(oriented.gloss || '').trim();
         if (!t || !g) return;
         const key = `${this.normalizeLessonVocabTerm(t)}|${this.normalizeLessonVocabTerm(g)}`;
         if (seen.has(key)) return;