@saasquatch/mint-components 2.2.0 → 2.3.0-2

package/dist/cjs/{usePayoutStatus-0192fccd.js → useIndirectTaxForm-c3c1ec56.js}

@@ -2,8 +2,10 @@
 
 const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
 const index_module = require('./index.module-f8c8495f.js');
-
-const TAX_FORM_UPDATED_EVENT_KEY = "sqm:tax-form-updated";
+const jsonpointer = require('./jsonpointer-11327262.js');
+const utils = require('./utils-a3b3d05b.js');
+const data = require('./data-89ac73dd.js');
+const eventKeys = require('./eventKeys-7af4df4d.js');
 
 var toArray = function toArray(a) {
   var ret = Array(a.length);
@@ -1062,10 +1064,10 @@ function usePayoutStatus(props) {
   }, [data]);
   domContextHooks_module.useEffect(() => {
     const cb = () => refetch();
-    window.addEventListener(TAX_FORM_UPDATED_EVENT_KEY, cb);
+    window.addEventListener(eventKeys.TAX_FORM_UPDATED_EVENT_KEY, cb);
     window.addEventListener(VERIFF_COMPLETE_EVENT_KEY, cb);
     return () => {
-      window.removeEventListener(TAX_FORM_UPDATED_EVENT_KEY, cb);
+      window.removeEventListener(eventKeys.TAX_FORM_UPDATED_EVENT_KEY, cb);
       window.removeEventListener(VERIFF_COMPLETE_EVENT_KEY, cb);
     };
   }, []);
@@ -1109,8 +1111,295 @@ function usePayoutStatus(props) {
   };
 }
 
