авил новую пользовательскую КАРТУ со знаком плюс. Я сделал дополнительные карты, которые отображают имя пользователя на каждой карте. Карты с именем пользователя отображаются с помощью.map() метод. Теперь, если я вставлю код части 1 (см. Ниже) внутри.map() Функция затем отображает несколько добавить новую карточку пользователя. Моя конечная цель - показать одну добавленную новую карточку пользователя и использовать.map() отобразить остальные карты.

Код части 1:

<div className="item-card add" onClick = {this.addUser} >
  <img src={require("../../images/plus.svg")} className="plus-icon"/>
  <div className="lbl">Add a new User</div>
</div>

Если я вставлю выше код внутри.map() он отображает несколько добавить новую карточку пользователя.

Где я должен вставить код части 1 внутриdisplayUsers() метод?

displayUsers() {
  return this.state.userList.map(user => {
    return (
      <div className="item-card">
        <div className="info">
          <div className="username">Username: {user.userName}</div>
        </div>
        <div className="del-wrap">
          <img src={require('../../images/cancel.svg')} />
        </div>
      </div>
    );
  });
}