diff --git a/src/app/a.client.tsx b/src/app/a.client.tsx index a414098..aa4a3b2 100644 --- a/src/app/a.client.tsx +++ b/src/app/a.client.tsx @@ -5,8 +5,12 @@ import {fetcher} from "@/app/utils"; import {useEffect, useState} from "react"; import {Card, Metric, Text, Title} from "@tremor/react"; -export function ClientComponent({projectId}: { - projectId: number +export function ClientComponent({ + projectId, + title + }: { + projectId: number, + title?: string }) { const { data, @@ -18,14 +22,14 @@ export function ClientComponent({projectId}: { useEffect(() => { if (data) { setA(data - .map((entry) => entry['raw_json']['seconds']) + .map((entry) => entry.raw_json.seconds) .reduce((a, b) => a + b, 0)); } }, [data]); return ( - {data?.[0]['project']['name']} + {title ?? (isLoading ? 'Loading' : data?.[0]['project']['name'])} Total {(a / (60 * 60)).toFixed(2)} hours diff --git a/src/app/page.tsx b/src/app/page.tsx index f0c3623..4540f2c 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,16 +1,25 @@ -import {Card, Metric, Text, Title} from "@tremor/react"; import {ClientComponent} from "@/app/a.client"; export default function Home() { return ( -
- +
+ - + - + - +
) }