@saasquatch/mint-components 1.5.0-85 → 1.5.0-89

package/dist/cjs/sqm-referral-table_11.cjs.entry.js

@@ -4,21 +4,335 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-87a1f4f7.js');
-const global = require('./global-4c495d76.js');
+const global = require('./global-633d1fb7.js');
 require('./use-callback-e754042f.js');
-const index_module = require('./index.module-54724339.js');
+const index_module = require('./index.module-f972f103.js');
 require('./extends-08099afd.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./mixins-7b7c59fe.js');
 const JSS = require('./JSS-c65a40f1.js');
 const GenericTableView = require('./GenericTableView-39e0998e.js');
-const reRender = require('./re-render-2f8d0f37.js');
-require('./useChildElements-a68699b4.js');
-const useReferralTable = require('./useReferralTable-45f295ba.js');
+const reRender = require('./re-render-1ef744c7.js');
+const useChildElements = require('./useChildElements-3ce892db.js');
+const useReferralTable = require('./useReferralTable-464dd3a0.js');
 const luxon = require('./luxon-59ca7d19.js');
 const utils = require('./utils-01dbfd4a.js');
 const sqmTextSpanView = require('./sqm-text-span-view-f101dedf.js');
-const ReferralTableRewardsCell_stories = require('./ReferralTableRewardsCell.stories-cd7b9c93.js');
+
+const mockReferralData = {
+  totalCount: 6,
+  count: 4,
+  referredByReferral: {
+    dateConverted: null,
+    dateReferralStarted: 1643912659850,
+    referrerUser: {
+      firstName: "John",
+      lastName: "Snow",
+      rewards: [],
+    },
+  },
+  data: [
+    {
+      id: "5cae6b0fcc540e209db45b53",
+      referredUser: {
+        id: "5cae6b0ce4b0d81c67b78e82",
+        accountId: "SPX1MZBIPTFL3E1H",
+        firstName: "Aaron",
+        lastName: "Hernandez",
+        email: "aaronhernandez.uexwltgh@mailosaur.io",
+        programGoals: [],
+      },
+      shareLinkUsed: null,
+      referralCodeUsed: "JIMBONEUTRON2",
+      moderationStatus: "PENDING",
+      dateConverted: 1554934550726,
+      dateFraudChecksCompleted: null,
+      dateModerated: 1558730033306,
+      dateModified: 1554934543447,
+      dateReferralEnded: null,
+      dateReferralPaid: null,
+      dateReferralStarted: 1554934543447,
+      dateUserModified: null,
+      programId: "sam-partner-test-2",
+      program: {
+        id: "sam-partner-test-2",
+        name: "Partner Program 2.0",
+      },
+      rewards: [
+        {
+          id: "5cae6b16cc540e209db45cfa",
+          type: "CREDIT",
+          value: 1,
+          unit: "POINT",
+          name: "Partner Reward",
+          dateGiven: 1554934550726,
+          dateExpires: null,
+          dateCancelled: null,
+          dateRedeemed: 1637004373582,
+          dateScheduledFor: null,
+          fuelTankCode: null,
+          fuelTankType: null,
+          currency: null,
+          prettyValue: "1 Point",
+          statuses: ["REDEEMED"],
+          globalRewardKey: null,
+          programRewardKey: "partnerReward",
+          rewardRedemptionTransactions: {
+            data: [
+              {
+                exchangedRewards: {
+                  data: [
+                    {
+                      prettyValue: "CAD10.00 Visa* Prepaid Card CAD",
+                      type: "INTEGRATION",
+                      fuelTankCode: null,
+                      globalRewardKey: "gc1",
+                    },
+                  ],
+                },
+              },
+            ],
+          },
+        },
+      ],
+      childNodes: {
+        data: [
+          {
+            data: {
+              id: "5cae6b16cc540e209db45cb3",
+              statuses: ["AVAILABLE"],
+              type: "PCT_DISCOUNT",
+              value: 50,
+            },
+            depth: 1,
+          },
+          {
+            data: {
+              id: "5cae6b16cc540e209db45cfa",
+              statuses: ["REDEEMED"],
+              type: "CREDIT",
+              value: 1,
+            },
+            depth: 1,
+          },
+        ],
+      },
+    },
+    {
+      id: "5cae6a92cc540e209db45106",
+      referredUser: {
+        id: "5cae6a8fe4b0d81c67b78e60",
+        accountId: "B5DY96TJ2HFF321L",
+        firstName: "Brian",
+        lastName: "Mendez",
+        email: "brianmendez.uexwltgh@mailosaur.io",
+        programGoals: [],
+      },
+      shareLinkUsed: null,
+      referralCodeUsed: "JIMBONEUTRON2",
+      moderationStatus: "PENDING",
+      dateConverted: 1554934455495,
+      dateFraudChecksCompleted: null,
+      dateModerated: 1558730033311,
+      dateModified: 1554934418374,
+      dateReferralEnded: null,
+      dateReferralPaid: null,
+      dateReferralStarted: 1554934418374,
+      dateUserModified: null,
+      programId: "sam-partner-test-2",
+      program: {
+        id: "sam-partner-test-2",
+        name: "Partner Program 2.0",
+      },
+      rewards: [
+        {
+          id: "5cae6ab7cc540e209db456cc",
+          type: "CREDIT",
+          value: 1,
+          unit: "POINT",
+          name: "Partner Reward",
+          dateGiven: 1554934455495,
+          dateExpires: null,
+          dateCancelled: null,
+          dateRedeemed: 1637004373582,
+          dateScheduledFor: null,
+          fuelTankCode: null,
+          fuelTankType: null,
+          currency: null,
+          prettyValue: "1 Point",
+          statuses: ["REDEEMED"],
+          globalRewardKey: null,
+          programRewardKey: "partnerReward",
+          rewardRedemptionTransactions: {
+            data: [
+              {
+                exchangedRewards: {
+                  data: [
+                    {
+                      prettyValue: "CAD10.00 Visa* Prepaid Card CAD",
+                      type: "INTEGRATION",
+                      fuelTankCode: null,
+                      globalRewardKey: "gc1",
+                    },
+                  ],
+                },
+              },
+            ],
+          },
+        },
+      ],
+      childNodes: {
+        data: [
+          {
+            data: {
+              id: "5cae6ab7cc540e209db456cc",
+              statuses: ["REDEEMED"],
+              type: "CREDIT",
+              value: 1,
+            },
+            depth: 1,
+          },
+          {
+            data: {
+              id: "5cae6a92cc540e209db45136",
+              statuses: ["AVAILABLE"],
+              type: "PCT_DISCOUNT",
+              value: 50,
+            },
+            depth: 1,
+          },
+        ],
+      },
+    },
+    {
+      id: "5cae6a42cc540e209db44b5a",
+      referredUser: {
+        id: "5cae6a40e4b0d81c67b78e3e",
+        accountId: "3TW6KPEDCKIMUMPS",
+        firstName: "Loretta",
+        lastName: "Harper",
+        email: "lorettaharper.uexwltgh@mailosaur.io",
+        programGoals: [],
+      },
+      shareLinkUsed: null,
+      referralCodeUsed: "JIMBONEUTRON2",
+      moderationStatus: "PENDING",
+      dateConverted: 1554934342984,
+      dateFraudChecksCompleted: null,
+      dateModerated: 1558730033315,
+      dateModified: 1554934338318,
+      dateReferralEnded: null,
+      dateReferralPaid: null,
+      dateReferralStarted: 1554934338318,
+      dateUserModified: null,
+      programId: "sam-partner-test-2",
+      program: {
+        id: "sam-partner-test-2",
+        name: "Partner Program 2.0",
+      },
+      rewards: [
+        {
+          id: "5cae6a46cc540e209db44cf2",
+          type: "CREDIT",
+          value: 1,
+          unit: "POINT",
+          name: "Partner Reward",
+          dateGiven: 1554934342984,
+          dateExpires: null,
+          dateCancelled: null,
+          dateRedeemed: 1637004373582,
+          dateScheduledFor: null,
+          fuelTankCode: null,
+          fuelTankType: null,
+          currency: null,
+          prettyValue: "1 Point",
+          statuses: ["REDEEMED"],
+          globalRewardKey: null,
+          programRewardKey: "partnerReward",
+          rewardRedemptionTransactions: {
+            data: [
+              {
+                exchangedRewards: {
+                  data: [
+                    {
+                      prettyValue: "CAD10.00 Visa* Prepaid Card CAD",
+                      type: "INTEGRATION",
+                      fuelTankCode: null,
+                      globalRewardKey: "gc1",
+                    },
+                  ],
+                },
+              },
+            ],
+          },
+        },
+      ],
+      childNodes: {
+        data: [
+          {
+            data: {
+              id: "5cae6a42cc540e209db44b7e",
+              statuses: ["AVAILABLE"],
+              type: "PCT_DISCOUNT",
+              value: 50,
+            },
+            depth: 1,
+          },
+          {
+            data: {
+              id: "5cae6a46cc540e209db44cf2",
+              statuses: ["REDEEMED"],
+              type: "CREDIT",
+              value: 1,
+            },
+            depth: 1,
+          },
+        ],
+      },
+    },
+    {
+      id: "5cae6a37cc540e209db44937",
+      referredUser: {
+        id: "5cae6a33e4b0d81c67b78e1e",
+        accountId: "41E0PY65021C3T5Z",
+        firstName: "Isaac",
+        lastName: "Meyer",
+        email: "isaacmeyer.uexwltgh@mailosaur.io",
+        programGoals: [],
+      },
+      shareLinkUsed: null,
+      referralCodeUsed: "JIMBONEUTRON2",
+      moderationStatus: "PENDING",
+      dateConverted: null,
+      dateFraudChecksCompleted: null,
+      dateModerated: 1554934327291,
+      dateModified: 1554934327291,
+      dateReferralEnded: null,
+      dateReferralPaid: null,
+      dateReferralStarted: 1554934327291,
+      dateUserModified: null,
+      programId: "sam-partner-test-2",
+      program: {
+        id: "sam-partner-test-2",
+        name: "Partner Program 2.0",
+      },
+      rewards: [],
+      childNodes: {
+        data: [
+          {
+            data: {
+              id: "5cae6a37cc540e209db44954",
+              statuses: ["AVAILABLE"],
+              type: "PCT_DISCOUNT",
+              value: 50,
+            },
+            depth: 1,
+          },
+        ],
+      },
+    },
+  ],
+};
 
 const ReferralTable = class {
   constructor(hostRef) {
@@ -45,10 +359,11 @@ const ReferralTable = class {
   render() {
     const empty = index.h("slot", { name: "empty" });
     const loading = index.h(LoadingSlot, null);
-    const { states, data, callbacks, elements } = index_module.k()
-      ? useReferraltableDemo(this)
+    const { states, data, callbacks, elements } = index_module.jn()
+      ? useReferralTableDemo(this, empty, loading)
       : useReferralTable.useReferralTable(this, empty, loading);
     console.log("elemente", elements);
+    reRender.useRequestRerender([this.showReferrer, this.perPage]);
     return (index.h(GenericTableView.GenericTableView, { states: states, data: data, callbacks: callbacks, elements: elements }));
   }
 };
@@ -58,7 +373,61 @@ function LoadingSlot() {
 function LoadingRow() {
   return (index.h("sqm-table-row", null, index.h("sqm-table-cell", { colspan: 5 }, index.h("sl-skeleton", null))));
 }
-function useReferraltableDemo(props) {
+function useReferralTableDemo(props, emptyElement, loadingElement) {
+  const [content, setContent] = stencilHooks_module.useReducer((state, next) => ({
+    ...state,
+    ...next,
+  }), {
+    columns: [],
+    rows: [],
+    loading: false,
+    page: 0,
+  });
+  const tick = reRender.useRerenderListener();
+  const { data } = mockReferralData;
+  const components = useChildElements.useChildElements();
+  async function getComponentData(components) {
+    let componentData;
+    const { data: mockData } = mockReferralData;
+    const referrerData = mockReferralData === null || mockReferralData === void 0 ? void 0 : mockReferralData.referredByReferral;
+    const showReferrerRow = props.showReferrer &&
+      !!(mockReferralData === null || mockReferralData === void 0 ? void 0 : mockReferralData.referredByReferral.dateReferralStarted);
+    if (showReferrerRow) {
+      console.log("mock data", mockData.slice(-1));
+      componentData = mockData.slice(0, -1);
+    }
+    else {
+      componentData = data;
+    }
+    // filter out loading and empty states from columns array
+    const columnComponents = components.filter((component) => component.slot !== "loading" && component.slot !== "empty");
+    // get the column titles (renderLabel is asynchronous)
+    const columnsPromise = columnComponents === null || columnComponents === void 0 ? void 0 : columnComponents.map(async (c) => useReferralTable.tryMethod(c, () => c.renderLabel()));
+    // show the referrer row before any other rows (renderReferrerCell is asynchronous)
+    let referrerRow;
+    if (showReferrerRow) {
+      const referrerPromise = columnComponents === null || columnComponents === void 0 ? void 0 : columnComponents.map(async (c) => useReferralTable.tryMethod(c, function renderCell() {
+        return c.renderCell(referrerData, c);
+      }));
+      referrerRow = await Promise.all(referrerPromise);
+    }
+    // get the column cells (renderCell is asynchronous)
+    const cellsPromise = componentData === null || componentData === void 0 ? void 0 : componentData.map(async (r) => {
+      const cellPromise = columnComponents === null || columnComponents === void 0 ? void 0 : columnComponents.map(async (c) => useReferralTable.tryMethod(c, () => c.renderCell(r, undefined)));
+      const cells = (await Promise.all(cellPromise));
+      return cells;
+    });
+    const rows = cellsPromise &&
+      [referrerRow, ...(await Promise.all(cellsPromise))].filter((value) => value);
+    setContent({ rows });
+    const columns = columnsPromise && (await Promise.all(columnsPromise));
+    // Set the content to render and finish loading components
+    setContent({ columns, loading: false, page: 0 });
+  }
+  stencilHooks_module.useEffect(() => {
+    setContent({ loading: true });
+    data && getComponentData(components);
+  }, [data, components, tick]);
   const demoProps = cjs.cjs({
     states: {
       hasPrev: false,
@@ -79,33 +448,12 @@ function useReferraltableDemo(props) {
       referralData: [],
     },
     elements: {
-      emptyElement: (index.h("sqm-empty", { emptyStateImage: "https://res.cloudinary.com/saasquatch/image/upload/v1642618031/squatch-assets/image_3_1.png", emptyStateHeader: "View your referral details", emptyStateText: "Track the status of your referrals and rewards earned by referring\r\n\t\tfriends", table: true })),
-      loadingElement: index.h(LoadingSlot, null),
-      columns: [
-        index.h("div", null, "User"),
-        index.h("div", null, "Referral Status"),
-        index.h("div", null, "Rewards"),
-      ],
-      rows: [
-        [
-          index.h("sqm-referral-table-user-cell", { name: "Joe Smith" }),
-          index.h("sqm-referral-table-status-cell", { statusText: "Completed", converted: true }),
-          index.h(ReferralTableRewardsCell_stories.PendingNoUnpend, null),
-        ],
-        [
-          index.h("sqm-referral-table-user-cell", { name: "Bob Williams" }),
-          index.h("sqm-referral-table-status-cell", { statusText: "In Progress", converted: false }),
-          index.h(ReferralTableRewardsCell_stories.AvailableNoExpiry, null),
-        ],
-        [
-          index.h("sqm-referral-table-user-cell", { name: "Sarah Joseph" }),
-          index.h("sqm-referral-table-status-cell", { statusText: "Completed", converted: true }),
-          index.h(ReferralTableRewardsCell_stories.Cancelled, null),
-        ],
-      ],
+      columns: content.columns,
+      rows: content.rows,
+      emptyElement,
+      loadingElement,
     },
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
-  console.log("PROPS", demoProps);
   return demoProps;
 }
 
@@ -188,6 +536,10 @@ const ReferralTableDateColumn = class {
   async renderLabel() {
     return this.columnTitle;
   }
+  async renderReferrerCell(data) {
+    // TODO - Validate `dateShown` against a set of known values
+    return (index.h("sqm-referral-table-date-cell", { date: data[this.dateShown] }));
+  }
   render() {
     reRender.useRequestRerender([this.dateShown, this.columnTitle]);
     return index.h(index.Host, { style: { display: "none" } });
@@ -375,6 +727,10 @@ const ReferralTableRewardsColumn = class {
   async renderLabel() {
     return this.columnTitle;
   }
+  async renderReferrerCell(data) {
+    // TODO: Do the right thing with many rewards, pending rewards, canceled rewards
+    return (index.h("sqm-referral-table-rewards-cell", { rewards: data.rewards }));
+  }
   render() {
     reRender.useRequestRerender([this.columnTitle]);
     return index.h(index.Host, { style: { display: "none" } });
@@ -428,6 +784,13 @@ const ReferralTableStatusColumn = class {
   async renderLabel() {
     return this.columnTitle;
   }
+  async renderReferrerCell(data) {
+    // TODO: Make ICU and more complete
+    const statusText = data.dateConverted
+      ? this.convertedStatusText
+      : this.inProgressStatusText;
+    return (index.h("sqm-referral-table-status-cell", { "status-text": statusText, converted: data.dateConverted ? true : false }));
+  }
   render() {
     reRender.useRequestRerender([this.columnTitle]);
     return index.h(index.Host, { style: { display: "none" } });
@@ -462,23 +825,42 @@ const ReferralTableUserColumn = class {
   }
   disconnectedCallback() { }
   async renderCell(data) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     let name;
-    if (!(data === null || data === void 0 ? void 0 : data.referredUser)) {
+    if (!(data === null || data === void 0 ? void 0 : data.referredUser) && !(data === null || data === void 0 ? void 0 : data.referrerUser)) {
       name = this.deletedUser;
     }
     else if (!((_a = data === null || data === void 0 ? void 0 : data.referredUser) === null || _a === void 0 ? void 0 : _a.firstName) &&
-      !((_b = data === null || data === void 0 ? void 0 : data.referredUser) === null || _b === void 0 ? void 0 : _b.lastName)) {
+      !((_b = data === null || data === void 0 ? void 0 : data.referredUser) === null || _b === void 0 ? void 0 : _b.lastName) &&
+      !((_c = data === null || data === void 0 ? void 0 : data.referrerUser) === null || _c === void 0 ? void 0 : _c.firstName) &&
+      !((_d = data === null || data === void 0 ? void 0 : data.referrerUser) === null || _d === void 0 ? void 0 : _d.lastName)) {
       name = this.anonymousUser;
     }
+    else if (data === null || data === void 0 ? void 0 : data.referrerUser) {
+      name = `${(_e = data === null || data === void 0 ? void 0 : data.referrerUser) === null || _e === void 0 ? void 0 : _e.firstName} ${(_f = data === null || data === void 0 ? void 0 : data.referrerUser) === null || _f === void 0 ? void 0 : _f.lastName}`;
+    }
     else {
-      name = `${(_c = data === null || data === void 0 ? void 0 : data.referredUser) === null || _c === void 0 ? void 0 : _c.firstName} ${(_d = data === null || data === void 0 ? void 0 : data.referredUser) === null || _d === void 0 ? void 0 : _d.lastName}`;
+      name = `${(_g = data === null || data === void 0 ? void 0 : data.referredUser) === null || _g === void 0 ? void 0 : _g.firstName} ${(_h = data === null || data === void 0 ? void 0 : data.referredUser) === null || _h === void 0 ? void 0 : _h.lastName}`;
     }
     return (index.h("sqm-referral-table-user-cell", { name: name }));
   }
   async renderLabel() {
     return this.columnTitle;
   }
+  async renderReferrerCell(data) {
+    var _a, _b, _c, _d;
+    let name;
+    if (!data) {
+      name = this.deletedUser;
+    }
+    else if (!((_a = data === null || data === void 0 ? void 0 : data.referrerUser) === null || _a === void 0 ? void 0 : _a.firstName) && !((_b = data.referrerUser) === null || _b === void 0 ? void 0 : _b.lastName)) {
+      name = this.anonymousUser;
+    }
+    else {
+      name = `${(_c = data === null || data === void 0 ? void 0 : data.referrerUser) === null || _c === void 0 ? void 0 : _c.firstName} ${(_d = data === null || data === void 0 ? void 0 : data.referrerUser) === null || _d === void 0 ? void 0 : _d.lastName}`;
+    }
+    return (index.h("sqm-referral-table-user-cell", { name: name }));
+  }
   render() {
     reRender.useRequestRerender([
       this.deletedUser,

package/dist/cjs/sqm-refresh-button.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-87a1f4f7.js');
 require('./use-callback-e754042f.js');
-const index_module = require('./index.module-54724339.js');
+const index_module = require('./index.module-f972f103.js');
 require('./extends-08099afd.js');
 const utils = require('./utils-01dbfd4a.js');
 
@@ -29,7 +29,7 @@ const RefreshButton = class {
   disconnectedCallback() { }
   render() {
     const thisProps = utils.getProps(this);
-    const props = index_module.k()
+    const props = index_module.jn()
       ? useDemoRefereshButton(thisProps)
       : useRefreshButton(thisProps);
     return (index.h(RefreshButtonView, Object.assign({}, props), index.h("slot", null)));