Store LastModuleCategory with the user

client/src/components/modules/ModuleFilter.vue

@@ -2,7 +2,7 @@
   <div>
     <div class="container">
       <div class="radio-group">
-        <div class="radio-item" v-for="(category, index) in firstLevelCategories" :key="index" >
+        <div class="radio-item" v-for="(category, index) in firstLevelCategories" :key="index">
           <input
             type="radio"
             :value="category"
@@ -16,7 +16,7 @@
 
       <div class="dropdown-container">
         <select id="lernfeld-select" v-model="selectedLernfeld" @change="filterModules">
-          <option :value="lernfeld" v-for="(lernfeld, index) in lernfeldOptions"  :key="index">
+          <option :value="lernfeld" v-for="(lernfeld, index) in lernfeldOptions" :key="index">
             {{ lernfeld.name }}
           </option>
         </select>
@@ -38,11 +38,11 @@
   import {computed, ref} from "vue";
   import ModuleTeaser from "@/components/modules/ModuleTeaser.vue";
   import gql from "graphql-tag";
-  import {useQuery} from "@vue/apollo-composable";
-
+  import {useQuery, useMutation} from "@vue/apollo-composable";
 
   const props = defineProps<{
     modules: [];
+    me: any;
   }>();
 
 
@@ -59,21 +59,13 @@
     name: '---',
     id: null,
   };
+  let defaultCategory = loadDefaultCategory(props.me);
 
-  const selectedCategory = ref(nullCategory);
-
+  let selectedCategory = ref(defaultCategory);
 
   const firstLevelCategories = computed(() => {
     return [nullCategory, ...moduleCategoriesResult.value?.moduleCategories || []];
   });
-  const {result: moduleCategoryTypesResult} = useQuery(gql`
-    query ModuleCategoryTypesQuery {
-      moduleCategoryTypes {
-        name
-        id
-      }
-    }
-  `);
 
   const nullLernfeld = {
     name: '---',
@@ -82,6 +74,14 @@
 
   const selectedLernfeld = ref(nullLernfeld);
 
+  const {result: moduleCategoryTypesResult} = useQuery(gql`
+    query ModuleCategoryTypesQuery {
+      moduleCategoryTypes {
+        name
+        id
+      }
+    }
+  `);
 
   const lernfeldOptions = computed(() => {
     return [nullLernfeld, ...moduleCategoryTypesResult.value?.moduleCategoryTypes || []];
@@ -94,6 +94,10 @@
 
   // "$flavor.textInstrumentFilterShowAll"
 
+  function loadDefaultCategory(me) {
+    return me?.lastModuleCategory || nullCategory;
+  }
+
 
   function filterModules() {
     let filteredModules = props.modules;
@@ -114,12 +118,36 @@
         return module.categoryType.id == selectedLernfeld.value.id;
       });
     }
-
+    updateLastModuleCategory(selectedCategory.value);
 
     return filteredModules;
 
 
   }
+
+
+  function updateLastModuleCategory(moduleCategory) {
+    console.log(moduleCategory);
+
+    const {mutate: updateLastModuleCategory} = useMutation(gql`
+ mutation ($input: UpdateLastModuleCategoryInput!){updateLastModuleCategory(input: $input) {
+                      clientMutationId
+                      user {
+                        username
+                        lastModuleCategory {
+                          name
+                          id
+                        }
+                      }
+                    }}`);
+
+    updateLastModuleCategory({
+      input: {
+        id: moduleCategory.id,
+      },
+    });
+
+  }
 </script>
 
 <style scoped lang="scss">

client/src/graphql/gql/fragments/userParts.gql

@@ -10,6 +10,10 @@ fragment UserParts on PrivateUserNode {
   avatarUrl
   expiryDate
   readOnly
+  lastModuleCategory {
+    id
+    name
+  }
   lastModule {
     id
     slug

client/src/pages/topic-page.vue

@@ -15,7 +15,7 @@
         {{ topic.teaser }}
       </p>
       <div class="topic__modulefilter">
-        <module-filter :modules="modules"></module-filter>
+        <module-filter :modules="modules" :me="me"></module-filter>
       </div>
       <div class="topic__links">
         <div