From 6af2221db62419933d3f580ef0d1a4f3d14f19b0 Mon Sep 17 00:00:00 2001
From: Mateus Machado Luna <mateus.m.luna@gmail.com>
Date: Fri, 17 Jan 2020 14:35:52 -0300
Subject: [PATCH] Moves filter loading logic from items list to
 filter-items-list

---
 .../components/search/filters-items-list.vue  | 556 +++++++++++-------
 src/views/admin/pages/lists/items-page.vue    | 130 +---
 .../theme-search/pages/theme-items-page.vue   | 178 +-----
 3 files changed, 358 insertions(+), 506 deletions(-)

diff --git a/src/views/admin/components/search/filters-items-list.vue b/src/views/admin/components/search/filters-items-list.vue
index 6219dfa3f..f93b601e7 100644
--- a/src/views/admin/components/search/filters-items-list.vue
+++ b/src/views/admin/components/search/filters-items-list.vue
@@ -1,209 +1,259 @@
 <template>
-    <div class="extra-margin">
+    <div>
+        <h3 
+                id="filters-label-landmark"
+                class="has-text-weight-semibold">
+            {{ $i18n.get('filters') }}
+        </h3>
 
-        <!-- TERM ITEMS PAGE FILTERS -->
-        <template v-if="taxonomy && taxonomyFilters">
-            <div 
-                    v-if="key == 'repository-filters'"
-                    :key="index"
-                    v-for="(taxonomyFilter, key, index) of taxonomyFilters">
-                <div 
-                        v-tooltip="{
-                            delay: {
-                                show: 500,
-                                hide: 300,
-                            },
-                            content: $i18n.get('label_filters_from') + ' ' + taxonomyFiltersCollectionNames[key] + ': ',
-                            autoHide: false,
-                            classes: ['tooltip', isRepositoryLevel ? 'repository-tooltip' : ''],
-                            placement: 'auto-start'
-                        }" 
-                        v-if="taxonomyFilter.length > 0 && taxonomyFiltersCollectionNames != undefined && taxonomyFiltersCollectionNames[key] != undefined"
-                        class="collection-name">
-                    {{ $i18n.get('label_filters_from') + " " + taxonomyFiltersCollectionNames[key] + ": " }}
-                </div>
-                <div    
-                        v-if="taxonomyFilter.length > 0 && !(taxonomyFiltersCollectionNames != undefined && taxonomyFiltersCollectionNames[key] != undefined)"
-                        class="collection-name">
-                    <span 
-                            style="width: 100%; height: 54px;"
-                            class="icon has-text-centered loading-icon">
-                        <div class="control has-icons-right is-loading is-clearfix" />
-                    </span>
-                </div>
-                <template v-if="taxonomyFilter.length > 0">
-                    <tainacan-filter-item
-                            v-show="!isMenuCompressed"        
-                            :query="getQuery"
-                            v-for="(filter, filterIndex) in taxonomyFilter"
-                            :key="filterIndex"
-                            :filter="filter"
-                            :open="collapsed"
-                            :is-repository-level="key == 'repository-filters'"/>
-                </template>
-                <!-- <p   
-                        class="has-text-gray is-size-7"
-                        v-if="taxonomyFilter.length <= 0">
-                    {{ $i18n.get('info_there_is_no_filter') }}    
-                </p> -->
-                <hr v-if="taxonomyFilter.length > 0">
-            </div>
-            <div 
-                    v-if="key != 'repository-filters'"
-                    :key="index"
-                    v-for="(taxonomyFilter, key, index) of taxonomyFilters">
-                <div 
-                        v-tooltip="{
-                            delay: {
-                                show: 500,
-                                hide: 300,
-                            },
-                            content: $i18n.get('label_filters_from') + ' ' + taxonomyFiltersCollectionNames[key] + ': ',
-                            autoHide: false,
-                            classes: ['tooltip', isRepositoryLevel ? 'repository-tooltip' : ''],
-                            placement: 'auto-start'
-                        }" 
-                        v-if="taxonomyFilter.length > 0 && taxonomyFiltersCollectionNames != undefined && taxonomyFiltersCollectionNames[key] != undefined"
-                        class="collection-name">
-                    {{ $i18n.get('label_filters_from') + " " + taxonomyFiltersCollectionNames[key] + ": " }}
-                </div>
-                <div    
-                        v-if="taxonomyFilter.length > 0 && !(taxonomyFiltersCollectionNames != undefined && taxonomyFiltersCollectionNames[key] != undefined)"
-                        class="collection-name">
-                    <span 
-                            style="width: 100%; height: 54px;"
-                            class="icon has-text-centered loading-icon">
-                        <div class="control has-icons-right is-loading is-clearfix" />
-                    </span>
-                </div>
-                <template v-if="taxonomyFilter.length > 0">
-                    <tainacan-filter-item
-                            v-show="!isMenuCompressed"        
-                            :query="getQuery"
-                            v-for="(filter, filterIndex) in taxonomyFilter"
-                            :key="filterIndex"
-                            :filter="filter"
-                            :open="collapsed"
-                            :is-repository-level="key == 'repository-filters'"/>
-                </template>
-                <!-- <p   
-                        class="has-text-gray is-size-7"
-                        v-if="taxonomyFilter.length <= 0">
-                    {{ $i18n.get('info_there_is_no_filter') }}    
-                </p> -->
-                <hr v-if="taxonomyFilter.length > 0">
-            </div>
-        </template>
+        <button
+                aria-controls="filters-items-list"
+                :aria-expanded="!collapseAll"
+                v-if="!isLoadingFilters &&
+                    ((filters.length >= 0 &&
+                    isRepositoryLevel) || filters.length > 0)"
+                class="link-style collapse-all"
+                @click="collapseAll = !collapseAll">
+            {{ collapseAll ? $i18n.get('label_collapse_all') : $i18n.get('label_expand_all') }}
+            <span class="icon">
+                <i 
+                        :class="{ 'tainacan-icon-arrowdown' : collapseAll, 'tainacan-icon-arrowright' : !collapseAll }"
+                        class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
+            </span>
+        </button>
 
