I think the issue is you're using data.id to render but for the delete logic, you're using session.id

data.id should be session.id? as you're already using data to map, and have session as a key here:

{data.map((session) => {
...
<li key={data.id}> // typo? session.id*

I think this is the reason why you see changes in the backend, but changes aren't reflected in the front end

also to guarantee latest update, I would utilize with prevData based on the value of the old state of the component:

setData(prevData => prevData.filter(s => s.id !== session.id));