import ErrorMessage from "../ErrorMessage/ErrorMessage";
import BasicForm from "../Forms/BasicForm";
import { componentInputTypeToFormFieldType } from "./Utils";
import React, { useEffect, useRef, useState, } from "react";
const RunForm = (props) => {
    const formRef = useRef(null);
    const [component, setComponent] = useState(props.component);
    const [hasFormValidationErrors, setHasFormValidationErrors] = useState(false);
    useEffect(() => {
        props.onHasFormValidationErrors(hasFormValidationErrors);
    }, [hasFormValidationErrors]);
    useEffect(() => {
        props.onFormChange(component);
    }, [component]);
    return (React.createElement("div", { className: "mb-3 mt-3" },
        React.createElement("div", { className: "mt-5 mb-5" },
            React.createElement("h2", { className: "text-base font-medium text-gray-500" },
                "Run ",
                component.metadata.title),
            React.createElement("p", { className: "text-sm font-medium text-gray-400 mb-5" }, component.metadata.description),
            component.metadata.runWorkflowManuallyArguments &&
                component.metadata.runWorkflowManuallyArguments.length === 0 && (React.createElement(ErrorMessage, { message: 'This workflow trigger does not take any values. You can run it by clicking the "Run" button below.' })),
            component.metadata.runWorkflowManuallyArguments &&
                component.metadata.runWorkflowManuallyArguments.length > 0 && (React.createElement(BasicForm, { hideSubmitButton: true, ref: formRef, initialValues: Object.assign({}, (component.arguments || {})), onChange: (values) => {
                    setComponent(Object.assign(Object.assign({}, component), { arguments: Object.assign(Object.assign({}, (component.arguments || {})), (values || {})) }));
                }, onFormValidationErrorChanged: (hasError) => {
                    setHasFormValidationErrors(hasError);
                }, fields: component.metadata.runWorkflowManuallyArguments &&
                    component.metadata.runWorkflowManuallyArguments.map((argument) => {
                        return Object.assign({ title: `${argument.name}`, description: `${argument.required ? "Required" : "Optional"}. ${argument.description}`, field: {
                                [argument.id]: true,
                            }, required: argument.required, placeholder: argument.placeholder }, componentInputTypeToFormFieldType(argument.type, component.returnValues &&
                            component.returnValues[argument.id]
                            ? component.returnValues[argument.id]
                            : null));
                    }) })))));
};
export default RunForm;
//# sourceMappingURL=RunForm.js.map