-        <!-- REPOSITORY ITEMS PAGE FILTERS -->
-        <template v-else-if="isRepositoryLevel && !taxonomy">
-            <collections-filter
-                    :open="collapsed"
-                    :query="getQuery"/>
-            <div 
-                    v-if="key == 'repository-filters'"
-                    :key="index"
-                    v-for="(repositoryCollectionFilter, key, index) of repositoryCollectionFilters">
-                <div 
-                        v-tooltip="{
-                            delay: {
-                                show: 500,
-                                hide: 300,
-                            },
-                            content: $i18n.get('label_filters_from') + ' ' + repositoryCollectionNames[key] + ': ',
-                            autoHide: false,
-                            classes: ['tooltip', isRepositoryLevel ? 'repository-tooltip' : ''],
-                            placement: 'auto-start'
-                        }" 
-                        v-if="repositoryCollectionFilter.length > 0 && repositoryCollectionNames != undefined && repositoryCollectionNames[key] != undefined"
-                        class="collection-name">
-                    {{ $i18n.get('label_filters_from') + " " + repositoryCollectionNames[key] + ": " }}
-                </div>
-                <div    
-                        v-if="repositoryCollectionFilter.length > 0 && !(repositoryCollectionNames != undefined && repositoryCollectionNames[key] != undefined)"
-                        class="collection-name">
-                    <span 
-                            style="width: 100%; height: 54px;"
-                            class="icon has-text-centered loading-icon">
-                        <div class="control has-icons-right is-loading is-clearfix" />
-                    </span>
-                </div>
-                <template v-if="repositoryCollectionFilter.length > 0">
-                    <tainacan-filter-item
-                            v-show="!isMenuCompressed"        
-                            :query="getQuery"
-                            v-for="(filter, filterIndex) in repositoryCollectionFilter"
-                            :key="filterIndex"
-                            :filter="filter"
-                            :open="collapsed"
-                            :is-repository-level="key == 'repository-filters'"/>
-                </template>
-                <!-- <p   
-                        class="has-text-gray is-size-7"
-                        v-if="taxonomyFilter.length <= 0">
-                    {{ $i18n.get('info_there_is_no_filter') }}    
-                </p> -->
-                <hr v-if="repositoryCollectionFilters.length > 0">
-            </div>
-            <div 
-                    v-if="key != 'repository-filters'"
-                    :key="index"
-                    v-for="(repositoryCollectionFilter, key, index) of repositoryCollectionFilters">
-                <div 
-                        v-tooltip="{
-                            delay: {
-                                show: 500,
-                                hide: 300,
-                            },
-                            content: $i18n.get('label_filters_from') + ' ' + repositoryCollectionNames[key] + ': ',
-                            autoHide: false,
-                            classes: ['tooltip', isRepositoryLevel ? 'repository-tooltip' : ''],
-                            placement: 'auto-start'
-                        }" 
-                        v-if="repositoryCollectionFilter.length > 0 && repositoryCollectionNames != undefined && repositoryCollectionNames[key] != undefined"
-                        class="collection-name">
-                    {{ $i18n.get('label_filters_from') + " " + repositoryCollectionNames[key] + ": " }}
-                </div>
-                <div    
-                        v-if="repositoryCollectionFilter.length > 0 && !(repositoryCollectionNames != undefined && repositoryCollectionNames[key] != undefined)"
-                        class="collection-name">
-                    <span 
-                            style="width: 100%; height: 54px;"
-                            class="icon has-text-centered loading-icon">
-                        <div class="control has-icons-right is-loading is-clearfix" />
-                    </span>
-                </div>
-                <template v-if="repositoryCollectionFilter.length > 0">
-                    <tainacan-filter-item
-                            v-show="!isMenuCompressed"        
-                            :query="getQuery"
-                            v-for="(filter, filterIndex) in repositoryCollectionFilter"
-                            :key="filterIndex"
-                            :filter="filter"
-                            :open="collapsed"
-                            :is-repository-level="key == 'repository-filters'"/>
-                </template>
-                <!-- <p   
-                        class="has-text-gray is-size-7"
-                        v-if="taxonomyFilter.length <= 0">
-                    {{ $i18n.get('info_there_is_no_filter') }}    
-                </p> -->
-                <hr v-if="repositoryCollectionFilters.length > 0">
-            </div>
-        </template>
+        <br>
+        <br>
+        <div            
+                v-if="!isLoadingFilters &&
+                    ((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
+                class="extra-margin">
 
-        <!-- COLLECTION ITEMS PAGE FILTERS -->
-        <template v-else>
-            <tainacan-filter-item
-                    v-show="!isMenuCompressed"        
-                    :query="getQuery"
-                    v-for="(filter, index) in filters"
-                    :key="index"
-                    :filter="filter"
-                    :open="collapsed"
-                    :is-repository-level="isRepositoryLevel"/>
-        </template>
-    </div>
+            <!-- TERM ITEMS PAGE FILTERS -->
+            <template v-if="taxonomy && taxonomyFilters">
+                <div 
+                        v-if="key == 'repository-filters'"
+                        :key="index"
+                        v-for="(taxonomyFilter, key, index) of taxonomyFilters">
+                    <div 
+                            v-tooltip="{
+                                delay: {
+                                    show: 500,
+                                    hide: 300,
+                                },
+                                content: $i18n.get('label_filters_from') + ' ' + taxonomyFiltersCollectionNames[key] + ': ',
+                                autoHide: false,
+                                classes: ['tooltip', isRepositoryLevel ? 'repository-tooltip' : ''],
+                                placement: 'auto-start'
+                            }" 
+                            v-if="taxonomyFilter.length > 0 && taxonomyFiltersCollectionNames != undefined && taxonomyFiltersCollectionNames[key] != undefined"
+                            class="collection-name">
+                        {{ $i18n.get('label_filters_from') + " " + taxonomyFiltersCollectionNames[key] + ": " }}
+                    </div>
+                    <div    
+                            v-if="taxonomyFilter.length > 0 && !(taxonomyFiltersCollectionNames != undefined && taxonomyFiltersCollectionNames[key] != undefined)"
+                            class="collection-name">
+                        <span 
+                                style="width: 100%; height: 54px;"
+                                class="icon has-text-centered loading-icon">
+                            <div class="control has-icons-right is-loading is-clearfix" />
+                        </span>
+                    </div>
+                    <template v-if="taxonomyFilter.length > 0">
+                        <tainacan-filter-item
+                                v-show="!isMenuCompressed"        
+                                :query="getQuery"
+                                v-for="(filter, filterIndex) in taxonomyFilter"
+                                :key="filterIndex"
+                                :filter="filter"
+                                :open="!collapseAll"
+                                :is-repository-level="key == 'repository-filters'"/>
+                    </template>
+                    <!-- <p   
+                            class="has-text-gray is-size-7"
+                            v-if="taxonomyFilter.length <= 0">
+                        {{ $i18n.get('info_there_is_no_filter') }}    
+                    </p> -->
+                    <hr v-if="taxonomyFilter.length > 0">
+                </div>
+                <div 
+                        v-if="key != 'repository-filters'"
+                        :key="index"
+                        v-for="(taxonomyFilter, key, index) of taxonomyFilters">
+                    <div 
+                            v-tooltip="{
+                                delay: {
+                                    show: 500,
+                                    hide: 300,
+                                },
+                                content: $i18n.get('label_filters_from') + ' ' + taxonomyFiltersCollectionNames[key] + ': ',
+                                autoHide: false,
+                                classes: ['tooltip', isRepositoryLevel ? 'repository-tooltip' : ''],
+                                placement: 'auto-start'
+                            }" 
+                            v-if="taxonomyFilter.length > 0 && taxonomyFiltersCollectionNames != undefined && taxonomyFiltersCollectionNames[key] != undefined"
+                            class="collection-name">
+                        {{ $i18n.get('label_filters_from') + " " + taxonomyFiltersCollectionNames[key] + ": " }}
+                    </div>
+                    <div    
+                            v-if="taxonomyFilter.length > 0 && !(taxonomyFiltersCollectionNames != undefined && taxonomyFiltersCollectionNames[key] != undefined)"
+                            class="collection-name">
+                        <span 
+                                style="width: 100%; height: 54px;"
+                                class="icon has-text-centered loading-icon">
+                            <div class="control has-icons-right is-loading is-clearfix" />
+                        </span>
+                    </div>
+                    <template v-if="taxonomyFilter.length > 0">
+                        <tainacan-filter-item
+                                v-show="!isMenuCompressed"        
+                                :query="getQuery"
+                                v-for="(filter, filterIndex) in taxonomyFilter"
+                                :key="filterIndex"
+                                :filter="filter"
+                                :open="!collapseAll"
+                                :is-repository-level="key == 'repository-filters'"/>
+                    </template>
+                    <!-- <p   
+                            class="has-text-gray is-size-7"
+                            v-if="taxonomyFilter.length <= 0">
+                        {{ $i18n.get('info_there_is_no_filter') }}    
+                    </p> -->
+                    <hr v-if="taxonomyFilter.length > 0">
+                </div>
+            </template>
+
+            <!-- REPOSITORY ITEMS PAGE FILTERS -->
+            <template v-else-if="isRepositoryLevel && !taxonomy">
+                <collections-filter
+                        :open="!collapseAll"
+                        :query="getQuery"/>
+                <div 
+                        v-if="key == 'repository-filters'"
+                        :key="index"
+                        v-for="(repositoryCollectionFilter, key, index) of repositoryCollectionFilters">
+                    <div 
+                            v-tooltip="{
+                                delay: {
+                                    show: 500,
+                                    hide: 300,
+                                },
+                                content: $i18n.get('label_filters_from') + ' ' + repositoryCollectionNames[key] + ': ',
+                                autoHide: false,
+                                classes: ['tooltip', isRepositoryLevel ? 'repository-tooltip' : ''],
+                                placement: 'auto-start'
+                            }" 
+                            v-if="repositoryCollectionFilter.length > 0 && repositoryCollectionNames != undefined && repositoryCollectionNames[key] != undefined"
+                            class="collection-name">
+                        {{ $i18n.get('label_filters_from') + " " + repositoryCollectionNames[key] + ": " }}
+                    </div>
+                    <div    
+                            v-if="repositoryCollectionFilter.length > 0 && !(repositoryCollectionNames != undefined && repositoryCollectionNames[key] != undefined)"
+                            class="collection-name">
+                        <span 
+                                style="width: 100%; height: 54px;"
+                                class="icon has-text-centered loading-icon">
+                            <div class="control has-icons-right is-loading is-clearfix" />
+                        </span>
+                    </div>
+                    <template v-if="repositoryCollectionFilter.length > 0">
+                        <tainacan-filter-item
+                                v-show="!isMenuCompressed"        
+                                :query="getQuery"
+                                v-for="(filter, filterIndex) in repositoryCollectionFilter"
+                                :key="filterIndex"
+                                :filter="filter"
+                                :open="!collapseAll"
+                                :is-repository-level="key == 'repository-filters'"/>
+                    </template>
+                    <!-- <p   
+                            class="has-text-gray is-size-7"
+                            v-if="taxonomyFilter.length <= 0">
+                        {{ $i18n.get('info_there_is_no_filter') }}    
+                    </p> -->
+                    <hr v-if="repositoryCollectionFilters.length > 0">
+                </div>
+                <div 
+                        v-if="key != 'repository-filters'"
+                        :key="index"
+                        v-for="(repositoryCollectionFilter, key, index) of repositoryCollectionFilters">
+                    <div 
+                            v-tooltip="{
+                                delay: {
+                                    show: 500,
+                                    hide: 300,
+                                },
+                                content: $i18n.get('label_filters_from') + ' ' + repositoryCollectionNames[key] + ': ',
+                                autoHide: false,
+                                classes: ['tooltip', isRepositoryLevel ? 'repository-tooltip' : ''],
+                                placement: 'auto-start'
+                            }" 
+                            v-if="repositoryCollectionFilter.length > 0 && repositoryCollectionNames != undefined && repositoryCollectionNames[key] != undefined"
+                            class="collection-name">
+                        {{ $i18n.get('label_filters_from') + " " + repositoryCollectionNames[key] + ": " }}
+                    </div>
+                    <div    
+                            v-if="repositoryCollectionFilter.length > 0 && !(repositoryCollectionNames != undefined && repositoryCollectionNames[key] != undefined)"
+                            class="collection-name">
+                        <span 
+                                style="width: 100%; height: 54px;"
+                                class="icon has-text-centered loading-icon">
+                            <div class="control has-icons-right is-loading is-clearfix" />
+                        </span>
+                    </div>
+                    <template v-if="repositoryCollectionFilter.length > 0">
+                        <tainacan-filter-item
+                                v-show="!isMenuCompressed"        
+                                :query="getQuery"
+                                v-for="(filter, filterIndex) in repositoryCollectionFilter"
+                                :key="filterIndex"
+                                :filter="filter"
+                                :open="!collapseAll"
+                                :is-repository-level="key == 'repository-filters'"/>
+                    </template>
+                    <!-- <p   
+                            class="has-text-gray is-size-7"
+                            v-if="taxonomyFilter.length <= 0">
+                        {{ $i18n.get('info_there_is_no_filter') }}    
+                    </p> -->
+                    <hr v-if="repositoryCollectionFilters.length > 0">
+                </div>
+            </template>
+
+            <!-- COLLECTION ITEMS PAGE FILTERS -->
+            <template v-else>
+                <tainacan-filter-item
+                        v-show="!isMenuCompressed"        
+                        :query="getQuery"
+                        v-for="(filter, index) in filters"
+                        :key="index"
+                        :filter="filter"
+                        :open="!collapseAll"
+                        :is-repository-level="isRepositoryLevel"/>
+            </template>
+        </div>
+        <section
+                v-if="!isLoadingFilters &&
+                    !((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
+                class="is-grouped-centered section">
+            <div class="content has-text-gray has-text-centered">
+                <p>
+                    <span class="icon is-large">
+                        <i class="tainacan-icon tainacan-icon-36px tainacan-icon-filters" />
+                    </span>
+                </p>
+                <p>{{ $i18n.get('info_there_is_no_filter' ) }}</p>
+                <router-link
+                        v-if="!$route.query.iframemode && this.$route.name != null"
+                        id="button-create-filter"
+                        :to="isRepositoryLevel && $routerHelper ? $routerHelper.getNewFilterPath() : $routerHelper.getNewCollectionFilterPath(collectionId)"
+                        tag="button"
+                        class="button is-secondary is-centered">
+                    {{ $i18n.getFrom('filters', 'new_item') }}
+                </router-link>
+            </div>
+        </section>
+    </div>    
 </template> 
 
 <script>
@@ -215,21 +265,31 @@
             CollectionsFilter
         },
         props: {
-            filters: Array,
-            collapsed: Boolean,
+            collectionId: String,
             isRepositoryLevel: Boolean,
-            taxonomyFilters: Object,
             taxonomy: String,
-            repositoryCollectionFilters: Object
+            isLoadingFilters: false,
         },
         data() {
             return {
+                collapseAll: false,
                 taxonomyFiltersCollectionNames: {},
                 repositoryCollectionNames: {},
-                collectionNameSearchCancel: undefined
+                collectionNameSearchCancel: undefined,
+                filtersSearchCancel: undefined,
+                repositoryFiltersSearchCancel: undefined,
             }
         },
         computed: {
+            filters() {
+                return this.getFilters();
+            },
+            repositoryCollectionFilters() {
+                return this.getRepositoryCollectionFilters();
+            },
+            taxonomyFilters() {
+                return this.getTaxonomyFilters();
+            },
             getQuery() {
                 return this.getPostQuery();
             },
@@ -284,10 +344,29 @@
                 }                
             }
         },
