From ee338c0e49044170d06c5b99f94d3e5a8c871b58 Mon Sep 17 00:00:00 2001
From: "Torsten Schulz (local)" <tsschulz@gmx.net>
Date: Tue, 7 Apr 2026 11:22:22 +0200
Subject: [PATCH] refactor(vocab): update vocabulary label handling in
 VocabLessonView

- Replaced computed properties for current vocabulary preparation labels with direct references to new properties, enhancing clarity and maintainability.
- Improved the logic for populating native and target hints, ensuring accurate representation of vocabulary items.
- Removed outdated label swapping logic, streamlining the code and focusing on course-specific language names for better user experience.
---
 frontend/src/views/social/VocabLessonView.vue | 61 ++++++-------------
 1 file changed, 20 insertions(+), 41 deletions(-)

diff --git a/frontend/src/views/social/VocabLessonView.vue b/frontend/src/views/social/VocabLessonView.vue
index 154f5d0..21b8466 100644
--- a/frontend/src/views/social/VocabLessonView.vue
+++ b/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">{{ currentPrepTopLabel }}</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">{{ currentPrepBottomLabel }}</span>
+                  <span class="vocab-prep-card__label">{{ prepGlossLabel }}</span>
                   <div class="vocab-prep-card__gloss">{{ currentPrepItem.gloss || '—' }}</div>
                 </div>
               </div>
@@ -1313,27 +1313,33 @@ export default {
         || this.$t('socialnetwork.vocab.courses.vocabPrepGlossLabel')
       ).toUpperCase();
     },
-    currentPrepTopLabel() {
-      return this._prepRowLabelFor('target');
-    },
-    currentPrepBottomLabel() {
-      return this._prepRowLabelFor('gloss');
-    },
     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 nativeHints = new Set(
-        (this.importantVocab || [])
-          .map((x) => this.normalizeLessonVocabTerm(x?.learning))
+      let nativeHints = new Set(
+        (this.normalizedCorePatterns || [])
+          .map((x) => this.normalizeLessonVocabTerm(x?.gloss))
           .filter(Boolean)
       );
-      const targetHints = new Set(
-        (this.importantVocab || [])
-          .map((x) => this.normalizeLessonVocabTerm(x?.reference))
+      let targetHints = new Set(
+        (this.normalizedCorePatterns || [])
+          .map((x) => this.normalizeLessonVocabTerm(x?.target))
           .filter(Boolean)
       );
+      if (nativeHints.size === 0 || targetHints.size === 0) {
+        nativeHints = new Set(
+          (this.importantVocab || [])
+            .map((x) => this.normalizeLessonVocabTerm(x?.learning))
+            .filter(Boolean)
+        );
+        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();
@@ -1822,33 +1828,6 @@ export default {
       }
       return { target: s, gloss: '' };
     },
-    _prepRowLabelFor(side = 'target') {
-      const item = this.currentPrepItem;
-      if (!item) {
-        return side === 'target' ? this.prepTargetLabel : this.prepGlossLabel;
-      }
-      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 targetNorm = this.normalizeLessonVocabTerm(item.target);
-      const glossNorm = this.normalizeLessonVocabTerm(item.gloss);
-      const targetLooksNative = nativeHints.has(targetNorm) && !targetHints.has(targetNorm);
-      const glossLooksTarget = targetHints.has(glossNorm) && !nativeHints.has(glossNorm);
-      const targetLooksTarget = targetHints.has(targetNorm) && !nativeHints.has(targetNorm);
-      const glossLooksNative = nativeHints.has(glossNorm) && !targetHints.has(glossNorm);
-      const shouldSwapLabels = targetLooksNative && glossLooksTarget && !(targetLooksTarget && glossLooksNative);
-      if (shouldSwapLabels) {
-        return side === 'target' ? this.prepGlossLabel : this.prepTargetLabel;
-      }
-      return side === 'target' ? this.prepTargetLabel : this.prepGlossLabel;
-    },
     corePatternToDisplayString(p) {
       const n = this.normalizeCorePatternEntry(p);
       if (!n) return '';