47 lines
1.3 KiB
TypeScript
47 lines
1.3 KiB
TypeScript
"use client";
|
|
|
|
import { useRouter } from "next/navigation";
|
|
import { useState, type FormEvent } from "react";
|
|
import { apiFetch, errorMessage } from "@/lib/client-api";
|
|
|
|
export function AddHolidayForm() {
|
|
const router = useRouter();
|
|
const [day, setDay] = useState("");
|
|
const [name, setName] = useState("");
|
|
const [error, setError] = useState("");
|
|
const [busy, setBusy] = useState(false);
|
|
|
|
async function submit(e: FormEvent) {
|
|
e.preventDefault();
|
|
setBusy(true);
|
|
setError("");
|
|
try {
|
|
await apiFetch("/holidays", { method: "POST", body: { day, name, source: "manual" } });
|
|
setDay("");
|
|
setName("");
|
|
router.refresh();
|
|
} catch (err) {
|
|
setError(errorMessage(err));
|
|
} finally {
|
|
setBusy(false);
|
|
}
|
|
}
|
|
|
|
return (
|
|
<form className="inline-form" onSubmit={submit}>
|
|
<label className="field">
|
|
<span>Data</span>
|
|
<input type="date" value={day} onChange={(e) => setDay(e.target.value)} required />
|
|
</label>
|
|
<label className="field">
|
|
<span>Nome</span>
|
|
<input value={name} onChange={(e) => setName(e.target.value)} maxLength={120} required />
|
|
</label>
|
|
<button className="btn primary" type="submit" disabled={busy}>
|
|
Cadastrar
|
|
</button>
|
|
{error && <p className="error-text">{error}</p>}
|
|
</form>
|
|
);
|
|
}
|