silancar/components/layout/dashboard-side-menu.tsx

70 lines
2.1 KiB
TypeScript

import { RefreshCwIcon } from "lucide-react"
import { Button } from "../ui/button"
import {
Carousel,
CarouselContent,
CarouselItem,
CarouselNext,
CarouselPrevious,
} from "@/components/ui/carousel"
const dummy = [
{
name: "Ipda Iwan",
message: "Ndan, lokasi di Bundaran HI lalu lintas lancar",
time: "16 Oct 2024, 13:44",
},
{
name: "Ipda Iwan",
message: "Ndan, lokasi di Bundaran HI lalu lintas lancar",
time: "16 Oct 2024, 13:44",
},
]
export default function DashboardSideMenu() {
return (
<div className="flex flex-col gap-10">
<div className="flex flex-col gap-2">
<div className="flex justify-between text-2xl font-semibold">
Pesan Pribadi Terakhir
<Button>
<RefreshCwIcon />
</Button>
</div>
<Carousel className="w-full">
<CarouselContent>
{dummy.map((list, index) => (
<CarouselItem key={index}>
<div className="flex flex-col gap-2 rounded-lg bg-white p-3 text-black">
<p className="text-lg font-bold">{list.name}</p>
<p className="">{list.message}</p>
<p className="text-right text-xs">{list.time}</p>
</div>
</CarouselItem>
))}
</CarouselContent>
</Carousel>
</div>
<div className="flex flex-col gap-2">
<div className="flex justify-between text-2xl font-semibold">
Panggilan Pribadi Terakhir
</div>
<Carousel className="w-full">
<CarouselContent>
{dummy.map((list, index) => (
<CarouselItem key={index}>
<div className="flex flex-col gap-2 rounded-lg bg-white p-3 text-black">
<p className="text-lg font-bold">{list.name}</p>
<p className="">{list.message}</p>
<p className="text-right text-xs">{list.time}</p>
</div>
</CarouselItem>
))}
</CarouselContent>
</Carousel>
</div>
</div>
)
}