В радиокомпоненте реакции JS, когда я нажимаю на одну радиокнопку, она выбирает другую радиокнопку в форме, но передает правильное значение.

Question

У меня есть форма реагирования с управляемым компонентом переключателя, но когда я нажимаю на один переключатель, он выбирает другой переключатель в форме, но отправляет правильное значение выбранной кнопки, я не знаю, в чем проблема с кодомне могли бы вы помочь мне.

вот компонент переключателя:

import React, {Component} from 'react';

const CheckboxOrRadioGroup = (props) => (
    <div className="form-group">
        <label className="form-label-radio">{props.title}</label>
        <div className="checkbox-group">
            <ul class="radioul">
            {props.options.map(opt => {
                return (
                  <li class="radioli" >

                        <input
                            id = {props.name}
                            name={props.name}
                            onChange={props.handleChange}
                            value={opt}
                            checked={ props.selectedOptions.indexOf(opt) > -1 }
                            type={props.type} /> <label for={opt} className="form-label-radio1" id={props.handleChange}>{opt}
                    </label>
                  </li>
                );
            })}
            </ul>
        </div>

    </div>
);

export default CheckboxOrRadioGroup;

вот элемент формы и действие:

     <CheckboxOrRadioGroup
                    title={'Enter a  amount'}
                    name={'AMOUNT2'}
                     type={'radio'}
                    options={this.state.AMOUNT2Options}
                    selectedOptions = { this.state.newUser.AMOUNT2}
                    handleChange={this.handleRadioSelection}
                />

  handleRadioSelection(e) {
        let value = e.target.value;
        let name = e.target.name;
        this.setState( prevState => ({ newUser :
                {...prevState.newUser, AMOUNT2: value
                }
        }), () => console.log(this.state.newUser)

        )
}