why Sometimes data comes in dropdown and sometimes it doesn't comes?

Question

why Sometimes data comes in dropdown and sometimes it doesn't comes?

dropdown's data comes on first time cloning, Sometimes it comes even after cloning for the second time. But when cloned for the third time, dropdown's doesn't get the options.

  render() {
    const { value, items, selectedOption, mode, open } = this.state;
    const { data, userPrivileges, handleClose, options } = this.props;
    //console.log('test',options);
    const topics = data.topics;
    const isDisabled = !userPrivileges.includes("Create_Note");
    const defaultOption = options.filter((x) => x.productId === data.productId);

i tried to console the value and i got clicking on 1st clone getting 2 array list, 2nd time clone getting 1 array list but clicking on 3rd time getting 3 or 4 array list, when getting 3 or 4 array list after that dropdown's doesn't get

 componentDidMount() {
    const defaultOption = this.props.options.find(
      (x) => x.productId === this.props.data.productId
    );
    this.setState({ selectedOption: defaultOption });
    const { productInfoUrl, takeovers, complements } = this.props.data;
    this.setState({
      link: productInfoUrl,
      takeovers: takeovers,
      complements: complements,
    });
  }

export default connect(
  (state, props) => {
    const topics = props.data.topics;
    const items = topics.reduce((x, y) => {
      return { ...x, [y.title]: y };
    }, {});
    const dataGrid = state.dataGrid.dataGrid;
    const options = dataGrid.map((arrayItem) => {
      console.log()
      return {
        ...arrayItem,
        label: arrayItem.productName,
        value: arrayItem.productName,
      };
    });

                <StyledSelect
                  components={{ MenuList }}
                  options={options}
                  onChange={this.handleSelect}
                  defaultValue={defaultOption}
                  placeholder="Search for product"
                  filterOption={({ label }, query) =>
                    label.toLowerCase().indexOf(query.toLowerCase()) >= 0 &&
                    i++ < resultLimit
                  }
                  onInputChange={() => {
                    i = 0;
                  }}
                />

i tried to console the value and i got clicking on 1st clone getting 2 array list, 2nd time clone getting 1 array list but clicking on 3rd time getting 3 or 4 array list, when getting 3 or 4 array list after that dropdown's doesn't get

Whenever we clone, there should be an option in dropdown