From cab5428d0bafd6f97af8b8e677e4f4a500035491 Mon Sep 17 00:00:00 2001
From: "Torsten Schulz (local)" <tsschulz@gmx.net>
Date: Thu, 23 Apr 2026 10:04:46 +0200
Subject: [PATCH] feat(VocabLessonView): enhance vocab trainer visibility for
 cross-chapter hard vocabulary

- Updated the VocabLessonView to display the vocab trainer section when there are cross-chapter hard vocabulary items, improving user engagement and accessibility to training options.
- Adjusted the button rendering logic to ensure that the hard vocabulary trainer is available when applicable, enhancing the overall learning experience.
---
 frontend/src/views/social/VocabLessonView.vue | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/frontend/src/views/social/VocabLessonView.vue b/frontend/src/views/social/VocabLessonView.vue
index 527c311..e1971b5 100644
--- a/frontend/src/views/social/VocabLessonView.vue
+++ b/frontend/src/views/social/VocabLessonView.vue
@@ -219,7 +219,7 @@
           </div>
 
           <!-- Vokabeltrainer -->
-          <div v-if="trainableLessonVocab.length > 0" class="vocab-trainer-section">
+          <div v-if="trainableLessonVocab.length > 0 || hasCrossChapterHardVocab" class="vocab-trainer-section">
             <h4>{{ $t('socialnetwork.vocab.courses.vocabTrainer') }}</h4>
             <div v-if="hasPreviousVocab" class="review-priority-note">
               <strong>{{ $t('socialnetwork.vocab.courses.reviewPriorityTitle') }}</strong>
@@ -235,15 +235,15 @@
                 <button @click="startVocabTrainer" class="btn-start-trainer">
                   {{ hasPreviousVocab ? $t('socialnetwork.vocab.courses.startLesson') : $t('socialnetwork.vocab.courses.startVocabTrainer') }}
                 </button>
-                <button
-                  v-if="hasCrossChapterHardVocab"
-                  @click="startHardVocabTrainer"
-                  class="btn-start-trainer button-secondary"
-                >
-                  {{ $t('socialnetwork.vocab.courses.startHardVocabTrainer', { count: crossChapterHardVocab.length }) }}
-                </button>
               </template>
               <p v-else class="vocab-trainer-locked-hint">{{ $t('socialnetwork.vocab.courses.vocabTrainerLockedHint') }}</p>
+              <button
+                v-if="hasCrossChapterHardVocab"
+                @click="startHardVocabTrainer"
+                class="btn-start-trainer button-secondary"
+              >
+                {{ $t('socialnetwork.vocab.courses.startHardVocabTrainer', { count: crossChapterHardVocab.length }) }}
+              </button>
             </div>
             <div v-else class="vocab-trainer-active">
               <div class="vocab-trainer-stats">