React displaying message after submitting the form

Question

Trying to create a simple form and i am using semantic ui react. Problem is i can not display any message on the screen after form is submitted.

            <Form.TextArea
                required 
                label="Description"
                name="description"
                placeholder="Your description..."
                value={this.state.description}
                error={this.state.descriptionError}
                onChange={this.inputChange}
            />
            <Form.Button 
                fluid
                color="blue"
                disabled={
                    !this.state.term 
                    || !this.state.description
                }
            >Submit</Form.Button>

    {!this.state.formError
        ?
        <Message
            success
            header="Form completed"
            content="Thank you for your contribution."
        />
        :
        <Message
            error
            header="Missing fields!" 
            list={['All fields must be filled.']}
        />
    }
        </Form>

Edit: FormError part is here. Thanks for the replies. I will try them all

inputChange =  (e, {name, value}) => this.setState({[name]: value})

formSubmit = (e) => {
    e.preventDefault();
    let error = false;
    if(this.state.description.length < 10){
        this.setState({descriptionError: true})
        error=true
    }else{
        this.setState({descriptionError: false})
    }

    if(error){
        this.setState({formError: true})
        return
    }

    this.setState({formError: false})
}

Answer 1

Here is the working code link - https://codesandbox.io/s/semantic-ui-react-responsive-navbar-drvf7?fontsize=14

You can just update the state value to true or false and see the message it is working fine.

Also, use positive for success and negative for Error inside the <Message/> component