diff --git a/app/dashboard/expenses/page.tsx b/app/dashboard/expenses/page.tsx index 7e8cee5..8b24064 100644 --- a/app/dashboard/expenses/page.tsx +++ b/app/dashboard/expenses/page.tsx @@ -1,7 +1,7 @@ /* Copyright (C) 2024 Manuel Bustillo*/ import { lusitana } from '@/app/ui/fonts'; -import ExpenseSummary from '@/app/ui/expenses/summary'; +import ExpensesTable from '@/app/ui/expenses/table'; export default function Page () { return ( @@ -9,7 +9,7 @@ export default function Page () {

Expenses

Summary

- +
); diff --git a/app/dashboard/page.tsx b/app/dashboard/page.tsx index 643e65f..51c96c1 100644 --- a/app/dashboard/page.tsx +++ b/app/dashboard/page.tsx @@ -1,5 +1,9 @@ /* Copyright (C) 2024 Manuel Bustillo*/ +import GlobalSummary from '@/app/ui/dashboard/global-summary'; + export default function Page() { - return

Dashboard Page

; + return( + + ); } \ No newline at end of file diff --git a/app/lib/definitions.ts b/app/lib/definitions.ts index fb05a59..07eef8b 100644 --- a/app/lib/definitions.ts +++ b/app/lib/definitions.ts @@ -26,6 +26,13 @@ export type Guest = { status?: 'Considered' | 'Invited' | 'Confirmed' | 'Declined' | 'Tentative'; } +export type Expense = { + id: string; + name: string; + amount: number; + pricingType: 'fixed' | 'per person'; +}; + export type TableArrangement = { id: string; number: number; diff --git a/app/ui/expenses/summary.tsx b/app/ui/dashboard/global-summary.tsx similarity index 97% rename from app/ui/expenses/summary.tsx rename to app/ui/dashboard/global-summary.tsx index d838c4b..9b00359 100644 --- a/app/ui/expenses/summary.tsx +++ b/app/ui/dashboard/global-summary.tsx @@ -2,7 +2,7 @@ import { MainCard, SecondaryCard } from '../components/dashboard-cards'; -export default async function ExpenseSummary() { +export default async function GlobalSummary() { return (
diff --git a/app/ui/expenses/table.tsx b/app/ui/expenses/table.tsx new file mode 100644 index 0000000..55a0bbe --- /dev/null +++ b/app/ui/expenses/table.tsx @@ -0,0 +1,51 @@ +/* Copyright (C) 2024 Manuel Bustillo*/ + +'use client' + +import React, { useState } from "react" +import { Expense } from '@/app/lib/definitions'; +import TableOfContents from "../components/table-of-contents"; + +export default function ExpensesTable() { + const [expenses, setExpenses] = useState>([]); + + function loadExpenses() { + fetch("/api/expenses") + .then((response) => response.json()) + .then((data) => { + setExpenses(data.map((record: any) => { + return ({ + id: record.id, + name: record.name, + amount: record.amount, + pricingType: record.pricing_type + }); + })); + }, (error) => { + return []; + }); + } + + expenses.length === 0 && loadExpenses(); + + return ( + ( + + + {expense.name} + + + {expense.amount}€ + + + {expense.pricingType} + + + )} + /> + ); +} \ No newline at end of file