47 lines
1.3 KiB
TypeScript
47 lines
1.3 KiB
TypeScript
import ExpenseCard from "@/app/_components/expense/expense-card";
|
|
import Header from "@/components/header";
|
|
import { Icons } from "@/components/icons";
|
|
import Section from "@/components/section";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { api } from "@/trpc/server";
|
|
import { currentUser } from "@clerk/nextjs/server";
|
|
import Link from "next/link";
|
|
import React from "react";
|
|
|
|
export default async function Page() {
|
|
const splits = await api.expense.getAll();
|
|
const sessionUser = await currentUser();
|
|
|
|
return (
|
|
<>
|
|
<Header text="Expenses">
|
|
<Button asChild size={"sm"}>
|
|
<Link href="/add">Add Expense</Link>
|
|
</Button>
|
|
</Header>
|
|
<Section>
|
|
{/* FILTER BAR */}
|
|
<div className="py-4 flex items-center gap-2">
|
|
<Button
|
|
size={"icon"}
|
|
variant={"outline"}
|
|
className="text-muted-foreground bg-card/25"
|
|
>
|
|
<Icons.filter className="size-6 " />
|
|
</Button>
|
|
<Input placeholder="Search..." />
|
|
</div>
|
|
|
|
<ul className="space-y-4">
|
|
{splits.map((expense) => (
|
|
<li key={expense.id}>
|
|
<ExpenseCard expense={expense} sessionUserId={sessionUser?.id!} />
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</Section>
|
|
</>
|
|
);
|
|
}
|