React native, setTimeout gives weird warning when called inside useEffect

Question

I ultimately want to display a modal to the user if a certain condition is met after X seconds of the app execution.

However, I keep getting a warning about setting a timer for a long period of time (a few minutes) on android, but my timer only has a few seconds.

const surveyCheckTime = 3000; // X = 3 seconds

const App = () => {
  // First Time Modal State
  const [surveyVisibility, setSurveyVisibility] = useState(false);
  const handleSurveyOpen = () => {
    setSurveyVisibility(true);
  };
  const handleSurveyClose = () => {
    setSurveyVisibility(false);
  };

  useEffect(() => {
    const timer = setTimeout(() => {
      console.log('0:FROM_APP: Checking for condition: ');
      getData().then(
        keyValue => {
          console.log('0:FROM_APP: Completion status: ', keyValue);
          if (keyValue === 'false' || keyValue === undefined) {
            handleSurveyOpen();
          }
        },
        error => {
          // console.log('Survery_Error: ', error);
        },
      );
    }, surveyCheckTime);

    return () => clearTimeout(timer);
  }, []);

  return (
      <View>
         ...
        <SurveyModal
          surveyVisibility={surveyVisibility}
          handleSurveyClose={handleSurveyClose}
        />
      </View>
  )

getData() is an async function returning keyValue as promise.

export const getData = async (myKey = 'alreadyOpened') => {
  try {
    const value = await AsyncStorage.getItem(`@${myKey}`);
    if (value !== null) {
      // value previously stored
      // console.log('FROM__getData: Stored previously: ', value);
      return value;
    }
  } catch (e) {
    // error reading value
    console.log('ERROR:FROM__getData: Cannot read: ', e);
    return 'fasle';
  }
};

All is good and everything works as intended but I keep getting this warning with a different last line everytime:

(Saw setTimeout with duration Y ms) Y is way higher than my X value

There is this question but it's not exactly firebase related in my case. (Although I do use firebase to fetch data inside another component but it shouldn't be the issue) IT IS THE ISSUE

I've looked into this, but most of the solutions either change the "node_modules" or disable the warning and the topic is pretty much outdated.

It would be best If there's a more efficient solution of handling timeouts.

EDIT: "firebase": "7.13.1" is what's causing the issue when fetching data

Answer 1

I was using a deprecated integration of firebase which was causing this issue, (web config and not .json file)