Add native language support in vocab course management

- Introduced a new field for native language in the VocabCourse model to allow learners to specify their native language.
- Updated the VocabService to handle native language during course creation and retrieval, including filtering options.
- Enhanced the database schema to include foreign key constraints for native language.
- Updated frontend components to support native language selection and display in course listings.
- Added internationalization strings for native language features in both German and English.

frontend/src/views/social/VocabCourseListView.vue

@@ -20,11 +20,20 @@
           />
         </div>
         <div class="filter-box">
+          <label>{{ $t('socialnetwork.vocab.courses.targetLanguage') }}:</label>
           <select v-model="selectedLanguageId" @change="loadAllCourses">
             <option value="">{{ $t('socialnetwork.vocab.courses.allLanguages') }}</option>
             <option v-for="lang in languages" :key="lang.id" :value="lang.id">{{ lang.name }}</option>
           </select>
         </div>
+        <div class="filter-box">
+          <label>{{ $t('socialnetwork.vocab.courses.nativeLanguage') }}:</label>
+          <select v-model="selectedNativeLanguageId" @change="loadAllCourses">
+            <option value="">{{ $t('socialnetwork.vocab.courses.allNativeLanguages') }}</option>
+            <option value="null">{{ $t('socialnetwork.vocab.courses.forAllLanguages') }}</option>
+            <option v-for="lang in languages" :key="lang.id" :value="lang.id">{{ lang.name }}</option>
+          </select>
+        </div>
       </div>
 
       <div v-if="loading">{{ $t('general.loading') }}</div>
@@ -42,7 +51,8 @@
             </div>
             <p v-if="course.description" class="course-description">{{ course.description }}</p>
             <div class="course-meta">
-              <span v-if="course.languageName">{{ $t('socialnetwork.vocab.courses.language') }}: {{ course.languageName }}</span>
+              <span v-if="course.languageName">{{ $t('socialnetwork.vocab.courses.targetLanguage') }}: {{ course.languageName }}</span>
+              <span v-if="course.nativeLanguageName">{{ $t('socialnetwork.vocab.courses.nativeLanguage') }}: {{ course.nativeLanguageName }}</span>
               <span>{{ $t('socialnetwork.vocab.courses.difficulty') }}: {{ course.difficultyLevel }}</span>
               <span v-if="course.lessons">{{ $t('socialnetwork.vocab.courses.lessons') }}: {{ course.lessons.length }}</span>
             </div>
@@ -162,6 +172,9 @@ export default {
         if (this.selectedLanguageId) {
           params.languageId = this.selectedLanguageId;
         }
+        if (this.selectedNativeLanguageId !== '') {
+          params.nativeLanguageId = this.selectedNativeLanguageId === 'null' ? null : this.selectedNativeLanguageId;
+        }
         if (this.searchTerm.trim()) {
           params.search = this.searchTerm.trim();
         }
@@ -230,6 +243,7 @@ export default {
           title: '',
           description: '',
           languageId: null,
+          nativeLanguageId: null,
           difficultyLevel: 1,
           isPublic: false
         };