<Collapsible
  tabIndex={list.group_id}
  triggerSibling={
    <div>
      <span className="col-sm-3">{list.group_name}</span>
      <div id="buttons" className="col-sm-3 Collapsible__trigger-sibling">
        <button
          type="button"
          data-toggle="modal"
          data-target="#addRequirementModal"
          onClick={() => this.addRequirement(list.group_id)}
        >
          <MaterialIcon icon="add" size={14} />
        </button>
        <Link
          to={`/requirement/${list.group_id}`}
          id={list.group_id}
          style={{ color: 'white' }}
        >
          <MaterialIcon icon="visibility" size={14} />
        </Link>
        <button
          type="button"
          value={list.group_id}
          onClick={() => this.getGroupDetails(list.group_id)}
          data-toggle="modal"
          data-target="#editModal"
        >
          <MaterialIcon icon="edit" size={14} />
        </button>
        <button
          type="button"
          value={list.group_id}
          onClick={() => this.deleteGroup(list.group_id)}
        >
          <MaterialIcon icon="delete" size={14} />
        </button>
      </div>
    </div>
  }
  key={list.group_id}
/>