Trouble re-rendering flatlist in functional component using extraData

I'm struggling to re-render a flatlist. I'm trying to use a boolean refreshToggle, that is fed into extraData, that is changed after the desired information is successfully fetched. The code below successfully fetches the data and changes the boolean (so changing to functional updates for the state, while perhaps better practice, doesn't seem like a solution) (I've checked that this is happening with various logs etc), but the flatlist doesn't re-render.

export default function transactions({ navigation }: { navigation: any }) {    const [paymentsBtnActive, setPaymentsBtnActive] = React.useState<boolean>(navigation.getParam('Pressed') == 'Payments');    const [requestsBtnActive, setRequestsBtnActive] = React.useState<boolean>(navigation.getParam('Pressed') == 'Requests');    const [refreshToggle, setRefreshToggle] = React.useState<boolean>(false);    let data: any[] = [];    async function getRequests() {        const body = { 'phone': GLOBAL.userInfo['phone']        }        const options = {            method: 'POST',            headers: { 'Content-Type': 'application/json'},            body: JSON.stringify(body)        }        let requests =  await fetch('http://3ef68e9c1352.ngrok.io/requests/user', options);        let requestsJSON = await requests.json();        data = requestsJSON['data'];    }        function renderItem(item: any) {        return (<Text>{item['item']['data']['date']}</Text>)    }    function listEmpty(){        return (<Text>Loading</Text>)    }    useEffect(() => {        (async function () {            await getRequests();            setRefreshToggle(!refreshToggle)        })()    }, [])    return (<SafeAreaView style = {styles.container}><View style = {{flexDirection: 'row', justifyContent: 'center'}}><TouchableOpacity style = { paymentsBtnActive ? styles.paymentsBtnActive : styles.paymentsBtnInactive } onPress = { () => { setRequestsBtnActive(paymentsBtnActive)                     setPaymentsBtnActive(!paymentsBtnActive) } } ><Text style = { paymentsBtnActive ? styles.whiteText : styles.redText }>Payments</Text></TouchableOpacity><TouchableOpacity style = { requestsBtnActive ? styles.requestsBtnActive : styles.requestsBtnInactive } onPress = { () => { setPaymentsBtnActive(requestsBtnActive)                    setRequestsBtnActive(!requestsBtnActive) } }  ><Text style = { requestsBtnActive ? styles.whiteText : styles.redText }>Requests</Text></TouchableOpacity></View><View style = {styles.summaryView}><FlatList                     data={data}                     renderItem={renderItem}                     ListEmptyComponent = {listEmpty}                    extraData = {refreshToggle}                /></View></SafeAreaView>    );