Невозможно отобразить компонент формы antd внутри другого компонента

Question

Я создал простой компонент, который инкапсулирует формуляр antd внутри antd modal .Я хочу сделать следующий компонент внутри другого компонента.

 class MOCForm extends Component<FormComponentProps & mprops, mocFormState> {

    constructor(props) {
        super(props);

        this.state = {
        showMOCModal: false,
        confirmMOCLoading: false
        };
    }

    async saveNewMOC() {
        this.setState({
        confirmMOCLoading: true
        });

        this.props.form.validateFieldsAndScroll(async (err, values) => {
            if (!err) {
                await addMOC({
                name: values.new_moc
                });

                /**
                * After the data is saved, stop the loader
                */
                this.setState({
                    confirmMOCLoading: false,
                    showMOCModal: false
                });
            }
        });
    }

    closeMOCModal() {
        this.setState({
        showMOCModal: false
        });
    }

    render() {
        return (
        <Modal
            title="Create a New MOC"
            visible={this.state.showMOCModal}
            onOk={this.saveNewMOC}
            confirmLoading={this.state.confirmMOCLoading}
            onCancel={this.closeMOCModal}
        >
            <Form onSubmit={this.saveNewMOC}>
            <FormItem label="Name">
                {this.props.form.getFieldDecorator("new_moc", {
                rules: [
                    {
                    required: true,
                    message: "Please fill the name of this MOC to add"
                    }
                ]
                })(<Input />)}
            </FormItem>
            </Form>
        </Modal>
        );
    }
}

Чтобы отобразить вышеуказанный компонент формы, я сделал следующее внутри другого компонента:

    const modalForm = Form.create({})(MOCForm);

    .
    .
    render() {
       <modalForm />
    }

Но я получаю сообщение об ошибкеProperty 'modal' does not exist on type 'JSX.IntrinsicElements'.ts(2339) Я также попробовал следующее:

{modalForm}

, но затем я получаю другую ошибку, говорящую: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.

Как я могу отобразить вышеуказанный компонент внутри другого компонента?Что я делаю неправильно?