+        mounted() {
+            this.$eventBusSearch.$on('hasToPrepareMetadataAndFilters', () => {
+                /* This condition is to prevent an incorrect fetch by filter or metadata when we come from items
+                 * at collection level to items page at repository level
+                 */
+                this.prepareFilters();
+            });
+        },
         beforeDestroy() {
             // Cancels previous collection name Request
             if (this.collectionNameSearchCancel != undefined)
                 this.collectionNameSearchCancel.cancel('Collection name search Canceled.');
+        
+            // Cancels previous Repository Filters Request
+            if (this.repositoryFiltersSearchCancel != undefined)
+                this.repositoryFiltersSearchCancel.cancel('Repository Collection Filters search Canceled.');
+
+            // Cancels previous Filters Request
+            if (this.filtersSearchCancel != undefined)
+                this.filtersSearchCancel.cancel('Filters search Canceled.');
+
+            this.$eventBusSearch.$off('hasToPrepareMetadataAndFilters');
+     
         },
         methods: {
             ...mapGetters('search',[
@@ -296,11 +375,74 @@
             ...mapActions('collection',[
                 'fetchAllCollectionNames'
             ]),
+            ...mapActions('filter', [
+                'fetchFilters',
+                'fetchTaxonomyFilters',
+                'fetchRepositoryCollectionFilters'
+            ]),
+            ...mapGetters('filter', [
+                'getFilters',
+                'getTaxonomyFilters',
+                'getRepositoryCollectionFilters'
+            ]),
+            prepareFilters() {
+                
+                // Cancels previous Request
+                if (this.filtersSearchCancel != undefined)
+                    this.filtersSearchCancel.cancel('Filters search Canceled.');
+
+                this.isLoadingFilters = true;
+            
+                // Normal filter loading, only collection ones
+                if (!this.taxonomy) {
+                    this.fetchFilters({
+                        collectionId: this.collectionId,
+                        isRepositoryLevel: this.isRepositoryLevel,
+                        isContextEdit: false,
+                        includeDisabled: false,
+                    })
+                        .then((resp) => {
+                            resp.request
+                                .then(() => this.isLoadingFilters = false)
+                                .catch(() => this.isLoadingFilters = false);
+
+                            // Search Request Token for cancelling
+                            this.filtersSearchCancel = resp.source;
+                        })
+                        .catch(() => this.isLoadingFilters = false);
+                
+                // Custom filter loading, get's from collections that have items with that taxonomy
+                } else {
+                    let taxonomyId = this.taxonomy.split("_");
+                    this.fetchTaxonomyFilters(taxonomyId[taxonomyId.length - 1])
+                        .catch(() => this.isLoadingFilters = false);
+                        
+                }
+
+                // On repository level we also fetch collection filters
+                if (this.isRepositoryLevel) {
+                    
+                    // Cancels previous Request
+                    if (this.repositoryFiltersSearchCancel != undefined)
+                        this.repositoryFiltersSearchCancel.cancel('Repository Collection Filters search Canceled.');
+
+                    this.fetchRepositoryCollectionFilters()
+                        .then((source) => {
+                            this.repositoryFiltersSearchCancel = source;
+                        });
+                }
+            }
         }
     }
 </script>
 
 <style scoped>
+
+    .collapse-all {
+        display: inline-flex;
+        align-items: center;
+        font-size: 0.75rem !important;
+    }
     .extra-margin {
         margin-bottom: 40px;
     }
diff --git a/src/views/admin/pages/lists/items-page.vue b/src/views/admin/pages/lists/items-page.vue
index a00dce9a6..7929ddc64 100644
--- a/src/views/admin/pages/lists/items-page.vue
+++ b/src/views/admin/pages/lists/items-page.vue
@@ -108,58 +108,11 @@
                     class="link-style is-size-7 is-pulled-right is-hidden-mobile">
                 {{ $i18n.get('advanced_search') }}
             </button>
-            
-            <h3 
-                    id="filters-label-landmark"
-                    class="has-text-weight-semibold">
-                {{ $i18n.get('filters') }}
-            </h3>
-            <button
-                    v-if="!isLoadingFilters &&
-                    ((filters.length >= 0 &&
-                    isRepositoryLevel) || filters.length > 0)"
-                    class="link-style collapse-all"
-                    @click="collapseAll = !collapseAll">
-                {{ collapseAll ? $i18n.get('label_collapse_all') : $i18n.get('label_expand_all') }}
-                <span class="icon">
-                    <i 
-                            :class="{ 'tainacan-icon-arrowdown' : collapseAll, 'tainacan-icon-arrowright' : !collapseAll }"
-                            class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
-                </span>
-            </button>
-
-            <br>
-            <br>
 
             <filters-items-list
-                    v-if="!isLoadingFilters &&
-                        ((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
-                    :filters="filters"
-                    :repository-collection-filters="repositoryCollectionFilters"
-                    :collapsed="collapseAll"
+                    :collection-id="collectionId"
                     :is-repository-level="isRepositoryLevel"/>
 
-            <section
-                    v-if="!isLoadingFilters &&
-                        !((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
-                    class="is-grouped-centered section">
-                <div class="content has-text-gray has-text-centered">
-                    <p>
-                        <span class="icon is-large">
-                            <i class="tainacan-icon tainacan-icon-36px tainacan-icon-filters" />
-                        </span>
-                    </p>
-                    <p>{{ $i18n.get('info_there_is_no_filter' ) }}</p>
-                    <router-link
-                            id="button-create-filter"
-                            :to="isRepositoryLevel ? $routerHelper.getNewFilterPath() : $routerHelper.getNewCollectionFilterPath(collectionId)"
-                            tag="button"
-                            class="button is-secondary is-centered">
-                        {{ $i18n.getFrom('filters', 'new_item') }}
-                    </router-link>
-                </div>
-            </section>
-
         </aside>
 
         <!-- ITEMS LIST AREA (ASIDE THE ASIDE) ------------------------- -->
@@ -682,7 +635,7 @@
        
         <b-modal
                 role="region"
-                aria-labelledby="filters-label-landmark-modal"
+                aria-labelledby="filters-label-landmark"
                 id="filters-mobile-modal"
                 class="tainacan-form is-hidden-tablet"                
                 :active.sync="isFilterModalActive"
@@ -698,60 +651,12 @@
                     tabindex="-1"
                     aria-modal
                     role="dialog">
-                <h3 
-                        id="filters-label-landmark-modal"
-                        class="has-text-weight-semibold">
-                    {{ $i18n.get('filters') }}
-                </h3>
-                <button
-                        aria-controls="filters-items-list"
-                        :aria-expanded="!collapseAll"
-                        v-if="!isLoadingFilters &&
-                            ((filters.length >= 0 &&
-                            isRepositoryLevel) || filters.length > 0)"
-                        class="link-style collapse-all"
-                        @click="collapseAll = !collapseAll">
-                    {{ collapseAll ? $i18n.get('label_collapse_all') : $i18n.get('label_expand_all') }}
-                    <span class="icon">
-                        <i 
-                                :class="{ 'tainacan-icon-arrowdown' : collapseAll, 'tainacan-icon-arrowright' : !collapseAll }"
-                                class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
-                    </span>
-                </button>
-
-                <br>
-                <br>
 
                 <filters-items-list
+                        :collection-id="collectionId"
                         id="filters-items-list"
-                        v-if="!isLoadingFilters &&
-                            ((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
-                        :filters="filters"
-                        :collapsed="collapseAll"
-                        :repository-collection-filters="repositoryCollectionFilters"
                         :is-repository-level="isRepositoryLevel"/>
 
-                <section
-                        v-if="!isLoadingFilters &&
-                            !((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
-                        class="is-grouped-centered section">
-                    <div class="content has-text-gray has-text-centered">
-                        <p>
-                            <span class="icon is-large">
-                                <i class="tainacan-icon tainacan-icon-36px tainacan-icon-filters" />
-                            </span>
-                        </p>
-                        <p>{{ $i18n.get('info_there_is_no_filter' ) }}</p>
-                        <router-link
-                                v-if="!$route.query.iframemode"
-                                id="button-create-filter"
-                                :to="isRepositoryLevel ? $routerHelper.getNewFilterPath() : $routerHelper.getNewCollectionFilterPath(collectionId)"
-                                tag="button"
-                                class="button is-secondary is-centered">
-                            {{ $i18n.getFrom('filters', 'new_item') }}
-                        </router-link>
-                    </div>
-                </section>
             </div>
         </b-modal>
     </div>
@@ -790,11 +695,9 @@
                 displayedMetadata: [],
                 prefDisplayedMetadata: [],
                 isLoadingItems: false,
-                isLoadingFilters: false,
                 isLoadingMetadata: false,
                 hasFiltered: false,
                 isFiltersMenuCompressed: false,
-                collapseAll: true,
                 futureSearchQuery: '',
                 localDisplayedMetadata: [],
                 registeredViewModes: tainacan_plugin.registered_view_modes,
@@ -807,8 +710,6 @@
                 isFilterModalActive: false,
                 hasAnOpenModal: false,
                 hasAnOpenAlert: true,
-                repositoryFiltersSearchCancel: undefined,
-                filtersSearchCancel: undefined,
                 metadataSearchCancel: undefined
             }
         },
@@ -826,12 +727,6 @@
                 this.updateCollectionInfo();
                 return this.getTotalItems();
             },
-            filters() {
-                return this.getFilters();
-            },
-            repositoryCollectionFilters() {
-                return this.getRepositoryCollectionFilters();
-            },
             metadata() {
                 return this.getMetadata();
             },
@@ -929,7 +824,6 @@
                  */
                 if (this.collectionId == to.params.collectionId || to.query.fromBreadcrumb) {
                     this.prepareMetadata();
-                    this.prepareFilters();
                 }
             });
 
@@ -943,7 +837,7 @@
 
         },
         mounted() {
-            this.prepareFilters();
+            
             this.prepareMetadata();
             this.localDisplayedMetadata = JSON.parse(JSON.stringify(this.displayedMetadata));
 
@@ -979,19 +873,11 @@
             // Cancels previous Metadata Request
             if (this.metadataSearchCancel != undefined)
                 this.metadataSearchCancel.cancel('Metadata search Canceled.');
-     
-            // Cancels previous Filters Request
-            if (this.filtersSearchCancel != undefined)
-                this.filtersSearchCancel.cancel('Filters search Canceled.');
-     
+
             // Cancels previous Items Request
             if (this.$eventBusSearch.searchCancel != undefined)
                 this.$eventBusSearch.searchCancel.cancel('Item search Canceled.');
 
-            // Cancels previous Repository Filters Request
-            if (this.repositoryFiltersSearchCancel != undefined)
-                this.repositoryFiltersSearchCancel.cancel('Repository Collection Filters search Canceled.');
-
         },
         methods: {
             ...mapGetters('collection', [
@@ -1447,12 +1333,6 @@
         margin: 0;
     }
 
-    .collapse-all {
-        display: inline-flex;
-        align-items: center;
-        font-size: 0.75rem !important;
-    }
-
     .advanced-search-criteria-title {
         margin-bottom: 40px;
 
diff --git a/src/views/theme-search/pages/theme-items-page.vue b/src/views/theme-search/pages/theme-items-page.vue
index 3d728b619..e0b4b1b9b 100644
--- a/src/views/theme-search/pages/theme-items-page.vue
+++ b/src/views/theme-search/pages/theme-items-page.vue
@@ -53,7 +53,6 @@
 
         <!-- Sidebar with search and filters -->
         <aside
-                :aria-busy="isLoadingFilters"
                 id="filters-desktop-aside"
                 role="region"
                 aria-labelledby="filters-label-landmark"
@@ -62,9 +61,6 @@
                         !openAdvancedSearch && 
                         !(registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].full_screen)"
                 class="filters-menu tainacan-form is-hidden-mobile">
-            <!-- <b-loading
-                    :is-full-page="false"
-                    :active.sync="isLoadingFilters"/> -->
 
             <div class="search-area is-hidden-mobile">
                 <div class="control has-icons-right  is-small is-clearfix">
@@ -91,52 +87,11 @@
                 {{ $i18n.get('advanced_search') }}
             </button> -->
 
-            <h3 
-                    id="filters-label-landmark"
-                    class="has-text-weight-semibold">
-                {{ $i18n.get('filters') }}
-            </h3>
-            <button
-                    v-if="!isLoadingFilters &&
-                        ((filters.length >= 0 &&
-                        isRepositoryLevel) || filters.length > 0)"
-                    class="link-style collapse-all"
-                    @click="collapseAll = !collapseAll">
-                {{ collapseAll ? $i18n.get('label_collapse_all') : $i18n.get('label_expand_all') }}
-                <span class="icon">
-                    <i 
-                            :class="{ 'tainacan-icon-arrowdown' : collapseAll, 'tainacan-icon-arrowright' : !collapseAll }"
-                            class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
-                </span>
-            </button>
-
-            <br>
-            <br>
-
             <filters-items-list
-                    v-if="!isLoadingFilters &&
-                        ((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
-                    :filters="filters"
-                    :taxonomy-filters="taxonomyFilters"
-                    :repository-collection-filters="repositoryCollectionFilters"
                     :taxonomy="taxonomy"
-                    :collapsed="collapseAll"
+                    :collection-id="collectionId"
                     :is-repository-level="isRepositoryLevel"/>
 
-            <section
-                    v-if="!isLoadingFilters &&
-                        !((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
-                    class="is-grouped-centered section">
-                <div class="content has-text-gray has-text-centered">
-                    <p>
-                        <span class="icon is-large">
-                            <i class="tainacan-icon tainacan-icon-36px tainacan-icon-filters" />
-                        </span>
-                    </p>
-                    <p>{{ $i18n.get('info_there_is_no_filter' ) }}</p>
-                </div>
-            </section>
-
         </aside>
         
         <!-- ITEMS LIST AREA (ASIDE THE ASIDE) ------------------------- -->
@@ -551,7 +506,7 @@
        
         <b-modal
                 role="region"
-                aria-labelledby="filters-label-landmark-modal"
+                aria-labelledby="filters-label-landmark"
                 id="filters-mobile-modal"
                 class="tainacan-form is-hidden-tablet"                
                 :active.sync="isFilterModalActive"
@@ -567,53 +522,13 @@
                     tabindex="-1"
                     aria-modal
                     role="dialog">
-                <h3 
-                        id="filters-label-landmark-modal"
-                        class="has-text-weight-semibold">
-                    {{ $i18n.get('filters') }}
-                </h3>
-                <button
-                        aria-controls="filters-items-list"
-                        :aria-expanded="!collapseAll"
-                        v-if="!isLoadingFilters &&
-                            ((filters.length >= 0 &&
-                            isRepositoryLevel) || filters.length > 0)"
-                        class="link-style collapse-all"
-                        @click="collapseAll = !collapseAll">
-                    {{ collapseAll ? $i18n.get('label_collapse_all') : $i18n.get('label_expand_all') }}
-                    <span class="icon">
-                        <i 
-                                :class="{ 'tainacan-icon-arrowdown' : collapseAll, 'tainacan-icon-arrowright' : !collapseAll }"
-                                class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
-                    </span>
-                </button>
-
-                <br>
-                <br>
 
                 <filters-items-list
                         id="filters-items-list"
-                        v-if="!isLoadingFilters &&
-                            ((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
-                        :filters="filters"
-                        :taxonomy-filters="taxonomyFilters"
                         :taxonomy="taxonomy"
-                        :collapsed="collapseAll"
+                        :collection-id="collectionId"
                         :is-repository-level="isRepositoryLevel"/>
 
-                <section
-                        v-if="!isLoadingFilters &&
-                            !((filters.length >= 0 && isRepositoryLevel) || filters.length > 0)"
-                        class="is-grouped-centered section">
-                    <div class="content has-text-gray has-text-centered">
-                        <p>
-                            <span class="icon is-large">
-                                <i class="tainacan-icon tainacan-icon-36px tainacan-icon-filters" />
-                            </span>
-                        </p>
-                        <p>{{ $i18n.get('info_there_is_no_filter' ) }}</p>
-                    </div>
-                </section>
             </div>
         </b-modal>
     </div>
@@ -650,11 +565,9 @@
                 displayedMetadata: [],
                 prefDisplayedMetadata: [],
                 isLoadingItems: false,
-                isLoadingFilters: false,
                 isLoadingMetadata: false,
                 hasFiltered: false,
                 isFiltersMenuCompressed: false,
-                collapseAll: true,
                 futureSearchQuery: '',
                 localDisplayedMetadata: [],
                 registeredViewModes: tainacan_plugin.registered_view_modes,
@@ -667,9 +580,7 @@
                 isFilterModalActive: false,
                 customFilters: [],
                 hasAnOpenModal: false,
-                hasAnOpenAlert: true,
-                repositoryFiltersSearchCancel: undefined,
-                filtersSearchCancel: undefined,
+                hasAnOpenAlert: true,                
                 metadataSearchCancel: undefined
             }
         },
@@ -686,15 +597,6 @@
             totalItems() {
                 return this.getTotalItems();
             },
-            filters() {
-                return this.getFilters();
-            },
-            repositoryCollectionFilters() {
-                return this.getRepositoryCollectionFilters();
-            },
-            taxonomyFilters() {
-                return this.getTaxonomyFilters();
-            },
             metadata() {
                 return this.getMetadata();
             },
@@ -789,7 +691,6 @@
                  * at collection level to items page at repository level
                  */
                 this.prepareMetadata();
-                this.prepareFilters();
             });
 
             if(this.$route.query && this.$route.query.advancedSearch) {
@@ -803,7 +704,6 @@
         },
         mounted() {
             
-            this.prepareFilters();
             this.prepareMetadata();
             this.localDisplayedMetadata = JSON.parse(JSON.stringify(this.displayedMetadata));
 
@@ -840,17 +740,10 @@
             if (this.metadataSearchCancel != undefined)
                 this.metadataSearchCancel.cancel('Metadata search Canceled.');
      
-            // Cancels previous Filters Request
-            if (this.filtersSearchCancel != undefined)
-                this.filtersSearchCancel.cancel('Filters search Canceled.');
-     
             // Cancels previous Items Request
             if (this.$eventBusSearch.searchCancel != undefined)
                 this.$eventBusSearch.searchCancel.cancel('Item search Canceled.');
 
-            // Cancels previous Repository Filters Request
-            if (this.repositoryFiltersSearchCancel != undefined)
-                this.repositoryFiltersSearchCancel.cancel('Repository Collection Filters search Canceled.');
 
         },
         methods: {
@@ -864,16 +757,6 @@
             ...mapGetters('metadata', [
                 'getMetadata'
             ]),
-            ...mapActions('filter', [
-                'fetchFilters',
-                'fetchTaxonomyFilters',
-                'fetchRepositoryCollectionFilters'
-            ]),
-            ...mapGetters('filter', [
-                'getFilters',
-                'getTaxonomyFilters',
-                'getRepositoryCollectionFilters'
-            ]),
             ...mapGetters('search', [
                 'getSearchQuery',
                 'getOrderBy',
@@ -969,53 +852,6 @@
                 // Closes dropdown
                 this.$refs.displayedMetadataDropdown.toggle();
             },
-            prepareFilters() {
-                
-                // Cancels previous Request
-                if (this.filtersSearchCancel != undefined)
-                    this.filtersSearchCancel.cancel('Filters search Canceled.');
-
-                this.isLoadingFilters = true;
-            
-                // Normal filter loading, only collection ones
-                if (!this.taxonomy) {
-                    this.fetchFilters({
-                        collectionId: this.collectionId,
-                        isRepositoryLevel: this.isRepositoryLevel,
-                        isContextEdit: false,
-                        includeDisabled: false,
-                    })
-                        .then((resp) => {
-                            resp.request
-                                .then(() => this.isLoadingFilters = false)
-                                .catch(() => this.isLoadingFilters = false);
-
-                            // Search Request Token for cancelling
-                            this.filtersSearchCancel = resp.source;
-                        })
-                        .catch(() => this.isLoadingFilters = false);
-                
-                // Custom filter loading, get's from collections that have items with that taxonomy
-                } else {
-                    let taxonomyId = this.taxonomy.split("_");
-                    this.fetchTaxonomyFilters(taxonomyId[taxonomyId.length - 1])
-                        .catch(() => this.isLoadingFilters = false);
-                        
-                }
-
-                // On repository level we also fetch collection filters
-                if (this.isRepositoryLevel) {
-                    
-                    // Cancels previous Request
-                    if (this.repositoryFiltersSearchCancel != undefined)
-                        this.repositoryFiltersSearchCancel.cancel('Repository Collection Filters search Canceled.');
-
-                    this.fetchRepositoryCollectionFilters()
-                        .then((source) => {
-                            this.repositoryFiltersSearchCancel = source;
-                        });
-                }
-            },
             prepareMetadata() {
             
                 // Cancels previous Request
@@ -1293,12 +1129,6 @@
         animation: open-full-screen 0.4s ease;
     }
 
-    .collapse-all {
-        display: inline-flex;
-        align-items: center;
-        font-size: 0.75rem !important;
-    }
-
     .advanced-search-criteria-title {
        margin-bottom: 40px;