Всем привет помогите или подскажите, что не так, пожалуйста Есть такой

Question

Всем привет помогите или подскажите, что не так, пожалуйста Есть такой

кусок кода:
const [statePhones, setStatePhone] = useState(statePhonesObject);
const handleChangeSize = (e) => {
const choosedSizeID = Number(e.target.id);
let newStatePhones = statePhones;
const _phone = newStatePhones[choosedSizeID].phone;
const _isActive = newStatePhones[choosedSizeID].isActive;

newStatePhones[choosedSizeID] = { id: Number(choosedSizeID), phone: _phone, isActive: !_isActive }

setStatePhone(newStatePhones)
}
и сам рендер:
<ul className="phones-list" onClick={(e) => handleChangeSize(e)}>
{phoneSizeList.map((phone, index) => (
<div className="phone-block" key={index} id={index}>
{statePhones[index].isActive ? <CircleOptionChoose id={index} /> : <CircleOptionEmpty id={index} />}
<li id={index}>{phone}</li>
</div>
))}
</ul>
Проблема в том, что в хендлере все ок, получаю айди, меняю стейт
но перерисовка не происходит
Не подскажете из-за чего это может быть ?
Ошибки вроде нет