Не корректно работает Поиск на React

вопрос заключается в следующем: Поиск сам по себе работает но не корректно, а именно ищет карточки совершенно неясным способом ниже я представляю код, и фото как это работает.

   const onChangeSearchInput = (event) => {
   setsearchValue(event.target.value);
   };

  return (
    <div className="wrapper clear">
      {cartOpened && (
        <Drawer items={cartItems} onClose={() => setCartOpened(false)} />
      )}
      <Header onClickCart={() => setCartOpened(true)} />
      <div className="content p-40">
        <div className="d-flex align-center mb-40 justify-between">
          <h1>
            {searchValue
              ? `Поиск по запросу: '${searchValue}'`
              : "Все кроссовки"}
          </h1>
          <div className="search-block d-flex">
            <img src="/img/search.svg" alt="#"></img>
            {searchValue && (
              <img
                onClick={() => setsearchValue('')}
                className="clear cu-p"
                src="/img/btn-close.svg"
                alt="clear"
              />
            )}
            <input
              onChange={onChangeSearchInput}
              value={searchValue}
              placeholder="Поиск..."
            />
          </div>
        </div>

Img указывает коротко как работает код Клик