import React from "react";
import { Create, useForm } from "@refinedev/antd";
import { Form, Input } from "antd";
import { useTranslation } from "react-i18next";
import { DrawioEditor } from "@cundi/refine-xaf";

export const DrawioTestCreate: React.FC = () => {
    const { t } = useTranslation();
    const { formProps, saveButtonProps } = useForm();

    return (
        <Create saveButtonProps={saveButtonProps}>
            <Form {...formProps} layout="vertical">
                <Form.Item
                    label={t("drawioTest.name")}
                    name="Name"
                    rules={[{ required: true }]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    label={t("drawioTest.xmlContent")}
                    name="XmlContent"
                    trigger="onChange"
                    validateTrigger="onBlur"
                >
                    <DrawioEditor height={600} />
                </Form.Item>
            </Form>
        </Create>
    );
};
