import type { Meta, StoryObj } from "@storybook/preact";
import { FormView } from "./FormView";
import type { RecordSpec, DataRow } from "@/types/spec";

const clientRec: RecordSpec = {
  name: "Clients", table: "clients", display: "name", required: ["name", "email"],
  fields: {
    name: { type: "text" },
    email: { type: "text" },
    company: { type: "text" },
    status: { type: "choice", choices: ["lead", "active", "churned"] },
    revenue: { type: "number", format: "currency", symbol: "$" },
    notes: { type: "text" },
  },
};

const dealRec: RecordSpec = {
  name: "Deals", table: "deals", display: "title", required: ["title"],
  fields: {
    title: { type: "text" },
    client: { type: "link", link: "clients" },
    value: { type: "number", format: "currency", symbol: "$" },
    stage: { type: "choice", choices: ["prospect", "proposal", "negotiation", "won", "lost"] },
  },
};

const clients: DataRow[] = [
  { id: "1", name: "Alice Chen" },
  { id: "2", name: "Bob Kumar" },
];

const meta: Meta<typeof FormView> = { title: "Views/FormView", component: FormView, parameters: { layout: "padded" } };
export default meta;
type Story = StoryObj<typeof FormView>;

export const NewClient: Story = {
  render: () => (
    <FormView
      page={{ name: "Add Clients", type: "form", record: "clients" }}
      rec={clientRec}
      allRecords={[clientRec]}
      allData={{ clients: [] }}
      tabName="Clients"
      onBack={() => {}}
      onSubmit={() => {}}
    />
  ),
};

export const NewDealWithFK: Story = {
  render: () => (
    <FormView
      page={{ name: "Add Deals", type: "form", record: "deals" }}
      rec={dealRec}
      allRecords={[clientRec, dealRec]}
      allData={{ clients, deals: [] }}
      tabName="Deals"
      onBack={() => {}}
      onSubmit={() => {}}
    />
  ),
};
