2025-07-02 11:00:41 +02:00

41 lines
1.2 KiB
TypeScript

import { useRouter } from "next/navigation";
import { Box, Button, IconButton, Paper, Typography } from "@mui/material";
import { PieCharts } from "../PieCharts/PieCharts";
import MoreVertIcon from "@mui/icons-material/MoreVert";
import { TransactionsOverViewTable } from "./components/TransactionsOverViewTable";
import "./TransactionsOverView.scss";
export const TransactionsOverView = () => {
const router = useRouter();
return (
<Paper className="transaction-overview" elevation={3}>
{/* Title and All Transactions Button */}
<Box className="transaction-overview__header">
<Typography variant="h5" fontWeight="bold">
Transactions Overview (Last 24h)
</Typography>
<Box>
<Button
variant="contained"
color="primary"
onClick={() => router.push("dashboard/transactions")}
>
All Transactions
</Button>
<IconButton size="small">
<MoreVertIcon fontSize="small" />
</IconButton>
</Box>
</Box>
{/* Chart and Table */}
<Box className="transaction-overview__chart-table">
<PieCharts />
<TransactionsOverViewTable />
</Box>
</Paper>
);
};