"use client";

import { z } from "zod";
import { CrudPage } from "@/components/crud-page";
import { Customer } from "@/lib/api";

const schema = z.object({
  customer_type: z.enum(["practice", "clinic"]),
  name: z.string().min(2),
  street: z.string().optional().nullable(),
  postal_code: z.string().optional().nullable(),
  city: z.string().optional().nullable(),
  phone: z.string().optional().nullable(),
  email: z.union([z.string().email(), z.literal(""), z.null()]).optional(),
  hygiene_officer: z.string().optional().nullable(),
  quality_manager: z.string().optional().nullable(),
  notes: z.string().optional().nullable()
});

export default function CustomersPage() {
  return (
    <CrudPage<Customer>
      title="Kunden"
      subtitle="Praxen und Kliniken mit Kontakt- und Qualitaetsdaten."
      endpoint="/customers"
      columns={[
        { key: "name", label: "Name" },
        { key: "customer_type", label: "Typ" },
        { key: "city", label: "Ort" },
        { key: "phone", label: "Telefon" },
        { key: "email", label: "Mail" }
      ]}
      fields={[
        { name: "customer_type", label: "Typ", type: "select", options: [{ label: "Praxis", value: "practice" }, { label: "Klinik", value: "clinic" }] },
        { name: "name", label: "Name", required: true },
        { name: "street", label: "Adresse" },
        { name: "postal_code", label: "PLZ" },
        { name: "city", label: "Ort" },
        { name: "phone", label: "Telefon" },
        { name: "email", label: "Mail", type: "email" },
        { name: "hygiene_officer", label: "Hygienebeauftragter" },
        { name: "quality_manager", label: "QM" },
        { name: "notes", label: "Bemerkungen", type: "textarea" }
      ]}
      schema={schema}
      emptyValues={{ customer_type: "practice", name: "", street: "", postal_code: "", city: "", phone: "", email: "", hygiene_officer: "", quality_manager: "", notes: "" }}
    />
  );
}

