From b1511ce926bdcb79dac3845dc1320ddad7b645f4 Mon Sep 17 00:00:00 2001
From: Mateus Machado Luna <mateus.m.luna@gmail.com>
Date: Thu, 10 Oct 2019 12:03:17 -0300
Subject: [PATCH] Several updates on tagslist logic.

---
 .../components/search/filters-tags-list.vue   | 38 ++++++++++-------
 .../autocomplete/Autocomplete.vue             |  7 ++--
 .../filter-types/checkbox/Checkbox.vue        |  2 +-
 .../custom-interval/CustomInterval.vue        | 10 ++++-
 src/classes/filter-types/date/Date.vue        | 10 ++++-
 .../filter-types/filter-types-mixin.js        | 18 ++------
 .../numeric-interval/NumericInterval.vue      |  4 +-
 .../NumericListInterval.vue                   |  4 +-
 src/classes/filter-types/numeric/Numeric.vue  |  4 +-
 .../filter-types/selectbox/Selectbox.vue      |  2 +-
 .../filter-types/tainacan-filter-item.vue     | 28 ++++++++++---
 .../filter-types/taxonomy/Checkbox.vue        |  2 +-
 .../filter-types/taxonomy/Taginput.vue        |  4 +-
 src/js/event-bus-search.js                    | 41 ++++++++++++-------
 src/js/store/modules/search/actions.js        |  4 ++
 src/js/store/modules/search/mutations.js      | 20 +++++++--
 16 files changed, 125 insertions(+), 73 deletions(-)

diff --git a/src/admin/components/search/filters-tags-list.vue b/src/admin/components/search/filters-tags-list.vue
index c3cd5759a..426c98cc5 100644
--- a/src/admin/components/search/filters-tags-list.vue
+++ b/src/admin/components/search/filters-tags-list.vue
@@ -7,8 +7,8 @@
                 :key="index"       
                 attached
                 closable
-                @close="removeMetaQuery(filterTag.filterId, filterTag.value, filterTag.singleValue)">
-            {{ filterTag.singleValue != undefined ? filterTag.singleValue : filterTag.value }}
+                @close="removeMetaQuery(filterTag)">
+            {{ filterTag.singleLabel != undefined ? filterTag.singleLabel : filterTag.label }}
         </b-tag>
         <button 
                 @click="clearAllFilters()"
@@ -19,7 +19,7 @@
     </div>
 </template>
 <script>
