Fix TypeScript errors

- Fix TS2353: Object literal may only specify known properties, and 'paymentMethod' does not exist in type 'Transaction'.
- Fix TS1205: Re-exporting a type when 'isolatedModules' is enabled requires using 'export type'.
- Fix TS2741: Property 'getPaymentMethodStats' is missing in type '{ transactions: Transaction[]; budgetData: BudgetData; categoryBudgets: Record<string, number>; selectedTab: BudgetPeriod; setSelectedTab: React.Dispatch<...>; ... 5 more ...; resetBudgetData: () => void; }' but required in type 'BudgetContextType'.

src/components/AddTransactionButton.tsx

@@ -1,4 +1,3 @@
-
 import React, { useState, useEffect } from 'react';
 import { PlusIcon } from 'lucide-react';
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from './ui/dialog';
@@ -7,7 +6,7 @@ import { useBudget } from '@/contexts/BudgetContext';
 import { supabase } from '@/lib/supabase';
 import { isSyncEnabled, setLastSyncTime, trySyncAllData } from '@/utils/syncUtils';
 import ExpenseForm, { ExpenseFormValues } from './expenses/ExpenseForm';
-import { Transaction } from '@/components/TransactionCard';
+import { Transaction } from '@/contexts/budget/types';
 import { normalizeDate } from '@/utils/sync/transaction/dateUtils';
 import useNotifications from '@/hooks/useNotifications';
 
@@ -55,7 +54,7 @@ const AddTransactionButton = () => {
         date: formattedDate,
         category: data.category,
         type: 'expense',
-        paymentMethod: data.paymentMethod // 추가된 필드
+        paymentMethod: data.paymentMethod // 지출 방법 필드 추가
       };
       
       console.log('새 지출 추가:', newExpense);

src/components/TransactionCard.tsx

@@ -1,22 +1,10 @@
-
 import React, { useState } from 'react';
 import { cn } from '@/lib/utils';
 import TransactionEditDialog from './TransactionEditDialog';
 import TransactionIcon from './transaction/TransactionIcon';
 import TransactionDetails from './transaction/TransactionDetails';
 import TransactionAmount from './transaction/TransactionAmount';
-
+import { Transaction } from '@/contexts/budget/types';
-export type Transaction = {
-  id: string;
-  title: string;
-  amount: number;
-  date: string;
-  category: string;
-  type: 'expense' | 'income';
-  notes?: string; // notes 필드를 옵셔널로 추가
-  localTimestamp?: string; // 로컬 수정 타임스탬프 추가
-  serverTimestamp?: string; // 서버 타임스탬프 추가
-};
 
 interface TransactionCardProps {
   transaction: Transaction;

src/contexts/budget/useBudgetState.ts

@@ -41,6 +41,40 @@ export const useBudgetState = () => {
     return calculateCategorySpending(transactions, categoryBudgets);
   }, [transactions, categoryBudgets]);
   
+  // 결제 방법 통계 계산 함수 추가
+  const getPaymentMethodStats = useCallback(() => {
+    // 지출 트랜잭션 필터링
+    const expenseTransactions = transactions.filter(t => t.type === 'expense');
+    
+    // 총 지출 계산
+    const totalExpense = expenseTransactions.reduce((acc, curr) => acc + curr.amount, 0);
+    
+    // 결제 방법별 금액 계산
+    const cardExpense = expenseTransactions
+      .filter(t => t.paymentMethod === '신용카드' || !t.paymentMethod) // paymentMethod가 없으면 신용카드로 간주
+      .reduce((acc, curr) => acc + curr.amount, 0);
+      
+    const cashExpense = expenseTransactions
+      .filter(t => t.paymentMethod === '현금')
+      .reduce((acc, curr) => acc + curr.amount, 0);
+    
+    // 결과 배열 생성 - 금액이 큰 순서대로 정렬
+    const result = [
+      { 
+        method: '신용카드', 
+        amount: cardExpense,
+        percentage: totalExpense > 0 ? (cardExpense / totalExpense) * 100 : 0
+      },
+      { 
+        method: '현금', 
+        amount: cashExpense,
+        percentage: totalExpense > 0 ? (cashExpense / totalExpense) * 100 : 0
+      }
+    ].sort((a, b) => b.amount - a.amount);
+    
+    return result;
+  }, [transactions]);
+
   // 예산 목표 업데이트 함수 (기존 함수 래핑)
   const handleBudgetUpdate = useCallback((
     type: BudgetPeriod, 
@@ -126,6 +160,7 @@ export const useBudgetState = () => {
     
     // 도우미 함수
     getCategorySpending,
+    getPaymentMethodStats, // 여기에 추가
     
     // 데이터 초기화
     resetBudgetData: resetAllData