check ShowOnboarding

N3Mobile · May 28, 2024 · eac9738 · eac9738
1 parent d6caf42
commit eac9738
Showing 1 changed file with 76 additions and 3 deletions.
diff --git a/src/Navigation/index.tsx b/src/Navigation/index.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { StatusBar } from "react-native";
 import { NativeStackHeaderProps, createNativeStackNavigator } from "@react-navigation/native-stack";
 import { NavigationContainer, NavigationProp, NavigatorScreenParams } from "@react-navigation/native";
@@ -11,25 +11,47 @@ import { SignupContainer } from "@/Screens/Signup";
 import { TestContainer } from "@/Screens/Test";
 import { DefaultAppbar } from "./Appbar/DefaultAppbar";
 import { MainAppbar } from "./Appbar/MainAppbar";
-
+import { PasswordChangeContainer } from "@/Screens/PasswordChange";
+import { getItem } from "@/utils/asyncStorage";
 export type RootStackParamList = {
   [RootScreens.MAIN]: NavigatorScreenParams<BottomTabParamList>;
   [RootScreens.WELCOME]: undefined;
   [RootScreens.SETTINGS]: undefined;
   [RootScreens.LOGIN]: undefined;
   [RootScreens.SIGNUP]: undefined;
   [RootScreens.TEST]: undefined;
+  [RootScreens.PASSWORDCHANGE]: undefined;
 };
 export type StackNavigation = NavigationProp<RootStackParamList>;
 
 const RootStack = createNativeStackNavigator<RootStackParamList>();
 
 // @refresh reset
 const ApplicationNavigator = () => {
+  const [showOnboarding, setShowOnboarding] = useState<boolean | null>(null);
+
+  useEffect(() => {
+    checkIfAlreadyOnboarded();
+  }, []);
+
+  const checkIfAlreadyOnboarded = async () => {
+    let onboarding = await getItem('onboarding');
+    if (onboarding ==='1') {
+      // hide onboarding
+      setShowOnboarding(false);
+    } else {
+      // show onboarding
+      setShowOnboarding(true);
+    }
+  };
+  if (showOnboarding===null) return null;
+  if(showOnboarding) {
   return (
     <NavigationContainer>
       <StatusBar />
-      <RootStack.Navigator screenOptions={{ 
+      <RootStack.Navigator 
+      initialRouteName={RootScreens.WELCOME}
+      screenOptions={{ 
         header: (props) => <DefaultAppbar {...props} />,
       }}>
         <RootStack.Screen
@@ -62,9 +84,60 @@ const ApplicationNavigator = () => {
           name={RootScreens.TEST}
           component={TestContainer}
         />
+        <RootStack.Screen
+        name={RootScreens.PASSWORDCHANGE}
+        component={PasswordChangeContainer}
+      />
+      </RootStack.Navigator>
+    </NavigationContainer>
+  );
+}else{
+  return (
+    <NavigationContainer>
+      <StatusBar />
+      <RootStack.Navigator 
+      initialRouteName={RootScreens.LOGIN}
+      screenOptions={{ 
+        header: (props) => <DefaultAppbar {...props} />,
+      }}>
+        <RootStack.Screen
+          name={RootScreens.WELCOME}
+          component={WelcomeContainer}
+          options={{
+            headerShown: false
+          }}
+        />
+        <RootStack.Screen
+          name={RootScreens.MAIN}
+          component={MainNavigator}
+          options={{
+            header: (props) => <MainAppbar {...props} />
+          }}
+        />
+        <RootStack.Screen
+          name={RootScreens.SETTINGS}
+          component={SettingsContainer}
+        />
+        <RootStack.Screen
+          name={RootScreens.LOGIN}
+          component={LoginContainer}
+        />
+        <RootStack.Screen
+          name={RootScreens.SIGNUP}
+          component={SignupContainer}
+        />
+        <RootStack.Screen
+          name={RootScreens.TEST}
+          component={TestContainer}
+        />
+        <RootStack.Screen
+        name={RootScreens.PASSWORDCHANGE}
+        component={PasswordChangeContainer}
+      />
       </RootStack.Navigator>
     </NavigationContainer>
   );
+}
 };
 
 export { ApplicationNavigator };