Initial import: property management SaaS + security hardening + admin dashboard
Property Management Network — Next.js 16 (App Router), Better Auth, Drizzle ORM over PostgreSQL, Stripe, OpenAI, Resend. Includes: - Security hardening: access-control/IDOR fixes, TLS-by-default DB layer, constant-time cron auth, strict security headers, atomic AI quota gating, HTML/email output encoding, demo-backdoor disabled in production. - Superadmin dashboard at /admin (overview/MRR, server-paginated users with ban/impersonate/plan/delete, billing, platform activity + admin audit log, AI usage, system health) via the Better Auth admin plugin. - Seed/migration utility scripts under scripts/. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Leon Serfaty
@@ -0,0 +1,156 @@
|
||||
"use client"
|
||||
|
||||
import { useState } from "react"
|
||||
import { useRouter } from "next/navigation"
|
||||
import { Zap, CheckCircle2, AlertCircle, ChevronLeft, ChevronRight, Users } from "lucide-react"
|
||||
import { formatCurrency } from "@/lib/utils"
|
||||
|
||||
function monthLabel(year: number, month: number) {
|
||||
return new Date(year, month, 1).toLocaleDateString("en-US", { month: "long", year: "numeric" })
|
||||
}
|
||||
|
||||
export function BulkGenerateForm({ leases }: { leases: any[] }) {
|
||||
const router = useRouter()
|
||||
const now = new Date()
|
||||
const [year, setYear] = useState(now.getFullYear())
|
||||
const [month, setMonth] = useState(now.getMonth())
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [result, setResult] = useState<{ created: number; skipped: number; message: string } | null>(null)
|
||||
const [error, setError] = useState("")
|
||||
|
||||
function prevMonth() {
|
||||
if (month === 0) { setMonth(11); setYear(y => y - 1) } else setMonth(m => m - 1)
|
||||
}
|
||||
function nextMonth() {
|
||||
if (month === 11) { setMonth(0); setYear(y => y + 1) } else setMonth(m => m + 1)
|
||||
}
|
||||
|
||||
const totalRent = leases.reduce((s, l) => s + Number(l.rent_amount), 0)
|
||||
|
||||
async function generate() {
|
||||
setLoading(true)
|
||||
setError("")
|
||||
setResult(null)
|
||||
const res = await fetch("/api/rent/generate", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ year, month }),
|
||||
})
|
||||
const data = await res.json()
|
||||
setLoading(false)
|
||||
if (!res.ok) { setError(data.error ?? "Something went wrong"); return }
|
||||
setResult(data)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-5">
|
||||
{/* Month picker */}
|
||||
<div className="rounded-2xl border border-white/[0.06] bg-[#16161f] p-5">
|
||||
<p className="text-xs font-medium uppercase tracking-wider text-white/30 mb-4">Select Month</p>
|
||||
<div className="flex items-center justify-center gap-4">
|
||||
<button onClick={prevMonth} className="flex h-9 w-9 items-center justify-center rounded-xl border border-white/[0.08] text-white/40 hover:text-white hover:border-white/20 transition">
|
||||
<ChevronLeft className="h-4 w-4" />
|
||||
</button>
|
||||
<span className="min-w-[180px] text-center text-lg font-bold text-white">
|
||||
{monthLabel(year, month)}
|
||||
</span>
|
||||
<button onClick={nextMonth} className="flex h-9 w-9 items-center justify-center rounded-xl border border-white/[0.08] text-white/40 hover:text-white hover:border-white/20 transition">
|
||||
<ChevronRight className="h-4 w-4" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Summary */}
|
||||
<div className="rounded-2xl border border-white/[0.06] bg-[#16161f] overflow-hidden">
|
||||
<div className="px-5 py-4 border-b border-white/[0.06] flex items-center justify-between">
|
||||
<div className="flex items-center gap-2">
|
||||
<Users className="h-4 w-4 text-indigo-400" />
|
||||
<p className="text-sm font-semibold text-white">Active Tenants ({leases.length})</p>
|
||||
</div>
|
||||
<p className="text-sm font-bold text-emerald-400">{formatCurrency(totalRent)}<span className="text-xs text-white/30">/mo total</span></p>
|
||||
</div>
|
||||
|
||||
{leases.length === 0 ? (
|
||||
<div className="py-10 text-center text-sm text-white/30">
|
||||
No active leases found. Add leases first.
|
||||
</div>
|
||||
) : (
|
||||
<div className="divide-y divide-white/[0.04]">
|
||||
{leases.map((l: any) => (
|
||||
<div key={l.id} className="flex items-center justify-between px-5 py-3">
|
||||
<div>
|
||||
<p className="text-sm font-medium text-white">
|
||||
{l.tenant?.first_name} {l.tenant?.last_name}
|
||||
</p>
|
||||
<p className="text-xs text-white/35">
|
||||
{l.property?.name}{l.unit ? ` · Unit ${l.unit.unit_number}` : ""}
|
||||
</p>
|
||||
</div>
|
||||
<p className="text-sm font-semibold text-white">{formatCurrency(l.rent_amount)}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Result */}
|
||||
{result && (
|
||||
<div className={`rounded-xl border px-4 py-3 flex items-start gap-3 ${
|
||||
result.created > 0
|
||||
? "border-emerald-500/20 bg-emerald-500/5"
|
||||
: "border-amber-500/20 bg-amber-500/5"
|
||||
}`}>
|
||||
<CheckCircle2 className={`h-5 w-5 shrink-0 mt-0.5 ${result.created > 0 ? "text-emerald-400" : "text-amber-400"}`} />
|
||||
<div>
|
||||
<p className={`text-sm font-semibold ${result.created > 0 ? "text-emerald-400" : "text-amber-400"}`}>
|
||||
{result.message}
|
||||
</p>
|
||||
{result.skipped > 0 && (
|
||||
<p className="text-xs text-white/40 mt-0.5">{result.skipped} already existed and were skipped.</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{error && (
|
||||
<div className="rounded-xl border border-red-500/20 bg-red-500/5 px-4 py-3 flex items-center gap-2">
|
||||
<AlertCircle className="h-4 w-4 text-red-400 shrink-0" />
|
||||
<p className="text-sm text-red-400">{error}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Actions */}
|
||||
<div className="flex gap-3">
|
||||
<button
|
||||
onClick={() => router.push("/rent")}
|
||||
className="rounded-xl border border-white/10 px-5 py-2.5 text-sm text-white/50 hover:text-white transition"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
onClick={generate}
|
||||
disabled={loading || leases.length === 0}
|
||||
className="flex-1 flex items-center justify-center gap-2 rounded-xl bg-indigo-600 px-5 py-2.5 text-sm font-semibold text-white hover:bg-indigo-500 disabled:opacity-50 transition hover:shadow-lg hover:shadow-indigo-500/25"
|
||||
>
|
||||
{loading ? (
|
||||
<span className="animate-pulse">Generating…</span>
|
||||
) : (
|
||||
<>
|
||||
<Zap className="h-4 w-4" />
|
||||
Generate {leases.length} Payment{leases.length !== 1 ? "s" : ""} for {monthLabel(year, month)}
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{(result?.created ?? 0) > 0 && (
|
||||
<button
|
||||
onClick={() => router.push("/rent")}
|
||||
className="w-full text-center text-sm text-indigo-400 hover:text-indigo-300 transition"
|
||||
>
|
||||
View Rent Tracker →
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user