migrate transaction store to composition API and typescript

src/views/base/UnlockPageBase.ts

@@ -6,8 +6,7 @@ import { useRootStore } from '@/stores/index.ts';
 import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.ts';
 import { useTokensStore } from '@/stores/token.ts';
-// @ts-expect-error the above file is migrating to ts
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.ts';
 
 import { isWebAuthnSupported } from '@/lib/webauthn.ts';

src/views/base/settings/AppSettingsPageBase.ts

@@ -3,8 +3,7 @@ import { computed } from 'vue';
 import { useI18n } from '@/locales/helpers.ts';
 
 import { useSettingsStore } from '@/stores/setting.ts';
-// @ts-expect-error the above file is migrating to ts
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useOverviewStore } from '@/stores/overview.ts';
 import { useStatisticsStore } from '@/stores/statistics.ts';
 

src/views/desktop/app/settings/tabs/AppLockSettingTab.vue

@@ -71,7 +71,7 @@ import { useAppLockPageBase } from '@/views/base/settings/AppLockPageBase.ts';
 
 import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 
 import { registerWebAuthnCredential } from '@/lib/webauthn.ts';
 import {

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

@@ -149,7 +149,7 @@
 import { mapStores } from 'pinia';
 import { useSettingsStore } from '@/stores/setting.ts';
 import { useAccountsStore } from '@/stores/account.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useStatisticsStore } from '@/stores/statistics.ts';
 
 import { AccountType, AccountCategory } from '@/core/account.ts';

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

@@ -146,7 +146,7 @@
 import { mapStores } from 'pinia';
 import { useSettingsStore } from '@/stores/setting.ts';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useStatisticsStore } from '@/stores/statistics.ts';
 
 import { CategoryType } from '@/core/category.ts';

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

@@ -133,7 +133,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useTransactionTagsStore } from '@/stores/transactionTag.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useStatisticsStore } from '@/stores/statistics.ts';
 
 import { TransactionTagFilterType } from '@/core/transaction.ts';

src/views/desktop/transactions/ListPage.vue

@@ -593,7 +593,7 @@ import { useUserStore } from '@/stores/user.ts';
 import { useAccountsStore } from '@/stores/account.ts';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
 import { useTransactionTagsStore } from '@/stores/transactionTag.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useTransactionTemplatesStore } from '@/stores/transactionTemplate.js';
 
 import { DateRangeScene, DateRange } from '@/core/datetime.ts';
@@ -629,7 +629,7 @@ import {
     transactionTypeToCategoryType
 } from '@/lib/category.ts';
 import { getUnifiedSelectedAccountsCurrencyOrDefaultCurrency } from '@/lib/account.ts';
-import { getTransactionDisplayAmount } from '@/lib/transaction.js';
+import { getTransactionDisplayAmount } from '@/lib/transaction.ts';
 import { isDataImportingEnabled } from '@/lib/server_settings.ts';
 import { scrollToSelectedItem } from '@/lib/ui/desktop.ts';
 

src/views/desktop/transactions/list/dialogs/EditDialog.vue

@@ -115,11 +115,11 @@
                                                        :readonly="mode === 'view'"
                                                        :disabled="loading || submitting || !hasAvailableExpenseCategories"
                                                        :show-selection-primary-text="true"
-                                                       :custom-selection-primary-text="getPrimaryCategoryName(transaction.expenseCategory, allCategories[allCategoryTypes.Expense])"
-                                                       :custom-selection-secondary-text="getSecondaryCategoryName(transaction.expenseCategory, allCategories[allCategoryTypes.Expense])"
+                                                       :custom-selection-primary-text="getPrimaryCategoryName(transaction.expenseCategoryId, allCategories[allCategoryTypes.Expense])"
+                                                       :custom-selection-secondary-text="getSecondaryCategoryName(transaction.expenseCategoryId, allCategories[allCategoryTypes.Expense])"
                                                        :label="$t('Category')" :placeholder="$t('Category')"
                                                        :items="allCategories[allCategoryTypes.Expense]"
