Fix type errors in Index page
The BudgetTabContent and RecentTransactionsSection components in the Index page were receiving incorrect props, leading to TypeScript errors. This commit fixes these errors by passing the correct props to these components.
This commit is contained in:
@@ -7,14 +7,13 @@ import BudgetStatusDisplay from './budget/BudgetStatusDisplay';
|
|||||||
import BudgetInputButton from './budget/BudgetInputButton';
|
import BudgetInputButton from './budget/BudgetInputButton';
|
||||||
import BudgetInputForm from './budget/BudgetInputForm';
|
import BudgetInputForm from './budget/BudgetInputForm';
|
||||||
|
|
||||||
interface BudgetData {
|
// 이 인터페이스는 이 컴포넌트가 받는 props를 명확히 정의합니다
|
||||||
targetAmount: number;
|
|
||||||
spentAmount: number;
|
|
||||||
remainingAmount: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface BudgetTabContentProps {
|
interface BudgetTabContentProps {
|
||||||
data: BudgetData;
|
data: {
|
||||||
|
targetAmount: number;
|
||||||
|
spentAmount: number;
|
||||||
|
remainingAmount: number;
|
||||||
|
};
|
||||||
formatCurrency: (amount: number) => string;
|
formatCurrency: (amount: number) => string;
|
||||||
calculatePercentage: (spent: number, target: number) => number;
|
calculatePercentage: (spent: number, target: number) => number;
|
||||||
onSaveBudget: (amount: number, categoryBudgets?: Record<string, number>) => void;
|
onSaveBudget: (amount: number, categoryBudgets?: Record<string, number>) => void;
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Transaction } from '@/contexts/budget/types';
|
import { Transaction } from '@/contexts/budget/types';
|
||||||
import TransactionEditDialog from './TransactionEditDialog';
|
import TransactionEditDialog from './TransactionEditDialog';
|
||||||
@@ -8,7 +9,7 @@ import { useRecentTransactions } from '@/hooks/transactions/useRecentTransaction
|
|||||||
import { useRecentTransactionsDialog } from '@/hooks/transactions/useRecentTransactionsDialog';
|
import { useRecentTransactionsDialog } from '@/hooks/transactions/useRecentTransactionsDialog';
|
||||||
import RecentTransactionItem from './recent-transactions/RecentTransactionItem';
|
import RecentTransactionItem from './recent-transactions/RecentTransactionItem';
|
||||||
|
|
||||||
interface RecentTransactionsSectionProps {
|
export interface RecentTransactionsSectionProps {
|
||||||
transactions: Transaction[];
|
transactions: Transaction[];
|
||||||
onUpdateTransaction?: (transaction: Transaction) => void;
|
onUpdateTransaction?: (transaction: Transaction) => void;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -30,11 +30,18 @@ const Index = () => {
|
|||||||
</TabsList>
|
</TabsList>
|
||||||
|
|
||||||
<TabsContent value="budget" className="focus-visible:outline-none">
|
<TabsContent value="budget" className="focus-visible:outline-none">
|
||||||
<BudgetTabContent budgetData={budgetData.monthly} />
|
<BudgetTabContent
|
||||||
|
data={budgetData.monthly}
|
||||||
|
formatCurrency={(amount) => `${amount.toLocaleString()}원`}
|
||||||
|
calculatePercentage={(spent, target) => (target > 0 ? (spent / target) * 100 : 0)}
|
||||||
|
onSaveBudget={(amount, categoryBudgets) => {
|
||||||
|
/* 예산 저장 로직 */
|
||||||
|
}}
|
||||||
|
/>
|
||||||
</TabsContent>
|
</TabsContent>
|
||||||
|
|
||||||
<TabsContent value="recent" className="focus-visible:outline-none">
|
<TabsContent value="recent" className="focus-visible:outline-none">
|
||||||
<RecentTransactionsSection />
|
<RecentTransactionsSection transactions={transactions} />
|
||||||
</TabsContent>
|
</TabsContent>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user