React navigation params passing too slow

Question

I am working on a screen which takes data through route.params.

const {
    prompt,
    isUpscaling,
    imageToBeUpscaled,
    useDefaultPrompts = true,
    isChallenge = false,
    challengeData = {},
    isCommunityPage,
  } = route.params;

When navigating to this page, the params first being passed are actually the previous values. However, upon saving the file(thereby updating the state) the expected params load in.

I am using the params' data in a focusEffect function:

 useFocusEffect(
    useCallback(() => {
      setIsLoading(true);
      setSafeAreaBackgroundColor("#1a1a1a");
      generateImage();
    }, [])
  );

However, the original data being passed to this function are the old values. In short, the values being used are the previous route.params value from an old screen and not the new ones being passed in. The new params are being passed in but (I'm assuming) are not loading before the useFocusEffect is called. This results in the function using old data rather than new data.

How can I have the route.params data be updated when used in the useFocusEffect function?