import {Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle} from "@/components/ui/card";
import {Progress} from "@/components/ui/progress";
import {Button} from "@/components/ui/button";
import Link from "next/link";
import {ADMIN_MANAGE_CLIENT_URL, PATIENTS_SESSIONS_URL} from "@/lib/constants";


type PatientDashboardCardsProps = {
    user: any;
}

export default function PatientDashboardCards(props: PatientDashboardCardsProps) {
    return (
        <div className="grid gap-4 sm:grid-cols-4 md:grid-cols-5">
            <Card className="sm:col-span-5 md:col-span-3">
                <CardHeader className="pb-3">
                    <CardTitle>Welcome {`${props.user?.name}`}</CardTitle>
                    <CardDescription className="max-w-lg leading-relaxed">
                        Are you feeling down, losing hope or interest in your daily activities and having sleepless
                        nights?
                    </CardDescription>
                </CardHeader>
                <CardFooter>
                    <Button asChild>
                        <Link href={PATIENTS_SESSIONS_URL}>Start Session</Link>
                    </Button>
                </CardFooter>
            </Card>
            <Card className="sm:col-span-5 md:col-span-2">
                <CardHeader className="pb-2">
                    <CardDescription>Upcoming Appointments</CardDescription>
                    <CardTitle className="text-4xl">12, 122</CardTitle>
                </CardHeader>
                <CardContent>
                    <div className="text-xs text-muted-foreground">
                        +25% from last week
                    </div>
                </CardContent>
                <CardFooter>
                    <Progress value={25} aria-label="25% increase"/>
                </CardFooter>
            </Card>
        </div>
    )
}