fix(INJI-329): fix received card expand view and redirect the user to…

… history screen after VC transfer (#799) * fix(INJI-329): remove onboarding related code from MyVcs machine to show the expanded view of received card Onboarding is used to check whether we need to show the intro sliders or not now it is handled differently in AppLayout * fix(INJI-329): redirect the user to the history screen after successfull vc share * fix(INJI-329): show incoming card screen on the verifier after closing the success popup redirect the user to received cards screen if user clicks on view received card button and QR code screen if clicks on back button * refactor(INJI-329): extract bottom tab, scan and request screen names into separate file to maintain the consistency * refactor(INJI-329): remove activeTab from routeConstants as it is not being used before new UI merge we have 3 different tabs in home screen and activeTab is used for displaying the current active tab
mosip · Sep 12, 2023 · fe3f8a5 · fe3f8a5
1 parent ae7c187
commit fe3f8a5
Show file tree

Hide file tree

Showing 19 changed files with 210 additions and 169 deletions.
diff --git a/machines/bleShare/request/requestMachine.ts b/machines/bleShare/request/requestMachine.ts
@@ -405,7 +405,7 @@ export const requestMachine =
               },
               on: {
                 DISMISS: {
-                  target: 'navigatingToHistory',
+                  target: 'displayingIncomingVC',
                 },
               },
             },
@@ -431,11 +431,27 @@ export const requestMachine =
             displayingIncomingVC: {
               on: {
                 GO_TO_RECEIVED_VC_TAB: {
-                  target: 'navigatingToHistory',
+                  target: 'navigatingToReceivedCards',
+                },
+              },
+            },
+            navigatingToReceivedCards: {
+              on: {
+                DISMISS: {
+                  target: 'navigatingToHome',
+                },
+              },
+            },
+            navigatingToHome: {
+              invoke: {
+                src: 'disconnect',
+              },
+              on: {
+                DISCONNECT: {
+                  target: '#request.inactive',
                 },
               },
             },
