I want to make it mandatory to select the toggle button component.

[mutlueren]

I want to make it mandatory to mark the React toggle button component.
I created a component using React toggle button. There are two buttons in radio type, yes and no.

As in the example, when I press the complete button, I want to show a warning like the warning below.

I do not want the user to proceed on the form without selecting one of these two buttons. How can I do that? If the user does not check the buttons, I want the text Required below to appear.

My toggle button code sample

    return (
        <>
            <Row>
                <Col className='col-10'>
                    {question}
                </Col>
                <Col className='col-2'>
                    <ToggleButtonGroup name={formKey}
                                       type='radio'
                                       onChange={changeSelected}
                                       value={input.value}
                                       vertical={false} toggle>
                        <ToggleButton
                            className='btn-group'
                            key='1'
                            value={'true'}
                        >
                            Yes
                        </ToggleButton>
                        <p></p>
                        <ToggleButton
                            className='btn-group'
                            key='2'
                            value={'false'}
                        >
                            No
                        </ToggleButton>
                    </ToggleButtonGroup>
                </Col>
            </Row>
        </>
    )
}

My checkbox code sample

    return (
        <>
            <Row>
                <Col className='col-1'>

                        <Form.Check>
                            <Form.Check.Input required
                                              className='checkmark'
                                              name={formKey}
                                              onChange={(e) => changeSelected(e)}
                                              checked={input.value == "true"}/>
                            <Form.Control.Feedback type="invalid" >Required</Form.Control.Feedback>
                        </Form.Check>

                </Col>
                <Col className='col-11'>
                    <p>{question}</p>
                </Col>
            </Row>
        </>
    )

[taion]

You'll likely want to use a library that handles form state management. Take a look at either React-Formal or Formik. React-Bootstrap only deals with presentational concerns; form validation is out-of-scope here.