attempt to gate

src/Navigation.tsx

@@ -40,7 +40,7 @@ import {
   type SearchTabNavigatorParams,
 } from '#/lib/routes/types'
 import {type RouteParams, type State} from '#/lib/routes/types'
-import {attachRouteToLogEvents, logEvent} from '#/lib/statsig/statsig'
+import {attachRouteToLogEvents, logEvent, useGate} from '#/lib/statsig/statsig'
 import {bskyTitle} from '#/lib/strings/headings'
 import {logger} from '#/logger'
 import {isNative, isWeb} from '#/platform/detection'
@@ -149,7 +149,6 @@ import {useNonReactiveCallback} from './lib/hooks/useNonReactiveCallback'
 import {useLoggedOutViewControls} from './state/shell/logged-out'
 import {useLoggedOutView} from './state/shell/logged-out'
 import {useCloseAllActiveElements} from './state/util'
-import {AuthModal} from './view/shell/desktop/AuthLayout'
 
 const navigationRef = createNavigationContainerRef<AllNavigatorParams>()
 
@@ -789,63 +788,68 @@ const FlatNavigator = () => {
  */
 export const NativeNavigator = () => {
   const t = useTheme()
+  const gate = useGate()
   const {hasSession} = useSession()
   const {showLoggedOut} = useLoggedOutView()
 
-  return (
-    <Core.Navigator screenOptions={screenOptions(t)}>
-      {hasSession && !showLoggedOut ? (
-        <Core.Screen
-          name="App"
-          getComponent={() => TabsNavigator}
-          options={{animation: 'fade', animationDuration: 200}}
-        />
-      ) : (
-        <>
+  if (gate('new_auth_flow')) {
+    return (
+      <Core.Navigator screenOptions={screenOptions(t)}>
+        {hasSession && !showLoggedOut ? (
           <Core.Screen
-            name="Landing"
-            getComponent={() => LandingScreen}
+            name="App"
+            getComponent={() => TabsNavigator}
             options={{animation: 'fade', animationDuration: 200}}
           />
-          <Core.Screen
-            name="StarterPackLanding"
-            getComponent={() => StarterPackLandingScreen}
-          />
-          <Core.Group>
+        ) : (
+          <>
             <Core.Screen
-              name="SelectAccount"
-              getComponent={() => SelectAccountScreen}
-            />
-            <Core.Screen name="SignIn" getComponent={() => SignInScreen} />
-            <Core.Screen
-              name="ForgotPassword"
-              getComponent={() => ForgotPasswordScreen}
+              name="Landing"
+              getComponent={() => LandingScreen}
+              options={{animation: 'fade', animationDuration: 200}}
             />
             <Core.Screen
-              name="SetNewPassword"
-              getComponent={() => SetNewPasswordScreen}
+              name="StarterPackLanding"
+              getComponent={() => StarterPackLandingScreen}
             />
-            <Core.Screen
-              name="PasswordUpdated"
-              getComponent={() => PasswordUpdatedScreen}
-            />
-            <Core.Screen
-              name="SignUpInfo"
-              getComponent={() => SignUpInfoScreen}
-            />
-            <Core.Screen
-              name="SignUpHandle"
-              getComponent={() => SignUpHandleScreen}
-            />
-            <Core.Screen
-              name="SignUpCaptcha"
-              getComponent={() => SignUpCaptchaScreen}
-            />
-          </Core.Group>
-        </>
-      )}
-    </Core.Navigator>
-  )
+            <Core.Group>
+              <Core.Screen
+                name="SelectAccount"
+                getComponent={() => SelectAccountScreen}
+              />
+              <Core.Screen name="SignIn" getComponent={() => SignInScreen} />
+              <Core.Screen
+                name="ForgotPassword"
+                getComponent={() => ForgotPasswordScreen}
+              />
+              <Core.Screen
+                name="SetNewPassword"
+                getComponent={() => SetNewPasswordScreen}
+              />
+              <Core.Screen
+                name="PasswordUpdated"
+                getComponent={() => PasswordUpdatedScreen}
+              />
+              <Core.Screen
+                name="SignUpInfo"
+                getComponent={() => SignUpInfoScreen}
+              />
+              <Core.Screen
+                name="SignUpHandle"
+                getComponent={() => SignUpHandleScreen}
+              />
+              <Core.Screen
+                name="SignUpCaptcha"
+                getComponent={() => SignUpCaptchaScreen}
+              />
+            </Core.Group>
+          </>
+        )}
+      </Core.Navigator>
+    )
+  } else {
+    return <TabsNavigator />
+  }
 }
 
 /**

src/lib/statsig/gates.ts

@@ -4,6 +4,7 @@ export type Gate =
   | 'debug_show_feedcontext'
   | 'debug_subscriptions'
   | 'explore_show_suggested_feeds'
+  | 'new_auth_flow'
   | 'old_postonboarding'
   | 'onboarding_add_video_feed'
   | 'post_threads_v2_unspecced'

src/view/shell/createNativeStackNavigatorWithAuth.tsx

@@ -27,6 +27,7 @@ import {
 
 import {PWI_ENABLED} from '#/lib/build-flags'
 import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
+import {useGate} from '#/lib/statsig/statsig'
 import {isWeb} from '#/platform/detection'
 import {useSession} from '#/state/session'
 import {useOnboardingState} from '#/state/shell'
@@ -34,6 +35,7 @@ import {
   useLoggedOutView,
   useLoggedOutViewControls,
 } from '#/state/shell/logged-out'
+import {LoggedOut} from '#/view/com/auth/LoggedOut'
 import {AuthenticationFlow} from '#/screens/Authentication/components/Flow'
 import {Deactivated} from '#/screens/Deactivated'
 import {Onboarding} from '#/screens/Onboarding'
@@ -112,9 +114,17 @@ function NativeStackNavigator({
   const {setShowLoggedOut} = useLoggedOutViewControls()
   const {isMobile} = useWebMediaQueries()
   const {leftNavMinimal} = useLayoutBreakpoints()
-  // Temp: use old system for web. TODO: unify
-  if (isWeb && !hasSession && (!PWI_ENABLED || activeRouteRequiresAuth)) {
-    return <AuthenticationFlow />
+  const gate = useGate()
+
+  if (!hasSession && (!PWI_ENABLED || activeRouteRequiresAuth)) {
+    if (gate('new_auth_flow')) {
+      // I don't like how we have to split it like this, would prefer something neater
+      if (isWeb) {
+        return <AuthenticationFlow />
+      }
+    } else {
+      return <LoggedOut />
+    }
   }
   if (hasSession && currentAccount?.signupQueued) {
     return <SignupQueued />
@@ -122,8 +132,14 @@ function NativeStackNavigator({
   if (hasSession && currentAccount?.status === 'takendown') {
     return <Takendown />
   }
-  if (isWeb && showLoggedOut) {
-    return <AuthenticationFlow onDismiss={() => setShowLoggedOut(false)} />
+  if (showLoggedOut) {
+    if (gate('new_auth_flow')) {
+      if (isWeb) {
+        return <AuthenticationFlow onDismiss={() => setShowLoggedOut(false)} />
+      }
+    } else {
+      return <LoggedOut onDismiss={() => setShowLoggedOut(false)} />
+    }
   }
   if (currentAccount?.status === 'deactivated') {
     return <Deactivated />