-
             savingFailed: {
               initial: 'idle',
               entry: ['setReceiveLogTypeDiscarded', 'logReceived'],

diff --git a/machines/bleShare/request/requestMachine.typegen.ts b/machines/bleShare/request/requestMachine.typegen.ts
@@ -30,7 +30,8 @@ export interface Typegen0 {
     checkStorageAvailability: 'done.invoke.request.checkStorage:invocation[0]';
     disconnect:
       | 'done.invoke.request.clearingConnection:invocation[0]'
-      | 'done.invoke.request.reviewing.navigatingToHistory:invocation[0]';
+      | 'done.invoke.request.reviewing.navigatingToHistory:invocation[0]'
+      | 'done.invoke.request.reviewing.navigatingToHome:invocation[0]';
     monitorConnection: 'done.invoke.request:invocation[0]';
     receiveVc: 'done.invoke.request.waitingForVc:invocation[0]';
     requestBluetooth: 'done.invoke.request.checkingBluetoothService.requesting:invocation[0]';
@@ -148,6 +149,8 @@ export interface Typegen0 {
     | 'reviewing.idle'
     | 'reviewing.invalidIdentity'
     | 'reviewing.navigatingToHistory'
+    | 'reviewing.navigatingToHome'
+    | 'reviewing.navigatingToReceivedCards'
     | 'reviewing.rejected'
     | 'reviewing.savingFailed'
     | 'reviewing.savingFailed.idle'
@@ -169,6 +172,8 @@ export interface Typegen0 {
           | 'idle'
           | 'invalidIdentity'
           | 'navigatingToHistory'
+          | 'navigatingToHome'
+          | 'navigatingToReceivedCards'
           | 'rejected'
           | 'savingFailed'
           | 'verifyingIdentity'

diff --git a/machines/bleShare/request/selectors.ts b/machines/bleShare/request/selectors.ts
@@ -58,3 +58,11 @@ export function selectIsSavingFailedInViewingVc(state: State) {
 export function selectIsDone(state: State) {
   return state.matches('reviewing.navigatingToHistory');
 }
+
+export function selectIsNavigatingToReceivedCards(state: State) {
+  return state.matches('reviewing.navigatingToReceivedCards');
+}
+
+export function selectIsNavigatingToHome(state: State) {
+  return state.matches('reviewing.navigatingToHome');
+}
diff --git a/machines/settings.typegen.ts b/machines/settings.typegen.ts
@@ -25,6 +25,7 @@ export interface Typegen0 {
   };
   'eventsCausingActions': {
     injiTourGuide:
+      | 'ACCEPT_HARDWARE_SUPPORT_NOT_EXISTS'
       | 'BACK'
       | 'CANCEL'
       | 'STORE_RESPONSE'

diff --git a/routes/main.ts b/routes/main.ts
@@ -9,9 +9,10 @@ import { RootStackParamList } from './index';
 import { ScanLayout } from '../screens/Scan/ScanLayout';
 import { HistoryScreen } from '../screens/History/HistoryScreen';
 import i18n from '../i18n';
+import { BOTTOM_TAB_ROUTES } from './routesConstants';
 
 const home: TabScreen = {
-  name: 'home',
+  name: BOTTOM_TAB_ROUTES.home,
   component: HomeScreen,
   icon: 'home',
   options: {
@@ -24,16 +25,17 @@ const home: TabScreen = {
   },
 };
 export const scan: TabScreen = {
-  name: 'scan',
+  name: BOTTOM_TAB_ROUTES.scan,
   component: ScanLayout,
   icon: 'qr-code-scanner',
   options: {
     title: i18n.t('MainLayout:scan'),
     headerShown: false,
   },
 };
+
 const history: TabScreen = {
-  name: 'history',
+  name: BOTTOM_TAB_ROUTES.history,
   component: HistoryScreen,
   icon: 'history',
   options: {
@@ -48,11 +50,9 @@ mainRoutes.push(scan);
 mainRoutes.push(history);
 
 export type MainBottomTabParamList = {
-  home: {
-    activeTab: number;
-  };
-  Scan: undefined;
-  History: undefined;
+  home: undefined;
+  scan: undefined;
+  history: undefined;
 };
 
 export interface TabScreen {

diff --git a/routes/routesConstants.ts b/routes/routesConstants.ts
@@ -0,0 +1,29 @@
+import { MainBottomTabParamList } from './main';
+
+export const BOTTOM_TAB_ROUTES = {
+  home: 'home' as keyof MainBottomTabParamList,
+  scan: 'scan' as keyof MainBottomTabParamList,
+  history: 'history' as keyof MainBottomTabParamList,
+};
+
+export const SCAN_ROUTES = {
+  ScanScreen: 'ScanScreen' as keyof ScanStackParamList,
+  SendVcScreen: 'SendVcScreen' as keyof ScanStackParamList,
+};
+
+export const REQUEST_ROUTES = {
+  Request: 'Request' as keyof RequestStackParamList,
+  RequestScreen: 'RequestScreen' as keyof RequestStackParamList,
+  ReceiveVcScreen: 'ReceiveVcScreen' as keyof RequestStackParamList,
+};
+
+export type ScanStackParamList = {
+  ScanScreen: undefined;
+  SendVcScreen: undefined;
+};
+
+export type RequestStackParamList = {
+  Request: undefined;
+  RequestScreen: undefined;
+  ReceiveVcScreen: undefined;
+};
diff --git a/screens/Home/MyVcsTabController.ts b/screens/Home/MyVcsTabController.ts
@@ -18,7 +18,6 @@ import {
   MyVcsTabEvents,
   MyVcsTabMachine,
   selectAddVcModal,
-  selectIsOnboarding,
   selectIsRequestSuccessful,
   selectGetVcModal,
   selectIsSavingFailedInIdle,
@@ -46,7 +45,6 @@ export function useMyVcsTab(props: HomeScreenTabProps) {
 
     isRefreshingVcs: useSelector(vcService, selectIsRefreshingMyVcs),
     isRequestSuccessful: useSelector(service, selectIsRequestSuccessful),
-    isOnboarding: useSelector(service, selectIsOnboarding),
     isSavingFailedInIdle: useSelector(service, selectIsSavingFailedInIdle),
     walletBindingError: useSelector(service, selectWalletBindingError),
     isBindingError: useSelector(service, selectShowWalletBindingError),
@@ -70,8 +68,6 @@ export function useMyVcsTab(props: HomeScreenTabProps) {
       return service.send(MyVcsTabEvents.VIEW_VC(vcRef));
     },
 
-    ONBOARDING_DONE: () => service.send(MyVcsTabEvents.ONBOARDING_DONE()),
-
     IS_TAMPERED: () => service.send(MyVcsTabEvents.IS_TAMPERED()),
 
     ACCEPT_HARDWARE_SUPPORT_NOT_EXISTS: () =>

diff --git a/screens/Home/MyVcsTabMachine.ts b/screens/Home/MyVcsTabMachine.ts
@@ -11,10 +11,7 @@ import { StoreEvents, StoreResponseEvent } from '../../machines/store';
 import { VcEvents } from '../../machines/vc';
 import { vcItemMachine } from '../../machines/vcItem';
 import { AppServices } from '../../shared/GlobalContext';
-import {
-  MY_VCS_STORE_KEY,
-  ONBOARDING_STATUS_STORE_KEY,
-} from '../../shared/constants';
+import { MY_VCS_STORE_KEY } from '../../shared/constants';
 import { AddVcModalMachine } from './MyVcs/AddVcModalMachine';
 import { GetVcModalMachine } from './MyVcs/GetVcModalMachine';
 import Storage from '../../shared/storage';
@@ -36,7 +33,6 @@ const model = createModel(
       GET_VC: () => ({}),
       STORAGE_AVAILABLE: () => ({}),
       STORAGE_UNAVAILABLE: () => ({}),
-      ONBOARDING_DONE: () => ({}),
       IS_TAMPERED: () => ({}),
     },
   }
@@ -57,31 +53,8 @@ export const MyVcsTabMachine = model.createMachine(
       events: {} as EventFrom<typeof model>,
     },
     id: 'MyVcsTab',
-    initial: 'checkingOnboardingStatus',
+    initial: 'idle',
     states: {
-      checkingOnboardingStatus: {
-        entry: ['getOnboardingStatus'],
-        on: {
-          STORE_RESPONSE: [
-            { cond: 'isOnboardingDone', target: 'idle' },
-            { target: 'onboarding' },
-          ],
-        },
-      },
-      onboarding: {
-        on: {
-          ADD_VC: [
-            {
-              target: 'addVc',
-              actions: ['completeOnboarding'],
-            },
-          ],
-          ONBOARDING_DONE: {
-            target: 'idle',
-            actions: ['completeOnboarding'],
-          },
-        },
-      },
       addVc: {
         initial: 'checkStorage',
         states: {
@@ -202,16 +175,6 @@ export const MyVcsTabMachine = model.createMachine(
         model.events.VIEW_VC(event.vcItemActor)
       ),
 
-      getOnboardingStatus: send(
-        () => StoreEvents.GET(ONBOARDING_STATUS_STORE_KEY),
-        { to: (context) => context.serviceRefs.store }
-      ),
-
-      completeOnboarding: send(
-        () => StoreEvents.SET(ONBOARDING_STATUS_STORE_KEY, true),
-        { to: (context) => context.serviceRefs.store }
-      ),
-
       storeVcItem: send(
         (_context, event) => {
           return StoreEvents.PREPEND(
@@ -231,10 +194,6 @@ export const MyVcsTabMachine = model.createMachine(
     },
 
     guards: {
-      isOnboardingDone: (_context, event: StoreResponseEvent) => {
-        return event.response === true;
-      },
-
       isMinimumStorageLimitReached: (_context, event) => Boolean(event.data),
     },
   }
@@ -257,10 +216,6 @@ export function selectGetVcModal(state: State) {
   return state.children.GetVcModal as ActorRefFrom<typeof GetVcModalMachine>;
 }
 
-export function selectIsOnboarding(state: State) {
-  return state.matches('onboarding');
-}
-
 export function selectIsRequestSuccessful(state: State) {
   return state.matches('addingVc.addVcSuccessful');
 }

diff --git a/screens/Home/MyVcsTabMachine.typegen.ts b/screens/Home/MyVcsTabMachine.typegen.ts
@@ -30,8 +30,6 @@ export interface Typegen0 {
     services: never;
   };
   'eventsCausingActions': {
-    completeOnboarding: 'ADD_VC' | 'ONBOARDING_DONE';
-    getOnboardingStatus: 'xstate.init';
     refreshMyVc: 'IS_TAMPERED';
     resetIsTampered: 'IS_TAMPERED';
     sendVcAdded: 'STORE_RESPONSE';
@@ -41,7 +39,6 @@ export interface Typegen0 {
   'eventsCausingDelays': {};
   'eventsCausingGuards': {
     isMinimumStorageLimitReached: 'done.invoke.MyVcsTab.addVc.checkStorage:invocation[0]';
-    isOnboardingDone: 'STORE_RESPONSE';
   };
   'eventsCausingServices': {
     AddVcModal:
@@ -60,11 +57,9 @@ export interface Typegen0 {
     | 'addingVc.savingFailed.idle'
     | 'addingVc.storing'
     | 'addingVc.waitingForvcKey'
-    | 'checkingOnboardingStatus'
     | 'gettingVc'
     | 'gettingVc.waitingForvcKey'
     | 'idle'
-    | 'onboarding'
     | 'viewingVc'
     | {
         addVc?: 'checkStorage' | 'storageLimitReached';

diff --git a/screens/Request/RequestLayout.tsx b/screens/Request/RequestLayout.tsx
@@ -7,12 +7,15 @@ import { useRequestLayout } from './RequestLayoutController';
 import { Message } from '../../components/Message';
 import { ReceiveVcScreen } from './ReceiveVcScreen';
 import { MessageOverlay } from '../../components/MessageOverlay';
-
+import { ReceivedCardsModal } from '../Settings/ReceivedCardsModal';
+import { useReceivedVcsTab } from '../Home/ReceivedVcsTabController';
+import { REQUEST_ROUTES } from '../../routes/routesConstants';
 const RequestStack = createNativeStackNavigator();
 
 export const RequestLayout: React.FC = () => {
   const { t } = useTranslation('RequestScreen');
   const controller = useRequestLayout();
+  const receivedCardsController = useReceivedVcsTab();
 
   return (
     <React.Fragment>
@@ -31,7 +34,7 @@ export const RequestLayout: React.FC = () => {
         }}>
         {!controller.isDone && (
           <RequestStack.Screen
-            name="ReceiveVcScreen"
+            name={REQUEST_ROUTES.ReceiveVcScreen}
             component={ReceiveVcScreen}
             options={{
               title: t('incomingVc'),
@@ -46,14 +49,19 @@ export const RequestLayout: React.FC = () => {
           />
         )}
         <RequestStack.Screen
-          name="RequestScreen"
+          name={REQUEST_ROUTES.RequestScreen}
           component={RequestScreen}
           options={{
             title: t('receiveCard').toUpperCase(),
           }}
         />
       </RequestStack.Navigator>
 
+      <ReceivedCardsModal
+        isVisible={controller.isNavigatingToReceivedCards}
+        controller={receivedCardsController}
+        onDismiss={controller.DISMISS}
+      />
       {controller.isAccepted && (
         <Message
           title={t('status.accepted.title')}