-                                                       v-model="transaction.expenseCategory">
+                                                       v-model="transaction.expenseCategoryId">
                                     </two-column-select>
                                 </v-col>
                                 <v-col cols="12" md="12" v-if="transaction.type === allTransactionTypes.Income">
@@ -132,11 +132,11 @@
                                                        :readonly="mode === 'view'"
                                                        :disabled="loading || submitting || !hasAvailableIncomeCategories"
                                                        :show-selection-primary-text="true"
-                                                       :custom-selection-primary-text="getPrimaryCategoryName(transaction.incomeCategory, allCategories[allCategoryTypes.Income])"
-                                                       :custom-selection-secondary-text="getSecondaryCategoryName(transaction.incomeCategory, allCategories[allCategoryTypes.Income])"
+                                                       :custom-selection-primary-text="getPrimaryCategoryName(transaction.incomeCategoryId, allCategories[allCategoryTypes.Income])"
+                                                       :custom-selection-secondary-text="getSecondaryCategoryName(transaction.incomeCategoryId, allCategories[allCategoryTypes.Income])"
                                                        :label="$t('Category')" :placeholder="$t('Category')"
                                                        :items="allCategories[allCategoryTypes.Income]"
-                                                       v-model="transaction.incomeCategory">
+                                                       v-model="transaction.incomeCategoryId">
                                     </two-column-select>
                                 </v-col>
                                 <v-col cols="12" md="12" v-if="transaction.type === allTransactionTypes.Transfer">
@@ -149,11 +149,11 @@
                                                        :readonly="mode === 'view'"
                                                        :disabled="loading || submitting || !hasAvailableTransferCategories"
                                                        :show-selection-primary-text="true"
-                                                       :custom-selection-primary-text="getPrimaryCategoryName(transaction.transferCategory, allCategories[allCategoryTypes.Transfer])"
-                                                       :custom-selection-secondary-text="getSecondaryCategoryName(transaction.transferCategory, allCategories[allCategoryTypes.Transfer])"
+                                                       :custom-selection-primary-text="getPrimaryCategoryName(transaction.transferCategoryId, allCategories[allCategoryTypes.Transfer])"
+                                                       :custom-selection-secondary-text="getSecondaryCategoryName(transaction.transferCategoryId, allCategories[allCategoryTypes.Transfer])"
                                                        :label="$t('Category')" :placeholder="$t('Category')"
                                                        :items="allCategories[allCategoryTypes.Transfer]"
-                                                       v-model="transaction.transferCategory">
+                                                       v-model="transaction.transferCategoryId">
                                     </two-column-select>
                                 </v-col>
                                 <v-col cols="12" :md="transaction.type === allTransactionTypes.Transfer ? 6 : 12">
@@ -396,7 +396,7 @@ import { useUserStore } from '@/stores/user.ts';
 import { useAccountsStore } from '@/stores/account.ts';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
 import { useTransactionTagsStore } from '@/stores/transactionTag.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useTransactionTemplatesStore } from '@/stores/transactionTemplate.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.ts';
 
@@ -423,7 +423,7 @@ import {
     getTransactionSecondaryCategoryName,
     getFirstAvailableCategoryId
 } from '@/lib/category.ts';
