REACT- I don't see the event traceability when I select or check an option

I don't know why in my console log (f12) I'm not able to see the event when I click on Availabitlity, Trust (true if selected else false) or when I change the Taste or Comment to see the selection made in the console

I have in my console :

useEventListener.js:12 Uncaught TypeError: callbackRef.current is not a function
    at handler (useEventListener.js:12:1)
handler @ useEventListener.js:12

MenuItemDisplay.jsx :

export default function MenuItemDisplay() {
 
  const TASTE = [
    { label: "Good", value: "Good" },
  ...
  ];

  const COMMENTS = [
    { label: "0/4", value: "VeryBad" },
   ...
  ];

  function Checkbox({ value }) {
    const [checked, setChecked] = React.useState(true);

    return (
      <label>
        <input
          type="checkbox"
          defaultChecked={checked}
          onChange={() => setChecked(!checked)}
        />
        {value}
      </label>
    );
  }

  return (
    <>
      <h1>{item.name}</h1>
      <div>
        <div className="TextStyle">
          Taste
          <CustomDropdown
            style={styles.select}
            options={TASTE}
            defaultValue={TASTE.find((t) => t.label === item.taste)}
            styleSelect={colourStyles}
            isMulti={true}
          />
        </div>
        <div className="TextStyle">
          Comments
          <CustomDropdown
            style={styles.select}
            options={COMMENTS}
            defaultValue={COMMENTS.find((t) => t.label === item.comments)}
          />
        </div>
        <div className="TextStyle">
          Availability <Checkbox value={!!item.availability} />
        </div>
        <div className="TextStyle">
          Trust <Checkbox value={!!item.trust} />
        </div>           
    </>
  );
}

Here is my code