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