34 lines
1.1 KiB
TypeScript
34 lines
1.1 KiB
TypeScript
|
"use client"
|
||
|
|
|
||
|
|
import { useState } from "react"
|
||
|
|
import { Bell, Loader2 } from "lucide-react"
|
||
|
|
import { toast } from "sonner"
|
||
|
|
|
||
|
|
export function SendReminderButton({ tenantId, paymentId }: { tenantId: string; paymentId: string }) {
|
||
|
|
const [loading, setLoading] = useState(false)
|
||
|
|
|
||
|
|
async function send() {
|
||
|
|
setLoading(true)
|
||
|
|
const res = await fetch("/api/notifications", {
|
||
|
|
method: "POST",
|
||
|
|
headers: { "Content-Type": "application/json" },
|
||
|
|
body: JSON.stringify({ type: "rent_reminder", tenant_id: tenantId, payment_id: paymentId }),
|
||
|
|
})
|
||
|
|
setLoading(false)
|
||
|
|
if (res.ok) toast.success("Reminder sent")
|
||
|
|
else toast.error("Failed to send reminder")
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<button
|
||
|
|
onClick={send}
|
||
|
|
disabled={loading}
|
||
|
|
title="Send rent reminder"
|
||
|
|
className="flex h-7 items-center gap-1.5 rounded-md border border-white/10 px-2.5 text-xs text-white/50 transition hover:border-amber-500/30 hover:text-amber-400 disabled:opacity-40"
|
||
|
|
>
|
||
|
|
{loading ? <Loader2 className="h-3 w-3 animate-spin" /> : <Bell className="h-3 w-3" />}
|
||
|
|
Remind
|
||
|
|
</button>
|
||
|
|
)
|
||
|
|
}
|