Предотвращение дублирования объектов, добавляемых в серверную часть Firebase

Question

У меня есть вопрос относительно предотвращения добавления дубликатов в корзину
при использовании firebase в качестве внутреннего.

Это должно быть прямо, но по какой-то причине, я ничего не пытаюсь работать.

    const { products } = this.props;

    return (
      <div>
        {products === undefined ? (
          <p>Loading......</p>
        ) : (
          products.map(val => {
            return (
              <div key={val.id} className="row">
                <div className="col-sm-6">
                  <div className="card-body">
                    <img src={val.url} className="img-fluid" alt="Responsive" />
                    <h5 className="card-title">{val.name}</h5>
                    <h6 className="card-subtitle mb-2 text-muted">
                      {val.price}
                    </h6>
                    <button
                      className=" "
                      style={{
                        float: "right",
                        marginBottom: "1px",
                        width: "100%"
                      }}
                      onClick={() => this.submit(val)}
                    >
                      <i className="fas fa-cart-plus" />
                    </button>
                  </div>
                </div>
              </div>
            );
          })
        )}
      </div>
    );