48 lines
2.1 KiB
TypeScript
48 lines
2.1 KiB
TypeScript
"use client";
|
|
|
|
import { FileText, Inbox } from "lucide-react";
|
|
import { Card } from "@/components/ui/card";
|
|
|
|
export function EmptyContractsState() {
|
|
return (
|
|
<Card className="border-dashed border-border hover:border-primary/50 transition-colors duration-300">
|
|
<div className="p-12 md:p-16 flex flex-col items-center justify-center min-h-[300px]">
|
|
<div className="mb-6 relative">
|
|
<div className="absolute inset-0 bg-gradient-to-r from-primary/20 to-accent/20 rounded-full blur-3xl"></div>
|
|
<div className="relative p-4 bg-background dark:bg-card rounded-full border border-border/50">
|
|
<Inbox className="w-8 h-8 text-muted-foreground" />
|
|
</div>
|
|
</div>
|
|
|
|
<div className="text-center max-w-md">
|
|
<h3 className="text-xl font-semibold text-foreground mb-2">
|
|
No contracts yet
|
|
</h3>
|
|
<p className="text-sm text-muted-foreground mb-1">
|
|
Upload your first contract to get started.
|
|
</p>
|
|
<p className="text-xs text-muted-foreground">
|
|
Our AI will automatically analyze and extract key information from
|
|
your documents.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="mt-8 grid grid-cols-3 gap-4 w-full text-center text-xs">
|
|
<div className="p-3 rounded-lg bg-primary/5 dark:bg-primary/10 border border-primary/20">
|
|
<FileText className="w-5 h-5 mx-auto mb-2 text-primary" />
|
|
<span className="text-muted-foreground">Fast Upload</span>
|
|
</div>
|
|
<div className="p-3 rounded-lg bg-accent/5 dark:bg-accent/10 border border-accent/20">
|
|
<FileText className="w-5 h-5 mx-auto mb-2 text-accent" />
|
|
<span className="text-muted-foreground">AI Analysis</span>
|
|
</div>
|
|
<div className="p-3 rounded-lg bg-secondary/5 dark:bg-secondary/10 border border-secondary/20">
|
|
<FileText className="w-5 h-5 mx-auto mb-2 text-secondary" />
|
|
<span className="text-muted-foreground">Blockchain</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Card>
|
|
);
|
|
}
|