React/Javascript checkbox working but not changing color(not showing)

i have react table and with checkboxes i want to take values and export them inside excel, everything works except when i click the checkbox, no color changing, just changing true/false state.. need help

here is the code

   
    const formApi = React.createRef();
   
    useEffect(() => {
        api.postAramaList(taarih).then(res => {
            setData(res.data);
        });
    }, []);

    **const setGazeteChecked = (item) => {
        const tempItem = Array.from(data).find(v => v === item);
        tempItem.secilenKayit = !tempItem.secilenKayit;
        
        let filtered = data.filter(v => v.secilenKayit);
        
        setSecilenler(JSON.parse(JSON.stringify(filtered)));
        console.log(item);**
    }

 
    return (
        <div className="mx-3 mx-md-5">
            <br />
            <div className="card">
                <h6 className="card-header text-left"> Basın Yayın Müdürlüğü Gazete Haberleri </h6>
                <div className="card text-center">                
            <br />
         
               < div className="button col-md-12">
                    <ReactHTMLTableToExcel
                    id="test-table-xls-button"
                    className="btn btn-primary btn-sm m-2 float-left"
                    table="table-to-xls"
                    filename="GazeteYayinExcelCiktisi"
                    sheet="tablexls"
                    buttonText="Excel Olarak İndir"/>
                </div>
    
                        <ReactTable data={data} pageSizeOptions={[60, 100, 100, 100, 200, 1000]} columns={[
                            {
                                
                                columns: [
                                    {
                                        width: 60,
                                        Cell: row => (
                                            <div className="col" >
                                               <label className="cb">
                                                    <input type="checkbox" checked={row.secilenKayit} onChange={() => setGazeteChecked(row.original)} />
                                                    <span className="checkmark"></span>
                                                </label>
                                            </div>
                                        ),
                                    },
                                    {
                                        Header: '',
                                        width: 100,
                                        Cell: row => (
                                            <div className="form-row text-left">
                                                <div className="col col-sm-1">
                                                    <button onClick={(e) => handleIncele(row.original)} className="btn btn-success btn-sm btn-center">Detay </button>
                                                </div>
                                            </div>

the problem is probably at const setGazeteChecked .