unchek checkbox with another button in react js

I'm learning Reactjs and trying to make my own multiple checkbox like the existing multiple checkbox packages, but I'm confused at the final stage to make the checkbox unchecked when I press the checkbox indicator button,

const ListProduct = () => {

    // Checkbox Handle
    const [checked, setChecked] = useState([]);

    // Add/Remove checked item from list
    const handleCheck = (event) => {
        var updatedList = [...checked];
        if (event.target.checked) {
        updatedList = [...checked, event.target.value];
        } else {
        updatedList.splice(checked.indexOf(event.target.value), 1);
        }
        setChecked(updatedList);
        
    };

    // Generate string of checked items
    const renderFilters  = () => {
        return checked.map((item) => {
            if (item.length >= 1){
                return (
                        <Badge className="filter-list-indikator" bg="secondary" key={item} onClick={handleCheck}>
                            {item}
                        </Badge>
                );
            } else {
                return null
            }
        })
    }

 

<div className="d-flex" key={1}>
      <input type="checkbox" onChange={handleCheck} value="3 Seater"/>
      <label>3 Seater</label>
</div>