From 88cc1af1391a8e62fc5b3afc8c4a1a6a47e0601b Mon Sep 17 00:00:00 2001 From: "gpt-engineer-app[bot]" <159125892+gpt-engineer-app[bot]@users.noreply.github.com> Date: Mon, 17 Mar 2025 22:41:30 +0000 Subject: [PATCH] Refactor useTransactionsFiltering hook Refactor the useTransactionsFiltering hook into smaller, more manageable units without changing functionality. --- .../transactions/filterOperations/index.ts | 42 ++++++++++++++ .../transactions/filterOperations/types.ts | 16 ++++++ .../filterOperations/useFilterApplication.ts | 32 +++++++++++ .../filterOperations/useMonthSelection.ts | 26 +++++++++ .../filterOperations/useTotalCalculation.ts | 18 ++++++ src/hooks/transactions/useTransactionsCore.ts | 4 +- .../transactions/useTransactionsFiltering.ts | 56 +------------------ 7 files changed, 139 insertions(+), 55 deletions(-) create mode 100644 src/hooks/transactions/filterOperations/index.ts create mode 100644 src/hooks/transactions/filterOperations/types.ts create mode 100644 src/hooks/transactions/filterOperations/useFilterApplication.ts create mode 100644 src/hooks/transactions/filterOperations/useMonthSelection.ts create mode 100644 src/hooks/transactions/filterOperations/useTotalCalculation.ts diff --git a/src/hooks/transactions/filterOperations/index.ts b/src/hooks/transactions/filterOperations/index.ts new file mode 100644 index 0000000..fcfab09 --- /dev/null +++ b/src/hooks/transactions/filterOperations/index.ts @@ -0,0 +1,42 @@ + +import { useMonthSelection } from './useMonthSelection'; +import { useFilterApplication } from './useFilterApplication'; +import { useTotalCalculation } from './useTotalCalculation'; +import { FilteringProps, FilteringReturn } from './types'; + +/** + * 트랜잭션 필터링 작업 관련 훅 + * 월 선택, 필터 적용, 총액 계산 기능을 제공합니다. + */ +export const useTransactionsFiltering = ({ + transactions, + selectedMonth, + setSelectedMonth, + searchQuery, + setFilteredTransactions +}: FilteringProps): FilteringReturn => { + // 월 선택 관련 기능 + const { handlePrevMonth, handleNextMonth } = useMonthSelection( + selectedMonth, + setSelectedMonth + ); + + // 필터 적용 + useFilterApplication( + transactions, + selectedMonth, + searchQuery, + setFilteredTransactions + ); + + // 총 지출 계산 + const { getTotalExpenses } = useTotalCalculation(); + + return { + handlePrevMonth, + handleNextMonth, + getTotalExpenses + }; +}; + +export * from './types'; diff --git a/src/hooks/transactions/filterOperations/types.ts b/src/hooks/transactions/filterOperations/types.ts new file mode 100644 index 0000000..40aafd7 --- /dev/null +++ b/src/hooks/transactions/filterOperations/types.ts @@ -0,0 +1,16 @@ + +import { Transaction } from '@/components/TransactionCard'; + +export interface FilteringProps { + transactions: Transaction[]; + selectedMonth: string; + setSelectedMonth: (month: string) => void; + searchQuery: string; + setFilteredTransactions: (transactions: Transaction[]) => void; +} + +export interface FilteringReturn { + handlePrevMonth: () => void; + handleNextMonth: () => void; + getTotalExpenses: (filteredTransactions: Transaction[]) => number; +} diff --git a/src/hooks/transactions/filterOperations/useFilterApplication.ts b/src/hooks/transactions/filterOperations/useFilterApplication.ts new file mode 100644 index 0000000..28e63b1 --- /dev/null +++ b/src/hooks/transactions/filterOperations/useFilterApplication.ts @@ -0,0 +1,32 @@ + +import { useEffect } from 'react'; +import { Transaction } from '@/components/TransactionCard'; +import { + filterTransactionsByMonth, + filterTransactionsByQuery +} from '../filterUtils'; + +/** + * 필터 적용 관련 훅 + * 트랜잭션에 대한 월별/검색어 필터링을 적용합니다. + */ +export const useFilterApplication = ( + transactions: Transaction[], + selectedMonth: string, + searchQuery: string, + setFilteredTransactions: (transactions: Transaction[]) => void +) => { + // 필터 적용 + useEffect(() => { + // 1. 월별 필터링 + let filtered = filterTransactionsByMonth(transactions, selectedMonth); + + // 2. 검색어 필터링 + if (searchQuery.trim()) { + filtered = filterTransactionsByQuery(filtered, searchQuery); + } + + console.log('필터링 결과:', filtered.length, '트랜잭션'); + setFilteredTransactions(filtered); + }, [transactions, selectedMonth, searchQuery, setFilteredTransactions]); +}; diff --git a/src/hooks/transactions/filterOperations/useMonthSelection.ts b/src/hooks/transactions/filterOperations/useMonthSelection.ts new file mode 100644 index 0000000..f54effd --- /dev/null +++ b/src/hooks/transactions/filterOperations/useMonthSelection.ts @@ -0,0 +1,26 @@ + +import { getPrevMonth, getNextMonth } from '../dateUtils'; + +/** + * 월 선택 관련 훅 + * 이전/다음 월 선택 기능을 제공합니다. + */ +export const useMonthSelection = ( + selectedMonth: string, + setSelectedMonth: (month: string) => void +) => { + // 이전 월로 변경 + const handlePrevMonth = () => { + setSelectedMonth(getPrevMonth(selectedMonth)); + }; + + // 다음 월로 변경 + const handleNextMonth = () => { + setSelectedMonth(getNextMonth(selectedMonth)); + }; + + return { + handlePrevMonth, + handleNextMonth + }; +}; diff --git a/src/hooks/transactions/filterOperations/useTotalCalculation.ts b/src/hooks/transactions/filterOperations/useTotalCalculation.ts new file mode 100644 index 0000000..babbc12 --- /dev/null +++ b/src/hooks/transactions/filterOperations/useTotalCalculation.ts @@ -0,0 +1,18 @@ + +import { Transaction } from '@/components/TransactionCard'; +import { calculateTotalExpenses } from '../filterUtils'; + +/** + * 총 지출 계산 관련 훅 + * 필터링된 트랜잭션의 총 지출을 계산합니다. + */ +export const useTotalCalculation = () => { + // 필터링된 트랜잭션의 총 지출 계산 + const getTotalExpenses = (filteredTransactions: Transaction[]): number => { + return calculateTotalExpenses(filteredTransactions); + }; + + return { + getTotalExpenses + }; +}; diff --git a/src/hooks/transactions/useTransactionsCore.ts b/src/hooks/transactions/useTransactionsCore.ts index 406d38e..2fc3966 100644 --- a/src/hooks/transactions/useTransactionsCore.ts +++ b/src/hooks/transactions/useTransactionsCore.ts @@ -44,13 +44,13 @@ export const useTransactionsCore = () => { handlePrevMonth, handleNextMonth, getTotalExpenses - } = useTransactionsFiltering( + } = useTransactionsFiltering({ transactions, selectedMonth, setSelectedMonth, searchQuery, setFilteredTransactions - ); + }); // 트랜잭션 작업 const { diff --git a/src/hooks/transactions/useTransactionsFiltering.ts b/src/hooks/transactions/useTransactionsFiltering.ts index 6e4054c..9fff4e8 100644 --- a/src/hooks/transactions/useTransactionsFiltering.ts +++ b/src/hooks/transactions/useTransactionsFiltering.ts @@ -1,55 +1,5 @@ -import { useEffect } from 'react'; -import { Transaction } from '@/components/TransactionCard'; -import { - filterTransactionsByMonth, - filterTransactionsByQuery, - calculateTotalExpenses -} from './filterUtils'; -import { getPrevMonth, getNextMonth } from './dateUtils'; +import { useTransactionsFiltering } from './filterOperations'; -/** - * 트랜잭션 필터링 관련 훅 - * 월별 및 검색어 필터링 기능을 제공합니다. - */ -export const useTransactionsFiltering = ( - transactions: Transaction[], - selectedMonth: string, - setSelectedMonth: (month: string) => void, - searchQuery: string, - setFilteredTransactions: (transactions: Transaction[]) => void -) => { - // 월 변경 처리 - const handlePrevMonth = () => { - setSelectedMonth(getPrevMonth(selectedMonth)); - }; - - const handleNextMonth = () => { - setSelectedMonth(getNextMonth(selectedMonth)); - }; - - // 필터 적용 - useEffect(() => { - // 1. 월별 필터링 - let filtered = filterTransactionsByMonth(transactions, selectedMonth); - - // 2. 검색어 필터링 - if (searchQuery.trim()) { - filtered = filterTransactionsByQuery(filtered, searchQuery); - } - - console.log('필터링 결과:', filtered.length, '트랜잭션'); - setFilteredTransactions(filtered); - }, [transactions, selectedMonth, searchQuery, setFilteredTransactions]); - - // 필터링된 트랜잭션의 총 지출 계산 - const getTotalExpenses = (filteredTransactions: Transaction[]) => { - return calculateTotalExpenses(filteredTransactions); - }; - - return { - handlePrevMonth, - handleNextMonth, - getTotalExpenses - }; -}; +// 기존 훅을 그대로 내보내기 +export { useTransactionsFiltering };