@saasquatch/mint-components 1.11.1-1 → 1.11.1-10

package/dist/cjs/{ShadowViewAddon-2c6026c3.js → ShadowViewAddon-af975b90.js}

@@ -6,7 +6,7 @@ const global = require('./global-02e50f09.js');
 const index_module = require('./index.module-df530553.js');
 const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
-const copyTextView = require('./copy-text-view-a22ad7e7.js');
+const copyTextView = require('./copy-text-view-35a47e8d.js');
 const cjs = require('./cjs-1066ec21.js');
 const mixins = require('./mixins-fe9d4112.js');
 const useChildElements = require('./useChildElements-e0d44916.js');
@@ -381,11 +381,15 @@ function useShareLink(props) {
   const contextData = index_module.In(copyTextView.REFERRAL_CODES_NAMESPACE);
   const { data } = index_module.yn(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] = index_module.$e(WIDGET_ENGAGEMENT_EVENT);
+  const [setUsed, usedRes] = index_module.$e(copyTextView.SET_CODE_USED);
   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] = stencilHooks_module.useState(false);
   function onClick() {
+    if (contextData) {
+      setUsed(true);
+    }
     // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
     // Only if called from a user-initiated event
     navigator.clipboard.writeText(copyString);
@@ -459,7 +463,7 @@ function GenericShare(messageLink, errorText) {
   return messageLink ? window.open(messageLink) : alert(errorText);
 }
 function useShareButton(props) {
-  var _a, _b, _c;
+  var _a, _b;
   const { sharetitle, sharetext, medium } = props;
   const programId = props.programId ? props.programId : index_module.H();
   const user = index_module.Q();
@@ -469,24 +473,29 @@ function useShareButton(props) {
     shareMedium: medium.toUpperCase(),
   };
   const data = index_module.In(copyTextView.REFERRAL_CODES_NAMESPACE);
+  const overrideData = data === null || data === void 0 ? void 0 : data[medium];
   // only queries if a programId is available
-  const res = index_module.yn(MessageLinkQuery$1, variables, !(user === null || user === void 0 ? void 0 : user.jwt) || !programId || (data === null || data === void 0 ? void 0 : data[medium]) !== undefined);
-  const directLink = ((_a = data === null || data === void 0 ? void 0 : data[medium]) === null || _a === void 0 ? void 0 : _a.shareLink) || ((_c = (_b = res === null || res === void 0 ? void 0 : res.data) === null || _b === void 0 ? void 0 : _b.viewer) === null || _c === void 0 ? void 0 : _c.shareLink);
+  const res = index_module.yn(MessageLinkQuery$1, variables, !(user === null || user === void 0 ? void 0 : user.jwt) || !programId || overrideData !== undefined);
+  const [setUsed, usedRes] = index_module.$e(copyTextView.SET_CODE_USED);
+  const directLink = (overrideData === null || overrideData === void 0 ? void 0 : overrideData.shareLink) || ((_b = (_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.viewer) === null || _b === void 0 ? void 0 : _b.shareLink);
   const environment = index_module.getEnvironmentSDK();
   const hide = (medium.toLocaleUpperCase() === "SMS" &&
     window.orientation === undefined) ||
     (medium.toLocaleUpperCase() === "DIRECT" && !window.navigator.share);
   function onClick() {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d;
+    if (overrideData) {
+      setUsed(true);
+    }
     if (medium.toLocaleUpperCase() === "FACEBOOK" &&
       environment.type === "SquatchAndroid") {
-      FacebookShare(directLink, ((_a = data === null || data === void 0 ? void 0 : data[medium]) === null || _a === void 0 ? void 0 : _a.messageLink) || ((_c = (_b = res.data) === null || _b === void 0 ? void 0 : _b.viewer) === null || _c === void 0 ? void 0 : _c.messageLink), props.errorText);
+      FacebookShare(directLink, (overrideData === null || overrideData === void 0 ? void 0 : overrideData.messageLink) || ((_b = (_a = res.data) === null || _a === void 0 ? void 0 : _a.viewer) === null || _b === void 0 ? void 0 : _b.messageLink), props.errorText);
     }
     else if (medium.toLocaleUpperCase() === "DIRECT") {
       NativeShare({ sharetitle, sharetext }, directLink, props.errorText, props.unsupportedPlatformText);
     }
     else {
-      GenericShare(((_d = data === null || data === void 0 ? void 0 : data[medium]) === null || _d === void 0 ? void 0 : _d.messageLink) || ((_f = (_e = res.data) === null || _e === void 0 ? void 0 : _e.viewer) === null || _f === void 0 ? void 0 : _f.messageLink), props.errorText);
+      GenericShare((overrideData === null || overrideData === void 0 ? void 0 : overrideData.messageLink) || ((_d = (_c = res.data) === null || _c === void 0 ? void 0 : _c.viewer) === null || _d === void 0 ? void 0 : _d.messageLink), props.errorText);
     }
   }
   return { ...props, loading: res.loading, onClick, hide };

package/dist/cjs/{copy-text-view-a22ad7e7.js → copy-text-view-35a47e8d.js}

@@ -6,17 +6,69 @@ const index_module = require('./index.module-df530553.js');
 const JSS = require('./JSS-8503a151.js');
 const mixins = require('./mixins-fe9d4112.js');
 
-const GET_REFERRAL_CODES = index_module.dist.gql `query getReferralCodes {
-}`;
+const GET_REFERRAL_CODES = index_module.dist.gql `
+  query getCodes(
+    $limit: Int!
+    $offset: Int!
+    $engagementMedium: UserEngagementMedium!
+  ) {
+    viewer {
+      ... on User {
+        referralCodeList(
+          limit: $limit
+          offset: $offset
+          filter: { fuelTank_eq: true }
+        ) {
+          data {
+            code
+            dateUsed
+            dateCopied
+            shareLinkCodes(limit: $limit, offset: $offset) {
+              data {
+                linkCode
+                shareLink: shortUrl(
+                  shareMedium: DIRECT
+                  engagementMedium: EMBED
+                )
+                email: shortUrl(
+                  shareMedium: EMAIL
+                  engagementMedium: $engagementMedium
+                )
+                whatsApp: shortUrl(
+                  shareMedium: WHATSAPP
+                  engagementMedium: $engagementMedium
+                )
+                fbMessenger: shortUrl(
+                  shareMedium: FBMESSENGER
+                  engagementMedium: $engagementMedium
+                )
+              }
+            }
+          }
+          count
+          totalCount
+        }
+      }
+    }
+  }
+`;
 const REFERRAL_CODES_NAMESPACE = "sq:referral-codes";
 const REFERRAL_CODES_PAGINATION_CONTEXT = "sq:referral-codes-pagination";
+const SET_CODE_USED = index_module.dist.gql `
+mutation test {}
+`;
 function useReferralCodes(props) {
   const user = index_module.Q();
+  const engagementMedium = index_module.B();
   console.log({ props });
-  const { envelope: referralData, states, callbacks, } = index_module.kn(GET_REFERRAL_CODES, (data) => { var _a; return (_a = data === null || data === void 0 ? void 0 : data.viewer) === null || _a === void 0 ? void 0 : _a.referralCodes; }, {
+  const { envelope: referralData, states, callbacks, } = index_module.kn(GET_REFERRAL_CODES, (data) => {
+    var _a;
+    console.log({ queryData: data });
+    return (_a = data === null || data === void 0 ? void 0 : data.viewer) === null || _a === void 0 ? void 0 : _a.referralCodeList;
+  }, {
     limit: 1,
     offset: 0,
-  }, {}, !(user === null || user === void 0 ? void 0 : user.jwt));
+  }, { engagementMedium }, !(user === null || user === void 0 ? void 0 : user.jwt));
   const [paginationContext, setPaginationContext] = index_module.Cn({
     namespace: REFERRAL_CODES_PAGINATION_CONTEXT,
     initialValue: { states, callbacks },
@@ -38,40 +90,33 @@ function useReferralCodes(props) {
     },
   });
   stencilHooks_module.useEffect(() => {
-    if (referralData === null || referralData === void 0 ? void 0 : referralData.data)
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    if ((_a = referralData === null || referralData === void 0 ? void 0 : referralData.data) === null || _a === void 0 ? void 0 : _a.length) {
+      const data = referralData.data[0];
       setReferralCodesContext({
-        referralCode: "EXAMPLECODE",
-        shareLink: "https://example.com",
+        referralCode: data.code,
+        shareLink: (_c = (_b = data.shareLinkCodes) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.direct,
         email: {
-          messageLink: "https://example.com",
+          messageLink: (_e = (_d = data.shareLinkCodes) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.email,
         },
         fbMessenger: {
-          messageLink: "https://example.com",
-          shareLink: "https://example.com",
+          messageLink: (_g = (_f = data.shareLinkCodes) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.fbMessenger,
+          shareLink: (_j = (_h = data.shareLinkCodes) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.fbMessenger,
         },
-        whatsApp: { messageLink: "https://example.com" },
+        whatsApp: { messageLink: (_l = (_k = data.shareLinkCodes) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.whatsApp },
       });
+    }
   }, [referralData]);
   stencilHooks_module.useEffect(() => {
     setPaginationContext({ states, callbacks });
-  }, [states]);
+  }, [states.loading]);
   console.log({ referralData, states });
   return {
     states: {
       ...states,
+      noCodes: (referralData === null || referralData === void 0 ? void 0 : referralData.totalCount) === 0,
     },
-    data: {
-      referralCode: "EXAMPLECODE",
-      shareLink: "https://example.com",
-      email: {
-        messageLink: "https://example.com",
-      },
-      fbMessenger: {
-        messageLink: "https://example.com",
-        shareLink: "https://example.com",
-      },
-      whatsApp: { messageLink: "https://example.com" },
-    },
+    data: referralCodesContext,
     callbacks: {
     // onPrev: () => callbacks.setCurrentPage(states.currentPage - 1),
     // onNext: () => callbacks.setCurrentPage(states.currentPage + 1),
@@ -170,4 +215,5 @@ function CopyTextView(props) {
 exports.CopyTextView = CopyTextView;
 exports.REFERRAL_CODES_NAMESPACE = REFERRAL_CODES_NAMESPACE;
 exports.REFERRAL_CODES_PAGINATION_CONTEXT = REFERRAL_CODES_PAGINATION_CONTEXT;
+exports.SET_CODE_USED = SET_CODE_USED;
 exports.useReferralCodes = useReferralCodes;

package/dist/cjs/sqm-big-stat_38.cjs.entry.js

@@ -9,7 +9,7 @@ const index_module = require('./index.module-df530553.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
 const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
-const copyTextView = require('./copy-text-view-a22ad7e7.js');
+const copyTextView = require('./copy-text-view-35a47e8d.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./mixins-fe9d4112.js');
 const reRender = require('./re-render-1976e05e.js');
@@ -20,7 +20,7 @@ const index$1 = require('./index-8c6255f5.js');
 const useRegistrationFormState = require('./useRegistrationFormState-876ed65d.js');
 const utilities = require('./utilities-cec9dd36.js');
 const AsYouType = require('./AsYouType-6788393a.js');
-const ShadowViewAddon = require('./ShadowViewAddon-2c6026c3.js');
+const ShadowViewAddon = require('./ShadowViewAddon-af975b90.js');
 require('./sqm-portal-container-view-990a85a3.js');
 
 const BigStat = class {

package/dist/cjs/sqm-pagination_3.cjs.entry.js

@@ -7,7 +7,7 @@ const stencilHooks_module = require('./stencil-hooks.module-72742a0b.js');
 const index_module = require('./index.module-df530553.js');
 const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
-const copyTextView = require('./copy-text-view-a22ad7e7.js');
+const copyTextView = require('./copy-text-view-35a47e8d.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./mixins-fe9d4112.js');
 
@@ -60,6 +60,7 @@ const Pagination = class {
     const hookProps = index_module.isDemo()
       ? useDemoPagination(utils.getProps(this))
       : usePagination();
+    console.log("pagination", { hookProps });
     const props = {
       currentPage: (_a = hookProps.states) === null || _a === void 0 ? void 0 : _a.currentPage,
       totalPages: (_b = hookProps.states) === null || _b === void 0 ? void 0 : _b.pageCount,
@@ -110,11 +111,15 @@ function useReferralCode(props) {
   const contextData = index_module.In(copyTextView.REFERRAL_CODES_NAMESPACE);
   const { data } = index_module.yn(MessageLinkQuery, { programId }, !(user === null || user === void 0 ? void 0 : user.jwt) || (contextData === null || contextData === void 0 ? void 0 : contextData.referralCode) !== undefined);
   const [sendLoadEvent] = index_module.$e(WIDGET_ENGAGEMENT_EVENT);
+  const [setUsed, usedRes] = index_module.$e(copyTextView.SET_CODE_USED);
   const copyString = (_b = ((contextData === null || contextData === void 0 ? void 0 : contextData.referralCode) || ((_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.referralCode))) !== null && _b !== void 0 ? _b : 
   // Shown during loading
   "...";
   const [open, setOpen] = stencilHooks_module.useState(false);
   function onClick() {
+    if (contextData) {
+      setUsed(true);
+    }
     // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
     // Only if called from a user-initiated event
     navigator.clipboard.writeText(copyString);
@@ -301,6 +306,8 @@ const ReferralCodes = class {
     const viewProps = {
       slots,
       ...props,
+      loading: props.states.loading,
+      noCodes: props.states.noCodes,
     };
     return index.h(ReferralCodesView, Object.assign({}, viewProps));
   }
@@ -308,6 +315,10 @@ const ReferralCodes = class {
 function useDemoReferralCodes(props) {
   return cjs.cjs({
     titleText: props.titleText,
+    states: {
+      noCodes: false,
+      loading: false,
+    },
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 

package/dist/cjs/sqm-stencilbook.cjs.entry.js

@@ -8,7 +8,7 @@ require('./global-02e50f09.js');
 const index_module = require('./index.module-df530553.js');
 require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
-const copyTextView = require('./copy-text-view-a22ad7e7.js');
+const copyTextView = require('./copy-text-view-35a47e8d.js');
 require('./cjs-1066ec21.js');
 require('./mixins-fe9d4112.js');
 const GenericTableView = require('./GenericTableView-a3f48e15.js');
@@ -29,7 +29,7 @@ const sqmPortalProfileView = require('./sqm-portal-profile-view-fde54e35.js');
 require('./utilities-cec9dd36.js');
 const sqmPortalResetPasswordView = require('./sqm-portal-reset-password-view-34771d2c.js');
 const sqmPortalVerifyEmailView = require('./sqm-portal-verify-email-view-c8f91506.js');
-const ShadowViewAddon = require('./ShadowViewAddon-2c6026c3.js');
+const ShadowViewAddon = require('./ShadowViewAddon-af975b90.js');
 const sqmPortalContainerView = require('./sqm-portal-container-view-990a85a3.js');
 const sqmInvoiceTableView = require('./sqm-invoice-table-view-e3b03a00.js');
 
@@ -15104,7 +15104,7 @@ const UseInvoiceTableCells = /*#__PURE__*/Object.freeze({
   InvoiceTableDemoHook: InvoiceTableDemoHook
 });
 
-const scenario$E = "@author: sam\n@owner: sam\n\nFeature: Referral Codes Component\n\n    A paginated display of available and used promo codes for the user to share with others\n\n    @motivating\n    Scenario: Promo code can be shared using various share mediums\n        Given an authenticated user\n        And the program has promo codes configured\n        When the promo code section is loaded\n        Then the promo code can be copied directly\n        And the promo code can be shared using <shareMedium>\n\n        Examples:\n            | shareMedium |\n            | DIRECT      |\n            | EMAIL       |\n            | FBMESSENGER |\n            | WHATSAPP    |\n\n    @minutia\n    Scenario: User is notified if the currently viewed promo code has been used already\n        Given an authenticated user\n        And the program has promo codes configured\n        When the promo code section is loaded\n        And the code has not been used already\n        Then no notification text is displayed\n        When the code is changed to one that has been used\n        Then the notification text is displayed\n\n    @minutia\n    Scenario Outline: Share mediums can be optionally displayed\n        Given an authenticated user\n        And the program has promo codes configured\n        And <propName> is true\n        Then the <shareMedium> is hidden\n        Examples:\n            | propName        | shareMedium |\n            | hideSharelink   | DIRECT      |\n            | hideEmail       | EMAIL       |\n            | hideFbMessenger | FBMESSENGER |\n            | hideWhatsApp    | WHATSAPP    |\n\n    @minutia\n    Scenario Outline: Number of codes is displayed in the pagination component\n        Given an authenticated user\n        And the program has promo codes configured\n        When the promo code section is loaded\n        And the user has <numCodes> available\n        And the user is on <currentPage>\n        Then the pagination text is <paginationText>\n        Examples:\n            | numCodes | currentPage | paginationText |\n            | 5        | 1           | 1 of 5         |\n            | 5        | 2           | 2 of 5         |\n            | 5        | 3           | 3 of 5         |\n            | 5        | 4           | 4 of 5         |\n            | 5        | 5           | 5 of 5         |\n            | 1        | 1           | 1 of 1         |\n            | 0        | 0           | 0 of 0         |\n\n";
+const scenario$E = "@author: sam\n@owner: sam\n\nFeature: Referral Codes Component\n\n    A paginated display of available and used promo codes for the user to share with others\n\n    @motivating\n    Scenario: Promo code can be shared using various share mediums\n        Given an authenticated user\n        And the program has promo codes configured\n        When the promo code section is loaded\n        Then the promo code can be copied directly\n        And the promo code can be shared using <shareMedium>\n\n        Examples:\n            | shareMedium |\n            | DIRECT      |\n            | EMAIL       |\n            | FBMESSENGER |\n            | WHATSAPP    |\n\n    @minutia\n    Scenario: User is notified if the currently viewed promo code has been used already\n        Given an authenticated user\n        And the program has promo codes configured\n        When the promo code section is loaded\n        And the code has not been used already\n        Then no notification text is displayed\n        When the code is changed to one that has been used\n        Then the notification text is displayed\n\n    @minutia\n    Scenario Outline: Share buttons slots use the link from referral codes instead of the default query\n        Given an authenticated user\n        And the program has promo codes configured\n        And a <shareMedium> button is a child of `<sqm-referral-codes>`\n        Then the <shareMedium> button is shown\n        And the link is <promoCode>\n        Examples:\n            | propName        | shareMedium | promoCode  |\n            | hideSharelink   | DIRECT      | PROMOCODE1 |\n            | hideEmail       | EMAIL       | PROMOCODE1 |\n            | hideFbMessenger | FBMESSENGER | PROMOCODE1 |\n            | hideWhatsApp    | WHATSAPP    | PROMOCODE1 |\n\n    @minutia\n    Scenario Outline: Number of codes is displayed in the pagination component\n        Given an authenticated user\n        And the program has promo codes configured\n        When the promo code section is loaded\n        And the user has <numCodes> available\n        And the user is on <currentPage>\n        Then the pagination text is <paginationText>\n        Examples:\n            | numCodes | currentPage | paginationText |\n            | 5        | 1           | 1 of 5         |\n            | 5        | 2           | 2 of 5         |\n            | 5        | 3           | 3 of 5         |\n            | 5        | 4           | 4 of 5         |\n            | 5        | 5           | 5 of 5         |\n            | 1        | 1           | 1 of 1         |\n            | 0        | 0           | 0 of 0         |\n\n";
 
 const ReferralCodes_stories = {
   title: "Components/Referral Codes",

package/dist/collection/components/sqm-pagination/sqm-pagination.js

@@ -23,6 +23,7 @@ export class Pagination {
     const hookProps = isDemo()
       ? useDemoPagination(getProps(this))
       : usePagination();
+    console.log("pagination", { hookProps });
     const props = {
       currentPage: (_a = hookProps.states) === null || _a === void 0 ? void 0 : _a.currentPage,
       totalPages: (_b = hookProps.states) === null || _b === void 0 ? void 0 : _b.pageCount,

package/dist/collection/components/sqm-referral-code/useReferralCode.js

@@ -1,7 +1,7 @@
 import { useEngagementMedium, useMutation, useParentValue, useProgramId, useQuery, useUserIdentity, } from "@saasquatch/component-boilerplate";
 import { useState } from "@saasquatch/universal-hooks";
 import { gql } from "graphql-request";
-import { REFERRAL_CODES_NAMESPACE, } from "../sqm-referral-codes/useReferralCodes";
+import { REFERRAL_CODES_NAMESPACE, SET_CODE_USED, } from "../sqm-referral-codes/useReferralCodes";
 const MessageLinkQuery = gql `
   query ($programId: ID) {
     user: viewer {
@@ -24,11 +24,15 @@ export function useReferralCode(props) {
   const contextData = useParentValue(REFERRAL_CODES_NAMESPACE);
   const { data } = useQuery(MessageLinkQuery, { programId }, !(user === null || user === void 0 ? void 0 : user.jwt) || (contextData === null || contextData === void 0 ? void 0 : contextData.referralCode) !== undefined);
   const [sendLoadEvent] = useMutation(WIDGET_ENGAGEMENT_EVENT);
+  const [setUsed, usedRes] = useMutation(SET_CODE_USED);
   const copyString = (_b = ((contextData === null || contextData === void 0 ? void 0 : contextData.referralCode) || ((_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.referralCode))) !== null && _b !== void 0 ? _b : 
   // Shown during loading
   "...";
   const [open, setOpen] = useState(false);
   function onClick() {
+    if (contextData) {
+      setUsed(true);
+    }
     // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
     // Only if called from a user-initiated event
     navigator.clipboard.writeText(copyString);

package/dist/collection/components/sqm-referral-codes/sqm-referral-codes.js

@@ -33,6 +33,8 @@ export class ReferralCodes {
     const viewProps = {
       slots,
       ...props,
+      loading: props.states.loading,
+      noCodes: props.states.noCodes,
     };
     return h(ReferralCodesView, Object.assign({}, viewProps));
   }
@@ -65,7 +67,7 @@ export class ReferralCodes {
       "mutable": false,
       "complexType": {
         "original": "DemoData<ReferralCodesViewProps>",
-        "resolved": "{ slots?: { shareButtons: VNode; shareCodes: VNode; pagination: VNode; }; titleText?: string; }",
+        "resolved": "{ slots?: { shareButtons: VNode; shareCodes: VNode; pagination: VNode; }; loading?: boolean; titleText?: string; noCodes?: boolean; }",
         "references": {
           "DemoData": {
             "location": "import",
@@ -95,5 +97,9 @@ export class ReferralCodes {
 function useDemoReferralCodes(props) {
   return deepmerge({
     titleText: props.titleText,
+    states: {
+      noCodes: false,
+      loading: false,
+    },
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }

package/dist/collection/components/sqm-referral-codes/useReferralCodes.js

@@ -1,17 +1,69 @@
-import { usePaginatedQuery, useParentState, useUserIdentity, } from "@saasquatch/component-boilerplate";
+import { useEngagementMedium, usePaginatedQuery, useParentState, useUserIdentity, } from "@saasquatch/component-boilerplate";
 import { gql } from "graphql-request";
 import { useEffect } from "@saasquatch/universal-hooks";
-const GET_REFERRAL_CODES = gql `query getReferralCodes {
-}`;
+const GET_REFERRAL_CODES = gql `
+  query getCodes(
+    $limit: Int!
+    $offset: Int!
+    $engagementMedium: UserEngagementMedium!
+  ) {
+    viewer {
+      ... on User {
+        referralCodeList(
+          limit: $limit
+          offset: $offset
+          filter: { fuelTank_eq: true }
+        ) {
+          data {
+            code
+            dateUsed
+            dateCopied
+            shareLinkCodes(limit: $limit, offset: $offset) {
+              data {
+                linkCode
+                shareLink: shortUrl(
+                  shareMedium: DIRECT
+                  engagementMedium: EMBED
+                )
+                email: shortUrl(
+                  shareMedium: EMAIL
+                  engagementMedium: $engagementMedium
+                )
+                whatsApp: shortUrl(
+                  shareMedium: WHATSAPP
+                  engagementMedium: $engagementMedium
+                )
+                fbMessenger: shortUrl(
+                  shareMedium: FBMESSENGER
+                  engagementMedium: $engagementMedium
+                )
+              }
+            }
+          }
+          count
+          totalCount
+        }
+      }
+    }
+  }
+`;
 export const REFERRAL_CODES_NAMESPACE = "sq:referral-codes";
 export const REFERRAL_CODES_PAGINATION_CONTEXT = "sq:referral-codes-pagination";
+export const SET_CODE_USED = gql `
+mutation test {}
+`;
 export function useReferralCodes(props) {
   const user = useUserIdentity();
+  const engagementMedium = useEngagementMedium();
   console.log({ props });
-  const { envelope: referralData, states, callbacks, } = usePaginatedQuery(GET_REFERRAL_CODES, (data) => { var _a; return (_a = data === null || data === void 0 ? void 0 : data.viewer) === null || _a === void 0 ? void 0 : _a.referralCodes; }, {
+  const { envelope: referralData, states, callbacks, } = usePaginatedQuery(GET_REFERRAL_CODES, (data) => {
+    var _a;
+    console.log({ queryData: data });
+    return (_a = data === null || data === void 0 ? void 0 : data.viewer) === null || _a === void 0 ? void 0 : _a.referralCodeList;
+  }, {
     limit: 1,
     offset: 0,
-  }, {}, !(user === null || user === void 0 ? void 0 : user.jwt));
+  }, { engagementMedium }, !(user === null || user === void 0 ? void 0 : user.jwt));
   const [paginationContext, setPaginationContext] = useParentState({
     namespace: REFERRAL_CODES_PAGINATION_CONTEXT,
     initialValue: { states, callbacks },
@@ -33,40 +85,33 @@ export function useReferralCodes(props) {
     },
   });
   useEffect(() => {
-    if (referralData === null || referralData === void 0 ? void 0 : referralData.data)
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    if ((_a = referralData === null || referralData === void 0 ? void 0 : referralData.data) === null || _a === void 0 ? void 0 : _a.length) {
+      const data = referralData.data[0];
       setReferralCodesContext({
-        referralCode: "EXAMPLECODE",
-        shareLink: "https://example.com",
+        referralCode: data.code,
+        shareLink: (_c = (_b = data.shareLinkCodes) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.direct,
         email: {
-          messageLink: "https://example.com",
+          messageLink: (_e = (_d = data.shareLinkCodes) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.email,
         },
         fbMessenger: {
-          messageLink: "https://example.com",
-          shareLink: "https://example.com",
+          messageLink: (_g = (_f = data.shareLinkCodes) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.fbMessenger,
+          shareLink: (_j = (_h = data.shareLinkCodes) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.fbMessenger,
         },
-        whatsApp: { messageLink: "https://example.com" },
+        whatsApp: { messageLink: (_l = (_k = data.shareLinkCodes) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.whatsApp },
       });
+    }
   }, [referralData]);
   useEffect(() => {
     setPaginationContext({ states, callbacks });
-  }, [states]);
+  }, [states.loading]);
   console.log({ referralData, states });
   return {
     states: {
       ...states,
+      noCodes: (referralData === null || referralData === void 0 ? void 0 : referralData.totalCount) === 0,
     },
-    data: {
-      referralCode: "EXAMPLECODE",
-      shareLink: "https://example.com",
-      email: {
-        messageLink: "https://example.com",
-      },
-      fbMessenger: {
-        messageLink: "https://example.com",
-        shareLink: "https://example.com",
-      },
-      whatsApp: { messageLink: "https://example.com" },
-    },
+    data: referralCodesContext,
     callbacks: {
     // onPrev: () => callbacks.setCurrentPage(states.currentPage - 1),
     // onNext: () => callbacks.setCurrentPage(states.currentPage + 1),

package/dist/collection/components/sqm-share-button/useShareButton.js

@@ -1,7 +1,7 @@
-import { useEngagementMedium, useUserIdentity, useQuery, useParentValue, } from "@saasquatch/component-boilerplate";
+import { useEngagementMedium, useUserIdentity, useQuery, useParentValue, useMutation, } from "@saasquatch/component-boilerplate";
 import { gql } from "graphql-request";
 import { useProgramId, getEnvironmentSDK, } from "@saasquatch/component-boilerplate";
-import { REFERRAL_CODES_NAMESPACE, } from "../sqm-referral-codes/useReferralCodes";
+import { REFERRAL_CODES_NAMESPACE, SET_CODE_USED, } from "../sqm-referral-codes/useReferralCodes";
 const MessageLinkQuery = gql `
   query (
     $programId: ID
@@ -54,7 +54,7 @@ function GenericShare(messageLink, errorText) {
   return messageLink ? window.open(messageLink) : alert(errorText);
 }
 export function useShareButton(props) {
-  var _a, _b, _c;
+  var _a, _b;
   const { sharetitle, sharetext, medium } = props;
   const programId = props.programId ? props.programId : useProgramId();
   const user = useUserIdentity();
@@ -64,24 +64,29 @@ export function useShareButton(props) {
     shareMedium: medium.toUpperCase(),
   };
   const data = useParentValue(REFERRAL_CODES_NAMESPACE);
+  const overrideData = data === null || data === void 0 ? void 0 : data[medium];
   // only queries if a programId is available
-  const res = useQuery(MessageLinkQuery, variables, !(user === null || user === void 0 ? void 0 : user.jwt) || !programId || (data === null || data === void 0 ? void 0 : data[medium]) !== undefined);
-  const directLink = ((_a = data === null || data === void 0 ? void 0 : data[medium]) === null || _a === void 0 ? void 0 : _a.shareLink) || ((_c = (_b = res === null || res === void 0 ? void 0 : res.data) === null || _b === void 0 ? void 0 : _b.viewer) === null || _c === void 0 ? void 0 : _c.shareLink);
+  const res = useQuery(MessageLinkQuery, variables, !(user === null || user === void 0 ? void 0 : user.jwt) || !programId || overrideData !== undefined);
+  const [setUsed, usedRes] = useMutation(SET_CODE_USED);
+  const directLink = (overrideData === null || overrideData === void 0 ? void 0 : overrideData.shareLink) || ((_b = (_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.viewer) === null || _b === void 0 ? void 0 : _b.shareLink);
   const environment = getEnvironmentSDK();
   const hide = (medium.toLocaleUpperCase() === "SMS" &&
     window.orientation === undefined) ||
     (medium.toLocaleUpperCase() === "DIRECT" && !window.navigator.share);
   function onClick() {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d;
+    if (overrideData) {
+      setUsed(true);
+    }
     if (medium.toLocaleUpperCase() === "FACEBOOK" &&
       environment.type === "SquatchAndroid") {
-      FacebookShare(directLink, ((_a = data === null || data === void 0 ? void 0 : data[medium]) === null || _a === void 0 ? void 0 : _a.messageLink) || ((_c = (_b = res.data) === null || _b === void 0 ? void 0 : _b.viewer) === null || _c === void 0 ? void 0 : _c.messageLink), props.errorText);
+      FacebookShare(directLink, (overrideData === null || overrideData === void 0 ? void 0 : overrideData.messageLink) || ((_b = (_a = res.data) === null || _a === void 0 ? void 0 : _a.viewer) === null || _b === void 0 ? void 0 : _b.messageLink), props.errorText);
     }
     else if (medium.toLocaleUpperCase() === "DIRECT") {
       NativeShare({ sharetitle, sharetext }, directLink, props.errorText, props.unsupportedPlatformText);
     }
     else {
-      GenericShare(((_d = data === null || data === void 0 ? void 0 : data[medium]) === null || _d === void 0 ? void 0 : _d.messageLink) || ((_f = (_e = res.data) === null || _e === void 0 ? void 0 : _e.viewer) === null || _f === void 0 ? void 0 : _f.messageLink), props.errorText);
+      GenericShare((overrideData === null || overrideData === void 0 ? void 0 : overrideData.messageLink) || ((_d = (_c = res.data) === null || _c === void 0 ? void 0 : _c.viewer) === null || _d === void 0 ? void 0 : _d.messageLink), props.errorText);
     }
   }
   return { ...props, loading: res.loading, onClick, hide };

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

@@ -1,7 +1,7 @@
 import { useEngagementMedium, useMutation, useParentValue, useProgramId, useQuery, useUserIdentity, } from "@saasquatch/component-boilerplate";
 import { useState } from "@saasquatch/universal-hooks";
 import { gql } from "graphql-request";
-import { REFERRAL_CODES_NAMESPACE, } from "../sqm-referral-codes/useReferralCodes";
+import { REFERRAL_CODES_NAMESPACE, SET_CODE_USED, } from "../sqm-referral-codes/useReferralCodes";
 const MessageLinkQuery = gql `
   query ($programId: ID, $engagementMedium: UserEngagementMedium!) {
     user: viewer {
@@ -28,11 +28,15 @@ export function useShareLink(props) {
   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 [sendLoadEvent] = useMutation(WIDGET_ENGAGEMENT_EVENT);
+  const [setUsed, usedRes] = useMutation(SET_CODE_USED);
   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);
   function onClick() {
+    if (contextData) {
+      setUsed(true);
+    }
     // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
     // Only if called from a user-initiated event
     navigator.clipboard.writeText(copyString);