-    import { mapGetters, mapActions } from 'vuex';
+    import { mapGetters } from 'vuex';
 
     export default {
         name: 'FiltersTagsList',
@@ -31,9 +31,9 @@
                 let tags = this.getFilterTags();
                 let flattenTags = [];
                 for (let tag of tags) {
-                    if (Array.isArray(tag.value)) {
-                        for (let valueTag of tag.value) 
-                            flattenTags.push({filterId: tag.filterId, value: tag, singleValue: valueTag}); 
+                    if (Array.isArray(tag.label)) {
+                        for (let i = 0; i < tag.label.length; i++) 
+                            flattenTags.push({filterId: tag.filterId, label: tag.label, singleLabel: tag.label[i], value: tag.value[i], taxonomy: tag.taxonomy, metadatumId: tag.metadatumId}); 
                     } else {
                         flattenTags.push(tag);
                     }
@@ -43,22 +43,30 @@
         },
         methods: {
             ...mapGetters('search',[
-                'getPostQuery',
                 'getFilterTags'
             ]),
-            ...mapActions('metadata',[
-                'fetchMetadatum'
-            ]),
-            removeMetaQuery(filterId, value, singleValue) {
-                if (singleValue != undefined)
-                    this.$eventBusSearch.removeMetaFromFilterTag({ filterId: filterId, singleValue: singleValue });
+            removeMetaQuery({ filterId, value, singleLabel, label, taxonomy, metadatumId }) {
+                if (singleLabel != undefined)
+                    this.$eventBusSearch.removeMetaFromFilterTag({ 
+                        filterId: filterId,
+                        singleLabel: singleLabel,
+                        value: value, 
+                        taxonomy: taxonomy,
+                        metadatumId: metadatumId 
+                    });
                 else
-                    this.$eventBusSearch.removeMetaFromFilterTag({ filterId: filterId, value: value });
+                    this.$eventBusSearch.removeMetaFromFilterTag({ 
+                        filterId: filterId, 
+                        label: label, 
+                        value: value, 
+                        taxonomy: taxonomy, 
+                        metadatumId: metadatumId 
+                    });
             },
             clearAllFilters() {
                 // this.$eventBusSearch.clearAllFilters();
                 for (let tag of this.filterTags) {
-                    this.removeMetaQuery(tag.filterId, tag.value, tag.singleValue);
+                    this.removeMetaQuery(tag);
                 }
             }
         }
diff --git a/src/classes/filter-types/autocomplete/Autocomplete.vue b/src/classes/filter-types/autocomplete/Autocomplete.vue
index 9f933459b..0a5004e2e 100644
--- a/src/classes/filter-types/autocomplete/Autocomplete.vue
+++ b/src/classes/filter-types/autocomplete/Autocomplete.vue
@@ -113,15 +113,14 @@
 
                     if (this.metadatumType === 'Tainacan\\Metadata_Types\\Relationship') {
                         
-                        axios.get('/items/' + metadata.value)
+                        axios.get('/items/' + metadata.value + '?fetch_only=title,thumbnail')
                             .then( res => {
-      
                                 let item = res.data;
                                 this.results = item.title;
                                 this.label = item.title;
                                 this.selected = item.title;
          
-                                this.$emit( 'sendValuesToTags', this.label);
+                                this.$emit( 'sendValuesToTags', { label: this.label, value: this.results });
                             })
                             .catch(error => {
                                 this.$console.log(error);
@@ -131,7 +130,7 @@
                         this.label = metadata.value;
                         this.selected = metadata.value;
 
-                        this.$emit( 'sendValuesToTags', metadata.value);
+                        this.$emit( 'sendValuesToTags', { label: this.label, value: this.results });
                     }
                 } else {
                     return false;
diff --git a/src/classes/filter-types/checkbox/Checkbox.vue b/src/classes/filter-types/checkbox/Checkbox.vue
index 3f0dc5e4c..1151ad7b7 100644
--- a/src/classes/filter-types/checkbox/Checkbox.vue
+++ b/src/classes/filter-types/checkbox/Checkbox.vue
@@ -117,7 +117,7 @@
                     }
                 }
 
-                this.$emit( 'sendValuesToTags', onlyLabels.length ? onlyLabels : this.selected);
+                this.$emit( 'sendValuesToTags', { label: onlyLabels.length ? onlyLabels : this.selected, value: this.selected });
             },
             selectedValues() {
                 if ( !this.query || !this.query.metaquery || !Array.isArray( this.query.metaquery ) )
diff --git a/src/classes/filter-types/custom-interval/CustomInterval.vue b/src/classes/filter-types/custom-interval/CustomInterval.vue
index af4a0beb1..5da550707 100644
--- a/src/classes/filter-types/custom-interval/CustomInterval.vue
+++ b/src/classes/filter-types/custom-interval/CustomInterval.vue
@@ -167,7 +167,10 @@
                     }
 
                     if (metadata.value[0] != undefined && metadata.value[1] != undefined)
-                        this.$emit( 'sendValuesToTags', this.parseDateToNavigatorLanguage(metadata.value[0]) + ' - ' + this.parseDateToNavigatorLanguage(metadata.value[1]));
+                        this.$emit('sendValuesToTags', { 
+                            label: this.parseDateToNavigatorLanguage(metadata.value[0]) + ' - ' + this.parseDateToNavigatorLanguage(metadata.value[1]),
+                            value: [metadata.value[0], metadata.value[1]]
+                        });
 
                 } else {
                     return false;
@@ -272,7 +275,10 @@
                 });
 
                 if (values[0] != undefined && values[1] != undefined)
-                    this.$emit( 'sendValuesToTags', this.parseDateToNavigatorLanguage(values[0]) + ' - ' + this.parseDateToNavigatorLanguage(values[1]));
+                    this.$emit( 'sendValuesToTags', { 
+                        label: this.parseDateToNavigatorLanguage(values[0]) + ' - ' + this.parseDateToNavigatorLanguage(values[1]), 
+                        value: [ values[0], values[1] ]
+                    });
             }
         }
     }
