Как изменить чтобы менялось только у одного элемента по клику?

Question

[doooktooor]

Делаю чтобы пустой флаг становился закрашенным при клике на кнопку, в котором он находится, но сейчас у меня меняются сразу все, пробовал передавать id как ключ, картина все та же, сейчас код выглядит так

const [check, setCheck] = useState(false);
<td>
          <button
            onClick={() => {
              setCheck((prevCheck) => !prevCheck);
            }}
          >
            {Bookmark(check)}
          </button>
        </td>

const Bookmark = (status) => {
  if (status === false) {
    return <i className="bi bi-bookmark"></i>;
  } else if (status === true) {
    return <i className="bi bi-bookmark-fill"></i>;
  }
};

Comments

[Владимир]

Из вашего кода непонятно что такое "сразу все"
Из того что вы написали у вас один компонент Button в который вы передаете стейт, этот стейт по идее должен менятся по нажатию на кнопку, но вы впихнули в обработчик какоето говно

onClick={() => {
              setCheck((prevCheck) => !prevCheck);
            }}

Почитайте
https://reactjs.org/docs/hooks-state.html
Потрудитесь написать пример на https://codesandbox.io/dashboard