@wlloyalty/wll-react-sdk 1.0.113 → 1.2.0

package/dist/types/mocks/tiles/roundupTile.d.ts

@@ -2,6 +2,10 @@ import { CTALinkTarget, RoundupTileConfig, TileHeight, TileType } from '../../ty
 export type RoundupTileMockConfig = Partial<RoundupTileConfig> & {
     active?: boolean;
     tileHeight?: TileHeight;
+    defaultLocale?: string;
+    details?: any[];
+    locale?: string;
+    balance?: number;
 };
 export declare const createRoundupTileMock: (config?: RoundupTileMockConfig) => {
     id: string;
@@ -13,11 +17,14 @@ export declare const createRoundupTileMock: (config?: RoundupTileMockConfig) =>
     priority: number;
     configuration: {
         title: string | null;
-        amount: number;
-        amountPrefix: string | null;
-        amountSuffix: string | null;
         artworkUrl: string | null;
         ctaLink: string | null | undefined;
         ctaLinkTarget: CTALinkTarget | undefined;
+        defaultLocale: string;
+        details: any[];
+        locale: string;
+        balance: number | undefined;
+        amountPrefix: string | null | undefined;
+        amountSuffix: string | null | undefined;
     };
 };

package/dist/types/types/tile.d.ts

@@ -49,7 +49,7 @@ export declare class RoundupTileConfig {
     amountPrefix?: string | null;
     amountSuffix?: string | null;
     artworkUrl?: string | null;
-    amount?: number;
+    balance?: number;
     ctaLink?: string | null;
     ctaLinkTarget?: CTALinkTarget;
 }

package/dist/types/utils/pointsHelpers.d.ts

@@ -1,3 +1,9 @@
+/**
+ * Cleans up a number by removing any whitespace and ensuring it's a valid number
+ * @param value The number to clean up
+ * @returns A cleaned up number as a number
+ */
+export declare const cleanNumber: (value: number) => number;
 /**
  * Applies a multiplier to a base value. Handles string multipliers by converting them to numbers.
  * If the multiplier is invalid (NaN, null, undefined), defaults to 1.

package/dist/web.js

@@ -20640,6 +20640,7 @@ var useGroupRefresh = function (_a) {
   }, [id, sdk, enabled, setGroupData]);
 };
 
+var inFlightRequests = new Map();
 var useInitialGroupFetch = function (_a) {
   var id = _a.id,
     setGroupData = _a.setGroupData;
@@ -20651,32 +20652,42 @@ var useInitialGroupFetch = function (_a) {
     error = _c[0],
     setError = _c[1];
   React.useEffect(function () {
+    if (!id || !(sdk === null || sdk === void 0 ? void 0 : sdk.refreshGroup)) {
+      setError('Unable to fetch group data: invalid configuration');
+      setIsLoading(false);
+      return;
+    }
     var cancelled = false;
-    var fetchGroup = function () {
+    var fetch = function () {
       return __awaiter(void 0, void 0, void 0, function () {
-        var response;
+        var existing, request, res;
         var _b;
         return __generator(this, function (_c) {
           switch (_c.label) {
             case 0:
-              if (!id || !(sdk === null || sdk === void 0 ? void 0 : sdk.refreshGroup)) {
-                setError('Unable to fetch group data: invalid configuration');
-                setIsLoading(false);
-                return [2 /*return*/];
-              }
               setIsLoading(true);
               setError(null);
+              existing = inFlightRequests.get(id);
+              request = existing !== null && existing !== void 0 ? existing : sdk.refreshGroup(id);
+              if (!existing) {
+                inFlightRequests.set(id, request);
+                request.finally(function () {
+                  if (inFlightRequests.get(id) === request) {
+                    inFlightRequests.delete(id);
+                  }
+                });
+              }
               _c.label = 1;
             case 1:
               _c.trys.push([1, 3, 4, 5]);
-              return [4 /*yield*/, sdk.refreshGroup(id)];
+              return [4 /*yield*/, request];
             case 2:
-              response = _c.sent();
+              res = _c.sent();
               if (cancelled) return [2 /*return*/];