diff --git a/src/classes/filter-types/date/Date.vue b/src/classes/filter-types/date/Date.vue
index d1f89aa22..223dbec89 100644
--- a/src/classes/filter-types/date/Date.vue
+++ b/src/classes/filter-types/date/Date.vue
@@ -166,7 +166,10 @@
                         
                         this.value = new Date(textValue);
 
-                        this.$emit('sendValuesToTags', this.comparator + ' ' + moment(this.value, moment.ISO_8601).format(this.dateFormat));
+                        this.$emit('sendValuesToTags', { 
+                            label: this.comparator + ' ' + moment(this.value, moment.ISO_8601).format(this.dateFormat), 
+                            value: this.value
+                        });
                     }
 
                 } else {
@@ -226,7 +229,10 @@
                     collection_id: this.collectionId,
                     value: valueQuery
                 });
-                this.$emit('sendValuesToTags', this.comparator + ' ' + moment(this.value, moment.ISO_8601).format(this.dateFormat));
+                this.$emit('sendValuesToTags', { 
+                    label: this.comparator + ' ' + moment(this.value, moment.ISO_8601).format(this.dateFormat), 
+                    value: valueQuery
+                });
                 
             },
             onChangeComparator(newComparator) {
diff --git a/src/classes/filter-types/filter-types-mixin.js b/src/classes/filter-types/filter-types-mixin.js
index cfae60f6a..b797d1550 100644
--- a/src/classes/filter-types/filter-types-mixin.js
+++ b/src/classes/filter-types/filter-types-mixin.js
@@ -25,7 +25,7 @@ export const filterTypeMixin = {
         this.metadatumType = this.filter.metadatum.metadata_type_object.className ? this.filter.metadatum.metadata_type_object.className : this.metadatumType;
     },
     mounted() {
-        this.$eventBusSearch.$on('removeFromFilterTag', this.cleanFromTags );
+        
     },
     methods: {
         cleanFromTags(filterTag) {
@@ -35,7 +35,7 @@ export const filterTypeMixin = {
     },
     beforeDestroy() {    
         this.$eventBusSearch.$off('removeFromFilterTag', this.cleanFromTags);
-    },
+    }
 };
 
 export const dynamicFilterTypeMixin = {
@@ -43,14 +43,9 @@ export const dynamicFilterTypeMixin = {
         return {
             thumbPlaceholderPath: tainacan_plugin.base_url + '/admin/images/placeholder_square.png',
             getOptionsValuesCancel: undefined,
-            isLoadingOptions: false
+            isLoadingOptions: false,
         }
     },
-    mounted() {
-        // We listen to event, but reload event if hasFiltered is negative, as 
-        // an empty query also demands filters reloading.
-        this.$eventBusSearch.$on('hasFiltered', this.reloadOptionsDueToFiltering);
-    },
     computed: {
         facetsFromItemSearch() {
             return this.getFacets();
@@ -344,17 +339,10 @@ export const dynamicFilterTypeMixin = {
                 }
             }
         },
-        reloadOptionsDueToFiltering() {
-            if (typeof this.loadOptions === "function")
-                this.loadOptions(true);
-        }
     },
     beforeDestroy() {
         // Cancels previous Request
         if (this.getOptionsValuesCancel != undefined)
             this.getOptionsValuesCancel.cancel('Facet search Canceled.');
-
-        this.$eventBusSearch.$off('hasFiltered', this.reloadOptionsDueToFiltering);
-
     },
 };
\ No newline at end of file
diff --git a/src/classes/filter-types/numeric-interval/NumericInterval.vue b/src/classes/filter-types/numeric-interval/NumericInterval.vue
index ec02f3981..23c6dee63 100644
--- a/src/classes/filter-types/numeric-interval/NumericInterval.vue
+++ b/src/classes/filter-types/numeric-interval/NumericInterval.vue
@@ -87,7 +87,7 @@
                 });
 
                 if (values[0] != undefined && values[1] != undefined)
