"use client";

import { useState } from "react";
import { useRouter } from "next/navigation";

export default function ContractForm() {
	const [form, setForm] = useState({
		contract_number: "",
		contract_name: "",
		customer_contract_number: "",
		customer: "",
		investor: "",
		date_signed: "",
		finish_date: "",
	});

	const router = useRouter();

	function handleChange(e) {
		setForm({ ...form, [e.target.name]: e.target.value });
	}

	async function handleSubmit(e) {
		e.preventDefault();

		console.log("Submitting form:", form);

		const res = await fetch("/api/contracts", {
			method: "POST",
			headers: { "Content-Type": "application/json" },
			body: JSON.stringify(form),
		});

		if (res.ok) {
			router.push("/projects"); // or /contracts if you plan a listing
		} else {
			alert(
				"Wystąpił błąd podczas dodawania umowy. Sprawdź dane i spróbuj ponownie."
			);
		}
	}

	return (
		<form onSubmit={handleSubmit} className="space-y-4">
			{[
				["contract_number", "Numer Umowy"],
				["contract_name", "Nazwa Umowy"],
				["customer_contract_number", "Numer Umowy (Klienta)"],
				["customer", "Zleceniodawca"],
				["investor", "Inwestor"],
				["date_signed", "Data zawarcia"],
				["finish_date", "Data zakończenia"],
			].map(([name, label]) => (
				<div key={name}>
					<label className="block font-medium">{label}</label>
					<input
						type={name.includes("date") ? "date" : "text"}
						name={name}
						value={form[name] || ""}
						onChange={handleChange}
						className="border p-2 w-full"
					/>
				</div>
			))}

			<button
				type="submit"
				className="bg-blue-600 text-white px-4 py-2 rounded"
			>
				Dodaj umowę
			</button>
		</form>
	);
}