React Native 'Can't perform a React state update on an unmounted component'

Question

I am new to React native (and React) and I keep getting the below error whenever 'closeModal' is triggered:

'Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.'

import { View, ScrollView } from 'react-native'
import DealCard from './DealCard'
import { useDispatch, useSelector } from 'react-redux';
import DealModal from './DealModal';
import React, { useState } from 'react'

export default function DealContainer() {
  const dealData = useSelector(state => state.dealsReducer);

  const [modalVisible, setModalVisible] = useState(false);
  const [selectedDeal, setSelectedDeal] = useState(null);
  
  const openModal = () => setModalVisible(true);
  const closeModal = () => {
    console.log("modal closed!");
    setModalVisible(false);
    setSelectedDeal(null);
  }
  const onDealPress = (id) => {
    console.log("deal pressed!");
    var selectedDeal = dealData.deals.filter((x) => x.id == id)[0];
    
    setSelectedDeal(selectedDeal);
    openModal();
  }


  return (
    <View>
      <ScrollView>
                {
        dealData.deals.map((deal, i) => (
           <DealCard key={`${deal}_${i}`} deal={deal} onPress={(id) => onDealPress(id)}></DealCard>
        ))
      }
      </ScrollView>

      
        <DealModal visible={modalVisible} deal={selectedDeal} onClose={closeModal} ></DealModal>
      
     
    </View>
  )
}

What am I doing wrong? All I need to do is set the object from 'DealData' with the matching id to 'selectedDeal' and pass that into <DealModal>