82 lines
2.4 KiB
TypeScript
82 lines
2.4 KiB
TypeScript
import { Card, CardContent, CardHeader, CardTitle } from "@/shared/components/ui/card";
|
|
import { Badge } from "@/shared/components/ui/badge";
|
|
import { Clock, MapPin, CalendarX } from "lucide-react";
|
|
import { EmptyState } from "@/shared/components/ui/empty-state";
|
|
|
|
interface ScheduleItem {
|
|
id: string;
|
|
course: string;
|
|
time: string;
|
|
location: string;
|
|
type: "Lecture" | "Workshop" | "Lab";
|
|
}
|
|
|
|
// MOCK_SCHEDULE can be empty to test empty state
|
|
const MOCK_SCHEDULE: ScheduleItem[] = [
|
|
{
|
|
id: "1",
|
|
course: "Advanced Web Development",
|
|
time: "09:00 AM - 10:30 AM",
|
|
location: "Room 304",
|
|
type: "Lecture",
|
|
},
|
|
{
|
|
id: "2",
|
|
course: "UI/UX Design Principles",
|
|
time: "11:00 AM - 12:30 PM",
|
|
location: "Design Studio A",
|
|
type: "Workshop",
|
|
},
|
|
{
|
|
id: "3",
|
|
course: "Frontend Frameworks",
|
|
time: "02:00 PM - 03:30 PM",
|
|
location: "Online (Zoom)",
|
|
type: "Lecture",
|
|
},
|
|
];
|
|
|
|
export function TeacherSchedule() {
|
|
const hasSchedule = MOCK_SCHEDULE.length > 0;
|
|
|
|
return (
|
|
<Card className="col-span-3">
|
|
<CardHeader>
|
|
<CardTitle>Today's Schedule</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
{!hasSchedule ? (
|
|
<EmptyState
|
|
icon={CalendarX}
|
|
title="No Classes Today"
|
|
description="You have no classes scheduled for today. Enjoy your free time!"
|
|
className="border-none h-[300px]"
|
|
/>
|
|
) : (
|
|
<div className="space-y-4">
|
|
{MOCK_SCHEDULE.map((item) => (
|
|
<div
|
|
key={item.id}
|
|
className="flex items-center justify-between border-b pb-4 last:border-0 last:pb-0"
|
|
>
|
|
<div className="space-y-1">
|
|
<p className="font-medium leading-none">{item.course}</p>
|
|
<div className="flex items-center text-sm text-muted-foreground">
|
|
<Clock className="mr-1 h-3 w-3" />
|
|
<span className="mr-3">{item.time}</span>
|
|
<MapPin className="mr-1 h-3 w-3" />
|
|
<span>{item.location}</span>
|
|
</div>
|
|
</div>
|
|
<Badge variant={item.type === "Lecture" ? "default" : "secondary"}>
|
|
{item.type}
|
|
</Badge>
|
|
</div>
|
|
))}
|
|
</div>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|