46 lines
1.1 KiB
TypeScript
46 lines
1.1 KiB
TypeScript
|
import type { LoaderFunction } from "remix";
|
||
|
|
import { useLoaderData, Link, useCatch } from "remix";
|
||
|
|
import type { Expense } from "@prisma/client";
|
||
|
|
import { db } from "~/utils/db.server";
|
||
|
|
|
||
|
|
type LoaderData = { lastExpenses: Expense[] };
|
||
|
|
|
||
|
|
export const loader: LoaderFunction = async () => {
|
||
|
|
const lastExpenses = await db.expense.findMany({
|
||
|
|
take: 25,
|
||
|
|
orderBy: { createdAt: "desc" },
|
||
|
|
});
|
||
|
|
|
||
|
|
const data: LoaderData = { lastExpenses };
|
||
|
|
return data;
|
||
|
|
};
|
||
|
|
|
||
|
|
export default function JokesIndexRoute() {
|
||
|
|
const data = useLoaderData<LoaderData>();
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div>
|
||
|
|
<p>Here show statistics</p>
|
||
|
|
|
||
|
|
<Link to="new" className="btn btn-primary">
|
||
|
|
Add an expense
|
||
|
|
</Link>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export function CatchBoundary() {
|
||
|
|
const caught = useCatch();
|
||
|
|
|
||
|
|
if (caught.status === 404) {
|
||
|
|
return (
|
||
|
|
<div className="error-container">There are no expenses to display.</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
throw new Error(`Unexpected caught response with status: ${caught.status}`);
|
||
|
|
}
|
||
|
|
|
||
|
|
export function ErrorBoundary() {
|
||
|
|
return <div className="error-container">I did a whoopsies.</div>;
|
||
|
|
}
|