SetState not being triggered after first trigger in useEffect function

I have a relatively trivial issue

I have a list in my functional component that fetches data from an API, once the data is fetched I simply call

setState(myList);

This works perfectly fine, and my list is visible in the UI.

However when a user selects an item in a list, this calls another API, in which the parameter is the item selected. I do some back-end operation using a solidity smart contract (unrelated to the question I am asking) and the operation is successful. NOW, upon success I wish to simply update my list such that the user's selection is no longer present in the view

I simply do setState(myList.filter(e=>e != address) where address is the selection the user made, and e is an element in my list of addresses.

This does not do anything i.e (my code still thinks there are 3 addressses present when there should only be 2, ( I think my code is still registering the list once the FIRST API in the useEffect is called.

Here is my code `function Approvals(){

const[approvalsList, setApprovalsList] = useState([]);
const[noApprovals, setNoApprovals] = useState(false);

const publicAddress = localStorage.getItem("public_address");
const web3JSON = localStorage.getItem("web3");
const web3 = JSON.parse(web3JSON);
const finalArr = []

    useEffect(()=>{

        const result =  axios.get("http://localhost:3001/get-user",{params:{
                address:publicAddress
            }}).then((response) => {
            if(response.data.approved_users.length === 0){
                setNoApprovals(true)
            }
            const jsonArray = JSON.parse(response.data.approved_users)
            setApprovalsList(jsonArray);
        })
    })


let button;
if(noApprovals === false){
     button = <text>asd World</text>
}


const callSmartContract = async (address) => {
    const currentProvider = detectCurrentProvider();
    if (currentProvider) {
        await currentProvider.request({method: 'eth_requestAccounts'});
        const web3 = new Web3(currentProvider);
        const userAccount = await web3.eth.getAccounts();
        const account = userAccount[0].toString();
        const UserContract = new web3.eth.Contract(User.value,"0xEeA1fcb8280d3723d0930C5fB8281D93929D4e2f",{
            from:account
        })
        const result = await UserContract.methods.giveApproval(account,address).send().then(response => {
            alert("Success")
            const arr = approvalsList.filter(e=> e !== address);
            setApprovalsList(arr)

        })



    }
}


return(<div>
    <center style=>
        <h2>Please select which doctor you would like to approve.</h2>
    </center>
    <center style=>
        <Box style=>

            <List sx=>
                {approvalsList.map((item)=>{
                    return  <ListItemButton component="a" onClick={()=>callSmartContract(item)}>
                        <ListItemText primary={item} secondary={"Accept Approval Request"} >
                        </ListItemText>
                    </ListItemButton>;
                })}
            </List>
        </Box>
    </center>
    {noApprovals === true &&
        <center style=>
            <h2>You have no users to approve</h2>
        </center>
    }
</div>)

}`