@saasquatch/mint-components 2.1.8-2 → 2.1.8-3

package/dist/collection/components/sqm-share-link/useShareLink.js

@@ -1,7 +1,9 @@
 import { useEngagementMedium, useMutation, useParentValue, useProgramId, useQuery, useUserIdentity, } from "@saasquatch/component-boilerplate";
-import { useState } from "@saasquatch/universal-hooks";
+import { useRef, useState } from "@saasquatch/universal-hooks";
 import { gql } from "graphql-request";
 import { REFERRAL_CODES_NAMESPACE, SET_CODE_COPIED, } from "../sqm-referral-codes/useReferralCodes";
+const MAX_EDITS = 5;
+const CHARACTER_LIMIT = 15;
 const MessageLinkQuery = gql `
   query ($programId: ID, $engagementMedium: UserEngagementMedium!) {
     user: viewer {
@@ -20,19 +22,119 @@ const WIDGET_ENGAGEMENT_EVENT = gql `
     createUserAnalyticsEvent(eventMeta: $eventMeta)
   }
 `;
+const ADD_SHARE_LINK_CODE = gql `
+  mutation ($addShareLinkCodeInput: AddShareLinkCodeInput!) {
+    addShareLinkCode(addShareLinkCodeInput: $addShareLinkCodeInput) {
+      linkCode {
+        linkCode
+        shortUrl
+        referralCode {
+          code
+        }
+      }
+    }
+  }
+`;
+// TODO: Replace with actual validation query when backend is ready
+const VALIDATE_LINK_CODE = gql `
+  query validateLinkCode($linkCode: String!, $programId: ID) {
+    validateShareLinkCode(linkCode: $linkCode, programId: $programId) {
+      valid
+      message
+    }
+  }
+`;
+const GET_LINK_DOMAIN = gql `
+  query getLinkDomain {
+    tenantSettings {
+      primaryLinkDomain {
+        host
+      }
+    }
+  }
+`;
+// TODO: Replace with actual edit count query when backend is ready
+const SHARE_LINK_EDIT_COUNT = gql `
+  query shareLinkEditCount($programId: ID) {
+    viewer {
+      ... on User {
+        shareLinkCodes(programId: $programId) {
+          totalCount
+        }
+      }
+    }
+  }
+`;
+function parseDomainPrefix(url) {
+  try {
+    const parsed = new URL(url);
+    return parsed.origin + "/";
+  }
+  catch {
+    return url;
+  }
+}
+function parsePathSuffix(url) {
+  try {
+    const parsed = new URL(url);
+    // Remove leading slash
+    return parsed.pathname.slice(1) + parsed.search + parsed.hash;
+  }
+  catch {
+    return "";
+  }
+}
 export function useShareLink(props) {
-  var _a, _b;
+  var _a, _b, _c, _d, _e, _f;
   const { programId = useProgramId() } = props;
   const user = useUserIdentity();
   const engagementMedium = useEngagementMedium();
   const contextData = useParentValue(REFERRAL_CODES_NAMESPACE);
-  const { data } = useQuery(MessageLinkQuery, { programId, engagementMedium }, !(user === null || user === void 0 ? void 0 : user.jwt) || !!props.linkOverride || (contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) !== undefined);
+  const { data, refetch } = useQuery(MessageLinkQuery, { programId, engagementMedium }, !(user === null || user === void 0 ? void 0 : user.jwt) || !!props.linkOverride || (contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) !== undefined);
   const [sendLoadEvent] = useMutation(WIDGET_ENGAGEMENT_EVENT);
-  const [setCopied, copiedRes] = useMutation(SET_CODE_COPIED);
+  const [setCopied] = useMutation(SET_CODE_COPIED);
+  const [addShareLinkCode, { loading: isSaving }] = useMutation(ADD_SHARE_LINK_CODE);
+  const { data: linkDomainData } = useQuery(GET_LINK_DOMAIN, {}, !(user === null || user === void 0 ? void 0 : user.jwt) || !props.customizeUrl);
+  // TODO: Wire up when backend query is ready
+  const { data: editCountData } = useQuery(SHARE_LINK_EDIT_COUNT, { programId }, !(user === null || user === void 0 ? void 0 : user.jwt) || !props.customizeUrl);
   const copyString = (_b = ((contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) || ((_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.shareLink))) !== null && _b !== void 0 ? _b : 
   // Shown during loading
   "...";
   const [open, setOpen] = useState(false);
+  const [isEditing, setIsEditing] = useState(false);
+  const [editValue, setEditValue] = useState("");
+  const [validationError, setValidationError] = useState(null);
+  const [isValidating, setIsValidating] = useState(false);
+  const [showSuccess, setShowSuccess] = useState(false);
+  const debounceTimerRef = useRef(undefined);
+  const domainPrefix = parseDomainPrefix(copyString);
+  const hasPrimaryLinkDomain = ((_c = linkDomainData === null || linkDomainData === void 0 ? void 0 : linkDomainData.tenantSettings) === null || _c === void 0 ? void 0 : _c.primaryLinkDomain) != null;
+  const customizeDisabled = !hasPrimaryLinkDomain;
+  const editCount = (_f = (_e = (_d = editCountData === null || editCountData === void 0 ? void 0 : editCountData.viewer) === null || _d === void 0 ? void 0 : _d.shareLinkCodes) === null || _e === void 0 ? void 0 : _e.totalCount) !== null && _f !== void 0 ? _f : 0;
+  const editsRemaining = Math.max(0, MAX_EDITS - editCount);
+  const limitReached = editsRemaining <= 0;
+  function mapErrorCodeToInfo(errorCode) {
+    if (!errorCode)
+      return null;
+    const errorMap = {
+      LINK_TAKEN: {
+        code: "LINK_TAKEN",
+        title: props.linkTakenErrorTitle,
+        description: props.linkTakenErrorDescription,
+      },
+      INVALID_SYMBOLS: {
+        code: "INVALID_SYMBOLS",
+        title: props.invalidSymbolsErrorTitle,
+        description: props.invalidSymbolsErrorDescription,
+      },
+      RESTRICTED_WORD: {
+        code: "RESTRICTED_WORD",
+        title: props.restrictedWordErrorTitle,
+        description: props.restrictedWordErrorDescription,
+      },
+    };
+    return errorMap[errorCode];
+  }
   async function onClick() {
     if (contextData) {
       await setCopied({ referralCode: contextData.referralCode });
@@ -56,5 +158,98 @@ export function useShareLink(props) {
       },
     });
   }
-  return { ...props, onClick, open, copyString: copyString };
+  function onCustomizeClick() {
+    if (limitReached || customizeDisabled)
+      return;
+    setIsEditing(true);
+    setEditValue(parsePathSuffix(copyString));
+    setValidationError(null);
+  }
+  function onEditValueChange(value) {
+    const trimmed = value.slice(0, CHARACTER_LIMIT);
+    setEditValue(trimmed);
+    setValidationError(null);
+    if (debounceTimerRef.current)
+      clearTimeout(debounceTimerRef.current);
+    if (!trimmed) {
+      setIsValidating(false);
+      return;
+    }
+    setIsValidating(true);
+    debounceTimerRef.current = setTimeout(async () => {
+      // TODO: Call actual validation query when backend is ready
+      // Example: const result = await validateLinkCode({ linkCode: trimmed, programId });
+      // if (!result?.validateShareLinkCode?.valid) {
+      //   setValidationError(mapErrorCodeToInfo(result.validateShareLinkCode.errorCode));
+      // }
+      setIsValidating(false);
+    }, 2000);
+  }
+  async function onSave() {
+    var _a, _b;
+    if (!editValue || validationError || isValidating)
+      return;
+    try {
+      await addShareLinkCode({
+        addShareLinkCodeInput: {
+          userId: user === null || user === void 0 ? void 0 : user.id,
+          accountId: user === null || user === void 0 ? void 0 : user.accountId,
+          programId,
+          linkCode: editValue,
+        },
+      });
+      setIsEditing(false);
+      setShowSuccess(true);
+      await refetch();
+      setTimeout(() => setShowSuccess(false), 3000);
+    }
+    catch (e) {
+      const errorCode = (_a = e === null || e === void 0 ? void 0 : e.extensions) === null || _a === void 0 ? void 0 : _a.code;
+      setValidationError((_b = mapErrorCodeToInfo(errorCode)) !== null && _b !== void 0 ? _b : {
+        code: null,
+        title: "Error",
+        description: (e === null || e === void 0 ? void 0 : e.message) || "Failed to save custom link. Please try again.",
+      });
+    }
+  }
+  function onCancel() {
+    setIsEditing(false);
+    setEditValue("");
+    setValidationError(null);
+    setIsValidating(false);
+  }
+  return {
+    copyTextViewProps: {
+      ...props,
+      onClick,
+      open,
+      copyString,
+    },
+    customizeUrl: props.customizeUrl,
+    customizeLinkLabel: props.customizeLinkLabel,
+    saveLabelText: props.saveLabelText,
+    cancelLabelText: props.cancelLabelText,
+    successMessage: props.successMessage,
+    isEditing,
+    editValue,
+    domainPrefix,
+    editsRemaining,
+    maxEdits: MAX_EDITS,
+    limitReached,
+    validationError,
+    isValidating,
+    isSaving,
+    showSuccess,
+    characterLimit: CHARACTER_LIMIT,
+    charactersRemaining: CHARACTER_LIMIT - editValue.length,
+    editLimitText: props.editLimitText,
+    editLimitReachedText: props.editLimitReachedText,
+    supportLinkText: props.supportLinkText,
+    customizeDisabled,
+    customizeDisabledTooltip: props.customizeDisabledTooltip,
+    onCustomizeClick,
+    onEditValueChange,
+    onSave,
+    onCancel,
+  };
 }

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

@@ -65,7 +65,7 @@ export class IndirectTaxForm {
     /**
      * @uiName Indirect tax number field label
      */
-    this.indirectTaxNumber = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}}";
+    this.indirectTaxNumber = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}}";
     /**
      * Displayed to participants registered for QST.
      * @uiName QST number field label
@@ -104,7 +104,7 @@ export class IndirectTaxForm {
     /**
      * @uiName Missing indirect tax number error message
      */
-    this.indirectTaxNumberError = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}} is required";
+    this.indirectTaxNumberError = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}} is required";
     /**
      * Placeholder text displayed in the country search dropdown
      * @uiName Country field placeholder text
@@ -457,7 +457,7 @@ export class IndirectTaxForm {
       },
       "attribute": "indirect-tax-number",
       "reflect": false,
-      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}}\""
+      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}}\""
     },
     "qstNumber": {
       "type": "string",
@@ -631,7 +631,7 @@ export class IndirectTaxForm {
       },
       "attribute": "indirect-tax-number-error",
       "reflect": false,
-      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}} is required\""
+      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}} is required\""
     },
     "searchForCountryText": {
       "type": "string",

package/dist/collection/components/tax-and-cash/sqm-payout-details-card/sqm-payout-details-card.js

@@ -15,7 +15,7 @@ export class PayoutDetailsCard {
      * Badge text indicating payout status
      * @uiName Payout badge status text
      */
-    this.statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} other {Failed}}";
+    this.statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} }";
     /**
      * Display participants' payout preference on the payout information card, indicating the balance at which they want to get paid.
      * @uiName Payout schedule by threshold text
@@ -73,7 +73,7 @@ export class PayoutDetailsCard {
       },
       "attribute": "status-badge-text",
       "reflect": false,
-      "defaultValue": "\"{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} other {Failed}}\""
+      "defaultValue": "\"{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} }\""
     },
     "thresholdPayoutText": {
       "type": "string",

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

@@ -176,7 +176,7 @@ export class TaxAndCashMonolith {
      * @uiName Indirect tax number field label
      * @uiGroup Step 2 Properties
      */
-    this.step2_indirectTaxNumber = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}}";
+    this.step2_indirectTaxNumber = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}}";
     /**
      * @uiName Province field label
      * @uiGroup Step 2 Properties
@@ -186,7 +186,7 @@ export class TaxAndCashMonolith {
      * @uiName Missing indirect tax number error message
      * @uiGroup Step 2 Properties
      */
-    this.step2_indirectTaxNumberError = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}} is required";
+    this.step2_indirectTaxNumberError = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}} is required";
     /**
      * Displayed to participants registered for QST.
      * @uiName QST number field label
@@ -754,7 +754,7 @@ export class TaxAndCashMonolith {
      * @uiName Payout status badge
      * @uiGroup Dashboard Properties
      */
-    this.dashboard_statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} other {Failed} }";
+    this.dashboard_statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} }";
     /**
      * Display participants' payout preference on the payout information card, indicating the balance at which they want to get paid.
      * @uiName Payout schedule by threshold text
@@ -1844,7 +1844,7 @@ export class TaxAndCashMonolith {
       },
       "attribute": "step-2_indirect-tax-number",
       "reflect": false,
-      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}}\""
+      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}}\""
     },
     "step2_province": {
       "type": "string",
@@ -1892,7 +1892,7 @@ export class TaxAndCashMonolith {
       },
       "attribute": "step-2_indirect-tax-number-error",
       "reflect": false,
-      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}} is required\""
+      "defaultValue": "\"{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}} is required\""
     },
     "step2_qstNumber": {
       "type": "string",
@@ -4259,7 +4259,7 @@ export class TaxAndCashMonolith {
       },
       "attribute": "dashboard_status-badge-text",
       "reflect": false,
-      "defaultValue": "\"{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} other {Failed} }\""
+      "defaultValue": "\"{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} }\""
     },
     "dashboard_thresholdPayoutText": {
       "type": "string",

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

@@ -168,7 +168,7 @@ export class TaxAndCashDashboard {
     /**
      * @uiName Payout status badge
      */
-    this.statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} other {Failed} }";
+    this.statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} }";
     /**
      * Display participants' payout preference on the payout information card, indicating the balance at which they want to get paid.
      * @uiName Payout schedule by threshold text
@@ -1049,7 +1049,7 @@ export class TaxAndCashDashboard {
       },
       "attribute": "status-badge-text",
       "reflect": false,
-      "defaultValue": "\"{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} other {Failed} }\""
+      "defaultValue": "\"{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} }\""
     },
     "thresholdPayoutText": {
       "type": "string",