"use client";

import { App, Form, Input, Modal, Select, Switch } from "antd";
import { useState } from "react";
import { createAuctionAccount } from "@/lib/api/auctions";
import type { CreateAuctionAccountInput } from "@/lib/api/auctions";
import { ApiError } from "@/lib/api/client";

export function AddAuctionAccountModal({
  open,
  supportedPlatforms,
  onClose,
  onCreated,
}: {
  open: boolean;
  supportedPlatforms: string[];
  onClose: () => void;
  onCreated: () => void;
}) {
  const { message } = App.useApp();
  const [form] = Form.useForm<CreateAuctionAccountInput>();
  const [isSubmitting, setIsSubmitting] = useState(false);

  async function handleSubmit(values: CreateAuctionAccountInput) {
    setIsSubmitting(true);
    try {
      await createAuctionAccount(values);
      message.success(`${values.label} added.`);
      form.resetFields();
      onCreated();
    } catch (err) {
      message.error(err instanceof ApiError ? err.message : "Couldn't add that auction account.");
    } finally {
      setIsSubmitting(false);
    }
  }

  return (
    <Modal
      title="Add Auction Account"
      open={open}
      onCancel={onClose}
      onOk={() => form.submit()}
      confirmLoading={isSubmitting}
      okText="Add account"
      className="dms_add_auction_account_modal"
    >
      <Form<CreateAuctionAccountInput>
        form={form}
        layout="vertical"
        onFinish={handleSubmit}
        initialValues={{ can_watch: true, can_bid: false, is_backorder: false }}
        className="dms_add_auction_account_form"
      >
        <Form.Item name="platform" label="Platform" rules={[{ required: true }]} className="dms_add_auction_account_platform_field">
          <Select options={supportedPlatforms.map((p) => ({ value: p, label: p }))} />
        </Form.Item>
        <Form.Item name="label" label="Label" rules={[{ required: true, message: "Give it a label" }]} className="dms_add_auction_account_label_field">
          <Input placeholder="GD-Auctions-01" autoFocus />
        </Form.Item>
        <Form.Item name="api_user" label="Account username" className="dms_add_auction_account_username_field">
          <Input />
        </Form.Item>
        <Form.Item name="api_key" label="Password / API key" className="dms_add_auction_account_api_key_field">
          <Input.Password />
        </Form.Item>
        <Form.Item name="can_watch" label="Can watch listings" valuePropName="checked" className="dms_add_auction_account_can_watch_field">
          <Switch />
        </Form.Item>
        <Form.Item name="can_bid" label="Can place bids" valuePropName="checked" className="dms_add_auction_account_can_bid_field">
          <Switch />
        </Form.Item>
        <Form.Item name="is_backorder" label="Backorder service" valuePropName="checked" className="dms_add_auction_account_backorder_field">
          <Switch />
        </Form.Item>
      </Form>
    </Modal>
  );
}