Dingdong_app/navigation/GuideStackNavigator.js

import {
    createStackNavigator,
    CardStyleInterpolators,
} from "@react-navigation/stack";
import * as React from "react";
import { useModel } from "flooks";

import Guide1Screen from "../screens/Guide1Screen";
const GuideStack = createStackNavigator();

const config = {
    animation: "spring",
    config: {
        stiffness: 1000,
        damping: 500,
        mass: 3,
        overshootClamping: true,
        restDisplacementThreshold: 0.01,
        restSpeedThreshold: 0.01,
    },
};

export default function GuideStackNavigator() {
    const { guideStep } = useModel("userModel");
    const initial = React.useMemo(() => {
        if (guideStep == 0) {
            return "Guide1";
        } else {
            return "Guide1";
        }
    }, [guideStep]);

    return (
        <GuideStack.Navigator
            headerMode='none'
            screenOptions={{
                gestureEnabled: true,
                cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
            }}
            initialRouteName={initial}
        >
            <GuideStack.Screen name='Guide1' component={Guide1Screen} />
        </GuideStack.Navigator>
    );
}