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>

components/forms/unit-form.tsx

@@ -0,0 +1,127 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { toast } from "sonner"
+import { Select } from "@/components/ui/select"
+
+const statusOptions = [
+  { value: "vacant",      label: "Vacant" },
+  { value: "occupied",    label: "Occupied" },
+  { value: "maintenance", label: "Maintenance" },
+  { value: "unavailable", label: "Unavailable" },
+]
+
+interface UnitFormProps {
+  propertyId: string
+  onSuccess?: () => void
+}
+
+export function UnitForm({ propertyId, onSuccess }: UnitFormProps) {
+  const router = useRouter()
+  const [loading, setLoading] = useState(false)
+  const [status, setStatus] = useState("vacant")
+
+  async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
+    e.preventDefault()
+    setLoading(true)
+
+    const formData = new FormData(e.currentTarget)
+    const body = {
+      property_id:  propertyId,
+      unit_number:  formData.get("unit_number"),
+      bedrooms:     Number(formData.get("bedrooms") ?? 1),
+      bathrooms:    Number(formData.get("bathrooms") ?? 1),
+      sq_ft:        formData.get("sq_ft") ? Number(formData.get("sq_ft")) : undefined,
+      rent_amount:  Number(formData.get("rent_amount")),
+      status,
+      notes:        formData.get("notes") || undefined,
+    }
+
+    const res = await fetch("/api/units", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(body),
+    })
+
+    setLoading(false)
+
+    if (!res.ok) {
+      const data = await res.json()
+      toast.error(data?.error ?? "Failed to add unit")
+      return
+    }
+
+    toast.success("Unit added")
+    if (onSuccess) {
+      onSuccess()
+    } else {
+      router.push(`/properties/${propertyId}`)
+      router.refresh()
+    }
+  }
+
+  const inputClass = "w-full rounded-lg border border-white/10 bg-white/5 px-4 py-2.5 text-sm text-white placeholder:text-white/30 focus:outline-none focus:border-indigo-500/50 focus:ring-1 focus:ring-indigo-500"
+  const labelClass = "block text-sm font-medium text-white/70 mb-1.5"
+
+  return (
+    <form onSubmit={handleSubmit} className="space-y-5">
+      <div className="grid grid-cols-2 gap-4">
+        <div>
+          <label className={labelClass}>Unit Number *</label>
+          <input name="unit_number" required placeholder="e.g. 1A, 101" className={inputClass} />
+        </div>
+        <div>
+          <label className={labelClass}>Monthly Rent ($) *</label>
+          <input name="rent_amount" type="number" required min={0} step={0.01} placeholder="1500" className={inputClass} />
+        </div>
+      </div>
+
+      <div className="grid grid-cols-3 gap-4">
+        <div>
+          <label className={labelClass}>Bedrooms</label>
+          <input name="bedrooms" type="number" min={0} defaultValue={1} className={inputClass} />
+        </div>
+        <div>
+          <label className={labelClass}>Bathrooms</label>
+          <input name="bathrooms" type="number" min={0} step={0.5} defaultValue={1} className={inputClass} />
+        </div>
+        <div>
+          <label className={labelClass}>Sq Ft</label>
+          <input name="sq_ft" type="number" min={0} placeholder="Optional" className={inputClass} />
+        </div>
+      </div>
+
+      <div>
+        <label className={labelClass}>Status</label>
+        <Select
+          options={statusOptions}
+          value={status}
+          onChange={setStatus}
+        />
+      </div>
+
+      <div>
+        <label className={labelClass}>Notes</label>
+        <textarea name="notes" rows={3} placeholder="Optional notes..." className={`${inputClass} resize-none`} />
+      </div>
+
+      <div className="flex gap-3 pt-2">
+        <button
+          type="button"
+          onClick={() => router.back()}
+          className="flex-1 rounded-lg border border-white/10 py-2.5 text-sm text-white/60 hover:border-white/20 hover:text-white transition"
+        >
+          Cancel
+        </button>
+        <button
+          type="submit"
+          disabled={loading}
+          className="flex-1 rounded-lg bg-indigo-600 py-2.5 text-sm font-medium text-white hover:bg-indigo-500 transition disabled:opacity-50"
+        >
+          {loading ? "Adding…" : "Add Unit"}
+        </button>
+      </div>
+    </form>
+  )
+}