35 lines
2.1 KiB
TypeScript
35 lines
2.1 KiB
TypeScript
|
import Link from "next/link"
|
||
|
|
import { Building2, Users, CreditCard, Wrench, FileText, Receipt, ArrowRight } from "lucide-react"
|
||
|
|
|
||
|
|
const ACTIONS = [
|
||
|
|
{ label: "Add Property", icon: Building2, href: "/properties/new", color: "text-indigo-400 bg-indigo-500/10 border-indigo-500/20 hover:bg-indigo-500/20 hover:border-indigo-500/40" },
|
||
|
|
{ label: "Add Tenant", icon: Users, href: "/tenants/new", color: "text-violet-400 bg-violet-500/10 border-violet-500/20 hover:bg-violet-500/20 hover:border-violet-500/40" },
|
||
|
|
{ label: "Record Payment", icon: CreditCard, href: "/rent", color: "text-emerald-400 bg-emerald-500/10 border-emerald-500/20 hover:bg-emerald-500/20 hover:border-emerald-500/40" },
|
||
|
|
{ label: "Log Expense", icon: Receipt, href: "/expenses", color: "text-amber-400 bg-amber-500/10 border-amber-500/20 hover:bg-amber-500/20 hover:border-amber-500/40" },
|
||
|
|
{ label: "New Lease", icon: FileText, href: "/leases/new", color: "text-blue-400 bg-blue-500/10 border-blue-500/20 hover:bg-blue-500/20 hover:border-blue-500/40" },
|
||
|
|
{ label: "New Request", icon: Wrench, href: "/maintenance/new", color: "text-rose-400 bg-rose-500/10 border-rose-500/20 hover:bg-rose-500/20 hover:border-rose-500/40" },
|
||
|
|
]
|
||
|
|
|
||
|
|
export function QuickActions() {
|
||
|
|
return (
|
||
|
|
<div className="rounded-2xl border border-white/[0.06] bg-[#16161f] p-5">
|
||
|
|
<div className="flex items-center justify-between mb-4">
|
||
|
|
<p className="text-xs font-medium uppercase tracking-wider text-white/40">Quick Actions</p>
|
||
|
|
</div>
|
||
|
|
<div className="grid grid-cols-2 gap-2">
|
||
|
|
{ACTIONS.map((action) => (
|
||
|
|
<Link
|
||
|
|
key={action.label}
|
||
|
|
href={action.href}
|
||
|
|
className={`group flex items-center gap-2.5 rounded-xl border px-3 py-2.5 transition-all duration-200 ${action.color}`}
|
||
|
|
>
|
||
|
|
<action.icon className="h-3.5 w-3.5 shrink-0" />
|
||
|
|
<span className="text-xs font-medium truncate">{action.label}</span>
|
||
|
|
<ArrowRight className="ml-auto h-3 w-3 opacity-0 group-hover:opacity-100 transition-opacity shrink-0" />
|
||
|
|
</Link>
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|