Files
property-management-network/components/forms/maintenance-status-updater.tsx
T
Leon SerfatyandClaude Opus 4.8 857b9a7811 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>
2026-06-23 20:36:07 -04:00

91 lines
3.5 KiB
TypeScript

"use client"
import { useState } from "react"
import { useRouter } from "next/navigation"
import { toast } from "sonner"
const STATUSES = [
{ value: "open", label: "Open", color: "border-amber-500/30 text-amber-400 hover:bg-amber-500/10" },
{ value: "in_progress", label: "In Progress", color: "border-blue-500/30 text-blue-400 hover:bg-blue-500/10" },
{ value: "resolved", label: "Resolved", color: "border-emerald-500/30 text-emerald-400 hover:bg-emerald-500/10" },
{ value: "closed", label: "Closed", color: "border-white/10 text-white/40 hover:bg-white/5" },
]
export function MaintenanceStatusUpdater({ request }: { request: any }) {
const router = useRouter()
const [loading, setLoading] = useState(false)
const [resolutionNotes, setResolutionNotes] = useState(request.resolution_notes ?? "")
const [actualCost, setActualCost] = useState(request.actual_cost ?? "")
async function updateStatus(status: string) {
setLoading(true)
await fetch(`/api/maintenance/${request.id}`, {
method: "PATCH",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
status,
resolution_notes: resolutionNotes || undefined,
actual_cost: actualCost ? Number(actualCost) : undefined,
}),
})
setLoading(false)
toast.success("Status updated")
router.refresh()
}
return (
<div className="rounded-xl border border-white/[0.06] bg-[#16161f] p-5 space-y-4">
<h3 className="text-xs font-medium uppercase tracking-wider text-white/30">Update Status</h3>
<div className="flex gap-2 flex-wrap">
{STATUSES.map((s) => (
<button
key={s.value}
onClick={() => updateStatus(s.value)}
disabled={loading || request.status === s.value}
className={`rounded-lg border px-3 py-1.5 text-xs font-medium transition disabled:opacity-40 ${
request.status === s.value
? "opacity-40 cursor-default"
: s.color
}`}
>
{s.label}
</button>
))}
</div>
<div>
<label className="mb-1.5 block text-xs font-medium text-white/50">Resolution Notes</label>
<textarea
rows={3}
value={resolutionNotes}
onChange={(e) => setResolutionNotes(e.target.value)}
placeholder="Describe what was done to resolve the issue..."
className="w-full rounded-lg border border-white/10 bg-white/5 px-4 py-2.5 text-sm text-white placeholder-white/30 outline-none ring-indigo-500 transition focus:border-indigo-500/50 focus:ring-1 resize-none"
/>
</div>
<div>
<label className="mb-1.5 block text-xs font-medium text-white/50">Actual Cost ($)</label>
<input
type="number"
step="0.01"
min="0"
value={actualCost}
onChange={(e) => setActualCost(e.target.value)}
placeholder="0.00"
className="w-full rounded-lg border border-white/10 bg-white/5 px-4 py-2.5 text-sm text-white placeholder-white/30 outline-none ring-indigo-500 transition focus:border-indigo-500/50 focus:ring-1"
/>
</div>
<button
onClick={() => updateStatus(request.status)}
disabled={loading}
className="w-full rounded-lg bg-indigo-600 py-2 text-sm font-medium text-white hover:bg-indigo-500 disabled:opacity-50 transition"
>
{loading ? "Saving..." : "Save Notes"}
</button>
</div>
)
}