Push object in array when checkbox is checked and remove object when checkbox is unchecked in ReactJS

Question

I am trying to implement a functionality where I want to push object into an array when the user checked it and remove it if the user unselects it. I have a menu where I am collecting user choices. I have implemented code but it has not resolved my issue, Could someone please help me how to resolve this issue. Thanks

  const selectSingle = (id, item, index) => {
    const user = Cookies.get("user") && JSON.parse(Cookies.get("user"));
    let callScheduleIds = Object.assign([], allCallNotifications);

    if (callScheduleIds.findIndex((item) => item.order_id === id)) {
      callScheduleIds.push({
        order_id: id,
        phone_number: item.phone1,
        sender_id: user.user.id,
      });
    } else {
      callScheduleIds.splice(callScheduleIds.indexOf(id), 1);
    }
    setAllCallNotifications(callScheduleIds);
  };

Answer 1

You can do it by using Lodash.

 const selectSingle = (rowIndex, item) => {
    let callIds = Object.assign([], allCallNotifications)

    if (_.findIndex(callIds, { id: item.id }) === -1) {
      callIds.push(item)
    } else {
      callIds.splice(_.findIndex(callIds, { id: item.id }), 1)
    }

    setAllCallNotifications(callIds)
  }