a326981e5d
Split the large Index.tsx file into smaller, more manageable components and custom hooks to improve code readability and maintainability. Ensure all functionality remains the same after refactoring.
59 lines
1.3 KiB
TypeScript
59 lines
1.3 KiB
TypeScript
|
|
import React from 'react';
|
|
import Header from '@/components/Header';
|
|
import HomeContent from '@/components/home/HomeContent';
|
|
import { useBudget } from '@/contexts/budget/BudgetContext';
|
|
import { BudgetData } from '@/contexts/budget/types';
|
|
|
|
// 기본 예산 데이터 (빈 객체 대신 사용할 더미 데이터)
|
|
const defaultBudgetData: BudgetData = {
|
|
daily: {
|
|
targetAmount: 0,
|
|
spentAmount: 0,
|
|
remainingAmount: 0
|
|
},
|
|
weekly: {
|
|
targetAmount: 0,
|
|
spentAmount: 0,
|
|
remainingAmount: 0
|
|
},
|
|
monthly: {
|
|
targetAmount: 0,
|
|
spentAmount: 0,
|
|
remainingAmount: 0
|
|
}
|
|
};
|
|
|
|
/**
|
|
* 인덱스 페이지의 주요 내용을 담당하는 컴포넌트
|
|
*/
|
|
const IndexContent: React.FC = () => {
|
|
const {
|
|
transactions,
|
|
budgetData,
|
|
selectedTab,
|
|
setSelectedTab,
|
|
handleBudgetGoalUpdate,
|
|
updateTransaction,
|
|
getCategorySpending
|
|
} = useBudget();
|
|
|
|
return (
|
|
<div className="max-w-md mx-auto px-6">
|
|
<Header />
|
|
|
|
<HomeContent
|
|
transactions={transactions || []}
|
|
budgetData={budgetData || defaultBudgetData}
|
|
selectedTab={selectedTab}
|
|
setSelectedTab={setSelectedTab}
|
|
handleBudgetGoalUpdate={handleBudgetGoalUpdate}
|
|
updateTransaction={updateTransaction}
|
|
getCategorySpending={getCategorySpending}
|
|
/>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default IndexContent;
|