ZELLYY/zellyy-finance
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Visual edit in Lovable

Browse Source 
Edited UI in Lovable
This commit is contained in:
gpt-engineer-app[bot]
2025-03-17 11:56:29 +00:00
parent cfe035ff3f
commit 0fe4825741
1 changed files with 2 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/RecentTransactionsSection.tsx
View File

@@ -6,12 +6,10 @@ import { useBudget } from '@/contexts/BudgetContext';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { categoryIcons } from '@/constants/categoryIcons'; import { categoryIcons } from '@/constants/categoryIcons';
import TransactionIcon from './transaction/TransactionIcon'; import TransactionIcon from './transaction/TransactionIcon';
interface RecentTransactionsSectionProps { interface RecentTransactionsSectionProps {
transactions: Transaction[]; transactions: Transaction[];
onUpdateTransaction?: (transaction: Transaction) => void; onUpdateTransaction?: (transaction: Transaction) => void;
} }
const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({ const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
transactions, transactions,
onUpdateTransaction onUpdateTransaction
@@ -22,12 +20,10 @@ const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
updateTransaction, updateTransaction,
deleteTransaction deleteTransaction
} = useBudget(); } = useBudget();
const handleTransactionClick = (transaction: Transaction) => { const handleTransactionClick = (transaction: Transaction) => {
setSelectedTransaction(transaction); setSelectedTransaction(transaction);
setIsDialogOpen(true); setIsDialogOpen(true);
}; };
const handleUpdateTransaction = (updatedTransaction: Transaction) => { const handleUpdateTransaction = (updatedTransaction: Transaction) => {
if (onUpdateTransaction) { if (onUpdateTransaction) {
onUpdateTransaction(updatedTransaction); onUpdateTransaction(updatedTransaction);
@@ -35,16 +31,13 @@ const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
// 직접 컨텍스트를 통해 업데이트 // 직접 컨텍스트를 통해 업데이트
updateTransaction(updatedTransaction); updateTransaction(updatedTransaction);
}; };
const handleDeleteTransaction = (id: string) => { const handleDeleteTransaction = (id: string) => {
// 직접 컨텍스트를 통해 삭제 // 직접 컨텍스트를 통해 삭제
deleteTransaction(id); deleteTransaction(id);
}; };
const formatCurrency = (amount: number) => { const formatCurrency = (amount: number) => {
return amount.toLocaleString('ko-KR') + '원'; return amount.toLocaleString('ko-KR') + '원';
}; };
return <div className="mt-6 mb-[50px]"> return <div className="mt-6 mb-[50px]">
<div className="flex justify-between items-center mb-3"> <div className="flex justify-between items-center mb-3">
<h2 className="text-lg font-semibold">최근 지출</h2> <h2 className="text-lg font-semibold">최근 지출</h2>
@@ -53,7 +46,7 @@ const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
</Link> </Link>
</div> </div>
<div className="neuro-card divide-y divide-gray-100 w-full"> <div className="neuro-card divide-y divide-gray-100 w-full">
{transactions.length > 0 ? transactions.map(transaction => <div key={transaction.id} onClick={() => handleTransactionClick(transaction)} className="flex justify-between py-3 px-4 cursor-pointer hover:bg-gray-50"> {transactions.length > 0 ? transactions.map(transaction => <div key={transaction.id} onClick={() => handleTransactionClick(transaction)} className="flex justify-between py-3 cursor-pointer hover:bg-gray-50 px-[5px]">
<div className="flex items-center"> <div className="flex items-center">
<TransactionIcon category={transaction.category} /> <TransactionIcon category={transaction.category} />
<div className="ml-3"> <div className="ml-3">
@@ -73,5 +66,4 @@ const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
{selectedTransaction && <TransactionEditDialog transaction={selectedTransaction} open={isDialogOpen} onOpenChange={setIsDialogOpen} onSave={handleUpdateTransaction} onDelete={handleDeleteTransaction} />} {selectedTransaction && <TransactionEditDialog transaction={selectedTransaction} open={isDialogOpen} onOpenChange={setIsDialogOpen} onSave={handleUpdateTransaction} onDelete={handleDeleteTransaction} />}
</div>; </div>;
}; };
export default RecentTransactionsSection;
export default RecentTransactionsSection;