In React Native SetState isnt working in the initial rendering index.js even my functions giving desired output like true or false

this is what i m trying, in the functions of conrtrolFirstLaunch and getAuthentication i m getting the log of both data and auth but state isnt updating, i dont know why is this happening but before implementing first launch it worked fine

import React, { useState, useEffect } from "react";
import { isAuthenticated, firstTimeLaunch } from "Services/Auth";
import { Redirect } from "expo-router";

const Home = () => {
  const [authenticated, setAuthenticated] = useState(null);
  const [firstLaunch, setFirstLaunch] = useState(null);

  useEffect(() => {
    controlFirstLaunch();
    getAuthentication();
  }, [authenticated, fisrtLaunch]);

  const controlFirstLaunch = async () => {
    let data = await firstTimeLaunch();
    setFirstLaunch(data);
  };

  const getAuthentication = async () => {
    let auth = await isAuthenticated();
    // console.log(auth);
    setAuthenticated(auth);
  };
  if (firstLaunch) {
    return <Redirect href={"onBoarding"} />;
  } else if (authenticated) {
    return <Redirect href={"authStackTabs"} />;
  } else return <Redirect href={"unAuthStack"} />;
};

export default Home;

I have tried by using another state called isLoading and many other solution but nothing worked

>Solution :

The component renders then the effects run, so <Redirect href={"unAuthStack"} /> will be rendered and effected prior to the effects running and enqueueing any state updates.

Using a loading state and waiting for both side-effects to complete is likely what you need to do.

Example:

const Home = () => {
  const [isLoading, setIsLoading] = useState(true);

  const [authenticated, setAuthenticated] = useState(null);
  const [firstLaunch, setFirstLaunch] = useState(null);

  useEffect(() => {
    const loadData = async () => {
      try {
        // Wait for both calls to resolve
        const [data, auth] = await Promise.all([
          firstTimeLaunch(),
          isAuthenticated(),
        ]);

        setFirstLaunch(data);
        setAuthenticated(auth);
      } catch(error) {
        // handle/ignore any errors/rejections
      } finally {
        // then clear the loading state after success/failure
        setIsLoading(false);
      }
    };

    loadData();
  }, []); // <-- empty dependency, run once on component mount

  // Check if component is still loading data
  if (isLoading) {
    return null; // or loading indicator/spinner/etc
  }

  if (firstLaunch) {
    return <Redirect href={"onBoarding"} />;
  } else if (authenticated) {
    return <Redirect href={"authStackTabs"} />;
  }
  return <Redirect href={"unAuthStack"} />;
};