show no available tags when all tags are hidden

src/stores/transactionTag.js

@@ -75,6 +75,9 @@ export const useTransactionTagsStore = defineStore('transactionTags', {
         },
         allAvailableTagsCount(state) {
             return state.allTransactionTags.length;
+        },
+        allVisibleTagsCount(state) {
+            return state.allVisibleTags.length;
         }
     },
     actions: {

src/views/desktop/common/cards/TransactionTagFilterSettingsCard.vue

@@ -65,11 +65,11 @@
                                :key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]"></v-skeleton-loader>
         </div>
 
-        <v-card-text :class="{ 'mt-0 mt-sm-2 mt-md-4': dialogMode }" v-if="!loading && !hasAnyAvailableTag">
+        <v-card-text :class="{ 'mt-0 mt-sm-2 mt-md-4': dialogMode }" v-if="!loading && !hasAnyVisibleTag">
             <span class="text-body-1">{{ $t('No available tag') }}</span>
         </v-card-text>
 
-        <v-card-text :class="{ 'mt-0 mt-sm-2 mt-md-4': dialogMode }" v-else-if="!loading && hasAnyAvailableTag">
+        <v-card-text :class="{ 'mt-0 mt-sm-2 mt-md-4': dialogMode }" v-else-if="!loading && hasAnyVisibleTag">
             <v-expansion-panels class="tag-categories" multiple v-model="expandTagCategories">
                 <v-expansion-panel class="border" key="default" value="default">
                     <v-expansion-panel-title class="expand-panel-title-with-bg py-0">
@@ -104,7 +104,7 @@
 
         <v-card-text class="overflow-y-visible" v-if="dialogMode">
             <div class="w-100 d-flex justify-center mt-2 mt-sm-4 mt-md-6 gap-4">
-                <v-btn :disabled="!hasAnyAvailableTag" @click="save">{{ $t(applyText) }}</v-btn>
+                <v-btn :disabled="!hasAnyVisibleTag" @click="save">{{ $t(applyText) }}</v-btn>
                 <v-btn color="secondary" variant="tonal" @click="cancel">{{ $t('Cancel') }}</v-btn>
             </div>
         </v-card-text>
@@ -171,6 +171,13 @@ export default {
         },
         hasAnyAvailableTag() {
             return this.transactionTagsStore.allAvailableTagsCount > 0;
+        },
+        hasAnyVisibleTag() {
+            if (this.showHidden) {
+                return this.transactionTagsStore.allAvailableTagsCount > 0;
+            } else {
+                return this.transactionTagsStore.allVisibleTagsCount > 0;
+            }
         }
     },
     created() {

src/views/mobile/settings/TransactionTagFilterSettingsPage.vue

@@ -5,7 +5,7 @@
             <f7-nav-title :title="$t(title)"></f7-nav-title>
             <f7-nav-right>
                 <f7-link icon-f7="ellipsis" :class="{ 'disabled': !hasAnyAvailableTag }" @click="showMoreActionSheet = true"></f7-link>
-                <f7-link :text="$t(applyText)" :class="{ 'disabled': !hasAnyAvailableTag }" @click="save"></f7-link>
+                <f7-link :text="$t(applyText)" :class="{ 'disabled': !hasAnyVisibleTag }" @click="save"></f7-link>
             </f7-nav-right>
         </f7-navbar>
 
@@ -37,11 +37,11 @@
             </f7-accordion-item>
         </f7-block>
 
-        <f7-list strong inset dividers accordion-list class="margin-top" v-if="!loading && !hasAnyAvailableTag">
+        <f7-list strong inset dividers accordion-list class="margin-top" v-if="!loading && !hasAnyVisibleTag">
             <f7-list-item :title="$t('No available tag')"></f7-list-item>
         </f7-list>
 
-        <f7-block class="combination-list-wrapper margin-vertical" key="default" v-if="!loading">
+        <f7-block class="combination-list-wrapper margin-vertical" key="default" v-show="!loading && hasAnyVisibleTag">
             <f7-accordion-item :opened="collapseStates['default'].opened"
                                @accordion:open="collapseStates['default'].opened = true"
                                @accordion:close="collapseStates['default'].opened = false">
@@ -143,6 +143,13 @@ export default {
         },
         hasAnyAvailableTag() {
             return this.transactionTagsStore.allAvailableTagsCount > 0;
+        },
+        hasAnyVisibleTag() {
+            if (this.showHidden) {
+                return this.transactionTagsStore.allAvailableTagsCount > 0;
+            } else {
+                return this.transactionTagsStore.allVisibleTagsCount > 0;
+            }
         }
     },
     created() {