@saasquatch/mint-components 1.13.0-9 → 1.13.1-0

package/dist/collection/components/tax-and-cash/sqm-tax-and-cash-dashboard/useTaxAndCashDashboard.js

@@ -5,6 +5,8 @@ import { vatLabels } from "../countries";
 import { TAX_CONTEXT_NAMESPACE, TAX_FORM_CONTEXT_NAMESPACE, USER_QUERY_NAMESPACE, } from "../sqm-tax-and-cash/data";
 import { INDIRECT_TAX_PROVINCES, INDIRECT_TAX_SPAIN_REGIONS, } from "../subregions";
 import { taxTypeToName } from "../utils";
+import { getStatus } from "../sqm-payout-status-alert/usePayoutStatus";
+import { useVeriffApp, VERIFF_COMPLETE_EVENT_KEY } from "../useVeriffApp";
 function getCountryName(countryCode, locale) {
   if (!countryCode)
     return undefined;
@@ -40,16 +42,17 @@ function getIndirectTaxType(taxInformation) {
   return "Indirect Tax";
 }
 export const useTaxAndCashDashboard = (props) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
   const setStep = useSetParent(TAX_CONTEXT_NAMESPACE);
   const setContext = useSetParent(TAX_FORM_CONTEXT_NAMESPACE);
   const [showDialog, setShowDialog] = useState(false);
+  const { render, loading: veriffLoading, errors: veriffErrors, } = useVeriffApp();
   const locale = useLocale();
   useEffect(() => {
     // Clear override context once on submitted
     setContext({});
   }, []);
-  const { data, loading, errors: userError, } = useParentQueryValue(USER_QUERY_NAMESPACE);
+  const { data, loading, errors: userError, refetch, } = useParentQueryValue(USER_QUERY_NAMESPACE);
   const publisher = (_b = (_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.impactConnection) === null || _b === void 0 ? void 0 : _b.publisher;
   const documentType = publisher === null || publisher === void 0 ? void 0 : publisher.requiredTaxDocumentType;
   const submissionDate = (_c = publisher === null || publisher === void 0 ? void 0 : publisher.currentTaxDocument) === null || _c === void 0 ? void 0 : _c.dateCreated;
@@ -74,6 +77,14 @@ export const useTaxAndCashDashboard = (props) => {
     setStep("/3");
   };
   const provinceName = (_d = INDIRECT_TAX_PROVINCES.find((p) => { var _a; return p.regionCode === ((_a = publisher === null || publisher === void 0 ? void 0 : publisher.taxInformation) === null || _a === void 0 ? void 0 : _a.indirectTaxRegion); })) === null || _d === void 0 ? void 0 : _d.displayName;
+  const payoutStatus = data ? getStatus(data) : null;
+  useEffect(() => {
+    const cb = () => refetch();
+    window.addEventListener(VERIFF_COMPLETE_EVENT_KEY, cb);
+    return () => {
+      window.removeEventListener(VERIFF_COMPLETE_EVENT_KEY, cb);
+    };
+  }, []);
   return {
     states: {
       dateSubmitted,
@@ -95,9 +106,13 @@ export const useTaxAndCashDashboard = (props) => {
       loading,
       loadingError: !!(userError === null || userError === void 0 ? void 0 : userError.message),
       showNewFormDialog: showDialog,
+      hasHold: !!((_m = publisher === null || publisher === void 0 ? void 0 : publisher.payoutsAccount) === null || _m === void 0 ? void 0 : _m.hold),
+      payoutStatus,
+      veriffLoading,
     },
     callbacks: {
       onClick: () => setShowDialog(true),
+      onVerifyClick: () => render(),
       onEditPayoutInfo,
       onNewFormCancel: () => setShowDialog(false),
       onNewFormClick,

package/dist/collection/components/tax-and-cash/sqm-user-info-form/sqm-user-info-form-view.js

@@ -85,7 +85,6 @@ const style = {
   },
   PhoneInputsSection: {
     display: "flex",
-    alignItems: "flex-start",
     flexDirection: "column",
     gap: "4px",
     "& p": {
@@ -96,7 +95,6 @@ const style = {
   },
   PhoneInputsContainer: {
     display: "flex",
-    alignItems: "flex-start",
     gap: "4px",
     width: "100%",
     "& #phoneNumber": {
@@ -165,7 +163,12 @@ export const UserInfoFormView = (props) => {
         h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
         h("strong", null, text.error.loadingErrorAlertHeader),
         h("br", null),
-        text.error.loadingErrorAlertDescription),
+        intl.formatMessage({
+          id: "loadingErrorAlertDescription",
+          defaultMessage: text.error.loadingErrorAlertDescription,
+        }, {
+          supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        })),
       h("br", null))),
     states.loading ? (h(GeneralLoadingView, null)) : (h("div", null,
       h("div", { class: classes.TextContainer },
@@ -180,12 +183,22 @@ export const UserInfoFormView = (props) => {
         h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
         h("strong", null, text.error.generalTitle),
         h("br", null),
-        text.error.generalDescription)),
+        intl.formatMessage({
+          id: "generalDescription",
+          defaultMessage: text.error.generalDescription,
+        }, {
+          supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        }))),
       (states.isPartner || states.isUser) && (h("sl-alert", { type: "primary", open: true, class: sheet.classes.PartnerAlertContainer, exportparts: "base: alert-base, icon:alert-icon" },
         h("sl-icon", { slot: "icon", name: "info-circle" }),
         h("strong", null, text.isPartnerAlertHeader),
         h("br", null),
-        text.isPartnerAlertDescription)),
+        intl.formatMessage({
+          id: "isPartnerAlertDescription",
+          defaultMessage: text.isPartnerAlertDescription,
+        }, {
+          supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        }))),
       h("div", null,
         h("div", { class: classes.InputContainer },
           h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", value: formState.firstName, label: text.firstName, disabled: states.disabled || states.isUser || states.isPartner }, (((_b = formState.errors) === null || _b === void 0 ? void 0 : _b.firstName) ? {
@@ -237,10 +250,11 @@ export const UserInfoFormView = (props) => {
                     h("div", { slot: "prefix" }, `${(_a = PHONE_EXTENSIONS[c.countryCode]) === null || _a === void 0 ? void 0 : _a.name} `), (_b = PHONE_EXTENSIONS[c.countryCode]) === null || _b === void 0 ? void 0 :
                     _b.dial_code));
                 })),
-              h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", id: "phoneNumber", name: "/phoneNumber", value: formState.phoneNumber, validationError: ({ value }) => 
-                // Naive phone number validation
-                validateBillingField(/[a-zA-Z]+/, value) &&
-                  formatErrorMessage(text.phoneNumber, text.error.fieldInvalidError), disabled: states.disabled || states.isPartner }, (((_k = formState.errors) === null || _k === void 0 ? void 0 : _k.phoneNumber) ? {
+              h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", id: "phoneNumber", name: "/phoneNumber", value: formState.phoneNumber, validationError: ({ value }) => {
+                  // Naive phone number validation
+                  validateBillingField(/[a-zA-Z]+/, value) &&
+                    formatErrorMessage(text.phoneNumber, text.error.fieldInvalidError);
+                }, disabled: states.disabled || states.isPartner }, (((_k = formState.errors) === null || _k === void 0 ? void 0 : _k.phoneNumber) ? {
                 class: classes.ErrorInput,
                 helpText: formatErrorMessage(text.phoneNumber, formState.errors.phoneNumber),
               }

package/dist/collection/components/tax-and-cash/sqm-user-info-form/sqm-user-info-form.js

@@ -88,7 +88,7 @@ export class TaxForm {
      * @uiName Participant is a partner alert description
      * @uiWidget textArea
      */
-    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact Support or sign up for this referral program with a different email.";
+    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact our {supportLink} or sign up for this referral program with a different email.";
     /**
      * Part of the alert displayed at the top of the page.
      * @uiName Form submission error message title
@@ -100,7 +100,7 @@ export class TaxForm {
      * @uiName Form submission error message description
      * @uiWidget textArea
      */
-    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact Support.";
+    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Edit the property called terms and conditions text to change what's displayed for {termsAndConditionsLink}.
      * @uiName Terms and conditions checkbox
@@ -116,7 +116,7 @@ export class TaxForm {
      * The link that appears in the terms and conditions checkbox
      * @uiName Terms and conditions link
      */
-    this.termsAndConditionsLink = "/payout-terms-and-conditions";
+    this.termsAndConditionsLink = "https://terms.advocate.impact.com/PayoutTermsAndConditions.html";
     /**
      * Placeholder text displayed in the country search dropdown
      * @uiName Country field placeholder text
@@ -153,12 +153,16 @@ export class TaxForm {
      * @uiName Page load error message description
      * @uiWidget textArea
      */
-    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact Support.";
+    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Displayed at the top of the page on all set up steps.
      * @uiName Page description
      */
     this.taxAndPayoutsDescription = "Submit your tax documents and add your banking information to receive your rewards.";
+    /**
+     * @uiName Support link text
+     */
+    this.supportLink = "support team";
     withHooks(this);
   }
   disconnectedCallback() { }
@@ -572,7 +576,7 @@ export class TaxForm {
       },
       "attribute": "is-partner-alert-description",
       "reflect": false,
-      "defaultValue": "\"If you don\u2019t recognize this referral program provider or believe this is a mistake, please contact Support or sign up for this referral program with a different email.\""
+      "defaultValue": "\"If you don\u2019t recognize this referral program provider or believe this is a mistake, please contact our {supportLink} or sign up for this referral program with a different email.\""
     },
     "generalErrorTitle": {
       "type": "string",
@@ -620,7 +624,7 @@ export class TaxForm {
       },
       "attribute": "general-error-description",
       "reflect": false,
-      "defaultValue": "\"Please review your information and try again. If this problem continues, contact Support.\""
+      "defaultValue": "\"Please review your information and try again. If this problem continues, contact our {supportLink}.\""
     },
     "allowBankingCollection": {
       "type": "string",
@@ -686,7 +690,7 @@ export class TaxForm {
       },
       "attribute": "terms-and-conditions-link",
       "reflect": false,
-      "defaultValue": "\"/payout-terms-and-conditions\""
+      "defaultValue": "\"https://terms.advocate.impact.com/PayoutTermsAndConditions.html\""
     },
     "searchForCountryText": {
       "type": "string",
@@ -839,7 +843,7 @@ export class TaxForm {
       },
       "attribute": "loading-error-alert-description",
       "reflect": false,
-      "defaultValue": "\"Please refresh the page and try again. If this problem continues, contact Support.\""
+      "defaultValue": "\"Please refresh the page and try again. If this problem continues, contact our {supportLink}.\""
     },
     "taxAndPayoutsDescription": {
       "type": "string",
@@ -862,6 +866,27 @@ export class TaxForm {
       "reflect": false,
       "defaultValue": "\"Submit your tax documents and add your banking information to receive your rewards.\""
     },
+    "supportLink": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Support link text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "support-link",
+      "reflect": false,
+      "defaultValue": "\"support team\""
+    },
     "demoData": {
       "type": "unknown",
       "mutable": false,

package/dist/collection/components/tax-and-cash/sqm-user-info-form/useUserInfoForm.js

@@ -24,17 +24,20 @@ export function useUserInfoForm(props) {
   const [filteredCurrencies, setFilteredCurrencies] = useState(currencies || []);
   const [formErrors, setErrors] = useState({});
   useEffect(() => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
     const user = data === null || data === void 0 ? void 0 : data.user;
     if (!user || step !== "/1")
       return;
     // If form already filled out, skip initialising it
     if (objectIsFull(userFormContext))
       return;
-    if (((_a = user.impactConnection) === null || _a === void 0 ? void 0 : _a.publisher) && ((_b = user.impactConnection) === null || _b === void 0 ? void 0 : _b.user)) {
+    // Prefer MI email if it was verified before this
+    const email = ((_a = user.managedIdentity) === null || _a === void 0 ? void 0 : _a.emailVerified) ? user.managedIdentity.email
+      : user.email;
+    if (((_b = user.impactConnection) === null || _b === void 0 ? void 0 : _b.publisher) && ((_c = user.impactConnection) === null || _c === void 0 ? void 0 : _c.user)) {
       // Initialise with partner information
       setUserFormContext({
-        email: user.email,
+        email,
         firstName: user.impactConnection.user.firstName,
         lastName: user.impactConnection.user.lastName,
         countryCode: user.impactConnection.publisher.countryCode,
@@ -50,17 +53,17 @@ export function useUserInfoForm(props) {
     else if (!(userFormContext === null || userFormContext === void 0 ? void 0 : userFormContext.email)) {
       // Initialise with user information
       setUserFormContext({
-        email: user.email,
+        email,
         firstName: user.firstName,
         lastName: user.lastName,
         countryCode: user.countryCode || "US",
-        currency: (_c = user.customFields) === null || _c === void 0 ? void 0 : _c.currency,
-        phoneNumberCountryCode: ((_d = user.customFields) === null || _d === void 0 ? void 0 : _d.phoneNumberCountryCode) || "US",
-        phoneNumber: (_e = user.customFields) === null || _e === void 0 ? void 0 : _e.phoneNumber,
-        address: (_f = user.customFields) === null || _f === void 0 ? void 0 : _f.address,
-        city: (_g = user.customFields) === null || _g === void 0 ? void 0 : _g.city,
-        state: (_h = user.customFields) === null || _h === void 0 ? void 0 : _h.state,
-        postalCode: (_j = user.customFields) === null || _j === void 0 ? void 0 : _j.postalCode,
+        currency: (_d = user.customFields) === null || _d === void 0 ? void 0 : _d.currency,
+        phoneNumberCountryCode: ((_e = user.customFields) === null || _e === void 0 ? void 0 : _e.phoneNumberCountryCode) || "US",
+        phoneNumber: (_f = user.customFields) === null || _f === void 0 ? void 0 : _f.phoneNumber,
+        address: (_g = user.customFields) === null || _g === void 0 ? void 0 : _g.address,
+        city: (_h = user.customFields) === null || _h === void 0 ? void 0 : _h.city,
+        state: (_j = user.customFields) === null || _j === void 0 ? void 0 : _j.state,
+        postalCode: (_k = user.customFields) === null || _k === void 0 ? void 0 : _k.postalCode,
       });
     }
   }, [data, step, userFormContext]);
@@ -139,6 +142,8 @@ export function useUserInfoForm(props) {
     const { allowBankingCollection, ...userData } = formData;
     setUserFormContext({
       ...userFormContext,
+      firstName: userData.firstName,
+      lastName: userData.lastName,
       phoneNumberCountryCode: userData.phoneNumberCountryCode,
       phoneNumber: userData.phoneNumber,
       countryCode: userData.countryCode,

package/dist/collection/components/tax-and-cash/useVeriffApp.js

@@ -0,0 +1,64 @@
+import { useMutation, useUserIdentity, } from "@saasquatch/component-boilerplate";
+import { createVeriffFrame, MESSAGES } from "@veriff/incontext-sdk";
+import { gql } from "graphql-request";
+const CREATE_IMPACT_VERIFICATION_SESSION = gql `
+  mutation createImpactVerificationSession($user: UserIdInput!) {
+    createImpactPublisherIdentityVerificationSession(user: $user) {
+      sessionUrl
+    }
+  }
+`;
+const REFRESH_USER_STATUS = gql `
+  mutation refreshImpactPublisherFinanceStatus($user: UserIdInput!) {
+    refreshImpactPublisherFinanceStatus(user: $user) {
+      id
+    }
+  }
+`;
+export const VERIFF_COMPLETE_EVENT_KEY = "sqm:veriff-updated";
+export function useVeriffApp() {
+  const { id, accountId } = useUserIdentity();
+  const [createImpactVerificationSessionMutation, { loading, errors }] = useMutation(CREATE_IMPACT_VERIFICATION_SESSION);
+  const [refreshImpactPublisherFinanceStatus, { loading: refreshLoading, errors: refreshErrors },] = useMutation(REFRESH_USER_STATUS);
+  const refresh = async () => {
+    try {
+      const res = await refreshImpactPublisherFinanceStatus({
+        user: { id, accountId },
+      });
+      if (!res || res.message)
+        throw new Error();
+      window.dispatchEvent(new Event(VERIFF_COMPLETE_EVENT_KEY));
+    }
+    catch (e) {
+      console.error("Failed to initialise Veriff:", e);
+    }
+  };
+  const render = async () => {
+    try {
+      const res = await createImpactVerificationSessionMutation({
+        user: { id, accountId },
+      });
+      if (!res || res.message)
+        throw new Error();
+      const sessionUrl = res.createImpactPublisherIdentityVerificationSession.sessionUrl;
+      createVeriffFrame({
+        url: sessionUrl,
+        onEvent: (msg) => {
+          switch (msg) {
+            case MESSAGES.FINISHED:
+            case MESSAGES.CANCELED:
+              refresh();
+          }
+        },
+      });
+    }
+    catch (e) {
+      console.error("Failed to initialise Veriff:", e);
+    }
+  };
+  return {
+    render,
+    loading: loading || refreshLoading,
+    errors: errors || refreshErrors,
+  };
+}