revision-ui/src/app/cards/subjectOverviewCard.tsx

28 lines
919 B
TypeScript

import {Card, Metric, Text, Title} from "@tremor/react";
import {Data} from "@/app/fetchData";
export function SubjectOverviewCard({
title,
data,
projectId,
}: {
title?: string,
data: Data,
projectId: number,
}) {
const project = data.projects.find((project) => project.projectId === projectId)!;
const totalDuration = data.timeEntries
.filter((entry) => entry.projectId === projectId)
.map((entry) => entry.duration)
.reduce((a, b) => a + b, 0);
return (
<Card style={{borderColor: project?.color}} decoration={'left'}>
<Title>{title ?? project?.name}</Title>
<Text>Total</Text>
<Metric>{(totalDuration / (60 * 60)).toFixed(2)} hours</Metric>
</Card>
)
}