fix the incorrect display type name of transaction categories

Author: mayswind

src/lib/category.ts

@@ -189,7 +189,7 @@ export function allTransactionCategoriesWithVisibleCount(allTransactionCategorie
             }
         }
 
-        ret[categoryType] = {
+        ret[`${categoryType}`] = {
             type: categoryType,
             allCategories: allCategories,
             allVisibleCategoryCount: allVisibleCategoryCount,
@@ -374,7 +374,7 @@ export function getLastShowingId(categories: TransactionCategory[], showHidden:
     return null;
 }
 
-export function containsAnyAvailableCategory(allTransactionCategories: Record<number, TransactionCategoriesWithVisibleCount>, showHidden: boolean): boolean {
+export function containsAnyAvailableCategory(allTransactionCategories: Record<string, TransactionCategoriesWithVisibleCount>, showHidden: boolean): boolean {
     for (const categoryType of values(allTransactionCategories)) {
         if (showHidden) {
             if (categoryType.allCategories && categoryType.allCategories.length > 0) {
@@ -390,7 +390,7 @@ export function containsAnyAvailableCategory(allTransactionCategories: Record<nu
     return false;
 }
 
-export function containsAvailableCategory(allTransactionCategories: Record<number, TransactionCategoriesWithVisibleCount>, showHidden: boolean): Record<number, boolean> {
+export function containsAvailableCategory(allTransactionCategories: Record<string, TransactionCategoriesWithVisibleCount>, showHidden: boolean): Record<number, boolean> {
     const result: Record<number, boolean> = {};
 
     for (const [type, categoryType] of entries(allTransactionCategories)) {

src/locales/helpers.ts

@@ -2,7 +2,7 @@ import { useI18n as useVueI18n } from 'vue-i18n';
 import moment from 'moment-timezone';
 import 'moment-timezone/moment-timezone-utils';
 
-import type { PartialRecord, NameValue, TypeAndName, TypeAndDisplayName, LocalizedSwitchOption } from '@/core/base.ts';
+import type { NameValue, TypeAndName, TypeAndDisplayName, LocalizedSwitchOption } from '@/core/base.ts';
 
 import {
     type LanguageInfo,
@@ -1341,8 +1341,8 @@ export function useI18n() {
         return ret;
     }
 
-    function getAllTransactionDefaultCategories(categoryType: 0 | CategoryType, locale: string): PartialRecord<CategoryType, LocalizedPresetCategory[]> {
-        const allCategories: PartialRecord<CategoryType, LocalizedPresetCategory[]> = {};
+    function getAllTransactionDefaultCategories(categoryType: 0 | CategoryType, locale: string): Record<string, LocalizedPresetCategory[]> {
+        const allCategories: Record<string, LocalizedPresetCategory[]> = {};
         const categoryTypes: CategoryType[] = [];
 
         if (categoryType === 0) {
@@ -1386,7 +1386,7 @@ export function useI18n() {
                 categories.push(submitCategory);
             }
 
-            allCategories[categoryType] = categories;
+            allCategories[`${categoryType}`] = categories;
         }
 
         return allCategories;

src/views/base/SignupPageBase.ts

@@ -93,7 +93,7 @@ export function useSignupPageBase() {
     const inputIsEmpty = computed<boolean>(() => !!inputEmptyProblemMessage.value);
     const inputIsInvalid = computed<boolean>(() => !!inputInvalidProblemMessage.value);
 
-    function getCategoryTypeName(categoryType: CategoryType): string {
+    function getCategoryTypeName(categoryType: number): string {
         switch (categoryType) {
             case CategoryType.Income:
                 return tt('Income Categories');

src/views/base/settings/CategoryFilterSettingPageBase.ts

@@ -56,7 +56,7 @@ export function useCategoryFilterSettingPageBase(type?: CategoryFilterType, allo
         }
     });
 
-    const allTransactionCategories = computed<Record<number, TransactionCategoriesWithVisibleCount>>(() => allTransactionCategoriesWithVisibleCount(transactionCategoriesStore.allTransactionCategories, allowCategoryTypes));
+    const allTransactionCategories = computed<Record<string, TransactionCategoriesWithVisibleCount>>(() => allTransactionCategoriesWithVisibleCount(transactionCategoriesStore.allTransactionCategories, allowCategoryTypes));
     const hasAnyAvailableCategory = computed<boolean>(() => containsAnyAvailableCategory(allTransactionCategories.value, true));
     const hasAnyVisibleCategory = computed<boolean>(() => containsAnyAvailableCategory(allTransactionCategories.value, showHidden.value));
     const hasAvailableCategory = computed<Record<number, boolean>>(() => containsAvailableCategory(allTransactionCategories.value, showHidden.value));
@@ -65,7 +65,7 @@ export function useCategoryFilterSettingPageBase(type?: CategoryFilterType, allo
         return !filterCategoryIds[category.id];
     }
 
-    function getCategoryTypeName(categoryType: CategoryType): string {
+    function getCategoryTypeName(categoryType: number): string {
         switch (categoryType) {
             case CategoryType.Income:
                 return tt('Income Categories');

src/views/desktop/SignupPage.vue

@@ -139,7 +139,7 @@
                                 <div class="overflow-y-auto px-3" :class="{ 'disabled': !usePresetCategories || submitting || navigateToHomePage }" style="max-height: 323px">
                                     <v-row :key="categoryType" v-for="(categories, categoryType) in allPresetCategories">
                                         <v-col cols="12" md="12">
-                                            <h4 class="mb-3">{{ getCategoryTypeName(categoryType) }}</h4>
+                                            <h4 class="mb-3">{{ getCategoryTypeName(parseInt(categoryType)) }}</h4>
 
                                             <v-expansion-panels class="border rounded" variant="accordion" multiple>
                                                 <v-expansion-panel :key="idx" v-for="(category, idx) in categories">
@@ -220,8 +220,8 @@ import { useSignupPageBase } from '@/views/base/SignupPageBase.ts';
 
 import { useRootStore } from '@/stores/index.ts';
 
-import type { PartialRecord, TypeAndDisplayName } from '@/core/base.ts';
-import { type LocalizedPresetCategory, CategoryType } from '@/core/category.ts';
+import type { TypeAndDisplayName } from '@/core/base.ts';
+import { type LocalizedPresetCategory } from '@/core/category.ts';
 import { ThemeType } from '@/core/theme.ts';
 import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';
 
@@ -262,7 +262,7 @@ const finalResultMessage = ref<string | null>(null);
 const navigateToHomePage = ref<boolean>(false);
 
 const allWeekDays = computed<TypeAndDisplayName[]>(() => getAllWeekDays());
-const allPresetCategories = computed<PartialRecord<CategoryType, LocalizedPresetCategory[]>>(() => getAllTransactionDefaultCategories(0, currentLocale.value));
+const allPresetCategories = computed<Record<string, LocalizedPresetCategory[]>>(() => getAllTransactionDefaultCategories(0, currentLocale.value));
 const isDarkMode = computed<boolean>(() => theme.global.name.value === ThemeType.Dark);
 
 const allSteps = computed<StepBarItem[]>(() => {

src/views/desktop/categories/list/dialogs/PresetDialog.vue

@@ -9,7 +9,7 @@
             <v-card-text class="preset-transaction-categories mt-sm-2 mt-md-4 pt-0">
                 <template :key="categoryType" v-for="(categories, categoryType) in allPresetCategories">
                     <div class="d-flex align-center mb-1">
-                        <h4>{{ getCategoryTypeName(categoryType) }}</h4>
+                        <h4>{{ getCategoryTypeName(parseInt(categoryType)) }}</h4>
                         <v-spacer/>
                         <language-select-button :disabled="submitting"
                                                 :use-model-value="true" v-model="currentLocale" />
@@ -64,7 +64,6 @@ import { useI18n } from '@/locales/helpers.ts';
 
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
 
-import type { PartialRecord } from '@/core/base.ts';
 import { type LocalizedPresetCategory, CategoryType } from '@/core/category.ts';
 import { categorizedArrayToPlainArray } from '@/lib/common.ts';
 import { localizedPresetCategoriesToTransactionCategoryCreateWithSubCategories } from '@/lib/category.ts';
@@ -90,14 +89,14 @@ const snackbar = useTemplateRef<SnackBarType>('snackbar');
 const currentLocale = ref<string>(getCurrentLanguageTag());
 const submitting = ref<boolean>(false);
 
-const allPresetCategories = computed<PartialRecord<CategoryType, LocalizedPresetCategory[]>>(() => getAllTransactionDefaultCategories(props.categoryType, currentLocale.value));
+const allPresetCategories = computed<Record<string, LocalizedPresetCategory[]>>(() => getAllTransactionDefaultCategories(props.categoryType, currentLocale.value));
 
 const showState = computed<boolean>({
     get: () => props.show,
     set: (value) => emit('update:show', value)
 });
 
-function getCategoryTypeName(categoryType: CategoryType): string {
+function getCategoryTypeName(categoryType: number): string {
     switch (categoryType) {
         case CategoryType.Income:
             return tt('Income Categories');

src/views/mobile/SignupPage.vue

@@ -146,7 +146,7 @@
                 </f7-navbar>
                 <f7-block class="no-padding no-margin"
                           :key="categoryType" v-for="(categories, categoryType) in allPresetCategories">
-                    <f7-block-title class="margin-top margin-horizontal">{{ getCategoryTypeName(categoryType) }}</f7-block-title>
+                    <f7-block-title class="margin-top margin-horizontal">{{ getCategoryTypeName(parseInt(categoryType)) }}</f7-block-title>
                     <f7-list strong inset dividers v-if="showPresetCategories">
                         <f7-list-item :title="category.name"
                                       :accordion-item="!!category.subCategories.length"
@@ -203,9 +203,9 @@ import { useSignupPageBase } from '@/views/base/SignupPageBase.ts';
 
 import { useRootStore } from '@/stores/index.ts';
 
-import type { PartialRecord, TypeAndDisplayName } from '@/core/base.ts';
+import type { TypeAndDisplayName } from '@/core/base.ts';
 import type { LocalizedCurrencyInfo } from '@/core/currency.ts';
-import { type LocalizedPresetCategory, CategoryType } from '@/core/category.ts';
+import { type LocalizedPresetCategory } from '@/core/category.ts';
 
 import { findDisplayNameByType, categorizedArrayToPlainArray } from '@/lib/common.ts';
 import { isUserLogined } from '@/lib/userstate.ts';
@@ -244,7 +244,7 @@ const showPresetCategoriesChangeLocaleSheet = ref<boolean>(false);
 const allLanguages = computed<LanguageOption[]>(() => getAllLanguageOptions(false));
 const allCurrencies = computed<LocalizedCurrencyInfo[]>(() => getAllCurrencies());
 const allWeekDays = computed<TypeAndDisplayName[]>(() => getAllWeekDays());
-const allPresetCategories = computed<PartialRecord<CategoryType, LocalizedPresetCategory[]>>(() => getAllTransactionDefaultCategories(0, currentLocale.value));
+const allPresetCategories = computed<Record<string, LocalizedPresetCategory[]>>(() => getAllTransactionDefaultCategories(0, currentLocale.value));
 const currentDayOfWeekName = computed<string | null>(() => findDisplayNameByType(allWeekDays.value, user.value.firstDayOfWeek));
 
 function submit(): void {

src/views/mobile/categories/PresetPage.vue

@@ -10,7 +10,7 @@
         </f7-navbar>
 
         <f7-block class="no-padding no-margin" :key="categoryType" v-for="(categories, categoryType) in allPresetCategories">
-            <f7-block-title class="margin-top margin-horizontal">{{ getCategoryTypeName(categoryType) }}</f7-block-title>
+            <f7-block-title class="margin-top margin-horizontal">{{ getCategoryTypeName(parseInt(categoryType)) }}</f7-block-title>
 
             <f7-list strong inset dividers class="margin-top">
                 <f7-list-item :title="category.name"
@@ -64,7 +64,6 @@ import type { Router } from 'framework7/types';
 import { useI18n } from '@/locales/helpers.ts';
 import { useI18nUIComponents, showLoading, hideLoading } from '@/lib/ui/mobile.ts';
 
-import type { PartialRecord } from '@/core/base.ts';
 import type { LanguageOption } from '@/locales/index.ts';
 import { type LocalizedPresetCategory, CategoryType } from '@/core/category.ts';
 import { getObjectOwnFieldCount, categorizedArrayToPlainArray } from '@/lib/common.ts';
@@ -88,10 +87,10 @@ const showMoreActionSheet = ref<boolean>(false);
 const showChangeLocaleSheet = ref<boolean>(false);
 
 const allLanguages = computed<LanguageOption[]>(() => getAllLanguageOptions(false));
-const allPresetCategories = computed<PartialRecord<CategoryType, LocalizedPresetCategory[]>>(() => getAllTransactionDefaultCategories(categoryType.value, currentLocale.value));
+const allPresetCategories = computed<Record<string, LocalizedPresetCategory[]>>(() => getAllTransactionDefaultCategories(categoryType.value, currentLocale.value));
 const isPresetHasCategories = computed<boolean>(() => getObjectOwnFieldCount(allPresetCategories.value) > 0);
 
-function getCategoryTypeName(categoryType: CategoryType): string {
+function getCategoryTypeName(categoryType: number): string {
     switch (categoryType) {
         case CategoryType.Income:
             return tt('Income Categories');