-                    this.$emit('sendValuesToTags', values[0] + ' - ' + values[1]);
+                    this.$emit('sendValuesToTags', { label: values[0] + ' - ' + values[1], value: values });
             },
             selectedValues(){
                 if ( !this.query || !this.query.metaquery || !Array.isArray( this.query.metaquery ) )
@@ -102,7 +102,7 @@
                     }
 
                     if (metaquery.value[0] != undefined && metaquery.value[1] != undefined)
-                        this.$emit( 'sendValuesToTags', this.valueInit + ' - ' + this.valueEnd);
+                        this.$emit('sendValuesToTags', { label: this.valueInit + ' - ' + this.valueEnd, value: metaquery.values });
 
                 } else {
                     return false;
diff --git a/src/classes/filter-types/numeric-list-interval/NumericListInterval.vue b/src/classes/filter-types/numeric-list-interval/NumericListInterval.vue
index 47bd70855..d9ab0fcbd 100644
--- a/src/classes/filter-types/numeric-list-interval/NumericListInterval.vue
+++ b/src/classes/filter-types/numeric-list-interval/NumericListInterval.vue
@@ -72,7 +72,7 @@
 
                 if (values[0] != undefined && values[1] != undefined) {
                     let labelValue = this.filterTypeOptions.intervals[this.selectedInterval].label + (this.filterTypeOptions.showIntervalOnTag ? `(${values[0]}-${values[1]})` : '');
-                    this.$emit( 'sendValuesToTags', labelValue);
+                    this.$emit('sendValuesToTags', { label: labelValue, value: values });
                 }
             },
             selectedValues(){
@@ -97,7 +97,7 @@
                     );
 
                     let labelValue = this.filterTypeOptions.intervals[this.selectedInterval].label + (this.filterTypeOptions.showIntervalOnTag ? `(${this.valueInit}-${this.valueEnd})` : '');
-                    this.$emit( 'sendValuesToTags', labelValue);
+                    this.$emit('sendValuesToTags', { label: labelValue, value: [ this.valueInit, this.valueEnd ] });
                 } else {
                     return false;
                 }
diff --git a/src/classes/filter-types/numeric/Numeric.vue b/src/classes/filter-types/numeric/Numeric.vue
index c4a43665f..b3efd0e3f 100644
--- a/src/classes/filter-types/numeric/Numeric.vue
+++ b/src/classes/filter-types/numeric/Numeric.vue
@@ -118,7 +118,7 @@
                         this.comparator = metadata.compare;
 
                     if (this.value != undefined)
-                        this.$emit('sendValuesToTags', this.comparator + ' ' + this.value);
+                        this.$emit('sendValuesToTags', { label: this.comparator + ' ' + this.value, value: this.value });
 
                 } else {
                     return false;
@@ -157,7 +157,7 @@
                     type: 'NUMERIC'
                 });
 
-                this.$emit('sendValuesToTags', this.comparator + ' ' + this.value);
+                this.$emit('sendValuesToTags', { label: this.comparator + ' ' + this.value, value: this.value });
                 
             },
             onChangeComparator(newComparator) {
diff --git a/src/classes/filter-types/selectbox/Selectbox.vue b/src/classes/filter-types/selectbox/Selectbox.vue
index 2e9cf891e..451991704 100644
--- a/src/classes/filter-types/selectbox/Selectbox.vue
+++ b/src/classes/filter-types/selectbox/Selectbox.vue
@@ -38,7 +38,7 @@
         watch: {
             selected(value) {
                 if (value)
-                    this.$emit('sendValuesToTags', value);
+                    this.$emit('sendValuesToTags', { label: value, value: value });
             }
         },
         computed: {
diff --git a/src/classes/filter-types/tainacan-filter-item.vue b/src/classes/filter-types/tainacan-filter-item.vue
index 06f23a811..1750c48e3 100644
--- a/src/classes/filter-types/tainacan-filter-item.vue
+++ b/src/classes/filter-types/tainacan-filter-item.vue
@@ -34,11 +34,11 @@
             <div :id="'filter-input-id-' + filter.id">
                 <component
                         :is="filter.filter_type_object.component"
+                        :key="reloadDueFiltering"
                         :filter="filter"
                         :query="query"
                         :is-repository-level="isRepositoryLevel"
                         :is-loading-items.sync="isLoadingItems"
-                        :is-using-elastic-search="isUsingElasticSearch"
                         @input="onInput"
                         @sendValuesToTags="onSendValuesToTags"/>
             </div>
@@ -59,6 +59,7 @@
             return {
                 isLoadingItems: Boolean,
                 isUsingElasticSearch: tainacan_plugin.wp_elasticpress == "1" ? true : false,
+                reloadOptionsDueFiltering: Boolean
             }
         },
         mounted() {
@@ -67,21 +68,36 @@
                     this.isLoadingOptions = isLoadingItems;
                 });
             }
