@flarehr/apollo-super-selection 4.33.32977 → 4.34.34409

package/dist/lib/collection/components/super-selection-app/prefill-fund/prefill-invalid-smsf.js

@@ -0,0 +1,144 @@
+import { Component, h, Prop, State } from '@stencil/core';
+import { EventTrackingService } from '../services/event-tracking.service';
+import navigationService from '../services/navigation.service';
+import { SuperSelectionAppRoutes } from '../services/super-selection-app.routes';
+import { Header, isNullOrWhitespace } from './prefill-common';
+import { BankAccountBsb, BankAccountName, BankAccountNumber, FundAbn, FundAddress, FundAddressCity, FundAddressLine1, FundAddressLine2, FundAddressPostcode, FundAddressState, FundEsa, MemberGivenNames, MemberLastName, SmsfFundName } from './prefill-types';
+export class PrefillInvalidSMSF {
+  constructor() {
+    this.eventTrackingService = EventTrackingService.Instance;
+    this.createSuperFundPrefillDeclinedDetail = (prefill) => {
+      return {
+        fundType: 'SMSF',
+        isAbnValid: prefill.fundAbn.valid,
+        isMemberFirstNamePresent: !isNullOrWhitespace(prefill.memberFirstName),
+        isMemberLastNamePresent: !isNullOrWhitespace(prefill.memberFamilyName)
+      };
+    };
+    this.createSuperFundPrefillViewedDetail = (prefill) => {
+      return {
+        fundType: 'SMSF',
+        isAbnValid: prefill.fundAbn.valid,
+        isMemberFirstNamePresent: !isNullOrWhitespace(prefill.memberFirstName),
+        isMemberLastNamePresent: !isNullOrWhitespace(prefill.memberFamilyName)
+      };
+    };
+  }
+  componentDidLoad() {
+    const detail = this.createSuperFundPrefillViewedDetail(this.prefill);
+    return this.eventTrackingService.TrackSuperFundPrefillViewedAsync(detail);
+  }
+  async componentWillLoad() {
+    if (this.prefill && !this.prefill.fundAbn.valid) {
+      this.initialiseComponent(this.prefill);
+    }
+    else {
+      // If prefill does not exist, or is valid we should
+      // not have landed on this page, navigate to consent page
+      navigationService.navigateInternally(this.history, SuperSelectionAppRoutes.PrefillInvalidMyOwnFundPage);
+    }
+  }
+  render() {
+    return (h("div", null,
+      h(Header, null),
+      h("div", { class: "flex flex-col items-center gap-8 mt-8 sm:mt-12" },
+        h("div", { class: "flex max-w-[560px] flex-col items-start gap-6 p-6 border shadow-sm rounded-lg" },
+          h("div", { class: "flex flex-col items-start gap-3 self-stretch" },
+            h("div", { class: "self-stretch text-grey-900 text-lg not-italic font-bold leading-7" }, "Your self-managed super fund (SMSF) details"),
+            h("sss-prefill-error-box", { class: "self-stretch", notificationList: [
+                'The fund ABN is invalid. You are required to choose another fund to continue with your super nomination.'
+              ] }),
+            h("div", { class: "flex flex-col gap-3 self-stretch mt-4" },
+              h("sss-prefill-display-field", { field: this.fundName }),
+              h("sss-prefill-display-field", { field: this.fundAbn }),
+              h("sss-prefill-display-field", { field: this.fundEsa }),
+              h("sss-prefill-display-field", { field: this.fundAddress }),
+              h("sss-prefill-display-field", { field: this.memberLastName }),
+              h("sss-prefill-display-field", { field: this.memberGivenNames }),
+              h("sss-prefill-display-field", { field: this.bankAccountName }),
+              h("sss-prefill-display-field", { field: this.bankAccountBsb }),
+              h("sss-prefill-display-field", { field: this.bankAccountNumber })))),
+        h("div", { class: "flex w-80 flex-col items-start gap-4" },
+          h("sss-button", { class: "self-stretch", fillWidth: true, variant: "primary", promiseFn: () => this.handleFundNominationDeclined() }, "Choose another fund")))));
+  }
+  initialiseComponent(prefill) {
+    this.fundName = new SmsfFundName(prefill.fundName);
+    this.fundAbn = new FundAbn(prefill.fundAbn.value, prefill.fundAbn.valid);
+    this.fundEsa = new FundEsa(prefill.electronicServiceAddress);
+    this.fundAddressLine1 = new FundAddressLine1(prefill.addressLine1);
+    this.fundAddressLine2 = new FundAddressLine2(prefill.addressLine2);
+    this.fundAddressCity = new FundAddressCity(prefill.addressCity);
+    this.fundAddressPostcode = new FundAddressPostcode(prefill.addressPostcode);
+    this.fundAddressState = new FundAddressState(prefill.addressState);
+    this.fundAddress = new FundAddress(this.fundAddressLine1, this.fundAddressLine2, this.fundAddressCity, this.fundAddressState, this.fundAddressPostcode);
+    this.memberGivenNames = new MemberGivenNames(prefill.memberFirstName);
+    this.memberLastName = new MemberLastName(prefill.memberFamilyName);
+    this.bankAccountName = new BankAccountName(prefill.bankAccountName);
+    this.bankAccountBsb = new BankAccountBsb(prefill.bankAccountBsb);
+    this.bankAccountNumber = new BankAccountNumber(prefill.bankAccountNumber);
+  }
+  async handleFundNominationDeclined() {
+    const detail = this.createSuperFundPrefillDeclinedDetail(this.prefill);
+    await this.eventTrackingService.TrackSuperFundPrefillDeclinedAsync(detail);
+    return navigationService.navigateInternally(this.history, SuperSelectionAppRoutes.ConsentPage);
+  }
+  static get is() { return "sss-prefill-invalid-smsf"; }
+  static get properties() { return {
+    "history": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "RouterHistory",
+        "resolved": "RouterHistory",
+        "references": {
+          "RouterHistory": {
+            "location": "import",
+            "path": "@stencil/router"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
+    },
+    "prefill": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "PrefillSMSFChoiceDto",
+        "resolved": "{ fundAbn: { valid: boolean; value: string; }; fundName: string | null; addressLine1: string | null; addressLine2: string | null; addressCity: string | null; addressState: string | null; addressPostcode: string | null; bankAccountBsb: string | null; bankAccountName: string | null; bankAccountNumber: string | null; electronicServiceAddress: string | null; memberFirstName: string | null; memberFamilyName: string | null; }",
+        "references": {
+          "PrefillSMSFChoiceDto": {
+            "location": "import",
+            "path": "../api/super-selection.api.dto"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
+    }
+  }; }
+  static get states() { return {
+    "fundName": {},
+    "fundAbn": {},
+    "fundEsa": {},
+    "fundAddressLine1": {},
+    "fundAddressLine2": {},
+    "fundAddressCity": {},
+    "fundAddressPostcode": {},
+    "fundAddressState": {},
+    "fundAddress": {},
+    "memberGivenNames": {},
+    "memberLastName": {},
+    "bankAccountName": {},
+    "bankAccountBsb": {},
+    "bankAccountNumber": {}
+  }; }
+}

package/dist/lib/collection/components/super-selection-app/prefill-fund/prefill-my-own-fund.js

@@ -0,0 +1,217 @@
+import { Component, h, Prop, State } from '@stencil/core';
+import customFundChoiceApi from '../funds/custom-fund/api/custom-fund-choice.api';
+import { EventTrackingService } from '../services/event-tracking.service';
+import navigationService from '../services/navigation.service';
+import { SuperSelectionAppRoutes } from '../services/super-selection-app.routes';
+import superSelectionAppService from '../services/super-selection-app.service';
+import { DisabledField, Header, isNullOrWhitespace, Style } from './prefill-common';
+import { FundName, FundUsi, MemberGivenNames, MemberLastName, MemberNumber, NAME_PATTERN } from './prefill-types';
+export class PrefillMyOwnFund {
+  constructor() {
+    this.mode = 'review';
+    this.formState = 'pristine';
+    this.isSubmitDisabled = true;
+    this.eventTrackingService = EventTrackingService.Instance;
+    this.createSuperFundPrefillDeclinedDetail = (prefill) => {
+      return {
+        fundType: 'My Own Fund',
+        isUsiValid: prefill.fundDetail.type === 'Valid',
+        isMemberNumberPresent: !isNullOrWhitespace(prefill.memberNumber),
+        isMemberFirstNamePresent: !isNullOrWhitespace(prefill.memberFirstName),
+        isMemberLastNamePresent: !isNullOrWhitespace(prefill.memberFamilyName)
+      };
+    };
+    this.createSuperFundPrefillViewedDetail = (prefill) => {
+      return {
+        fundType: 'My Own Fund',
+        isUsiValid: prefill.fundDetail.type === 'Valid',
+        isMemberNumberPresent: !isNullOrWhitespace(prefill.memberNumber),
+        isMemberFirstNamePresent: !isNullOrWhitespace(prefill.memberFirstName),
+        isMemberLastNamePresent: !isNullOrWhitespace(prefill.memberFamilyName)
+      };
+    };
+  }
+  componentDidLoad() {
+    const detail = this.createSuperFundPrefillViewedDetail(this.prefill);
+    return this.eventTrackingService.TrackSuperFundPrefillViewedAsync(detail);
+  }
+  async componentWillLoad() {
+    if (this.prefill && this.prefill.fundDetail.type === 'Valid') {
+      this.initialiseComponent(this.prefill.fundDetail.fundName, this.prefill);
+    }
+    else {
+      // If prefill does not exist, or is invalid we should
+      // not have landed on this page, navigate to consent page
+      navigationService.navigateInternally(this.history, SuperSelectionAppRoutes.ConsentPage);
+    }
+  }
+  render() {
+    const errorMessages = [
+      this.memberNumber.errorMessage,
+      this.memberLastName.errorMessage,
+      this.memberGivenNames.errorMessage
+    ].filter((err) => err !== null);
+    return (h("div", null,
+      h(Header, null),
+      h("div", { class: "flex flex-col items-center gap-8 mt-8 sm:mt-12" },
+        h("div", { class: "flex max-w-[560px] flex-col items-start gap-6 p-6 border shadow-sm rounded-lg" },
+          h("div", { class: "flex flex-col items-start gap-3.5 self-stretch" },
+            h("div", { class: "self-stretch text-grey-900 text-lg not-italic font-bold leading-7" }, "Your fund details"),
+            h("sss-prefill-warning-box", { class: "self-stretch", notificationList: [
+                'Make sure you are a current member of the fund before completing this step.',
+                'Please check that the fund USI is correct as some funds have similar names.'
+              ] }),
+            this.mode === 'review' && errorMessages.length > 0 && (h("sss-prefill-error-box", { class: "self-stretch", notificationList: errorMessages, withHeader: true })),
+            this.mode === 'review' && (h("div", { class: "flex flex-col gap-3 self-stretch mt-4" },
+              h("sss-prefill-display-field", { field: this.fundUsi }),
+              h("sss-prefill-display-field", { field: this.fundName }),
+              h("sss-prefill-display-field", { field: this.memberNumber }),
+              h("sss-prefill-display-field", { field: this.memberLastName }),
+              h("sss-prefill-display-field", { field: this.memberGivenNames }))),
+            this.mode === 'review' && (h("sss-button", { class: "self-stretch", fillWidth: true, variant: "light", promiseFn: () => this.setModeToEdit() },
+              h("div", { class: "flex flex-row gap-2" },
+                h("div", { class: "text-sm not-italic font-medium leading-4" }, "Edit details"),
+                h("div", { class: "w-4 h-4 relative" },
+                  h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "17", height: "16", viewBox: "0 0 17 16", fill: "currentColor" },
+                    h("path", { d: "M11.369 2.86865C11.9939 2.24381 13.0069 2.24381 13.6318 2.86865C14.2566 3.49349 14.2566 4.50656 13.6318 5.1314L12.9974 5.76571L10.7347 3.50297L11.369 2.86865Z" }),
+                    h("path", { d: "M9.60334 4.63434L2.90039 11.3373V13.6H5.16313L11.8661 6.89708L9.60334 4.63434Z" })))))),
+            this.mode === 'edit' && (h("form", { noValidate: true, onSubmit: (ev) => ev.preventDefault(), class: { 'was-validated': this.formState === 'validated' }, ref: (el) => (this.formElement = el), onInput: (_) => (this.isSubmitDisabled = this.formHasMissingData()) },
+              DisabledField(this.fundName.name, this.fundName.value),
+              DisabledField(this.fundUsi.name, this.fundUsi.value),
+              h("div", { class: "mt-3" },
+                h("label", { class: "text-sm font-medium text-gray-700" }, this.memberNumber.name),
+                h("div", { class: "mt-1" },
+                  h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, pattern: "[A-Za-z0-9]{4,16}", value: this.memberNumber.value, onInput: (ev) => {
+                      this.updateMemberNumber(ev.target.value);
+                    } }),
+                  h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.memberNumber.errorMessage))),
+              h("div", { class: "flex gap-x-4 flex-col sm:flex-row" },
+                h("div", { class: "mt-3 w-full sm:w-1/2" },
+                  h("label", { class: "text-sm font-medium text-gray-700" }, this.memberGivenNames.name),
+                  h("div", { class: "mt-1" },
+                    h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, pattern: NAME_PATTERN, value: this.memberGivenNames.value, onInput: (ev) => {
+                        this.updateMemberGivenNames(ev.target.value);
+                      } }),
+                    h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.memberGivenNames.errorMessage))),
+                h("div", { class: "mt-3 w-full sm:w-1/2" },
+                  h("label", { class: "text-sm font-medium text-gray-700" }, this.memberLastName.name),
+                  h("div", { class: "mt-1" },
+                    h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, pattern: NAME_PATTERN, value: this.memberLastName.value, onInput: (ev) => {
+                        this.updateMemberLastName(ev.target.value);
+                      } }),
+                    h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.memberLastName.errorMessage)))))))),
+        h("div", { class: "flex w-80 flex-col items-start gap-4" },
+          h("sss-button", { class: "self-stretch", fillWidth: true, variant: "primary", disabled: this.isSubmitDisabled, promiseFn: () => this.handleSubmitForm() }, "Continue"),
+          h("sss-button", { class: "self-stretch", fillWidth: true, variant: "secondary", promiseFn: () => this.handleFundNominationDeclined() }, "Choose another fund")))));
+  }
+  initialiseComponent(fundName, prefill) {
+    this.fundUsi = new FundUsi(prefill.fundDetail.fundUsi, true);
+    this.fundName = new FundName(fundName, true);
+    this.memberNumber = new MemberNumber(prefill.memberNumber);
+    this.memberGivenNames = new MemberGivenNames(prefill.memberFirstName);
+    this.memberLastName = new MemberLastName(prefill.memberFamilyName);
+    this.isSubmitDisabled = this.formHasMissingData();
+  }
+  isFormValid() {
+    return (this.fundUsi.isValid &&
+      this.fundName.isValid &&
+      this.memberNumber.isValid &&
+      this.memberGivenNames.isValid &&
+      this.memberLastName.isValid);
+  }
+  formHasMissingData() {
+    return (this.fundUsi.isEmpty ||
+      this.fundName.isEmpty ||
+      this.memberNumber.isEmpty ||
+      this.memberGivenNames.isEmpty ||
+      this.memberLastName.isEmpty);
+  }
+  setModeToEdit() {
+    this.mode = 'edit';
+    return Promise.resolve();
+  }
+  updateMemberNumber(memberNumber) {
+    this.memberNumber = new MemberNumber(memberNumber.trim());
+  }
+  updateMemberGivenNames(memberGivenNames) {
+    this.memberGivenNames = new MemberGivenNames(memberGivenNames.trimStart());
+  }
+  updateMemberLastName(memberLastName) {
+    this.memberLastName = new MemberLastName(memberLastName.trim());
+  }
+  async handleSubmitForm() {
+    this.formState = 'validated';
+    if (!this.isFormValid()) {
+      return;
+    }
+    if (this.mode === 'edit' && !this.formElement.checkValidity()) {
+      return;
+    }
+    navigationService.navigateInternallyToStandardChoice({
+      history: this.history,
+      fundName: this.fundName.value,
+      handleSubmitFn: async (standardChoiceFormSignature) => {
+        const customFundChoiceDto = Object.assign({ fundUsi: this.fundUsi.value, memberNumber: this.memberNumber.value, memberFirstName: this.memberGivenNames.value, memberFamilyName: this.memberLastName.value, standardChoiceFormSignature }, superSelectionAppService.promotedFundsConfig);
+        await customFundChoiceApi.submitCustomFundChoiceAsync(customFundChoiceDto);
+      }
+    });
+  }
+  async handleFundNominationDeclined() {
+    const detail = this.createSuperFundPrefillDeclinedDetail(this.prefill);
+    await this.eventTrackingService.TrackSuperFundPrefillDeclinedAsync(detail);
+    return navigationService.navigateInternally(this.history, SuperSelectionAppRoutes.ConsentPage);
+  }
+  static get is() { return "sss-prefill-my-own-fund"; }
+  static get properties() { return {
+    "history": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "RouterHistory",
+        "resolved": "RouterHistory",
+        "references": {
+          "RouterHistory": {
+            "location": "import",
+            "path": "@stencil/router"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
+    },
+    "prefill": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "PrefillOwnFundChoiceDto",
+        "resolved": "{ fundDetail: { type: \"Valid\"; fundUsi: string; fundName: string; } | { type: \"Invalid\"; fundUsi: string; }; memberNumber: string | null; memberFirstName: string | null; memberFamilyName: string | null; }",
+        "references": {
+          "PrefillOwnFundChoiceDto": {
+            "location": "import",
+            "path": "../api/super-selection.api.dto"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
+    }
+  }; }
+  static get states() { return {
+    "mode": {},
+    "formState": {},
+    "isSubmitDisabled": {},
+    "fundUsi": {},
+    "fundName": {},
+    "memberNumber": {},
+    "memberGivenNames": {},
+    "memberLastName": {}
+  }; }
+}