28 lines
919 B
TypeScript
28 lines
919 B
TypeScript
|
import { type LucideIcon } from "lucide-react";
|
||
|
|
import { cn } from "@/lib/utils";
|
||
|
|
|
||
|
|
interface EmptyStateProps {
|
||
|
|
icon: LucideIcon;
|
||
|
|
title: string;
|
||
|
|
description?: string;
|
||
|
|
className?: string;
|
||
|
|
action?: React.ReactNode;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function EmptyState({ icon: Icon, title, description, className, action }: EmptyStateProps) {
|
||
|
|
return (
|
||
|
|
<div
|
||
|
|
className={cn(
|
||
|
|
"tool-card flex flex-col items-center px-6 py-12 text-center",
|
||
|
|
className
|
||
|
|
)}
|
||
|
|
>
|
||
|
|
<div className="mb-3 flex h-10 w-10 items-center justify-center rounded-lg border border-border bg-muted">
|
||
|
|
<Icon className="h-5 w-5 text-muted-foreground" strokeWidth={1.5} />
|
||
|
|
</div>
|
||
|
|
<p className="text-[14px] font-medium text-foreground">{title}</p>
|
||
|
|
{description && <p className="page-lead mx-auto mt-1 max-w-xs text-center">{description}</p>}
|
||
|
|
{action && <div className="mt-4">{action}</div>}
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|