@ekyc_qoobiss/qbs-ect-cmp 3.2.1 → 3.2.3

package/dist/collection/components/flow/id-double-side/id-double-side.js

@@ -1,14 +1,13 @@
 import { h /*getAssetPath*/ } from '@stencil/core';
-import { ApiCall } from '../../../helpers/ApiCall';
 import store from '../../../helpers/store';
 import { Stream } from '../../../helpers/Stream';
 import { FlowStatus } from '../../../models/FlowStatus';
 import { FlowSteps } from '../../../models/FlowSteps';
 import { getLogMessage } from '../../../utils/utils';
+import { BaseComponent } from '../../base-component';
 // import { IDPose } from '../../libs/IDML5Detector/IDPose';
 export class IdDoubleSide {
   constructor() {
-    this.device = undefined;
     this.showTimeout = undefined;
     this.showInvalid = undefined;
     this.showHowTo = undefined;
@@ -24,7 +23,8 @@ export class IdDoubleSide {
       recordingFileName: '',
       recordingUploadType: '',
     };
-    this.apiCall = new ApiCall();
+    this.baseComponent = new BaseComponent(FlowSteps.CiBack);
+    this.baseComponent.setEventEmitter(this.apiErrorEvent);
   }
   componentWillLoad() {
     this.captureRetryCount = 0;
@@ -61,7 +61,7 @@ export class IdDoubleSide {
   async captureIdImage(event) {
     let idPhoto = event.detail;
     if (idPhoto.length == 0 || idPhoto.size == 0) {
-      await this.apiCall.AddLog({ message: 'Empty id photo', blobData: idPhoto }, getLogMessage());
+      await this.baseComponent.apiCall.AddLog({ message: 'Empty id photo', blobData: idPhoto }, getLogMessage());
       return;
     }
     try {
@@ -75,7 +75,7 @@ export class IdDoubleSide {
   async captureIdBackImage(event) {
     let idPhoto = event.detail;
     if (idPhoto.length == 0 || idPhoto.size == 0) {
-      await this.apiCall.AddLog({ message: 'Empty id photo', blobData: idPhoto }, getLogMessage());
+      await this.baseComponent.apiCall.AddLog({ message: 'Empty id photo', blobData: idPhoto }, getLogMessage());
       return;
     }
     try {
@@ -89,7 +89,7 @@ export class IdDoubleSide {
   async capturedIdRecording(event) {
     let idRecording = event.detail;
     if (idRecording.length == 0 || idRecording.size == 0) {
-      await this.apiCall.AddLog({ message: 'Empty recording', blobData: idRecording }, getLogMessage());
+      await this.baseComponent.apiCall.AddLog({ message: 'Empty recording', blobData: idRecording }, getLogMessage());
       return;
     }
     let mimeType = idRecording.type == Stream.mp4MimeType.type ? Stream.mp4MimeType : Stream.webmMimeType;
@@ -98,51 +98,53 @@ export class IdDoubleSide {
       this.uploadRecording();
     }
     catch (e) {
-      this.apiErrorEvent.emit(e);
+      if (store.recordingRetryCount < 3) {
+        store.recordingRetryCount++;
+        this.triggerErrorFlow();
+      }
+      else {
+        this.apiErrorEvent.emit(e);
+      }
     }
   }
   async verificationFinished(_event) {
     this.flow.verificationFinished = true;
-    this.endFlow();
+    await this.endFlow();
   }
   async componentDidLoad() {
-    try {
-      await this.apiCall.AddStep(FlowSteps.CiBack);
-    }
-    catch (e) {
-      this.apiErrorEvent.emit(e);
-    }
+    await this.baseComponent.initialize();
   }
   async uploadPhoto() {
     if (this.flow.photoFile == null || this.flow.photoDone) {
       return;
     }
-    this.flow.photoDone = await this.apiCall.UploadFileForRequestB64(store.requestId, this.flow.photoUploadType, this.flow.photoFile);
+    this.flow.photoDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, this.flow.photoUploadType, this.flow.photoFile);
     if (this.flow.photoDone) {
-      this.endFlow();
+      await this.endFlow();
     }
     else {
-      this.flow.photoFile = null;
-      this.flow.recordingFile = null;
       this.switchCamera();
-      this.showInvalid = true;
+      this.triggerErrorFlow();
     }
   }
   async uploadRecording() {
     if (this.flow.recordingFile == null || this.flow.recordingDone) {
       return;
     }
-    this.flow.recordingDone = await this.apiCall.UploadFileForRequestB64(store.requestId, this.flow.recordingUploadType, this.flow.recordingFile);
+    this.flow.recordingDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, this.flow.recordingUploadType, this.flow.recordingFile);
     if (this.flow.recordingDone) {
-      this.endFlow();
+      await this.endFlow();
     }
     else {
-      this.flow.photoFile = null;
-      this.flow.recordingFile = null;
-      this.showInvalid = true;
+      this.triggerErrorFlow();
     }
   }
-  endFlow() {
+  triggerErrorFlow() {
+    this.flow.photoFile = null;
+    this.flow.recordingFile = null;
+    this.showInvalid = true;
+  }
+  async endFlow() {
     if (!this.flow.photoDone) {
       return;
     }
@@ -165,6 +167,8 @@ export class IdDoubleSide {
     if (!this.flow.verificationFinished) {
       return;
     }
+    store.recordingRetryCount = 0;
+    await this.baseComponent.finalize();
     store.flowStatus = FlowStatus.LIVENESS;
   }
   switchCamera() {
@@ -179,8 +183,8 @@ export class IdDoubleSide {
   }
   render() {
     let error = h("capture-error", { type: "ID" });
-    let frontCapture = h("id-capture", { id: "idFront", device: this.device });
-    let secondCapture = h("id-back-capture", { id: "idBack", device: this.device });
+    let frontCapture = h("id-capture", { id: "idFront" });
+    let secondCapture = h("id-back-capture", { id: "idBack" });
     let howToInfo = h("how-to-info", { idSide: this.front ? 'front' : 'back' });
     return this.showHowTo ? howToInfo : this.showInvalid || this.showTimeout ? error : this.front ? frontCapture : secondCapture;
   }
@@ -195,30 +199,6 @@ export class IdDoubleSide {
       "$": ["id-double-side.css"]
     };
   }
-  static get properties() {
-    return {
-      "device": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "Device",
-          "resolved": "Device",
-          "references": {
-            "Device": {
-              "location": "import",
-              "path": "../../../models/IDevice"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        }
-      }
-    };
-  }
   static get states() {
     return {
       "showTimeout": {},

package/dist/collection/components/flow/id-single-side/id-single-side.js

@@ -1,14 +1,13 @@
 import { h /*getAssetPath*/ } from '@stencil/core';
-import { ApiCall } from '../../../helpers/ApiCall';
 import store from '../../../helpers/store';
 import { Stream } from '../../../helpers/Stream';
 import { FlowStatus } from '../../../models/FlowStatus';
 import { FlowSteps } from '../../../models/FlowSteps';
 import { getLogMessage } from '../../../utils/utils';
+import { BaseComponent } from '../../base-component';
 // import { IDPose } from '../../libs/IDML5Detector/IDPose';
 export class IdSingleSide {
   constructor() {
-    this.device = undefined;
     this.showTimeout = undefined;
     this.showHowTo = undefined;
     this.idFlow = {
@@ -18,7 +17,8 @@ export class IdSingleSide {
       photoFile: null,
       recordingFile: null,
     };
-    this.apiCall = new ApiCall();
+    this.baseComponent = new BaseComponent(FlowSteps.CiFront);
+    this.baseComponent.setEventEmitter(this.apiErrorEvent);
     this.captureRetryCount = 0;
     this.showHowTo = true;
   }
@@ -36,7 +36,7 @@ export class IdSingleSide {
   async captureIdImage(event) {
     let idPhoto = event.detail;
     if (idPhoto.length == 0 || idPhoto.size == 0) {
-      await this.apiCall.AddLog({ message: 'Empty id photo', blobData: idPhoto }, getLogMessage());
+      await this.baseComponent.apiCall.AddLog({ message: 'Empty id photo', blobData: idPhoto }, getLogMessage());
       return;
     }
     try {
@@ -49,12 +49,12 @@ export class IdSingleSide {
   }
   async verificationFinished(_event) {
     this.idFlow.verificationFinished = true;
-    this.endFlow();
+    await this.endFlow();
   }
   async capturedIdRecording(event) {
     let idRecording = event.detail;
     if (idRecording.length == 0 || idRecording.size == 0) {
-      await this.apiCall.AddLog({ message: 'Empty recording', blobData: idRecording }, getLogMessage());
+      await this.baseComponent.apiCall.AddLog({ message: 'Empty recording', blobData: idRecording }, getLogMessage());
       return;
     }
     let mimeType = idRecording.type == Stream.mp4MimeType.type ? Stream.mp4MimeType : Stream.webmMimeType;
@@ -69,20 +69,15 @@ export class IdSingleSide {
     }
   }
   async componentDidLoad() {
-    try {
-      await this.apiCall.AddStep(FlowSteps.CiFront);
-    }
-    catch (e) {
-      this.apiErrorEvent.emit(e);
-    }
+    await this.baseComponent.initialize();
   }
   async uploadPhoto() {
     if (this.idFlow.photoFile == null || this.idFlow.photoDone) {
       return;
     }
-    this.idFlow.photoDone = await this.apiCall.UploadFileForRequestB64(store.requestId, 'IdFront', this.idFlow.photoFile);
+    this.idFlow.photoDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, 'IdFront', this.idFlow.photoFile);
     if (this.idFlow.photoDone) {
-      this.endFlow();
+      await this.endFlow();
     }
     else {
       this.idFlow.photoFile = null;
@@ -95,9 +90,9 @@ export class IdSingleSide {
     if (this.idFlow.recordingFile == null || this.idFlow.recordingDone) {
       return;
     }
-    this.idFlow.recordingDone = await this.apiCall.UploadFileForRequestB64(store.requestId, 'IdFrontVideo', this.idFlow.recordingFile);
+    this.idFlow.recordingDone = await this.baseComponent.apiCall.UploadFileForRequestB64(store.requestId, 'IdFrontVideo', this.idFlow.recordingFile);
     if (this.idFlow.recordingDone) {
-      this.endFlow();
+      await this.endFlow();
     }
     else {
       this.idFlow.photoFile = null;
@@ -105,7 +100,7 @@ export class IdSingleSide {
       this.showTimeout = true;
     }
   }
-  endFlow() {
+  async endFlow() {
     if (!this.idFlow.photoDone) {
       return;
     }
@@ -115,6 +110,7 @@ export class IdSingleSide {
     if (!this.idFlow.verificationFinished) {
       return;
     }
+    await this.baseComponent.finalize();
     store.flowStatus = FlowStatus.LIVENESS;
   }
   switchCamera() {
@@ -129,7 +125,7 @@ export class IdSingleSide {
   }
   render() {
     let error = h("capture-error", { type: "ID" });
-    let capture = h("id-capture", { id: "idFront", device: this.device });
+    let capture = h("id-capture", { id: "idFront" });
     let howToInfo = h("how-to-info", { idSide: "front" });
     return this.showHowTo ? howToInfo : this.showTimeout ? error : capture;
   }
@@ -144,30 +140,6 @@ export class IdSingleSide {
       "$": ["id-single-side.css"]
     };
   }
-  static get properties() {
-    return {
-      "device": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "Device",
-          "resolved": "Device",
-          "references": {
-            "Device": {
-              "location": "import",
-              "path": "../../../models/IDevice"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        }
-      }
-    };
-  }
   static get states() {
     return {
       "showTimeout": {},

package/dist/collection/components/flow/landing-validation/landing-validation.js

@@ -1,24 +1,30 @@
 import { h } from '@stencil/core';
 import { LandingValues, SessionKeys } from '../../../helpers/textValues';
-// @ts-ignore
-import info from '../../../assets/landing/info.svg';
-import idSvg from '../../../assets/landing/id.svg';
-import idDevice from '../../../assets/landing/device.svg';
-import idValidation from '../../../assets/landing/validation.svg';
 import store from '../../../helpers/store';
 import Events from '../../../helpers/Events';
 import { FlowStatus } from '../../../models/FlowStatus';
 import { ApiCall } from '../../../helpers/ApiCall';
 import { FlowSteps } from '../../../models/FlowSteps';
 import { Cameras } from '../../../helpers/Cameras';
+import { BaseComponent } from '../../base-component';
+import { MobileOS } from '../../../models/IDevice';
+// @ts-ignore
+import info from '../../../assets/landing/info.svg';
+// @ts-ignore
+import idSvg from '../../../assets/landing/id.svg';
+// @ts-ignore
+import idValidation from '../../../assets/landing/validation.svg';
+// @ts-ignore
+import idDevice from '../../../assets/landing/device.svg';
 export class LandingValidation {
   constructor() {
-    this.device = undefined;
     this.warningText = undefined;
     this.buttonDisabled = undefined;
+    this.baseComponent = new BaseComponent(FlowSteps.Landing);
+    this.baseComponent.setEventEmitter(this.apiErrorEvent);
   }
   async componentWillLoad() {
-    this.apiCall = new ApiCall();
+    this.baseComponent.apiCall = new ApiCall();
     this.buttonDisabled = false;
     await this.initRequest();
   }
@@ -26,12 +32,7 @@ export class LandingValidation {
     Events.init(window);
     Events.flowStarted();
     if (store.environment !== 'DEMO') {
-      try {
-        await this.apiCall.AddStep(FlowSteps.Landing);
-      }
-      catch (e) {
-        this.apiErrorEvent.emit(e);
-      }
+      await this.baseComponent.initialize();
     }
   }
   async initRequest() {
@@ -49,8 +50,9 @@ export class LandingValidation {
         store.flowStatus = FlowStatus.COMPLETE;
         return;
       }
-      if (!(await Cameras.InitCameras(this.device))) {
-        if (this.device.isIos)
+      await this.baseComponent.finalize();
+      if (!(await Cameras.InitCameras(store.device))) {
+        if (store.device.mobileOS == MobileOS.iOS)
           sessionStorage.setItem(SessionKeys.RefreshDoneKey, 'false');
         store.flowStatus = FlowStatus.CAMERAERROR;
       }
@@ -70,7 +72,8 @@ export class LandingValidation {
       return;
     store.initialised = false;
     try {
-      await this.apiCall.AbortRequest();
+      await this.baseComponent.apiCall.AbortRequest();
+      await this.baseComponent.finalize();
       Events.flowAborted();
     }
     catch (e) {
@@ -92,30 +95,6 @@ export class LandingValidation {
       "$": ["landing-validation.css"]
     };
   }
-  static get properties() {
-    return {
-      "device": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "Device",
-          "resolved": "Device",
-          "references": {
-            "Device": {
-              "location": "import",
-              "path": "../../../models/IDevice"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        }
-      }
-    };
-  }
   static get states() {
     return {
       "warningText": {},

package/dist/collection/components/flow/mobile-redirect/mobile-redirect.js

@@ -2,12 +2,12 @@ import { h } from '@stencil/core';
 import { MobileRedirectValues } from '../../../helpers/textValues';
 import QRCode from 'qrcode';
 import store from '../../../helpers/store';
-import { ApiCall } from '../../../helpers/ApiCall';
 import Events from '../../../helpers/Events';
 import { OrderStatuses } from '../../../models/OrderStatuses';
 import { FlowStatus } from '../../../models/FlowStatus';
 import { FlowSteps } from '../../../models/FlowSteps';
 import { delay } from '../../../utils/utils';
+import { BaseComponent } from '../../base-component';
 export class MobileRedirect {
   constructor() {
     this.infoTextTop = undefined;
@@ -19,7 +19,8 @@ export class MobileRedirect {
     this.redirectLink = undefined;
     this.qrCode = undefined;
     this.prefilledPhone = false;
-    this.apiCall = new ApiCall();
+    this.baseComponent = new BaseComponent(FlowSteps.MobileRedirect);
+    this.baseComponent.setEventEmitter(this.apiErrorEvent);
     this.invalidValue = false;
     this.waitingMobile = false;
   }
@@ -43,12 +44,7 @@ export class MobileRedirect {
   async componentDidLoad() {
     Events.init(window);
     Events.flowStarted();
-    try {
-      await this.apiCall.AddStep(FlowSteps.MobileRedirect);
-    }
-    catch (e) {
-      this.apiErrorEvent.emit(e);
-    }
+    await this.baseComponent.initialize();
     await delay(5000);
     await this.checkStatus();
     while (this.orderStatus == OrderStatuses.Capturing || this.orderStatus == OrderStatuses.Waiting) {
@@ -57,9 +53,10 @@ export class MobileRedirect {
     }
   }
   async checkStatus() {
-    this.orderStatus = await this.apiCall.GetStatus(store.requestId);
+    this.orderStatus = await this.baseComponent.apiCall.GetStatus(store.requestId);
     if (this.orderStatus == OrderStatuses.FinishedCapturing) {
       this.waitingMobile = false;
+      await this.baseComponent.finalize();
       store.flowStatus = FlowStatus.COMPLETE;
     }
     if (this.orderStatus == OrderStatuses.NotFound) {
@@ -83,7 +80,7 @@ export class MobileRedirect {
     this.waitingMobile = true;
     this.infoTextTop = MobileRedirectValues.InfoWaiting;
     try {
-      await this.apiCall.SendLink(this.redirectLink, this.contact);
+      await this.baseComponent.apiCall.SendLink(this.redirectLink, this.contact);
     }
     catch (e) {
       this.apiErrorEvent.emit(e);

package/dist/collection/components/flow/sms-code-validation/sms-code-validation.js

@@ -1,9 +1,9 @@
 import { h } from '@stencil/core';
-import { ApiCall } from '../../../helpers/ApiCall';
 import store from '../../../helpers/store';
 import { PhoneValidationValues, CodeValidationValues } from '../../../helpers/textValues';
 import { FlowStatus } from '../../../models/FlowStatus';
 import { FlowSteps } from '../../../models/FlowSteps';
+import { BaseComponent } from '../../base-component';
 export class SmsCodeValidation {
   constructor() {
     this.title = undefined;
@@ -13,13 +13,20 @@ export class SmsCodeValidation {
     this.code = undefined;
     this.prefilledPhone = false;
     this.canSend = false;
-    this.apiCall = new ApiCall();
+    if (store.flowStatus == FlowStatus.PHONE) {
+      this.baseComponent = new BaseComponent(FlowSteps.OtpSend);
+    }
+    if (store.flowStatus == FlowStatus.CODE) {
+      this.baseComponent = new BaseComponent(FlowSteps.OtpCheck);
+    }
+    this.baseComponent.setEventEmitter(this.apiErrorEvent);
   }
   async doAction() {
     try {
       this.canSend = false;
+      await this.baseComponent.finalize();
       if (store.flowStatus == FlowStatus.CODE || store.flowStatus == FlowStatus.CODEERROR) {
-        var codeChecked = await this.apiCall.CheckOTPCode(store.requestId, this.code);
+        var codeChecked = await this.baseComponent.apiCall.CheckOTPCode(store.requestId, this.code);
         if (codeChecked === true) {
           store.flowStatus = FlowStatus.ID;
         }
@@ -28,7 +35,7 @@ export class SmsCodeValidation {
         }
       }
       if (store.flowStatus == FlowStatus.PHONE) {
-        var codeSent = await this.apiCall.SendOTPCode(store.requestId, this.phoneNumber);
+        var codeSent = await this.baseComponent.apiCall.SendOTPCode(store.requestId, this.phoneNumber);
         if (codeSent === true) {
           store.flowStatus = FlowStatus.CODE;
         }
@@ -56,17 +63,7 @@ export class SmsCodeValidation {
     }
   }
   async componentDidLoad() {
-    try {
-      if (store.flowStatus == FlowStatus.PHONE) {
-        await this.apiCall.AddStep(FlowSteps.OtpSend);
-      }
-      if (store.flowStatus == FlowStatus.CODE) {
-        await this.apiCall.AddStep(FlowSteps.OtpCheck);
-      }
-    }
-    catch (e) {
-      this.apiErrorEvent.emit(e);
-    }
+    await this.baseComponent.initialize();
   }
   handleChangePhone(ev) {
     let value = ev.target ? ev.target.value : '';