40 lines
1.4 KiB
TypeScript
40 lines
1.4 KiB
TypeScript
import { Async } from "react-async";
|
|
import { getInvoicingSummary, type InvoiceSummary } from "../../api/client";
|
|
import { Alert, Button, Grid, Typography } from "@mui/material";
|
|
import { PurchaseSummaryTable } from "./PurchaseSummaryTable";
|
|
import { SessionSummaryTable } from "./SessionSummaryTable";
|
|
import { useNavigate } from "react-router";
|
|
|
|
export const InvoicePage = () => {
|
|
const invoiceSummaryPromise = getInvoicingSummary();
|
|
const navigate = useNavigate();
|
|
|
|
return (
|
|
<Grid container direction="column" spacing={2} alignItems="center">
|
|
<Typography variant="h3">Summary</Typography>
|
|
<Async promise={invoiceSummaryPromise}>
|
|
<Async.Fulfilled<InvoiceSummary>>
|
|
{(invoiceSummary) => (
|
|
<Grid container direction="column" spacing={2}>
|
|
<PurchaseSummaryTable invoiceSummary={invoiceSummary} />
|
|
<SessionSummaryTable invoiceSummary={invoiceSummary} />
|
|
|
|
<Button
|
|
variant="contained"
|
|
color="primary"
|
|
sx={{ width: "100%" }}
|
|
onClick={() => navigate("/signup")}
|
|
>
|
|
Back to sessions
|
|
</Button>
|
|
</Grid>
|
|
)}
|
|
</Async.Fulfilled>
|
|
<Async.Rejected>
|
|
<Alert severity="error">Something went wrong</Alert>
|
|
</Async.Rejected>
|
|
</Async>
|
|
</Grid>
|
|
);
|
|
};
|