qr login

components/QrScanner.tsx

@@ -56,6 +56,11 @@ export const QrScanner: React.FC<QrScannerProps> = (props) => {
 
   return (
     <View>
+      {props.title && (
+        <Text align="center" margin="16 0" color={Theme.Colors.errorMessage}>
+          {props.title}
+        </Text>
+      )}
       <View style={Theme.Styles.scannerContainer}>
         <Camera
           style={Theme.Styles.scanner}
@@ -94,4 +99,5 @@ export const QrScanner: React.FC<QrScannerProps> = (props) => {
 
 interface QrScannerProps {
   onQrFound: (data: string) => void;
-}
+  title?: string;
+}

locales/en.json

@@ -188,8 +188,7 @@
     "back": "Go Back",
     "confirm": "Confirm",
     "verify": "Verify",
-    "scannerTitle":"Scan the QR Code to initiate the login",
-    "loadingVcs": "Loading Credential",
+    "loadingMyVcs":"Loading Credential",
     "domainWarning": "Please verify and confirm the domain of the website you are logging into"
   },
   "ReceiveVcScreen": {

machines/QrLoginMachine.ts

@@ -34,7 +34,7 @@ const model = createModel(
 export const QrLoginEvents = model.events;
 
 export const qrLoginMachine =
-  /** @xstate-layout N4IgpgJg5mDOIC5QEUBOAZA9lAlgOwDocIAbMAYgGUBhAQQDl6BJegcQH0ARAeXoFEA2gAYAuolAAHTLBwAXHJjziQAD0QBmAGyaCADiEB2dQFYATOtMBGXZoOWANCACeGgJyuCxg64AsQ44Y+rkI+ugC+YY5oWLiExGTknEyUALLJlMJiSCBSMvKKymoIVh7qZWXGugaaPjW6Po4uCBbqBELt7a7Gvpr1BhFRGNj4BLAAFpgA7gDqAIaoePhQ5NS8AGJMAEopmcq5cgpK2UXdlgQ+pgH6-u69uo2IlrVtBrqWAa9CpqY+-ZEg0WGhHGUzmCyWiWSaUoGVEe2kBwKx0Qmh+BE0T0sgWqmlcqIeCAAtGjXD9QkFLJdasZagMAUNYqMJpMAG4AY3QOFgsioABVuJs+OxBZQAAq8SiCOHZfb5I6gIqhVq2II+J6Gd6udQElXnELqVwGV6U4KWOmAxkg1kcrk8yXoPjUXnsABq1F2MoRcsKiEJFz1b0sWuMxksqIxBMJuIITy0plxwS+oeM5oZIyt7M53PILr4myYawAmh7JF7Dj6iWGfDH2lU+gYQxdtc5fZSzrjTAYrGYMe0w6mYiMAGazNlgWgAV1kY3Ia1o1CFLto6CYnBLOTLSNATV0rQ6nW6tXqmmbRV8rW+pKCVUuGoHQIII7Hk+ns-nQpYS5Xa+lpby5eRBA8Q8EJTETEwQgMHxmyaSxWm8Q8bC+UIhBsTR70ZJ9xynGc6HoBd0HXWUAIVRA8WrHxKh8WohFxJ4jAJb5jAIAxaNRawGzeUxdwwkZ8BZWYSGIJgIDAPB5FkJxIVSdIiM3eVVEQS4dFRYwCQbAwCHUBshEsLsfkMUleLiPABKEiARLEiSpMFXlNkLV08wLJg6F5JheDk-8t0U4pjBUy4CTeDwqgCPTvj8bxTAif48EwUT4GyC18HhLyFKKYlKRrVDXl+BsaXMSMrCEdFSSMNV1F+XQvCi-4kriUgwBSxE0sQIQCW0s59yELoej6YymVBeZFjwKAmu9QD1HqAhLysKpNFQ+MDECvd9x6o8j36jMbW5MaSJ8wlKVaYwtAxXd9E0Mx4wJLxgvUODWOCKoLH6rCXzGXbvKKHTpt0S51Fo-67rgglrGYspLjO+oDXcGrBkHEyzOE0TxLkJo-2ais2pbBBfp0Lq1t6X5+ogRRGs9VKKyxbQtPyo06PeEJlraDp-so65weisIgA */
+  /** @xstate-layout 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 */
   model.createMachine(
     {
       tsTypes: {} as import('./QrLoginMachine.typegen').Typegen0,

machines/QrLoginMachine.typegen.ts

@@ -1,38 +1,62 @@
+// This file was automatically generated. Edits will be overwritten
 
-  // This file was automatically generated. Edits will be overwritten
-
-  export interface Typegen0 {
-        '@@xstate/typegen': true;
-        internalEvents: {
-          "done.invoke.QrLogin.linkTransaction:invocation[0]": { type: "done.invoke.QrLogin.linkTransaction:invocation[0]"; data: unknown; __tip: "See the XState TS docs to learn how to strongly type this." };
-"xstate.init": { type: "xstate.init" };
-        };
-        invokeSrcNameMap: {
-          "linkTransaction": "done.invoke.QrLogin.linkTransaction:invocation[0]";
-        };
-        missingImplementations: {
-          actions: never;
-          delays: never;
-          guards: never;
-          services: never;
-        };
-        eventsCausingActions: {
-          "loadMyVcs": "CONFIRM" | "done.invoke.QrLogin.linkTransaction:invocation[0]";
-"setMyVcs": "STORE_RESPONSE";
-"setScanData": "SCANNING_DONE";
-"setSelectedVc": "SELECT_VC";
-"setlinkTransactionResponse": "done.invoke.QrLogin.linkTransaction:invocation[0]";
-        };
-        eventsCausingDelays: {
-          
-        };
-        eventsCausingGuards: {
-          
-        };
-        eventsCausingServices: {
-          "linkTransaction": never;
-        };
-        matchesStates: "done" | "faceAuth" | "idle" | "invalidIdentity" | "linkTransaction" | "loadMyVcs" | "requestConsent" | "showWarning" | "showvcList";
-        tags: never;
-      }
-  
+export interface Typegen0 {
+  '@@xstate/typegen': true;
+  'internalEvents': {
+    'done.invoke.QrLogin.linkTransaction:invocation[0]': {
+      type: 'done.invoke.QrLogin.linkTransaction:invocation[0]';
+      data: unknown;
+      __tip: 'See the XState TS docs to learn how to strongly type this.';
+    };
+    'done.invoke.QrLogin.requestingJwtToken:invocation[0]': {
+      type: 'done.invoke.QrLogin.requestingJwtToken:invocation[0]';
+      data: unknown;
+      __tip: 'See the XState TS docs to learn how to strongly type this.';
+    };
+    'error.platform.QrLogin.requestingJwtToken:invocation[0]': {
+      type: 'error.platform.QrLogin.requestingJwtToken:invocation[0]';
+      data: unknown;
+    };
+    'xstate.init': { type: 'xstate.init' };
+  };
+  'invokeSrcNameMap': {
+    linkTransaction: 'done.invoke.QrLogin.linkTransaction:invocation[0]';
+    requestingJwtToken: 'done.invoke.QrLogin.requestingJwtToken:invocation[0]';
+  };
+  'missingImplementations': {
+    actions: '';
+    delays: never;
+    guards: never;
+    services: 'requestingJwtToken';
+  };
+  'eventsCausingActions': {
+    '':
+      | 'done.invoke.QrLogin.requestingJwtToken:invocation[0]'
+      | 'error.platform.QrLogin.requestingJwtToken:invocation[0]';
+    'loadMyVcs':
+      | 'CONFIRM'
+      | 'done.invoke.QrLogin.linkTransaction:invocation[0]';
+    'setMyVcs': 'STORE_RESPONSE';
+    'setScanData': 'SCANNING_DONE';
+    'setSelectedVc': 'SELECT_VC';
+    'setlinkTransactionResponse': 'done.invoke.QrLogin.linkTransaction:invocation[0]';
+  };
+  'eventsCausingDelays': {};
+  'eventsCausingGuards': {};
+  'eventsCausingServices': {
+    linkTransaction: never;
+    requestingJwtToken: never;
+  };
+  'matchesStates':
+    | 'done'
+    | 'faceAuth'
+    | 'idle'
+    | 'invalidIdentity'
+    | 'linkTransaction'
+    | 'loadMyVcs'
+    | 'requestConsent'
+    | 'requestingJwtToken'
+    | 'showWarning'
+    | 'showvcList';
+  'tags': never;
+}

screens/Profile/QrLogin.tsx

@@ -10,7 +10,6 @@ import { MessageOverlay } from '../../components/MessageOverlay';
 import { MyBindedVcs } from './MyBindedVcs';
 import { QrLoginWarning } from './QrLoginWarning';
 import { QrLoginSuccess } from './QrLoginSuccessMessage';
-import { QrConsent } from './QrConsent';
 
 export const QrLogin: React.FC = () => {
   const controller = useQrLogin();
@@ -36,20 +35,22 @@ export const QrLogin: React.FC = () => {
         <Column fill>
           {controller.isScanningQr && (
             <Column fill padding="32" align="space-between">
-              <Text> {t('scannerTitle')}</Text>
-              <QrScanner onQrFound={controller.SCANNING_DONE} />
+              <QrScanner
+                onQrFound={controller.SCANNING_DONE}
+                title={'Scan the QR Code to initiate the login'}
+              />
             </Column>
           )}
 
           <QrLoginWarning
             isVisible={controller.isShowWarning}
             onConfirm={controller.CONFIRM}
-            onCancel={controller.DISMISS}
+            onCancel={controller.CANCEL}
           />
 
           <MessageOverlay
-            isVisible={controller.isLoadingVc}
-            title={t('loadingVcs')}
+            isVisible={controller.isLoadingMyVcs}
+            title={t('loadingMyVcs')}
             progress
           />
 
@@ -84,12 +85,6 @@ export const QrLogin: React.FC = () => {
             </Row>
           </MessageOverlay>
 
-          <QrConsent
-            isVisible={controller.isRequestingConsent}
-            onConfirm={controller.CONFIRM}
-            onCancel={controller.CANCEL}
-          />
-
           <QrLoginSuccess
             isVisible={controller.isVerifyingSuccesful}
             onPress={() => {
@@ -101,4 +96,3 @@ export const QrLogin: React.FC = () => {
     </ListItem>
   );
 };
-

screens/Profile/QrLoginController.ts

@@ -7,12 +7,10 @@ import {
   selectIsInvalidIdentity,
   selectIsisVerifyingIdentity,
   selectIsloadMyVcs,
-  selectIsRequestConsent,
   selectIsScanning,
   selectIsShowingVcList,
   selectIsShowWarning,
   selectIsVerifyingSuccesful,
-  selectLinkTransactionResponse,
   selectMyVcs,
   selectSelectedVc,
 } from '../../machines/QrLoginMachine';
@@ -40,10 +38,6 @@ export function useQrLogin() {
 
     vcKeys: useSelector(qrLoginService, selectMyVcs),
     selectedVc: useSelector(qrLoginService, selectSelectedVc),
-    LinkTransactionContent: useSelector(
-      qrLoginService,
-      selectLinkTransactionResponse
-    ),
 
     isQrLogin,
     setQrLogin,
@@ -52,7 +46,6 @@ export function useQrLogin() {
 
     isScanningQr: useSelector(qrLoginService, selectIsScanning),
     isShowWarning: useSelector(qrLoginService, selectIsShowWarning),
-    isLoadingVc: useSelector(qrLoginService, selectIsloadMyVcs),
     isShowingVcList: useSelector(qrLoginService, selectIsShowingVcList),
     isLoadingMyVcs: useSelector(qrLoginService, selectIsloadMyVcs),
     isGeneratingJwtToken: useSelector(
@@ -64,7 +57,6 @@ export function useQrLogin() {
       selectIsisVerifyingIdentity
     ),
     isInvalidIdentity: useSelector(qrLoginService, selectIsInvalidIdentity),
-    isRequestingConsent: useSelector(qrLoginService, selectIsRequestConsent),
     isVerifyingSuccesful: useSelector(
       qrLoginService,
       selectIsVerifyingSuccesful