From 95ef0e42265c25e97c82b7669a584bc6f91190ca Mon Sep 17 00:00:00 2001 From: Dmytro Svyrydenko Date: Mon, 19 Aug 2024 23:33:58 +0200 Subject: [PATCH 01/15] chore: Mark numeric input-field step: any to avoid false-positive invalid state --- src/components/fields/input-field.vue | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/components/fields/input-field.vue b/src/components/fields/input-field.vue index 2e88a5f..dcb509d 100644 --- a/src/components/fields/input-field.vue +++ b/src/components/fields/input-field.vue @@ -21,7 +21,10 @@ Date: Mon, 19 Aug 2024 23:34:32 +0200 Subject: [PATCH 02/15] fix: Invalidate account-specific transactions when loading latest mono txes --- .../types/monobank/load-latest-transactions.vue | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/src/pages/account/types/monobank/load-latest-transactions.vue b/src/pages/account/types/monobank/load-latest-transactions.vue index 0507590..538a08a 100644 --- a/src/pages/account/types/monobank/load-latest-transactions.vue +++ b/src/pages/account/types/monobank/load-latest-transactions.vue @@ -23,11 +23,14 @@ import { NotificationType, } from "@/components/notification-center"; import { Button } from "@/components/lib/ui/button"; +import { useQueryClient } from "@tanstack/vue-query"; +import { VUE_QUERY_CACHE_KEYS } from "@/common/const"; const props = defineProps<{ account: AccountModel; }>(); +const queryClient = useQueryClient(); const { addNotification } = useNotificationCenter(); const { addLSItem, removeLSItem, getLSItem } = useLocalStorage(); const monobankStore = useBanksMonobankStore(); @@ -77,6 +80,15 @@ const loadLatestTransactionsHandler = async () => { : "Loaded successfully", type: NotificationType.success, }); + + if (!isUserNeedToWait) { + queryClient.invalidateQueries({ + queryKey: [ + ...VUE_QUERY_CACHE_KEYS.accountSpecificTransactions, + props.account.id, + ], + }); + } } catch (e) { if (e?.data?.code === API_ERROR_CODES.forbidden) { addNotification({ From 8fce01abc8ba41f4c48fd17565a33dffe821687b Mon Sep 17 00:00:00 2001 From: Dmytro Svyrydenko Date: Wed, 21 Aug 2024 21:12:59 +0200 Subject: [PATCH 03/15] feat: Improve record management form UX --- .../modify-record/components/form-header.vue | 46 --- .../components/type-selector.vue | 3 +- src/components/modals/modify-record/index.vue | 362 +++++++++--------- tailwind.config.js | 3 + 4 files changed, 180 insertions(+), 234 deletions(-) delete mode 100644 src/components/modals/modify-record/components/form-header.vue diff --git a/src/components/modals/modify-record/components/form-header.vue b/src/components/modals/modify-record/components/form-header.vue deleted file mode 100644 index 7d9ff4c..0000000 --- a/src/components/modals/modify-record/components/form-header.vue +++ /dev/null @@ -1,46 +0,0 @@ - - - - - diff --git a/src/components/modals/modify-record/components/type-selector.vue b/src/components/modals/modify-record/components/type-selector.vue index 16655bd..ba8f73b 100644 --- a/src/components/modals/modify-record/components/type-selector.vue +++ b/src/components/modals/modify-record/components/type-selector.vue @@ -87,8 +87,7 @@ const selectTransactionType = (type: FORM_TYPES) => { grid-template-columns: repeat(3, minmax(0, 1fr)); background-color: rgba(#000, 0.4); - border-radius: 10px; - margin-top: 24px; + border-radius: 12px; } .type-selector__item { padding: 6px; diff --git a/src/components/modals/modify-record/index.vue b/src/components/modals/modify-record/index.vue index 62b20e3..5b66da4 100644 --- a/src/components/modals/modify-record/index.vue +++ b/src/components/modals/modify-record/index.vue @@ -36,7 +36,6 @@ import DateField from "@/components/fields/date-field.vue"; import { Button } from "@/components/lib/ui/button"; import { EVENTS as MODAL_EVENTS } from "@/components/modal-center/ui-modal.vue"; import TransactionRecrod from "@/components/transactions-list/transaction-record.vue"; -import FormHeader from "./components/form-header.vue"; import TypeSelector from "./components/type-selector.vue"; import FormRow from "./components/form-row.vue"; import AccountField from "./components/account-field.vue"; @@ -404,205 +403,196 @@ useEventListener(document, "keydown", (event) => { - - - - - - - - - - - - - - - - -
- - +
- - diff --git a/tailwind.config.js b/tailwind.config.js index 20143ca..7a16496 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -56,6 +56,9 @@ module.exports = { DEFAULT: "rgba(var(--card), )", foreground: "rgba(var(--card-foreground), )", }, + "app-income-color": "#2ecc71", + "app-expense-color": "#e74c3c", + "app-transfer-color": "#95a5a6", }, borderRadius: { lg: "var(--radius)", From bf6fcb7ede617b5e727e2cc55734277ad1b25adf Mon Sep 17 00:00:00 2001 From: Dmytro Svyrydenko Date: Thu, 22 Aug 2024 00:10:44 +0200 Subject: [PATCH 04/15] chore: update prettier config --- .prettierrc.json | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/.prettierrc.json b/.prettierrc.json index 0967ef4..ad4bde9 100644 --- a/.prettierrc.json +++ b/.prettierrc.json @@ -1 +1,5 @@ -{} +{ + "printWidth": 100, + "tabWidth": 2, + "useTabs": false +} From b484b0adb050fb43e1e08189de400fcfdca76522 Mon Sep 17 00:00:00 2001 From: Dmytro Svyrydenko Date: Thu, 22 Aug 2024 00:11:40 +0200 Subject: [PATCH 05/15] feat: Add chadcn/dialog component --- src/components/lib/ui/dialog/Dialog.vue | 19 ++++++ src/components/lib/ui/dialog/DialogClose.vue | 11 ++++ .../lib/ui/dialog/DialogContent.vue | 53 ++++++++++++++++ .../lib/ui/dialog/DialogDescription.vue | 25 ++++++++ src/components/lib/ui/dialog/DialogFooter.vue | 12 ++++ src/components/lib/ui/dialog/DialogHeader.vue | 14 +++++ .../lib/ui/dialog/DialogScrollContent.vue | 60 +++++++++++++++++++ src/components/lib/ui/dialog/DialogTitle.vue | 25 ++++++++ .../lib/ui/dialog/DialogTrigger.vue | 11 ++++ src/components/lib/ui/dialog/index.ts | 9 +++ 10 files changed, 239 insertions(+) create mode 100644 src/components/lib/ui/dialog/Dialog.vue create mode 100644 src/components/lib/ui/dialog/DialogClose.vue create mode 100644 src/components/lib/ui/dialog/DialogContent.vue create mode 100644 src/components/lib/ui/dialog/DialogDescription.vue create mode 100644 src/components/lib/ui/dialog/DialogFooter.vue create mode 100644 src/components/lib/ui/dialog/DialogHeader.vue create mode 100644 src/components/lib/ui/dialog/DialogScrollContent.vue create mode 100644 src/components/lib/ui/dialog/DialogTitle.vue create mode 100644 src/components/lib/ui/dialog/DialogTrigger.vue create mode 100644 src/components/lib/ui/dialog/index.ts diff --git a/src/components/lib/ui/dialog/Dialog.vue b/src/components/lib/ui/dialog/Dialog.vue new file mode 100644 index 0000000..014bccb --- /dev/null +++ b/src/components/lib/ui/dialog/Dialog.vue @@ -0,0 +1,19 @@ + + + diff --git a/src/components/lib/ui/dialog/DialogClose.vue b/src/components/lib/ui/dialog/DialogClose.vue new file mode 100644 index 0000000..bc3b70a --- /dev/null +++ b/src/components/lib/ui/dialog/DialogClose.vue @@ -0,0 +1,11 @@ + + + diff --git a/src/components/lib/ui/dialog/DialogContent.vue b/src/components/lib/ui/dialog/DialogContent.vue new file mode 100644 index 0000000..5734474 --- /dev/null +++ b/src/components/lib/ui/dialog/DialogContent.vue @@ -0,0 +1,53 @@ + + + diff --git a/src/components/lib/ui/dialog/DialogDescription.vue b/src/components/lib/ui/dialog/DialogDescription.vue new file mode 100644 index 0000000..99d4b0d --- /dev/null +++ b/src/components/lib/ui/dialog/DialogDescription.vue @@ -0,0 +1,25 @@ + + + diff --git a/src/components/lib/ui/dialog/DialogFooter.vue b/src/components/lib/ui/dialog/DialogFooter.vue new file mode 100644 index 0000000..715026a --- /dev/null +++ b/src/components/lib/ui/dialog/DialogFooter.vue @@ -0,0 +1,12 @@ + + + diff --git a/src/components/lib/ui/dialog/DialogHeader.vue b/src/components/lib/ui/dialog/DialogHeader.vue new file mode 100644 index 0000000..c479590 --- /dev/null +++ b/src/components/lib/ui/dialog/DialogHeader.vue @@ -0,0 +1,14 @@ + + + diff --git a/src/components/lib/ui/dialog/DialogScrollContent.vue b/src/components/lib/ui/dialog/DialogScrollContent.vue new file mode 100644 index 0000000..110fa47 --- /dev/null +++ b/src/components/lib/ui/dialog/DialogScrollContent.vue @@ -0,0 +1,60 @@ + + + diff --git a/src/components/lib/ui/dialog/DialogTitle.vue b/src/components/lib/ui/dialog/DialogTitle.vue new file mode 100644 index 0000000..b467224 --- /dev/null +++ b/src/components/lib/ui/dialog/DialogTitle.vue @@ -0,0 +1,25 @@ + + + diff --git a/src/components/lib/ui/dialog/DialogTrigger.vue b/src/components/lib/ui/dialog/DialogTrigger.vue new file mode 100644 index 0000000..7872f1c --- /dev/null +++ b/src/components/lib/ui/dialog/DialogTrigger.vue @@ -0,0 +1,11 @@ + + + diff --git a/src/components/lib/ui/dialog/index.ts b/src/components/lib/ui/dialog/index.ts new file mode 100644 index 0000000..b92d799 --- /dev/null +++ b/src/components/lib/ui/dialog/index.ts @@ -0,0 +1,9 @@ +export { default as Dialog } from "./Dialog.vue"; +export { default as DialogClose } from "./DialogClose.vue"; +export { default as DialogTrigger } from "./DialogTrigger.vue"; +export { default as DialogHeader } from "./DialogHeader.vue"; +export { default as DialogTitle } from "./DialogTitle.vue"; +export { default as DialogDescription } from "./DialogDescription.vue"; +export { default as DialogContent } from "./DialogContent.vue"; +export { default as DialogScrollContent } from "./DialogScrollContent.vue"; +export { default as DialogFooter } from "./DialogFooter.vue"; From 4536c44db1a4f96816aaeed3644e0b1820ac6444 Mon Sep 17 00:00:00 2001 From: Dmytro Svyrydenko Date: Thu, 22 Aug 2024 00:12:16 +0200 Subject: [PATCH 06/15] feat: Redesign record management modal and add refund tx selection --- .../mark-as-refund/mark-as-refund-dialog.vue | 41 ++++++ .../mark-as-refund-info-popover.vue | 69 ++++++++++ .../mark-as-refund/refund-records-list.vue | 103 ++++++++++++++ src/components/modals/modify-record/index.vue | 126 ++++++++---------- .../modals/modify-record/record-list.vue | 16 +-- src/components/modals/modify-record/types.ts | 1 + .../transactions-list/transaction-record.vue | 47 +++---- src/components/widgets/balance-trend.vue | 53 +++----- 8 files changed, 307 insertions(+), 149 deletions(-) create mode 100644 src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-dialog.vue create mode 100644 src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-info-popover.vue create mode 100644 src/components/modals/modify-record/components/mark-as-refund/refund-records-list.vue diff --git a/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-dialog.vue b/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-dialog.vue new file mode 100644 index 0000000..0501c0f --- /dev/null +++ b/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-dialog.vue @@ -0,0 +1,41 @@ + + + diff --git a/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-info-popover.vue b/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-info-popover.vue new file mode 100644 index 0000000..daf230f --- /dev/null +++ b/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-info-popover.vue @@ -0,0 +1,69 @@ + + + diff --git a/src/components/modals/modify-record/components/mark-as-refund/refund-records-list.vue b/src/components/modals/modify-record/components/mark-as-refund/refund-records-list.vue new file mode 100644 index 0000000..8104c67 --- /dev/null +++ b/src/components/modals/modify-record/components/mark-as-refund/refund-records-list.vue @@ -0,0 +1,103 @@ + + + + + + diff --git a/src/components/modals/modify-record/index.vue b/src/components/modals/modify-record/index.vue index 5b66da4..df6162a 100644 --- a/src/components/modals/modify-record/index.vue +++ b/src/components/modals/modify-record/index.vue @@ -3,6 +3,7 @@ import { ref, watch, computed, onMounted, nextTick, onUnmounted } from "vue"; import { storeToRefs } from "pinia"; import { useQueryClient } from "@tanstack/vue-query"; import { useEventListener } from "@vueuse/core"; +import { XIcon } from "lucide-vue-next"; import { TRANSACTION_TYPES, PAYMENT_TYPES, @@ -10,11 +11,7 @@ import { ACCOUNT_TYPES, TRANSACTION_TRANSFER_NATURE, } from "shared-types"; -import { - useAccountsStore, - useCategoriesStore, - useCurrenciesStore, -} from "@/stores"; +import { useAccountsStore, useCategoriesStore, useCurrenciesStore } from "@/stores"; import { createTransaction, editTransaction, @@ -39,6 +36,7 @@ import TransactionRecrod from "@/components/transactions-list/transaction-record import TypeSelector from "./components/type-selector.vue"; import FormRow from "./components/form-row.vue"; import AccountField from "./components/account-field.vue"; +import MarkAsRefundDialog from "./components/mark-as-refund/mark-as-refund-dialog.vue"; import { FORM_TYPES, UI_FORM_STRUCT } from "./types"; import { getFormTypeFromTransaction } from "./helpers"; import { useTransferFormLogic } from "./composables"; @@ -63,8 +61,7 @@ const emit = defineEmits([MODAL_EVENTS.closeModal]); const { addModal } = useModalCenter(); const { currenciesMap } = storeToRefs(useCurrenciesStore()); const { accountsRecord, systemAccounts } = storeToRefs(useAccountsStore()); -const { formattedCategories, categoriesMap } = - storeToRefs(useCategoriesStore()); +const { formattedCategories, categoriesMap } = storeToRefs(useCategoriesStore()); const queryClient = useQueryClient(); const isFormCreation = computed(() => !props.transaction); @@ -77,15 +74,18 @@ const form = ref({ targetAmount: null, category: formattedCategories.value[0], time: new Date(), - paymentType: VERBOSE_PAYMENT_TYPES.find( - (item) => item.value === PAYMENT_TYPES.creditCard, - ), + paymentType: VERBOSE_PAYMENT_TYPES.find((item) => item.value === PAYMENT_TYPES.creditCard), note: null, type: FORM_TYPES.expense, + refundTransaction: null, }); const linkedTransaction = ref(null); +const refundTransactionsTypeBasedOnFormType = computed(() => + form.value.type === FORM_TYPES.expense ? TRANSACTION_TYPES.income : TRANSACTION_TYPES.expense, +); + const openTransactionModalList = async () => { const type = props.transaction?.transactionType === TRANSACTION_TYPES.expense @@ -121,13 +121,11 @@ watch( (value) => { if ( value && - props.transaction.transferNature !== - TRANSACTION_TRANSFER_NATURE.transfer_out_wallet + props.transaction.transferNature !== TRANSACTION_TRANSFER_NATURE.transfer_out_wallet ) { nextTick(() => { if (accountsRecord.value[props.transaction.accountId]) { - form.value.account = - accountsRecord.value[props.transaction.accountId]; + form.value.account = accountsRecord.value[props.transaction.accountId]; } }); } @@ -138,9 +136,7 @@ watch( const isLoading = ref(false); const currentTxType = computed(() => form.value.type); -const isTransferTx = computed( - () => currentTxType.value === FORM_TYPES.transfer, -); +const isTransferTx = computed(() => currentTxType.value === FORM_TYPES.transfer); const { isTargetFieldVisible, @@ -188,9 +184,7 @@ const transferSourceAccounts = computed(() => [ ]); const transferDestinationAccounts = computed(() => - transferSourceAccounts.value.filter( - (item) => item.id !== form.value.account?.id, - ), + transferSourceAccounts.value.filter((item) => item.id !== form.value.account?.id), ); watch( @@ -201,16 +195,13 @@ watch( type: getFormTypeFromTransaction(value), category: categoriesMap.value[value.categoryId], time: new Date(value.time), - paymentType: VERBOSE_PAYMENT_TYPES.find( - (item) => item.value === value.paymentType, - ), + paymentType: VERBOSE_PAYMENT_TYPES.find((item) => item.value === value.paymentType), note: value.note, transactionRecordItem: value, + refundTransaction: null, } as typeof form.value; - if ( - value.transferNature === TRANSACTION_TRANSFER_NATURE.transfer_out_wallet - ) { + if (value.transferNature === TRANSACTION_TRANSFER_NATURE.transfer_out_wallet) { if (value.transactionType === TRANSACTION_TYPES.income) { initialFormValues.account = OUT_OF_WALLET_ACCOUNT_MOCK; initialFormValues.targetAmount = value.amount; @@ -256,8 +247,7 @@ watch( () => [currentTxType.value, linkedTransaction.value], ([txType, isLinked], [prevTxType]) => { if (props.transaction) { - const { amount, transactionType, accountId, transferNature } = - props.transaction; + const { amount, transactionType, accountId, transferNature } = props.transaction; if (isLinked) { form.value.amount = amount; @@ -270,9 +260,7 @@ watch( form.value.toAccount = accountsRecord.value[accountId]; form.value.account = null; - if ( - transferNature === TRANSACTION_TRANSFER_NATURE.transfer_out_wallet - ) { + if (transferNature === TRANSACTION_TRANSFER_NATURE.transfer_out_wallet) { form.value.account = OUT_OF_WALLET_ACCOUNT_MOCK; } } @@ -451,9 +439,7 @@ useEventListener(document, "keydown", (event) => { v-model:to-account="form.toAccount" :is-transfer-transaction="isTransferTx" :is-transaction-linking="!!linkedTransaction" - :transaction-type=" - props.transaction?.transactionType || TRANSACTION_TYPES.expense - " + :transaction-type="props.transaction?.transactionType || TRANSACTION_TYPES.expense" :accounts="isTransferTx ? transferSourceAccounts : systemAccounts" :from-account-disabled="fromAccountFieldDisabled" :to-account-disabled="toAccountFieldDisabled" @@ -491,10 +477,7 @@ useEventListener(document, "keydown", (event) => { @@ -39,14 +36,7 @@ import { ref, computed, watch } from "vue"; import { useQuery } from "@tanstack/vue-query"; import { Chart as Highcharts } from "highcharts-vue"; -import { - getDaysInMonth, - addDays, - startOfMonth, - endOfMonth, - startOfDay, - subMonths, -} from "date-fns"; +import { getDaysInMonth, addDays, startOfMonth, endOfMonth, startOfDay, subMonths } from "date-fns"; import { storeToRefs } from "pinia"; import { ChartLineIcon } from "lucide-vue-next"; import { getTotalBalance } from "@/api"; @@ -93,33 +83,27 @@ const actualDataPeriod = ref(props.selectedPeriod); const prevDataPeriod = ref(props.selectedPeriod); const periodQueryKey = computed(() => props.selectedPeriod.from.getTime()); -const { data: balanceHistory, isFetching: isBalanceHistoryFetching } = useQuery( - { - queryKey: [...VUE_QUERY_CACHE_KEYS.widgetBalanceTrend, periodQueryKey], - queryFn: () => loadBalanceTrendData(props.selectedPeriod), - staleTime: Infinity, - placeholderData: (prevData) => prevData, - }, -); +const { data: balanceHistory, isFetching: isBalanceHistoryFetching } = useQuery({ + queryKey: [...VUE_QUERY_CACHE_KEYS.widgetBalanceTrend, periodQueryKey], + queryFn: () => loadBalanceTrendData(props.selectedPeriod), + staleTime: Infinity, + placeholderData: (prevData) => prevData, +}); const { data: todayBalance, isFetching: isTodayBalanceFetching } = useQuery({ queryKey: [...VUE_QUERY_CACHE_KEYS.widgetBalanceTotalBalance, periodQueryKey], queryFn: () => getTotalBalance({ date: props.selectedPeriod.to }), placeholderData: (prevData) => prevData || 0, staleTime: Infinity, }); -const { data: previousBalance, isFetching: isPreviousBalanceFetching } = - useQuery({ - queryKey: [ - ...VUE_QUERY_CACHE_KEYS.widgetBalancePreviousBalance, - periodQueryKey, - ], - queryFn: () => - getTotalBalance({ - date: endOfMonth(subMonths(props.selectedPeriod.to, 1)), - }), - placeholderData: (prevData) => prevData || 0, - staleTime: Infinity, - }); +const { data: previousBalance, isFetching: isPreviousBalanceFetching } = useQuery({ + queryKey: [...VUE_QUERY_CACHE_KEYS.widgetBalancePreviousBalance, periodQueryKey], + queryFn: () => + getTotalBalance({ + date: endOfMonth(subMonths(props.selectedPeriod.to, 1)), + }), + placeholderData: (prevData) => prevData || 0, + staleTime: Infinity, +}); const isWidgetDataFetching = computed( () => @@ -153,8 +137,7 @@ watch( ); const isDataEmpty = computed( - () => - !balanceHistory.value || balanceHistory.value.every((i) => i.amount === 0), + () => !balanceHistory.value || balanceHistory.value.every((i) => i.amount === 0), ); const chartOptions = computed(() => { From 62a185ec03f5a09981eff4885f2cbe25582cb03f Mon Sep 17 00:00:00 2001 From: Dmytro Svyrydenko Date: Fri, 23 Aug 2024 00:11:16 +0200 Subject: [PATCH 07/15] feat: Add refund tx selection in the form --- backend | 2 +- package-lock.json | 12 ++++----- package.json | 2 +- src/api/_api.ts | 5 +--- src/api/refunds.ts | 4 +++ src/api/transactions.ts | 22 ++++----------- .../lib/ui/dialog/DialogContent.vue | 2 +- .../mark-as-refund/mark-as-refund-dialog.vue | 4 +-- .../mark-as-refund-info-popover.vue | 2 +- .../mark-as-refund/refund-records-list.vue | 27 +++++++++++-------- .../components/type-selector.vue | 19 +++++-------- src/components/modals/modify-record/index.vue | 15 +++++++++-- .../utils/prepare-tx-creation-params.ts | 15 +++++------ .../utils/prepare-tx-updation-params.ts | 19 +++---------- 14 files changed, 68 insertions(+), 82 deletions(-) create mode 100644 src/api/refunds.ts diff --git a/backend b/backend index a968eb5..c89af50 160000 --- a/backend +++ b/backend @@ -1 +1 @@ -Subproject commit a968eb5550fc9dcc6f362e6b9c9e10a6696e73db +Subproject commit c89af50245de0efe589189e9c3bbfe87d53132e9 diff --git a/package-lock.json b/package-lock.json index 96a1b9e..bd4c28b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -68,7 +68,7 @@ "storybook-dark-mode": "^4.0.2", "tailwindcss": "^3.4.8", "typescript": "^5.5.4", - "vite": "^5.4.0", + "vite": "^5.4.2", "vite-svg-loader": "^5.1.0", "vitest": "^2.0.5", "vue-style-loader": "^4.1.3", @@ -14890,14 +14890,14 @@ } }, "node_modules/vite": { - "version": "5.4.0", - "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.0.tgz", - "integrity": "sha512-5xokfMX0PIiwCMCMb9ZJcMyh5wbBun0zUzKib+L65vAZ8GY9ePZMXxFrHbr/Kyll2+LSCY7xtERPpxkBDKngwg==", + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.2.tgz", + "integrity": "sha512-dDrQTRHp5C1fTFzcSaMxjk6vdpKvT+2/mIdE07Gw2ykehT49O0z/VHS3zZ8iV/Gh8BJJKHWOe5RjaNrW5xf/GA==", "dev": true, "dependencies": { "esbuild": "^0.21.3", - "postcss": "^8.4.40", - "rollup": "^4.13.0" + "postcss": "^8.4.41", + "rollup": "^4.20.0" }, "bin": { "vite": "bin/vite.js" diff --git a/package.json b/package.json index 8621f37..92804ca 100644 --- a/package.json +++ b/package.json @@ -85,7 +85,7 @@ "storybook-dark-mode": "^4.0.2", "tailwindcss": "^3.4.8", "typescript": "^5.5.4", - "vite": "^5.4.0", + "vite": "^5.4.2", "vite-svg-loader": "^5.1.0", "vitest": "^2.0.5", "vue-style-loader": "^4.1.3", diff --git a/src/api/_api.ts b/src/api/_api.ts index 3bc3b4e..6976cc4 100644 --- a/src/api/_api.ts +++ b/src/api/_api.ts @@ -2,10 +2,7 @@ import { API_ERROR_CODES, API_RESPONSE_STATUS } from "shared-types"; import { useAuthStore } from "@/stores"; import { router } from "@/routes"; import { ApiBaseError } from "@/common/types"; -import { - useNotificationCenter, - NotificationType, -} from "@/components/notification-center"; +import { useNotificationCenter, NotificationType } from "@/components/notification-center"; import * as errors from "@/js/errors"; diff --git a/src/api/refunds.ts b/src/api/refunds.ts new file mode 100644 index 0000000..7f63331 --- /dev/null +++ b/src/api/refunds.ts @@ -0,0 +1,4 @@ +import { api } from "@/api/_api"; + +export const linkRefund = async (params: { originalTxId: number | null; refundTxId: number }) => + api.post("/transactions/refund", params); diff --git a/src/api/transactions.ts b/src/api/transactions.ts index 739737c..85b199f 100644 --- a/src/api/transactions.ts +++ b/src/api/transactions.ts @@ -1,14 +1,8 @@ -import { - TransactionModel, - endpointsTypes, - TRANSACTION_TRANSFER_NATURE, -} from "shared-types"; +import { TransactionModel, endpointsTypes, TRANSACTION_TRANSFER_NATURE } from "shared-types"; import { api } from "@/api/_api"; import { fromSystemAmount, toSystemAmount } from "@/api/helpers"; -const formatTransactionResponse = ( - transaction: TransactionModel, -): TransactionModel => ({ +const formatTransactionResponse = (transaction: TransactionModel): TransactionModel => ({ ...transaction, amount: fromSystemAmount(transaction.amount), refAmount: fromSystemAmount(transaction.refAmount), @@ -36,11 +30,7 @@ export const loadTransactions = async ( return result.map((item) => formatTransactionResponse(item)); }; -export const loadTransactionById = async ({ - id, -}: { - id: number; -}): Promise => { +export const loadTransactionById = async ({ id }: { id: number }): Promise => { const result = await api.get(`/transactions/${id}`); return formatTransactionResponse(result); @@ -54,9 +44,7 @@ export const loadTransactionsByTransferId = async ( return result.map((item) => formatTransactionResponse(item)); }; -export const createTransaction = async ( - params: endpointsTypes.CreateTransactionBody, -) => { +export const createTransaction = async (params: endpointsTypes.CreateTransactionBody) => { try { const formattedParams = formatTransactionPayload({ transferNature: TRANSACTION_TRANSFER_NATURE.not_transfer, @@ -64,7 +52,7 @@ export const createTransaction = async ( ...params, }); - await api.post("/transactions", formattedParams); + return api.post("/transactions", formattedParams); } catch (e) { throw new Error(e); } diff --git a/src/components/lib/ui/dialog/DialogContent.vue b/src/components/lib/ui/dialog/DialogContent.vue index 5734474..9a239c0 100644 --- a/src/components/lib/ui/dialog/DialogContent.vue +++ b/src/components/lib/ui/dialog/DialogContent.vue @@ -35,7 +35,7 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits); v-bind="forwarded" :class=" cn( - 'fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg', + 'fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg', props.class, ) " diff --git a/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-dialog.vue b/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-dialog.vue index 0501c0f..d4584b7 100644 --- a/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-dialog.vue +++ b/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-dialog.vue @@ -25,8 +25,8 @@ const saveResult = (v: TransactionModel) => { - - + + Select transaction Select the original transaction that this new entry is refunding. diff --git a/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-info-popover.vue b/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-info-popover.vue index daf230f..0a7703c 100644 --- a/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-info-popover.vue +++ b/src/components/modals/modify-record/components/mark-as-refund/mark-as-refund-info-popover.vue @@ -8,7 +8,7 @@ import * as ScrollArea from "@/components/lib/ui/scroll-area";
- Read more + How it works?
diff --git a/src/components/modals/modify-record/components/mark-as-refund/refund-records-list.vue b/src/components/modals/modify-record/components/mark-as-refund/refund-records-list.vue index 8104c67..4646b90 100644 --- a/src/components/modals/modify-record/components/mark-as-refund/refund-records-list.vue +++ b/src/components/modals/modify-record/components/mark-as-refund/refund-records-list.vue @@ -1,11 +1,12 @@