fix: navigation methods

packages/mobile/src/RootNavigation.ts

@@ -17,3 +17,10 @@ export const replaceScreen = <Params extends Record<string, unknown>>(screen: Sc
     navigationRef.dispatch(StackActions.replace(screen, params))
   }
 }
+
+export const pop = (): void => {
+  if (navigationRef.isReady()) {
+    // @ts-ignore
+    navigationRef.dispatch(StackActions.pop())
+  }
+}

packages/mobile/src/screens/ChannelList/ChannelList.screen.tsx

@@ -23,20 +23,20 @@ export const ChannelListScreen: FC = () => {
   useEffect(() => {
     if (usernameTaken) {
       dispatch(
-        navigationActions.replaceScreen({
+        navigationActions.navigation({
           screen: ScreenNames.UsernameTakenScreen,
         })
       )
     }
 
     if (duplicateCerts) {
       dispatch(
-        navigationActions.replaceScreen({
+        navigationActions.navigation({
           screen: ScreenNames.PossibleImpersonationAttackScreen,
         })
       )
     }
-  }, [dispatch, usernameTaken, duplicateCerts])
+  }, [dispatch, duplicateCerts])
 
   const redirect = useCallback(
     (id: string) => {

packages/mobile/src/screens/UsernameTaken/UsernameTaken.screen.tsx

@@ -9,16 +9,18 @@ import { navigationActions } from '../../store/navigation/navigation.slice'
 
 const UsernameTakenScreen: React.FC<UsernameTakenScreenProps> = () => {
   const dispatch = useDispatch()
+
   const currentIdentity = useSelector(identity.selectors.currentIdentity)
+
   const usernameRegistered = currentIdentity?.userCertificate != null
-  const error = useSelector(errors.selectors.registrarErrors)
+
   const registeredUsers = useSelector(users.selectors.certificatesMapping)
+
+  const error = useSelector(errors.selectors.registrarErrors)
 
   const handleBackButton = useCallback(() => {
     dispatch(
-      navigationActions.replaceScreen({
-        screen: ScreenNames.ChannelListScreen,
-      })
+      navigationActions.pop()
     )
   }, [dispatch])
 

packages/mobile/src/store/nativeServices/showNotification/showNotification.saga.test.ts

@@ -129,7 +129,7 @@ describe('showNotificationSaga', () => {
           },
           [StoreKeys.Navigation]: {
             ...new NavigationState(),
-            currentScreen: ScreenNames.ChannelScreen,
+            backStack: [ScreenNames.ChannelScreen],
           },
         }
       )
@@ -174,7 +174,7 @@ describe('showNotificationSaga', () => {
           },
           [StoreKeys.Navigation]: {
             ...new NavigationState(),
-            currentScreen: ScreenNames.ChannelScreen,
+            backStack: [ScreenNames.ChannelScreen],
           },
         }
       )
@@ -213,7 +213,7 @@ describe('showNotificationSaga', () => {
           },
           [StoreKeys.Navigation]: {
             ...new NavigationState(),
-            currentScreen: ScreenNames.ChannelScreen,
+            backStack: [ScreenNames.ChannelScreen],
           },
         }
       )

packages/mobile/src/store/navigation/navigation.master.saga.ts

@@ -3,11 +3,13 @@ import { navigationActions } from './navigation.slice'
 import { redirectionSaga } from './redirection/redirection.saga'
 import { navigationSaga } from './navigation/navigation.saga'
 import { replaceScreenSaga } from './replaceScreen/replaceScreen.saga'
+import { popSaga } from './pop/pop.saga'
 
 export function* navigationMasterSaga(): Generator {
   yield all([
     takeEvery(navigationActions.redirection.type, redirectionSaga),
     takeEvery(navigationActions.navigation.type, navigationSaga),
     takeEvery(navigationActions.replaceScreen.type, replaceScreenSaga),
+    takeEvery(navigationActions.pop.type, popSaga),
   ])
 }

packages/mobile/src/store/navigation/navigation.selectors.ts

@@ -5,7 +5,7 @@ import { CreatedSelectors, StoreState } from '../store.types'
 
 const navigationSlice: CreatedSelectors[StoreKeys.Navigation] = (state: StoreState) => state[StoreKeys.Navigation]
 
-export const currentScreen = createSelector(navigationSlice, reducerState => reducerState.currentScreen)
+export const currentScreen = createSelector(navigationSlice, reducerState => reducerState.backStack.slice(-1)[0])
 
 export const contextMenuVisibility = (menu: MenuName) =>
   createSelector(navigationSlice, reducerState => {

packages/mobile/src/store/navigation/navigation.slice.ts

@@ -4,7 +4,9 @@ import { ScreenNames } from '../../const/ScreenNames.enum'
 import { MenuName } from '../../const/MenuNames.enum'
 
 export class NavigationState {
-  public currentScreen: ScreenNames = ScreenNames.SplashScreen
+  public backStack: ScreenNames[] = [
+    ScreenNames.SplashScreen
+  ]
   public confirmationBox: ConfirmationBox = {
     open: false,
     args: {},
@@ -53,16 +55,19 @@ export const navigationSlice = createSlice({
     redirection: state => state,
     navigation: (state, action: PayloadAction<NavigationPayload>) => {
       const { screen } = action.payload
-      state.currentScreen = screen
+      state.backStack.push(screen)
     },
     // Replace screen overrides last screen in backstack
     replaceScreen: (state, action: PayloadAction<NavigationPayload>) => {
       const { screen } = action.payload
-      state.currentScreen = screen
+      state.backStack.pop()
+      state.backStack.push(screen)
+    },
+    pop: (state) => {
+      state.backStack.pop()
     },
     setPendingNavigation: (state, action: PayloadAction<PendingNavigationPayload>) => {
       const { screen } = action.payload
-      state.currentScreen = screen
       state.pendingNavigation = screen
     },
     clearPendingNavigation: state => {

packages/mobile/src/store/navigation/pop/pop.saga.ts

@@ -0,0 +1,10 @@
+import { PayloadAction } from '@reduxjs/toolkit'
+import { call } from 'typed-redux-saga'
+import { navigationActions } from '../navigation.slice'
+import { pop } from '../../../RootNavigation'
+
+export function* popSaga(
+  _action: PayloadAction<ReturnType<typeof navigationActions.pop>['payload']>
+): Generator {
+  yield* call(pop)
+}