-              if ((response === null || response === void 0 ? void 0 : response.status) === 'success' && response.data) {
-                setGroupData(response.data);
+              if ((res === null || res === void 0 ? void 0 : res.status) === 'success' && res.data) {
+                setGroupData(res.data);
               } else {
-                setError((_b = response === null || response === void 0 ? void 0 : response.error) !== null && _b !== void 0 ? _b : 'Failed to fetch group data');
+                setError((_b = res === null || res === void 0 ? void 0 : res.error) !== null && _b !== void 0 ? _b : 'Failed to fetch group data');
               }
               return [3 /*break*/, 5];
             case 3:
@@ -20692,7 +20703,7 @@ var useInitialGroupFetch = function (_a) {
         });
       });
     };
-    fetchGroup();
+    fetch();
     return function () {
       cancelled = true;
     };
@@ -22505,6 +22516,36 @@ TierTile.Full = TierTileFull;
 TierTile.Half = TierTileHalf;
 TierTile.Empty = TierTileEmpty;
 
+/**
+ * Renders formatted points value for a Roundup Tile.
+ *
+ * @returns JSX.Element or null if points are undefined or zero
+ */
+var RoundupTileFormattedPoints = function () {
+  var tileContext = useTileContext();
+  if (!isContextValid(tileContext)) return null;
+  var _a = tileContext.configuration,
+    _b = _a.balance,
+    balance = _b === void 0 ? 0 : _b,
+    _c = _a.amountPrefix,
+    amountPrefix = _c === void 0 ? '' : _c,
+    _d = _a.amountSuffix,
+    amountSuffix = _d === void 0 ? '' : _d;
+  if (balance === undefined) return null;
+  var fullPointsText = "".concat(amountPrefix).concat(cleanNumber(balance)).concat(amountSuffix).trim();
+  return /*#__PURE__*/React.createElement(View$2, {
+    testID: "roundup-tile-amount",
+    role: "article",
+    accessibilityLabel: "Amount: ".concat(fullPointsText)
+  }, /*#__PURE__*/React.createElement(Row, {
+    align: "center",
+    justify: "start"
+  }, /*#__PURE__*/React.createElement(Text, {
+    variant: "caption",
+    testID: "roundup-tile-value"
+  }, fullPointsText)));
+};
+
 /**
  * Custom hook that returns the styles for the RoundupTile component.
  * Applies responsive styling based on the current device.
@@ -22564,44 +22605,6 @@ var useRoundupTileStyles = function (isFullSize) {
   });
 };
 
-/**
- * Renders formatted points value for a Roundup Tile.
- *
- * @returns JSX.Element or null if points are undefined or zero
- */
-var RoundupTileFormattedPoints = function () {
-  var styles = useRoundupTileStyles();
-  var tileContext = useTileContext();
-  if (!isContextValid(tileContext)) return null;
-  var _a = tileContext.configuration,
-    _b = _a.amountPrefix,
-    amountPrefix = _b === void 0 ? '' : _b,
-    _c = _a.amountSuffix,
-    amountSuffix = _c === void 0 ? '' : _c,
-    _d = _a.amount,
-    amount = _d === void 0 ? 0 : _d;
-  if (amount === undefined) return null;
-  var fullPointsText = "".concat(amountPrefix).concat(amount, " ").concat(amountSuffix).trim();
-  return /*#__PURE__*/React.createElement(View$2, {
-    testID: "roundup-tile-amount",
-    role: "article",
-    accessibilityLabel: "Amount: ".concat(fullPointsText)
-  }, /*#__PURE__*/React.createElement(Row, {
-    align: "center",
-    justify: "start"
-  }, amountPrefix ? (/*#__PURE__*/React.createElement(Text, {
-    variant: "caption",
-    testID: "roundup-tile-prefix"
-  }, amountPrefix)) : null, /*#__PURE__*/React.createElement(Text, {
-    variant: "caption",
-    testID: "roundup-tile-value"
-  }, amount), amountSuffix ? (/*#__PURE__*/React.createElement(Text, {
-    variant: "caption",
-    style: styles.suffix,
-    testID: "roundup-tile-suffix"
-  }, amountSuffix)) : null));
-};
-
 /**
  * Renders the media of a Points Tile.
  *