Navigate to transactions on click
Implement navigation to the transactions page when the "모든 지출 보기" button is clicked.
This commit is contained in:
@@ -1,11 +1,21 @@
|
|||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { useNavigate } from 'react-router-dom';
|
||||||
import TransactionCard, { Transaction } from '@/components/TransactionCard';
|
import TransactionCard, { Transaction } from '@/components/TransactionCard';
|
||||||
|
|
||||||
interface RecentTransactionsSectionProps {
|
interface RecentTransactionsSectionProps {
|
||||||
transactions: Transaction[];
|
transactions: Transaction[];
|
||||||
}
|
}
|
||||||
|
|
||||||
const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
|
const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
|
||||||
transactions
|
transactions
|
||||||
}) => {
|
}) => {
|
||||||
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
const handleViewAllTransactions = () => {
|
||||||
|
navigate('/transactions');
|
||||||
|
};
|
||||||
|
|
||||||
return <>
|
return <>
|
||||||
<h2 className="text-lg font-semibold mb-3 mt-8">최근 지출</h2>
|
<h2 className="text-lg font-semibold mb-3 mt-8">최근 지출</h2>
|
||||||
<div className="grid gap-3 mb-6">
|
<div className="grid gap-3 mb-6">
|
||||||
@@ -13,8 +23,14 @@ const RecentTransactionsSection: React.FC<RecentTransactionsSectionProps> = ({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex justify-center mb-6">
|
<div className="flex justify-center mb-6">
|
||||||
<button className="text-neuro-income font-medium">모든 지출 보기</button>
|
<button
|
||||||
|
className="text-neuro-income font-medium hover:underline"
|
||||||
|
onClick={handleViewAllTransactions}
|
||||||
|
>
|
||||||
|
모든 지출 보기
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</>;
|
</>;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default RecentTransactionsSection;
|
export default RecentTransactionsSection;
|
||||||
Reference in New Issue
Block a user