+            this.$eventBusSearch.$on('removeFromFilterTag', this.cleanFromTags );
+            // We listen to event, but reload event if hasFiltered is negative, as 
+            // an empty query also demands filters reloading.
+            this.$eventBusSearch.$on('hasFiltered', this.reloadFilter);
         },
         methods: {
             onInput(inputEvent){
                 this.$eventBusSearch.$emit('input', inputEvent);
             },
-            onSendValuesToTags(values) {
-                this.$eventBusSearch.$emit('sendValuesToTags', {
+            onSendValuesToTags($event) {
+                this.$eventBusSearch.$emit('sendValuesToTags', { 
                     filterId: this.filter.id,
-                    value: values
+                    label: $event.label,
+                    value: $event.value,
+                    taxonomy: $event.taxonomy,
+                    metadatumId: this.filter.metadatum_id
                 });
-            }
-        },
+            },
+            reloadFilter() {
+                this.reloadDueFiltering = !this.reloadDueFiltering;
+            },
+            cleanFromTags() {
+            },
+        },    
         beforeDestroy() {
             if (this.isUsingElasticSearch)
                 this.$eventBusSearch.$off('isLoadingItems');
+        
+            this.$eventBusSearch.$off('hasFiltered', this.reloadFilter);
+            this.$eventBusSearch.$off('removeFromFilterTag', this.cleanFromTags);
         }
     }
 </script>
diff --git a/src/classes/filter-types/taxonomy/Checkbox.vue b/src/classes/filter-types/taxonomy/Checkbox.vue
index 7e1aba704..0fba33286 100644
--- a/src/classes/filter-types/taxonomy/Checkbox.vue
+++ b/src/classes/filter-types/taxonomy/Checkbox.vue
@@ -223,7 +223,7 @@
                     }
                 }
 
-                this.$emit("sendValuesToTags", onlyLabels);
+                this.$emit('sendValuesToTags', { label: onlyLabels, taxonomy: this.taxonomy, value: this.selected });
             },
             openCheckboxModal(parent) {
                 this.$buefy.modal.open({
diff --git a/src/classes/filter-types/taxonomy/Taginput.vue b/src/classes/filter-types/taxonomy/Taginput.vue
index 10edfe2bc..8fe612379 100644
--- a/src/classes/filter-types/taxonomy/Taginput.vue
+++ b/src/classes/filter-types/taxonomy/Taginput.vue
@@ -154,7 +154,7 @@
                     terms: values
                 });
 
-                this.$emit("sendValuesToTags", labels);
+                this.$emit('sendValuesToTags', { label: labels, taxonomy: this.taxonomy, value: values });
             },
             getTerm( taxonomy, id ){
                 //getting a specific value from api, does not need be in fecat api
@@ -190,7 +190,7 @@
                             collection_id: this.collectionId,
                             terms: values
                         });
-                        this.$emit( 'sendValuesToTags', labels);
+                        this.$emit('sendValuesToTags', { label: labels, taxonomy: this.taxonomy });
                    }
                 }
             }
