setup db connection + implement data fetching on dashboard + add skeleton + docs

This commit is contained in:
Michi 2025-04-19 17:56:12 +02:00
parent aea677e6f7
commit 00c39d3416
11 changed files with 259 additions and 67 deletions

View file

@ -3,20 +3,18 @@ import clsx from 'clsx';
import Image from 'next/image';
import { lusitana } from '@/app/ui/fonts';
import { LatestInvoice } from '@/app/lib/definitions';
export default async function LatestInvoices({
latestInvoices,
}: {
latestInvoices: LatestInvoice[];
}) {
import { fetchLatestInvoices } from '@/app/lib/data';
export default async function LatestInvoices() {
const latestInvoices = await fetchLatestInvoices();
return (
<div className="flex w-full flex-col md:col-span-4">
<h2 className={`${lusitana.className} mb-4 text-xl md:text-2xl`}>
Latest Invoices
</h2>
<div className="flex grow flex-col justify-between rounded-xl bg-gray-50 p-4">
{/* NOTE: Uncomment this code in Chapter 7 */}
{/* <div className="bg-white px-6">
<div className="bg-white px-6">
{latestInvoices.map((invoice, i) => {
return (
<div
@ -53,7 +51,7 @@ export default async function LatestInvoices({
</div>
);
})}
</div> */}
</div>
<div className="flex items-center pb-2 pt-6">
<ArrowPathIcon className="h-5 w-5 text-gray-500" />
<h3 className="ml-2 text-sm text-gray-500 ">Updated just now</h3>