update library tags handling

src/components/formItems/MultipleTagsSelect.vue

@@ -10,15 +10,15 @@
         variant="outline-secondary" class="d-block rounded-0"
       >
         <b-dropdown-item-button
-          v-for="tag in availableOptions" :key="tag.value"
-          @click="addTag(tag.text)"
+          v-for="tag in availableOptions" :key="tag"
+          @click="addTag(tag)"
         >
-          {{ tag.text }}
+          {{ tag }}
         </b-dropdown-item-button>
       </b-dropdown>
 
       <ul v-if="tags.length > 0" class="list-inline d-inline-block">
-        <li v-for="tag in tags" :key="tag" class="list-inline-item">
+        <li v-for="tag in tags" :key="tag + '-item'" class="list-inline-item">
           <b-form-tag
             :title="tag" :disabled="disabled" pill
             @remove="removeTag(tag)"

src/pages/library/LibraryOptions.vue

@@ -23,7 +23,7 @@
       >
         <multiple-tags-select
           id="tags-select" :button-text="$t('options.filters.choices.tags')"
-          v-model="selectedTags" :options="tagsOptions"
+          v-model="activeTags" :options="tagsOptions"
         />
       </b-form-group>
 
@@ -94,12 +94,13 @@ export default {
 
   computed: {
     ...mapGetters([
+      'nodesDepartsOptions',
+      'tagsOptions',
+      'nodebook',
       'mode',
       'nodeDepartId',
       'search',
-      'nodebook',
-      'nodesDepartsOptions',
-      'tagsOptions'
+      'tags'
     ]),
 
     show () {
@@ -125,6 +126,13 @@ export default {
       set (value) {
         this.$store.commit('SET_SEARCH', value)
       }
+    },
+
+    activeTags: {
+      get () { return this.tags },
+      set (value) {
+        this.$store.commit('UPDATE_TAGS', value)
+      }
     }
   }
 }

src/store/modules/library.js

@@ -24,7 +24,8 @@ export default {
     // LibraryOptions state
     mode: undefined,
     nodeDepartId: undefined,
-    search: ''
+    search: '',
+    tags: []
   },
 
   mutations: {
@@ -62,7 +63,11 @@ export default {
     // ╰─╯╵   ╵ ╶┴╴╰─╯╵╰╯╶─╯
 
     'SET_TAGS_OPTIONS' (state, tags) {
-      state.tagsOptions = tags.map(tag => ({ value: tag.id, text: tag.name }))
+      state.tagsOptions = Array.from(new Set(tags.map(tag => tag.name)))
+    },
+
+    'UPDATE_TAGS' (state, tags) {
+      state.tags = tags
     },
 
     'SET_MODE' (state, mode) {
@@ -145,10 +150,10 @@ export default {
     // ╰─╯╵   ╵ ╶┴╴╰─╯╵╰╯╶─╯
 
     'GET_ALL_TAGS' ({ state, commit }) {
-      if (state.tags !== undefined) return state.tags
+      if (state.tagsOptions.length) return state.tagsOptions
       return api.query(AllTags).then(data => {
         commit('SET_TAGS_OPTIONS', data.tags)
-        return state.tags
+        return state.tagsOptions
       })
     },
 
@@ -177,6 +182,7 @@ export default {
     mode: state => state.mode,
     nodeDepartId: state => state.nodeDepartId,
     search: state => state.search,
+    tags: state => state.tags,
 
     // LibraryOptions options
     tagsOptions: state => state.tagsOptions,