-import { setTransactionModelByTransaction } from '@/lib/transaction.js';
+import { setTransactionModelByTransaction } from '@/lib/transaction.ts';
 import {
     isTransactionPicturesEnabled,
     getMapProvider
@@ -715,7 +715,7 @@ export default {
         },
         inputEmptyProblemMessage() {
             if (this.transaction.type === this.allTransactionTypes.Expense) {
-                if (!this.transaction.expenseCategory || this.transaction.expenseCategory === '') {
+                if (!this.transaction.expenseCategoryId || this.transaction.expenseCategoryId === '') {
                     return 'Transaction category cannot be blank';
                 }
 
@@ -723,7 +723,7 @@ export default {
                     return 'Transaction account cannot be blank';
                 }
             } else if (this.transaction.type === this.allTransactionTypes.Income) {
-                if (!this.transaction.incomeCategory || this.transaction.incomeCategory === '') {
+                if (!this.transaction.incomeCategoryId || this.transaction.incomeCategoryId === '') {
                     return 'Transaction category cannot be blank';
                 }
 
@@ -731,7 +731,7 @@ export default {
                     return 'Transaction account cannot be blank';
                 }
             } else if (this.transaction.type === this.allTransactionTypes.Transfer) {
-                if (!this.transaction.transferCategory || this.transaction.transferCategory === '') {
+                if (!this.transaction.transferCategoryId || this.transaction.transferCategoryId === '') {
                     return 'Transaction category cannot be blank';
                 }
 
@@ -869,7 +869,7 @@ export default {
                 } else {
                     self.mode = 'add';
                     self.editId = null;
-                    self.transaction.id = null;
+                    self.transaction.id = '';
                 }
             }
 
@@ -1047,12 +1047,12 @@ export default {
 
             this.editId = null;
             this.duplicateFromId = this.transaction.id;
-            this.transaction.id = null;
+            this.transaction.id = '';
             this.transaction.time = getCurrentUnixTime();
             this.transaction.timeZone = this.settingsStore.appSettings.timeZone;
             this.transaction.utcOffset = getTimezoneOffsetMinutes(this.transaction.timeZone);
-            this.transaction.geoLocation = null;
-            this.transaction.pictures = [];
+            this.transaction.removeGeoLocation();
+            this.transaction.clearPictures();
             this.mode = 'add';
         },
         edit() {
@@ -1157,10 +1157,7 @@ export default {
 
                 self.geoLocationStatus = 'success';
 
-                self.transaction.geoLocation = {
-                    latitude: position.coords.latitude,
-                    longitude: position.coords.longitude
-                };
+                self.transaction.setLatitudeAndLongitude(position.coords.latitude, position.coords.longitude);
             }, function (err) {
                 logger.error('cannot retrieve current position', err);
                 self.geoLocationStatus = 'error';
@@ -1175,7 +1172,7 @@ export default {
         clearGeoLocation() {
             this.geoMenuState = false;
             this.geoLocationStatus = null;
-            this.transaction.geoLocation = null;
+            this.transaction.removeGeoLocation();
         },
         saveNewTag(tagName) {
             const self = this;
@@ -1232,12 +1229,7 @@ export default {
             self.submitting = true;
 
             self.transactionsStore.uploadTransactionPicture({ pictureFile }).then(response => {
-                if (!isArray(self.transaction.pictures)) {
-                    self.transaction.pictures = [];
-                }
-
-                self.transaction.pictures.push(response);
-
+                self.transaction.addPicture(response);
                 self.uploadingPicture = false;
                 self.submitting = false;
             }).catch(error => {
@@ -1262,23 +1254,15 @@ export default {
                 self.submitting = true;
 
                 self.transactionsStore.removeUnusedTransactionPicture({ pictureInfo }).then(response => {
-                    if (response && isArray(self.transaction.pictures)) {
-                        for (let i = 0; i < self.transaction.pictures.length; i++) {
-                            if (self.transaction.pictures[i].pictureId === pictureInfo.pictureId) {
-                                self.transaction.pictures.splice(i, 1);
-                            }
-                        }
+                    if (response) {
+                        self.transaction.removePicture(pictureInfo);
                     }
 
                     self.removingPictureId = '';
                     self.submitting = false;
                 }).catch(error => {
                     if (error.error && error.error.errorCode === KnownErrorCode.TransactionPictureNotFound) {
-                        for (let i = 0; i < self.transaction.pictures.length; i++) {
-                            if (self.transaction.pictures[i].pictureId === pictureInfo.pictureId) {
-                                self.transaction.pictures.splice(i, 1);
-                            }
-                        }
+                        self.transaction.removePicture(pictureInfo);
                     } else if (!error.processed) {
                         self.$refs.snackbar.showError(error);
                     }

src/views/desktop/transactions/list/dialogs/ImportDialog.vue

@@ -602,13 +602,15 @@ import { useUserStore } from '@/stores/user.ts';
 import { useAccountsStore } from '@/stores/account.ts';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
 import { useTransactionTagsStore } from '@/stores/transactionTag.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useOverviewStore } from '@/stores/overview.ts';
 import { useStatisticsStore } from '@/stores/statistics.ts';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.ts';
 
 import { CategoryType } from '@/core/category.ts';
 import { TransactionType } from '@/core/transaction.ts';
+import { ImportTransaction } from '@/models/imported_transaction.ts';
+
 import {
     isString,
     isNumber,
@@ -1139,17 +1141,12 @@ export default {
                 fileType: fileType,
                 importFile: self.importFile
             }).then(response => {
-                const parsedTransactions = response.items;
+                const parsedTransactions = [];
 
-                if (parsedTransactions) {
-                    for (let i = 0; i < parsedTransactions.length; i++) {
-                        const transaction = parsedTransactions[i];
-                        transaction.index = i;
-                        transaction.selected = false;
-                        transaction.valid = self.isTransactionValid(transaction);
-                        transaction.actualCategoryName = transaction.originalCategoryName;
-                        transaction.actualSourceAccountName = transaction.originalSourceAccountName;
-                        transaction.actualDestinationAccountName = transaction.originalDestinationAccountName;
+                if (response.items) {
+                    for (let i = 0; i < response.items.length; i++) {
+                        const parsedTransaction = ImportTransaction.of(response.items[i], i);
+                        parsedTransactions.push(parsedTransaction);
                     }
                 }
 
@@ -1408,7 +1405,7 @@ export default {
             }
         },
         updateTransactionData(transaction) {
-            transaction.valid = this.isTransactionValid(transaction);
+            transaction.valid = transaction.isTransactionValid();
 
             if (transaction.categoryId && this.allCategoriesMap[transaction.categoryId]) {
                 transaction.actualCategoryName = this.allCategoriesMap[transaction.categoryId].name;
@@ -1717,33 +1714,6 @@ export default {
 
             return invalidTags;
         },
-        isTransactionValid(transaction) {
-            if (!transaction) {
-                return false;
-            }
-
-            if (transaction.type !== this.allTransactionTypes.ModifyBalance && (!transaction.categoryId || transaction.categoryId === '0')) {
-                return false;
-            }
-
-            if (!transaction.sourceAccountId || transaction.sourceAccountId === '0') {
-                return false;
-            }
-
-            if (transaction.type === this.allTransactionTypes.Transfer && (!transaction.destinationAccountId || transaction.destinationAccountId === '0')) {
-                return false;
-            }
-
-            if (transaction.tagIds && transaction.tagIds.length) {
-                for (let j = 0; j < transaction.tagIds.length; j++) {
-                    if (!transaction.tagIds[j] || transaction.tagIds[j] === '0') {
-                        return false;
-                    }
-                }
-            }
-
-            return true;
-        },
         isTagValid(tagIds, tagIndex) {
             if (!tagIds || !tagIds[tagIndex]) {
                 return false;

src/views/mobile/ApplicationLockPage.vue

@@ -44,7 +44,7 @@ import { useAppLockPageBase } from '@/views/base/settings/AppLockPageBase.ts';
 
 import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 
 import { registerWebAuthnCredential } from '@/lib/webauthn.ts';
 import {

src/views/mobile/settings/AccountFilterSettingsPage.vue

@@ -135,7 +135,7 @@
 import { mapStores } from 'pinia';
 import { useSettingsStore } from '@/stores/setting.ts';
 import { useAccountsStore } from '@/stores/account.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useStatisticsStore } from '@/stores/statistics.ts';
 
 import { AccountType, AccountCategory } from '@/core/account.ts';

src/views/mobile/settings/CategoryFilterSettingsPage.vue

@@ -142,7 +142,7 @@
 import { mapStores } from 'pinia';
 import { useSettingsStore } from '@/stores/setting.ts';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useStatisticsStore } from '@/stores/statistics.ts';
 
 import { CategoryType } from '@/core/category.ts';

src/views/mobile/settings/TransactionTagFilterSettingsPage.vue

@@ -113,7 +113,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useTransactionTagsStore } from '@/stores/transactionTag.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useStatisticsStore } from '@/stores/statistics.ts';
 
 import { TransactionTagFilterType } from '@/core/transaction.ts';

src/views/mobile/transactions/AmountFilterPage.vue

@@ -58,7 +58,7 @@ import type { Router } from 'framework7/types';
 import { useI18n } from '@/locales/helpers.ts';
 import { useI18nUIComponents } from '@/lib/ui/mobile.ts';
 
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 
 import { AmountFilterType } from '@/core/numeral.ts';
 import { TRANSACTION_MIN_AMOUNT, TRANSACTION_MAX_AMOUNT } from '@/consts/transaction.ts';

src/views/mobile/transactions/EditPage.vue

@@ -104,9 +104,9 @@
             >
                 <template #title>
                     <div class="list-item-custom-title" v-if="hasAvailableExpenseCategories">
-                        <span>{{ getPrimaryCategoryName(transaction.expenseCategory, allCategories[allCategoryTypes.Expense]) }}</span>
+                        <span>{{ getPrimaryCategoryName(transaction.expenseCategoryId, allCategories[allCategoryTypes.Expense]) }}</span>
                         <f7-icon class="category-separate-icon" f7="chevron_right"></f7-icon>
-                        <span>{{ getSecondaryCategoryName(transaction.expenseCategory, allCategories[allCategoryTypes.Expense]) }}</span>
+                        <span>{{ getSecondaryCategoryName(transaction.expenseCategoryId, allCategories[allCategoryTypes.Expense]) }}</span>
                     </div>
                     <div class="list-item-custom-title" v-else-if="!hasAvailableExpenseCategories">
                         <span>{{ $t('None') }}</span>
@@ -120,7 +120,7 @@
                                            secondary-hidden-field="hidden"
                                            :items="allCategories[allCategoryTypes.Expense]"
                                            v-model:show="showCategorySheet"
-                                           v-model="transaction.expenseCategory">
+                                           v-model="transaction.expenseCategoryId">
                 </tree-view-selection-sheet>
             </f7-list-item>
 
@@ -135,9 +135,9 @@
             >
                 <template #title>
                     <div class="list-item-custom-title" v-if="hasAvailableIncomeCategories">
-                        <span>{{ getPrimaryCategoryName(transaction.incomeCategory, allCategories[allCategoryTypes.Income]) }}</span>
+                        <span>{{ getPrimaryCategoryName(transaction.incomeCategoryId, allCategories[allCategoryTypes.Income]) }}</span>
                         <f7-icon class="category-separate-icon" f7="chevron_right"></f7-icon>
-                        <span>{{ getSecondaryCategoryName(transaction.incomeCategory, allCategories[allCategoryTypes.Income]) }}</span>
+                        <span>{{ getSecondaryCategoryName(transaction.incomeCategoryId, allCategories[allCategoryTypes.Income]) }}</span>
                     </div>
                     <div class="list-item-custom-title" v-else-if="!hasAvailableIncomeCategories">
                         <span>{{ $t('None') }}</span>
@@ -151,7 +151,7 @@
                                            secondary-hidden-field="hidden"
                                            :items="allCategories[allCategoryTypes.Income]"
                                            v-model:show="showCategorySheet"
-                                           v-model="transaction.incomeCategory">
+                                           v-model="transaction.incomeCategoryId">
                 </tree-view-selection-sheet>
             </f7-list-item>
 
@@ -166,9 +166,9 @@
             >
                 <template #title>
                     <div class="list-item-custom-title" v-if="hasAvailableTransferCategories">
-                        <span>{{ getPrimaryCategoryName(transaction.transferCategory, allCategories[allCategoryTypes.Transfer]) }}</span>
+                        <span>{{ getPrimaryCategoryName(transaction.transferCategoryId, allCategories[allCategoryTypes.Transfer]) }}</span>
                         <f7-icon class="category-separate-icon" f7="chevron_right"></f7-icon>
-                        <span>{{ getSecondaryCategoryName(transaction.transferCategory, allCategories[allCategoryTypes.Transfer]) }}</span>
+                        <span>{{ getSecondaryCategoryName(transaction.transferCategoryId, allCategories[allCategoryTypes.Transfer]) }}</span>
                     </div>
                     <div class="list-item-custom-title" v-else-if="!hasAvailableTransferCategories">
                         <span>{{ $t('None') }}</span>
@@ -182,7 +182,7 @@
                                            secondary-hidden-field="hidden"
                                            :items="allCategories[allCategoryTypes.Transfer]"
                                            v-model:show="showCategorySheet"
-                                           v-model="transaction.transferCategory">
+                                           v-model="transaction.transferCategoryId">
                 </tree-view-selection-sheet>
             </f7-list-item>
 
@@ -436,7 +436,7 @@ import { useUserStore } from '@/stores/user.ts';
 import { useAccountsStore } from '@/stores/account.ts';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
 import { useTransactionTagsStore } from '@/stores/transactionTag.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 import { useTransactionTemplatesStore } from '@/stores/transactionTemplate.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.ts';
 
@@ -446,6 +446,7 @@ import { TemplateType, ScheduledTemplateFrequencyType } from '@/core/template.ts
 import { TRANSACTION_MIN_AMOUNT, TRANSACTION_MAX_AMOUNT, TRANSACTION_MAX_PICTURE_COUNT } from '@/consts/transaction.ts';
 import { KnownErrorCode } from '@/consts/api.ts';
 import { SUPPORTED_IMAGE_EXTENSIONS } from '@/consts/file.ts';
+
 import logger from '@/lib/logger.ts';
 import {
     isArray,
@@ -464,7 +465,7 @@ import {
     getTransactionSecondaryCategoryName,
     getFirstAvailableCategoryId
 } from '@/lib/category.ts';
-import { setTransactionModelByTransaction } from '@/lib/transaction.js';
+import { setTransactionModelByTransaction } from '@/lib/transaction.ts';
 import {
     isTransactionPicturesEnabled,
     getMapProvider
@@ -840,7 +841,7 @@ export default {
         },
         inputEmptyProblemMessage() {
             if (this.transaction.type === this.allTransactionTypes.Expense) {
-                if (!this.transaction.expenseCategory || this.transaction.expenseCategory === '') {
+                if (!this.transaction.expenseCategoryId || this.transaction.expenseCategoryId === '') {
                     return 'Transaction category cannot be blank';
                 }
 
@@ -848,7 +849,7 @@ export default {
                     return 'Transaction account cannot be blank';
                 }
             } else if (this.transaction.type === this.allTransactionTypes.Income) {
-                if (!this.transaction.incomeCategory || this.transaction.incomeCategory === '') {
+                if (!this.transaction.incomeCategoryId || this.transaction.incomeCategoryId === '') {
                     return 'Transaction category cannot be blank';
                 }
 
@@ -856,7 +857,7 @@ export default {
                     return 'Transaction account cannot be blank';
                 }
             } else if (this.transaction.type === this.allTransactionTypes.Transfer) {
-                if (!this.transaction.transferCategory || this.transaction.transferCategory === '') {
+                if (!this.transaction.transferCategoryId || this.transaction.transferCategoryId === '') {
                     return 'Transaction category cannot be blank';
                 }
 
@@ -1226,10 +1227,7 @@ export default {
 
                 self.geoLocationStatus = 'success';
 
-                self.transaction.geoLocation = {
-                    latitude: position.coords.latitude,
-                    longitude: position.coords.longitude
-                };
+                self.transaction.setLatitudeAndLongitude(position.coords.latitude, position.coords.longitude);
             }, function (err) {
                 logger.error('cannot retrieve current position', err);
                 self.geoLocationStatus = 'error';
@@ -1243,7 +1241,7 @@ export default {
         },
         clearGeoLocation() {
             this.geoLocationStatus = null;
-            this.transaction.geoLocation = null;
+            this.transaction.removeGeoLocation();
         },
         swapTransactionData(swapAccount, swapAmount) {
             if (swapAccount) {
@@ -1287,12 +1285,7 @@ export default {
             self.submitting = true;
 
             self.transactionsStore.uploadTransactionPicture({ pictureFile }).then(response => {
-                if (!isArray(self.transaction.pictures)) {
-                    self.transaction.pictures = [];
-                }
-
-                self.transaction.pictures.push(response);
-
+                self.transaction.addPicture(response);
                 self.uploadingPicture = false;
                 self.submitting = false;
             }).catch(error => {
@@ -1317,23 +1310,15 @@ export default {
                 self.submitting = true;
 
                 self.transactionsStore.removeUnusedTransactionPicture({ pictureInfo }).then(response => {
-                    if (response && isArray(self.transaction.pictures)) {
-                        for (let i = 0; i < self.transaction.pictures.length; i++) {
-                            if (self.transaction.pictures[i].pictureId === pictureInfo.pictureId) {
-                                self.transaction.pictures.splice(i, 1);
-                            }
-                        }
+                    if (response) {
+                        self.transaction.removePicture(pictureInfo);
                     }
 
                     self.removingPictureId = '';
                     self.submitting = false;
                 }).catch(error => {
                     if (error.error && error.error.errorCode === KnownErrorCode.TransactionPictureNotFound) {
-                        for (let i = 0; i < self.transaction.pictures.length; i++) {
-                            if (self.transaction.pictures[i].pictureId === pictureInfo.pictureId) {
-                                self.transaction.pictures.splice(i, 1);
-                            }
-                        }
+                        self.transaction.removePicture(pictureInfo);
                     } else if (!error.processed) {
                         self.$toast(error.message || error);
                     }

src/views/mobile/transactions/ListPage.vue

@@ -526,7 +526,7 @@ import { useUserStore } from '@/stores/user.ts';
 import { useAccountsStore } from '@/stores/account.ts';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
 import { useTransactionTagsStore } from '@/stores/transactionTag.ts';
-import { useTransactionsStore } from '@/stores/transaction.js';
+import { useTransactionsStore } from '@/stores/transaction.ts';
 
 import { DateRangeScene, DateRange } from '@/core/datetime.ts';
 import { AmountFilterType } from '@/core/numeral.ts';
@@ -550,7 +550,7 @@ import {
 } from '@/lib/datetime.ts';
 import { categoryTypeToTransactionType, transactionTypeToCategoryType } from '@/lib/category.ts';
 import { getUnifiedSelectedAccountsCurrencyOrDefaultCurrency } from '@/lib/account.ts';
-import { getTransactionDisplayAmount } from '@/lib/transaction.js';
+import { getTransactionDisplayAmount } from '@/lib/transaction.ts';
 import { onSwipeoutDeleted, scrollToSelectedItem } from '@/lib/ui/mobile.ts';
 
 export default {