Enable transaction editing

Make each transaction item in the transaction history clickable for modification and editing.

src/components/RecentTransactionsSection.tsx

@@ -1,25 +1,45 @@
 
-import React from 'react';
+import React, { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import TransactionCard, { Transaction } from '@/components/TransactionCard';
+import { toast } from '@/components/ui/use-toast';
 
 interface RecentTransactionsSectionProps {
   transactions: Transaction[];
+  onUpdateTransaction?: (updatedTransaction: Transaction) => void;
 }
 
 const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
-  transactions
+  transactions,
+  onUpdateTransaction
 }) => {
   const navigate = useNavigate();
   
   const handleViewAllTransactions = () => {
     navigate('/transactions');
   };
+
+  const handleUpdateTransaction = (updatedTransaction: Transaction) => {
+    if (onUpdateTransaction) {
+      onUpdateTransaction(updatedTransaction);
+      
+      toast({
+        title: "지출이 수정되었습니다",
+        description: `${updatedTransaction.title} 항목이 업데이트되었습니다.`,
+      });
+    }
+  };
   
   return <>
       <h2 className="text-lg font-semibold mb-3 mt-8">최근 지출</h2>
       <div className="grid gap-3 mb-6">
-        {transactions.map(transaction => <TransactionCard key={transaction.id} transaction={transaction} />)}
+        {transactions.map(transaction => (
+          <TransactionCard 
+            key={transaction.id} 
+            transaction={transaction} 
+            onUpdate={handleUpdateTransaction}
+          />
+        ))}
       </div>
       
       <div className="flex justify-center mb-6">