From 157eb140ebe2a66315a8c81fc1ebafb4a77c699c Mon Sep 17 00:00:00 2001
From: MaysWind <i@mayswind.net>
Date: Sat, 10 Aug 2024 00:40:03 +0800
Subject: [PATCH] hide multiple accounts / categories item when there are no
 accounts / categories

---
 src/views/desktop/transactions/ListPage.vue | 30 +++++++++++++++++--
 src/views/mobile/transactions/ListPage.vue  | 33 +++++++++++++++++++--
 2 files changed, 58 insertions(+), 5 deletions(-)

diff --git a/src/views/desktop/transactions/ListPage.vue b/src/views/desktop/transactions/ListPage.vue
index c8f76e83..2d2983f8 100644
--- a/src/views/desktop/transactions/ListPage.vue
+++ b/src/views/desktop/transactions/ListPage.vue
@@ -146,7 +146,8 @@
                                                         </v-list-item>
                                                         <v-list-item key="multiple" value="multiple" class="text-sm" density="compact"
                                                                      :class="{ 'list-item-selected': query.categoryIds && queryAllFilterCategoryIdsCount > 1 }"
-                                                                     :append-icon="(query.categoryIds && queryAllFilterCategoryIdsCount > 1 ? icons.check : null)">
+                                                                     :append-icon="(query.categoryIds && queryAllFilterCategoryIdsCount > 1 ? icons.check : null)"
+                                                                     v-if="allAvailableCategoriesCount > 0">
                                                             <v-list-item-title class="cursor-pointer"
                                                                                @click="showFilterCategoryDialog = true">
                                                                 <div class="d-flex align-center">
@@ -158,7 +159,7 @@
 
                                                         <template :key="categoryType"
                                                                   v-for="(categories, categoryType) in allPrimaryCategories">
-                                                            <v-list-item density="compact">
+                                                            <v-list-item density="compact" v-show="categories && categories.length">
                                                                 <v-list-item-title>
                                                                     <span class="text-sm">{{ getTransactionTypeName(getTransactionTypeFromCategoryType(categoryType), 'Type') }}</span>
                                                                 </v-list-item-title>
@@ -290,7 +291,8 @@
                                                         </v-list-item>
                                                         <v-list-item key="multiple" value="multiple" class="text-sm" density="compact"
                                                                      :class="{ 'list-item-selected': query.accountIds && queryAllFilterAccountIdsCount > 1 }"
-                                                                     :append-icon="(query.accountIds && queryAllFilterAccountIdsCount > 1 ? icons.check : null)">
+                                                                     :append-icon="(query.accountIds && queryAllFilterAccountIdsCount > 1 ? icons.check : null)"
+                                                                     v-if="allAvailableAccountsCount > 0">
                                                             <v-list-item-title class="cursor-pointer"
                                                                                @click="showFilterAccountDialog = true">
                                                                 <div class="d-flex align-center">
@@ -896,6 +898,9 @@ export default {
         allAccounts() {
             return this.accountsStore.allAccountsMap;
         },
+        allAvailableAccountsCount() {
+            return this.accountsStore.allAvailableAccountsCount;
+        },
         allCategories() {
             return this.transactionCategoriesStore.allTransactionCategoriesMap;
         },
@@ -916,6 +921,25 @@ export default {
 
             return primaryCategories;
         },
+        allAvailableCategoriesCount() {
+            let totalCount = 0;
+
+            for (const categoryType in this.transactionCategoriesStore.allTransactionCategories) {
+                if (!Object.prototype.hasOwnProperty.call(this.transactionCategoriesStore.allTransactionCategories, categoryType)) {
+                    continue;
+                }
+
+                if (this.query.type && this.getTransactionTypeFromCategoryType(categoryType) !== this.query.type) {
+                    continue;
+                }
+
+                if (this.transactionCategoriesStore.allTransactionCategories[categoryType]) {
+                    totalCount += this.transactionCategoriesStore.allTransactionCategories[categoryType].length;
+                }
+            }
+
+            return totalCount;
+        },
         allTransactionTags() {
             return this.transactionTagsStore.allTransactionTagsMap;
         },
diff --git a/src/views/mobile/transactions/ListPage.vue b/src/views/mobile/transactions/ListPage.vue
index 55b960ad..493b5469 100644
--- a/src/views/mobile/transactions/ListPage.vue
+++ b/src/views/mobile/transactions/ListPage.vue
@@ -300,7 +300,10 @@
                         <f7-icon class="list-item-checked-icon" f7="checkmark_alt" v-if="!query.categoryIds"></f7-icon>
                     </template>
                 </f7-list-item>
-                <f7-list-item :class="{ 'list-item-selected': query.categoryIds && queryAllFilterCategoryIdsCount > 1 }" :title="$t('Multiple Categories')" @click="filterMultipleCategories()">
+                <f7-list-item :class="{ 'list-item-selected': query.categoryIds && queryAllFilterCategoryIdsCount > 1 }"
+                              :title="$t('Multiple Categories')"
+                              @click="filterMultipleCategories()"
+                              v-if="allAvailableCategoriesCount > 0">
                     <template #media>
                         <f7-icon f7="rectangle_on_rectangle"></f7-icon>
                     </template>
@@ -313,6 +316,7 @@
                      class="no-margin-vertical"
                      :key="categoryType"
                      v-for="(categories, categoryType) in allPrimaryCategories"
+                     v-show="categories && categories.length"
             >
                 <f7-list-item divider :title="getTransactionTypeName(getTransactionTypeFromCategoryType(categoryType), 'Type')"></f7-list-item>
                 <f7-list-item accordion-item
@@ -371,7 +375,10 @@
                         <f7-icon class="list-item-checked-icon" f7="checkmark_alt" v-if="!query.accountIds"></f7-icon>
                     </template>
                 </f7-list-item>
-                <f7-list-item :class="{ 'list-item-selected': query.accountIds && queryAllFilterAccountIdsCount > 1 }" :title="$t('Multiple Accounts')" @click="filterMultipleAccounts()">
+                <f7-list-item :class="{ 'list-item-selected': query.accountIds && queryAllFilterAccountIdsCount > 1 }"
+                              :title="$t('Multiple Accounts')"
+                              @click="filterMultipleAccounts()"
+                              v-if="allAvailableAccountsCount > 0">
                     <template #media>
                         <f7-icon f7="rectangle_on_rectangle"></f7-icon>
                     </template>
@@ -657,6 +664,9 @@ export default {
         allAccounts() {
             return this.accountsStore.allAccountsMap;
         },
+        allAvailableAccountsCount() {
+            return this.accountsStore.allAvailableAccountsCount;
+        },
         allCategories() {
             return this.transactionCategoriesStore.allTransactionCategoriesMap;
         },
@@ -677,6 +687,25 @@ export default {
 
             return primaryCategories;
         },
+        allAvailableCategoriesCount() {
+            let totalCount = 0;
+
+            for (const categoryType in this.transactionCategoriesStore.allTransactionCategories) {
+                if (!Object.prototype.hasOwnProperty.call(this.transactionCategoriesStore.allTransactionCategories, categoryType)) {
+                    continue;
+                }
+
+                if (this.query.type && this.getTransactionTypeFromCategoryType(categoryType) !== this.query.type) {
+                    continue;
+                }
+
+                if (this.transactionCategoriesStore.allTransactionCategories[categoryType]) {
+                    totalCount += this.transactionCategoriesStore.allTransactionCategories[categoryType].length;
+                }
+            }
+
+            return totalCount;
+        },
         allTransactionTags() {
             return this.transactionTagsStore.allTransactionTagsMap;
         },