diff --git a/src/js/event-bus-search.js b/src/js/event-bus-search.js
index 7c361e217..c368f9093 100644
--- a/src/js/event-bus-search.js
+++ b/src/js/event-bus-search.js
@@ -17,13 +17,10 @@ export default {
             created() {
                 this.$on('input', data => {
                     this.$store.dispatch('search/setPage', 1);
-
                     if (data.taxonomy)
-                        this.add_taxquery(data);
+                        this.addTaxquery(data);
                     else
-                        this.add_metaquery(data);
-                    
-                    this.updateURLQueries();
+                        this.addMetaquery(data);
                 });
 
                 this.$on('sendValuesToTags', data => {
@@ -173,24 +170,38 @@ export default {
                     this.$store.dispatch('search/set_advanced_query', data);
                     this.updateURLQueries();
                 },
-                add_metaquery( data ){
+                addMetaquery( data ){
                     if ( data && data.collection_id ){
                         this.$store.dispatch('search/add_metaquery', data );
                     }
-                },
-                removeMetaQuery(query) {
-                    this.$store.dispatch('search/remove_metaquery', query );
                     this.updateURLQueries();
                 },
-                removeMetaFromFilterTag(filterTag) {
-                    this.$emit('removeFromFilterTag', filterTag);
-                    if (filterTag.singleValue == undefined)
-                        this.$store.dispatch('search/removeFilterTag', filterTag);
-                },
-                add_taxquery( data ){
+                addTaxquery( data ){
                     if ( data && data.collection_id ){
                         this.$store.dispatch('search/add_taxquery', data );
                     }
+                    this.updateURLQueries();
+                },
+                removeMetaFromFilterTag(filterTag) {
+
+                    if (filterTag.singleLabel != undefined) {
+
+                        if (filterTag.taxonomy)
+                            this.$store.dispatch('search/remove_taxquery', {
+                                filterId: filterTag.filterId,
+                                label: filterTag.singleLabel,
+                                taxonomy: filterTag.taxonomy,
+                                value: filterTag.value
+                            });
+                        else
+                            this.$store.dispatch('search/remove_metaquery', {
+                                filterId: filterTag.filterId,
+                                label: filterTag.singleLabel,
+                                metadatum_id: filterTag.metadatumId,
+                                value: filterTag.value
+                            });
+                    }
+                    this.updateURLQueries();
                 },
                 addFetchOnly( metadatum, ignorePrefs, metadatumIDs ){
                     
diff --git a/src/js/store/modules/search/actions.js b/src/js/store/modules/search/actions.js
index 24e8f6f30..80d7c269c 100644
--- a/src/js/store/modules/search/actions.js
+++ b/src/js/store/modules/search/actions.js
@@ -50,6 +50,10 @@ export const remove_metaquery = ( { commit }, filter  ) => {
     commit('removeMetaQuery', filter  );
 };
 
+export const remove_taxquery = ( { commit }, filter  ) => {
+    commit('removeTaxQuery', filter  );
+};
+
 // Pagination queries
 export const setTotalItems = ({ commit }, total ) => {
     commit('setTotalItems', total);
diff --git a/src/js/store/modules/search/mutations.js b/src/js/store/modules/search/mutations.js
index 8350250c7..41e2db276 100644
--- a/src/js/store/modules/search/mutations.js
+++ b/src/js/store/modules/search/mutations.js
@@ -96,15 +96,29 @@ export const removeMetaQuery = ( state, filter ) => {
     let index = state.postquery.metaquery.findIndex( item => item.key == filter.metadatum_id);
 
     if (index >= 0) {
-        state.postquery.metaquery.splice(index, 1);
+        if (Array.isArray(state.postquery.metaquery[index].value) && state.postquery.metaquery[index].value.length > 1) {
+            let otherIndex = state.postquery.metaquery[index].value.findIndex(item => item == filter.value);
+
+            if (otherIndex >= 0)
+                state.postquery.metaquery[index].value.splice(otherIndex, 1)
+        } else
+            state.postquery.metaquery.splice(index, 1);
     }
 };
 
 export const removeTaxQuery = ( state, filter ) => {
-    let index = state.postquery.taxquery.findIndex( item => item.taxonomy == filter.taxonomy);
+    state.postquery.taxquery = ( ! state.postquery.taxquery ) ? [] : state.postquery.taxquery;
 
+    let index = state.postquery.taxquery.findIndex( item => item.taxonomy == filter.taxonomy);
+    
     if (index >= 0) {
-        state.postquery.taxquery.splice(index, 1);
+        if (Array.isArray(state.postquery.taxquery[index].terms) && state.postquery.taxquery[index].terms.length > 1) {
+            let otherIndex = state.postquery.taxquery[index].terms.findIndex(item => item == filter.value);
+
+            if (otherIndex >= 0)
+                state.postquery.taxquery[index].terms.splice(otherIndex, 1)
+        } else
+            state.postquery.taxquery.splice(index, 1);
     }
 };