"use client";

import { App, Form, Input, Modal, Select } from "antd";
import { useState } from "react";
import { createServerAccount } from "@/lib/api/servers";
import { ApiError } from "@/lib/api/client";
import type { CreateServerAccountInput } from "@/lib/api/servers";

const WORKLOAD_OPTIONS = [
  { value: "static", label: "Static" },
  { value: "wordpress", label: "WordPress" },
];

export function AddServerAccountModal({
  open,
  serverGroupId,
  onClose,
  onCreated,
}: {
  open: boolean;
  serverGroupId: number | null;
  onClose: () => void;
  onCreated: () => void;
}) {
  const { message } = App.useApp();
  const [form] = Form.useForm<Omit<CreateServerAccountInput, "server_group_id">>();
  const [isSubmitting, setIsSubmitting] = useState(false);

  async function handleSubmit(values: Omit<CreateServerAccountInput, "server_group_id">) {
    if (!serverGroupId) return;
    setIsSubmitting(true);
    try {
      await createServerAccount({ ...values, server_group_id: serverGroupId });
      message.success(`${values.username} added.`);
      form.resetFields();
      onCreated();
    } catch (err) {
      message.error(err instanceof ApiError ? err.message : "Couldn't add that account.");
    } finally {
      setIsSubmitting(false);
    }
  }

  return (
    <Modal
      title="Add cPanel Account"
      open={open}
      onCancel={onClose}
      onOk={() => form.submit()}
      confirmLoading={isSubmitting}
      okText="Add account"
      className="dms_server_account_modal"
    >
      <Form
        form={form}
        layout="vertical"
        onFinish={handleSubmit}
        initialValues={{ workload_type: "static" }}
        className="dms_server_account_form"
      >
        <Form.Item
          name="username"
          label="cPanel username"
          rules={[{ required: true, message: "Enter a username" }]}
          className="dms_server_account_username_field"
        >
          <Input autoFocus />
        </Form.Item>
        <Form.Item name="workload_type" label="Workload type" rules={[{ required: true }]} className="dms_server_account_workload_field">
          <Select options={WORKLOAD_OPTIONS} />
        </Form.Item>
      </Form>
    </Modal>
  );
}