-exports.TAX_FORM_UPDATED_EVENT_KEY = TAX_FORM_UPDATED_EVENT_KEY;
+const CONNECT_PARTNER = index_module.dist.gql `
+  mutation createImpactConnection($vars: ImpactConnectionInput!) {
+    createImpactConnection(impactConnectionInput: $vars) {
+      success
+      validationErrors {
+        field
+        message
+      }
+      user {
+        id
+        accountId
+        impactConnection {
+          connected
+          publisher {
+            brandedSignup
+            requiredTaxDocumentType
+            currentTaxDocument {
+              type
+              status
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+const COMPLETE_PARTNER = index_module.dist.gql `
+  mutation completeImpactConnection($vars: ImpactConnectionInput!) {
+    completeImpactConnection(impactConnectionInput: $vars) {
+      success
+      validationErrors {
+        field
+        message
+      }
+      user {
+        id
+        accountId
+        impactConnection {
+          connected
+          publisher {
+            brandedSignup
+            requiredTaxDocumentType
+            currentTaxDocument {
+              type
+              status
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+function getOption(countries, countryCode) {
+  if (!countries)
+    return;
+  if (countries.find((c) => c.countryCode === countryCode)) {
+    return "otherRegion";
+  }
+  else {
+    return "notRegistered";
+  }
+}
+function useIndirectTaxForm(props) {
+  var _a, _b, _c, _d, _e;
+  const user = index_module.J();
+  const locale = index_module.L();
+  const formRef = domContextHooks_module.useRef(null);
+  const context = index_module.Fn(data.TAX_FORM_CONTEXT_NAMESPACE);
+  const [step, setStep] = index_module.Pn(data.TAX_CONTEXT_NAMESPACE);
+  const [connectImpactPartner, { loading: connectLoading }] = index_module.$e(CONNECT_PARTNER);
+  const [completeImpactPartner, { loading: completeLoading }] = index_module.$e(COMPLETE_PARTNER);
+  const userForm = index_module.Fn(data.USER_FORM_CONTEXT_NAMESPACE);
+  const { data: userData, refetch, errors: userError, } = index_module.$n(data.USER_QUERY_NAMESPACE);
+  const { data: _countriesRes, loading: countriesLoading } = index_module.$n(data.COUNTRIES_QUERY_NAMESPACE);
+  const intlLocale = (locale === null || locale === void 0 ? void 0 : locale.replace("_", "-")) || "en";
+  const _countries = domContextHooks_module.useMemo(() => { var _a, _b; return (_b = (_a = _countriesRes === null || _countriesRes === void 0 ? void 0 : _countriesRes.impactPayoutCountries) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.map((country) => utils.getCountryObj({ countryCode: country.countryCode, locale: intlLocale })); }, [(_a = _countriesRes === null || _countriesRes === void 0 ? void 0 : _countriesRes.impactPayoutCountries) === null || _a === void 0 ? void 0 : _a.data]);
+  const [loading, setLoading] = domContextHooks_module.useState(false);
+  const [formState, setFormState] = domContextHooks_module.useState({});
+  const [errors, setErrors] = domContextHooks_module.useState({});
+  const [countrySearch, setCountrySearch] = domContextHooks_module.useState("");
+  const [filteredCountries, setFilteredCountries] = domContextHooks_module.useState(_countries || []);
+  const [option, setOption] = domContextHooks_module.useState("notRegistered");
+  const publisher = (_c = (_b = userData === null || userData === void 0 ? void 0 : userData.user) === null || _b === void 0 ? void 0 : _b.impactConnection) === null || _c === void 0 ? void 0 : _c.publisher;
+  domContextHooks_module.useEffect(() => {
+    // reset redirect hash
+    window.location.hash = "";
+  }, []);
+  domContextHooks_module.useEffect(() => {
+    var _a;
+    if (!((_a = publisher === null || publisher === void 0 ? void 0 : publisher.taxInformation) === null || _a === void 0 ? void 0 : _a.indirectTaxCountryCode))
+      return;
+    const _option = getOption(_countries, publisher.taxInformation.indirectTaxCountryCode);
+    setOption(_option);
+  }, [publisher, _countries]);
+  domContextHooks_module.useEffect(() => {
+    if (countrySearch.trim() === "") {
+      setFilteredCountries(_countries || []);
+    }
+    else {
+      setFilteredCountries((_countries === null || _countries === void 0 ? void 0 : _countries.filter((c) => c.displayName.toLowerCase().includes(countrySearch.toLowerCase()))) || []);
+    }
+  }, [countrySearch, _countries]);
+  domContextHooks_module.useEffect(() => {
+    var _a, _b;
+    const user = userData === null || userData === void 0 ? void 0 : userData.user;
+    if (!user)
+      return;
+    if ((_b = (_a = user.impactConnection) === null || _a === void 0 ? void 0 : _a.publisher) === null || _b === void 0 ? void 0 : _b.taxInformation) {
+      setFormState({
+        province: user.impactConnection.publisher.taxInformation.indirectTaxRegion,
+        subRegion: user.impactConnection.publisher.taxInformation.indirectTaxRegion,
+        hasQst: !!user.impactConnection.publisher.taxInformation.additionalTaxId,
+        qstNumber: user.impactConnection.publisher.taxInformation.additionalTaxId,
+        hasSubRegionTaxNumber: !!user.impactConnection.publisher.taxInformation.withholdingTaxId,
+        subRegionTaxNumber: user.impactConnection.publisher.taxInformation.withholdingTaxId,
+        selectedRegion: user.impactConnection.publisher.taxInformation.indirectTaxCountryCode,
+        indirectTaxNumber: user.impactConnection.publisher.taxInformation.indirectTaxId,
+      });
+    }
+    else {
+      setFormState({
+        selectedRegion: (user === null || user === void 0 ? void 0 : user.countryCode) || (userForm === null || userForm === void 0 ? void 0 : userForm.countryCode),
+      });
+    }
+  }, [userData, userForm]);
+  const onFormChange = (field, e) => {
+    var _a, _b;
+    const value = (_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.__value;
+    if (!value)
+      console.error("Could not detect select change");
+    setFormState((p) => ({ ...p, [field]: value }));
+  };
+  async function connectPartner(formData) {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const vars = {
+      user: {
+        id: user.id,
+        accountId: user.accountId,
+      },
+      firstName: userForm.firstName,
+      lastName: userForm.lastName,
+      countryCode: userForm.countryCode,
+      currency: userForm.currency,
+      address: userForm.address,
+      city: userForm.city,
+      state: userForm.state,
+      postalCode: userForm.postalCode,
+      phoneNumber: userForm.phoneNumber,
+      phoneNumberCountryCode: userForm.phoneNumberCountryCode,
+      indirectTaxCountryCode: formData.selectedRegion,
+      indirectTaxRegion: formData.province || formData.subRegion,
+      indirectTaxId: formData.indirectTaxNumber,
+      additionalTaxId: formData.qstNumber,
+      withholdingTaxId: formData.subRegionTaxNumber,
+    };
+    // If the partner has already been started call completeImpactConnection
+    // to fill in the remaining details. Otherwise create from scratch.
+    let result = null;
+    let connectionResult;
+    if (((_b = (_a = userData === null || userData === void 0 ? void 0 : userData.user) === null || _a === void 0 ? void 0 : _a.impactConnection) === null || _b === void 0 ? void 0 : _b.connectionStatus) === "STARTED") {
+      result = await completeImpactPartner({
+        vars,
+      });
+      connectionResult = (_c = result) === null || _c === void 0 ? void 0 : _c.completeImpactConnection;
+    }
+    else {
+      result = await connectImpactPartner({
+        vars,
+      });
+      connectionResult = (_d = result) === null || _d === void 0 ? void 0 : _d.createImpactConnection;
+    }
+    if (!result || ((_e = result) === null || _e === void 0 ? void 0 : _e.message))
+      throw new Error();
+    if (!(connectionResult === null || connectionResult === void 0 ? void 0 : connectionResult.success)) {
+      // Output backend errors to console for now
+      console.error("Failed to create Impact connection: ", connectionResult === null || connectionResult === void 0 ? void 0 : connectionResult.validationErrors);
+      throw new Error();
+    }
+    await refetch();
+    const resultPublisher = (_g = (_f = connectionResult === null || connectionResult === void 0 ? void 0 : connectionResult.user) === null || _f === void 0 ? void 0 : _f.impactConnection) === null || _g === void 0 ? void 0 : _g.publisher;
+    const hasValidCurrentDocument = utils.validTaxDocument(resultPublisher === null || resultPublisher === void 0 ? void 0 : resultPublisher.requiredTaxDocumentType) && (resultPublisher === null || resultPublisher === void 0 ? void 0 : resultPublisher.currentTaxDocument);
+    // Fire form change event
+    window.dispatchEvent(new Event(eventKeys.TAX_FORM_UPDATED_EVENT_KEY));
+    return {
+      resultPublisher,
+      hasValidCurrentDocument,
+    };
+  }
+  const onSubmit = async (event) => {
+    if (!option) {
+      setErrors({ taxDetails: true });
+      return;
+    }
+    let formData = { taxOption: option };
+    let validationErrors = {};
+    const controls = event.target.getFormControls();
+    controls.forEach((control) => {
+      if (!control.name || !control.id)
+        return;
+      if (option === "notRegistered")
+        return; // Don't include fields for notRegistered option
+      const key = control.name;
+      const value = control.value;
+      jsonpointer.jsonpointer.set(formData, key, value);
+      if (control.required && !value) {
+        jsonpointer.jsonpointer.set(validationErrors, key, true);
+      }
+    });
+    setErrors(validationErrors);
+    if (Object.keys(validationErrors).length) {
+      return;
+    }
+    setLoading(true);
+    try {
+      const { resultPublisher, hasValidCurrentDocument } = await connectPartner(formData);
+      if ((resultPublisher === null || resultPublisher === void 0 ? void 0 : resultPublisher.requiredTaxDocumentType) &&
+        !hasValidCurrentDocument) {
+        // Go to docusign form
+        setStep("/3");
+      }
+      else {
+        if (resultPublisher === null || resultPublisher === void 0 ? void 0 : resultPublisher.brandedSignup) {
+          // Go to banking information form
+          setStep("/4");
+        }
+        else {
+          // Go right to the dashboard
+          setStep("/dashboard");
+        }
+      }
+    }
+    catch (e) {
+      setErrors({ general: true });
+    }
+    finally {
+      setLoading(false);
+    }
+  };
+  const onBack = () => {
+    setStep(context.overrideBackStep || "/1");
+  };
+  return {
+    states: {
+      step: step === null || step === void 0 ? void 0 : step.replace("/", ""),
+      hideSteps: context.hideSteps,
+      disabled: loading || countriesLoading || connectLoading || completeLoading,
+      loading: loading || connectLoading || countriesLoading || completeLoading,
+      isPartner: !!((_e = (_d = userData === null || userData === void 0 ? void 0 : userData.user) === null || _d === void 0 ? void 0 : _d.impactConnection) === null || _e === void 0 ? void 0 : _e.publisher),
+      loadingError: !!(userError === null || userError === void 0 ? void 0 : userError.message),
+      formState: {
+        checked: option,
+        errors,
+      },
+    },
+    callbacks: {
+      onBack,
+      onSubmit,
+      onFormChange,
+      onChange: setOption,
+      setCountrySearch,
+      onQstToggle: () => setFormState((p) => ({ ...p, hasQst: !p.hasQst })),
+      onSpainToggle: () => setFormState((p) => ({
+        ...p,
+        hasSubRegionTaxNumber: !p.hasSubRegionTaxNumber,
+      })),
+    },
+    data: {
+      esRegions: utils.INDIRECT_TAX_SPAIN_REGIONS,
+      countries: filteredCountries,
+      allCountries: _countries,
+      provinces: utils.INDIRECT_TAX_PROVINCES,
+    },
+    text: props.getTextProps(),
+    refs: {
+      formRef,
+    },
+    slotProps: {
+      formState: {
+        ...formState,
+        errors,
+      },
+    },
+  };
+}
+
+exports.COMPLETE_PARTNER = COMPLETE_PARTNER;
+exports.CONNECT_PARTNER = CONNECT_PARTNER;
 exports.VERIFF_COMPLETE_EVENT_KEY = VERIFF_COMPLETE_EVENT_KEY;
 exports.getStatus = getStatus;
+exports.useIndirectTaxForm = useIndirectTaxForm;
 exports.usePayoutStatus = usePayoutStatus;
 exports.useVeriffApp = useVeriffApp;