diff --git a/src/components/AddTransactionButton.tsx b/src/components/AddTransactionButton.tsx index e812fc4..095e800 100644 --- a/src/components/AddTransactionButton.tsx +++ b/src/components/AddTransactionButton.tsx @@ -1,8 +1,9 @@ + import React, { useState, useEffect } from 'react'; import { PlusIcon } from 'lucide-react'; import { Dialog, DialogContent, DialogHeader, DialogTitle } from './ui/dialog'; import { toast } from '@/hooks/useToast.wrapper'; // 래퍼 사용 -import { useBudget } from '@/contexts/BudgetContext'; +import { useBudget } from '@/contexts/budget/BudgetContext'; import { supabase } from '@/lib/supabase'; import { isSyncEnabled, setLastSyncTime, trySyncAllData } from '@/utils/syncUtils'; import ExpenseForm, { ExpenseFormValues } from './expenses/ExpenseForm'; diff --git a/src/components/BudgetProgressCard.tsx b/src/components/BudgetProgressCard.tsx index 926faef..8858815 100644 --- a/src/components/BudgetProgressCard.tsx +++ b/src/components/BudgetProgressCard.tsx @@ -1,8 +1,7 @@ - import React from 'react'; import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; import BudgetTabContent from './BudgetTabContent'; -import { BudgetPeriod } from '@/contexts/BudgetContext'; +import { BudgetPeriod } from '@/contexts/budget/BudgetContext'; interface BudgetData { targetAmount: number; diff --git a/src/components/RecentTransactionsSection.tsx b/src/components/RecentTransactionsSection.tsx index b671029..19375e1 100644 --- a/src/components/RecentTransactionsSection.tsx +++ b/src/components/RecentTransactionsSection.tsx @@ -1,8 +1,8 @@ import React, { useState, useCallback, useRef } from 'react'; -import { Transaction } from './TransactionCard'; +import { Transaction } from '@/contexts/budget/types'; import TransactionEditDialog from './TransactionEditDialog'; import { ChevronRight } from 'lucide-react'; -import { useBudget } from '@/contexts/BudgetContext'; +import { useBudget } from '@/contexts/budget/BudgetContext'; import { Link } from 'react-router-dom'; import { categoryIcons } from '@/constants/categoryIcons'; import TransactionIcon from './transaction/TransactionIcon'; @@ -154,7 +154,8 @@ const RecentTransactionsSection: React.FC = ({ const formatCurrency = (amount: number) => { return amount.toLocaleString('ko-KR') + '원'; }; - return
+ return ( +

최근 지출

@@ -163,28 +164,47 @@ const RecentTransactionsSection: React.FC = ({
- {transactions.length > 0 ? transactions.map(transaction =>
handleTransactionClick(transaction)} className="flex justify-between py-2 cursor-pointer px-[5px] bg-transparent"> -
- -
-

- {transaction.title} -

-

{transaction.date}

+ {transactions.length > 0 ? ( + transactions.map(transaction => ( +
handleTransactionClick(transaction)} + className="flex justify-between py-2 cursor-pointer px-[5px] bg-transparent" + > +
+ +
+

+ {transaction.title} +

+

{transaction.date}

+
+
+
+

+ -{formatCurrency(transaction.amount)} +

+

{transaction.category}

-
-

- -{formatCurrency(transaction.amount)} -

-

{transaction.category}

-
-
) :
+ )) + ) : ( +
지출 내역이 없습니다 -
} +
+ )}
- {selectedTransaction && } -
; + {selectedTransaction && ( + + )} +
+ ); }; export default RecentTransactionsSection; diff --git a/src/components/home/HomeContent.tsx b/src/components/home/HomeContent.tsx index c1b714f..002c76c 100644 --- a/src/components/home/HomeContent.tsx +++ b/src/components/home/HomeContent.tsx @@ -1,12 +1,11 @@ - import React from 'react'; import BudgetProgressCard from '@/components/BudgetProgressCard'; import BudgetCategoriesSection from '@/components/BudgetCategoriesSection'; import RecentTransactionsSection from '@/components/RecentTransactionsSection'; import EmptyState from './EmptyState'; -import { BudgetPeriod } from '@/contexts/BudgetContext'; +import { BudgetPeriod } from '@/contexts/budget/BudgetContext'; import { formatCurrency, calculatePercentage } from '@/utils/formatters'; -import { Transaction } from '@/components/TransactionCard'; +import { Transaction } from '@/contexts/budget/types'; interface HomeContentProps { transactions: Transaction[]; diff --git a/src/components/transaction/useTransactionEdit.ts b/src/components/transaction/useTransactionEdit.ts index bdc89c3..ee6f5d0 100644 --- a/src/components/transaction/useTransactionEdit.ts +++ b/src/components/transaction/useTransactionEdit.ts @@ -3,7 +3,7 @@ import { useState, useRef, useEffect } from 'react'; import { UseFormReturn, useForm } from 'react-hook-form'; import { zodResolver } from '@hookform/resolvers/zod'; import { Transaction } from '@/contexts/budget/types'; -import { useBudget } from '@/contexts/BudgetContext'; +import { useBudget } from '@/contexts/budget/BudgetContext'; import { toast } from '@/components/ui/use-toast'; import { TransactionFormValues, transactionFormSchema, formatWithCommas } from './TransactionFormFields'; import { mapCategoryToNew } from './categoryUtils'; diff --git a/src/hooks/transactions/transactionOperations/index.ts b/src/hooks/transactions/transactionOperations/index.ts index 67d3d65..be9a6bf 100644 --- a/src/hooks/transactions/transactionOperations/index.ts +++ b/src/hooks/transactions/transactionOperations/index.ts @@ -1,7 +1,6 @@ - import { useCallback } from 'react'; import { Transaction } from '@/contexts/budget/types'; -import { useBudget } from '@/contexts/BudgetContext'; +import { useBudget } from '@/contexts/budget/BudgetContext'; export const useTransactionsOperations = (transactions: Transaction[]) => { const { updateTransaction: budgetUpdateTransaction, deleteTransaction: budgetDeleteTransaction } = useBudget(); diff --git a/src/hooks/transactions/transactionOperations/useTransactionsOperations.ts b/src/hooks/transactions/transactionOperations/useTransactionsOperations.ts index bc7bc58..be9a6bf 100644 --- a/src/hooks/transactions/transactionOperations/useTransactionsOperations.ts +++ b/src/hooks/transactions/transactionOperations/useTransactionsOperations.ts @@ -1,11 +1,20 @@ - import { useCallback } from 'react'; import { Transaction } from '@/contexts/budget/types'; -import { useBudget } from '@/contexts/BudgetContext'; +import { useBudget } from '@/contexts/budget/BudgetContext'; export const useTransactionsOperations = (transactions: Transaction[]) => { - const { deleteTransaction: budgetDeleteTransaction } = useBudget(); + const { updateTransaction: budgetUpdateTransaction, deleteTransaction: budgetDeleteTransaction } = useBudget(); + // 트랜잭션 업데이트 함수 + const updateTransaction = useCallback((updatedTransaction: Transaction): void => { + try { + budgetUpdateTransaction(updatedTransaction); + } catch (error) { + console.error('트랜잭션 업데이트 중 오류:', error); + } + }, [budgetUpdateTransaction]); + + // 트랜잭션 삭제 함수 const deleteTransaction = useCallback(async (id: string): Promise => { try { budgetDeleteTransaction(id); @@ -17,6 +26,7 @@ export const useTransactionsOperations = (transactions: Transaction[]) => { }, [budgetDeleteTransaction]); return { + updateTransaction, deleteTransaction }; }; diff --git a/src/pages/Analytics.tsx b/src/pages/Analytics.tsx index 5e3510a..d17ae57 100644 --- a/src/pages/Analytics.tsx +++ b/src/pages/Analytics.tsx @@ -3,7 +3,7 @@ import React, { useState, useEffect } from 'react'; import NavBar from '@/components/NavBar'; import ExpenseChart from '@/components/ExpenseChart'; import AddTransactionButton from '@/components/AddTransactionButton'; -import { useBudget } from '@/contexts/BudgetContext'; +import { useBudget } from '@/contexts/budget/BudgetContext'; import { MONTHS_KR } from '@/hooks/useTransactions'; import { useIsMobile } from '@/hooks/use-mobile'; import { getCategoryColor } from '@/utils/categoryColorUtils'; diff --git a/src/pages/Transactions.tsx b/src/pages/Transactions.tsx index 6ce77e2..039e556 100644 --- a/src/pages/Transactions.tsx +++ b/src/pages/Transactions.tsx @@ -2,11 +2,11 @@ import React, { useEffect, useState, useRef, useCallback } from 'react'; import NavBar from '@/components/NavBar'; import AddTransactionButton from '@/components/AddTransactionButton'; -import { useBudget } from '@/contexts/BudgetContext'; +import { useBudget } from '@/contexts/budget/BudgetContext'; import { useTransactions } from '@/hooks/transactions'; import TransactionsHeader from '@/components/transactions/TransactionsHeader'; import TransactionsContent from '@/components/transactions/TransactionsContent'; -import { Transaction } from '@/components/TransactionCard'; +import { Transaction } from '@/contexts/budget/types'; import { toast } from '@/hooks/useToast.wrapper'; const Transactions = () => {