@genesislcap/pbc-notify-ui 14.454.2-GENC-1321.1 → 14.455.0

package/dist/dts/components/foundation-inbox/components/foundation-inbox-counter/foundation-inbox-counter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"foundation-inbox-counter.d.ts","sourceRoot":"","sources":["../../../../../../src/components/foundation-inbox/components/foundation-inbox-counter/foundation-inbox-counter.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EAAiB,cAAc,EAAc,MAAM,uBAAuB,CAAC;AAElF,OAAO,EAAE,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAK5E,qBAKa,sBAAuB,SAAQ,cAAc;IAC5C,KAAK,EAAE,MAAM,CAAK;IACrB,OAAO,EAAE,OAAO,CAAC;IACF,YAAY,EAAE,sBAAsB,CAAC;IAC7D,OAAO,CAAC,aAAa,CAAe;IAE9B,iBAAiB;IAUvB,oBAAoB;IAOpB;;;OAGG;YACW,iBAAiB;IAU/B;;;OAGG;IACH,OAAO,CAAC,mBAAmB,CAEzB;CACH"}
+{"version":3,"file":"foundation-inbox-counter.d.ts","sourceRoot":"","sources":["../../../../../../src/components/foundation-inbox/components/foundation-inbox-counter/foundation-inbox-counter.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EAAiB,cAAc,EAAc,MAAM,uBAAuB,CAAC;AAElF,OAAO,EAAE,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAW5E,qBAKa,sBAAuB,SAAQ,cAAc;IAC5C,KAAK,EAAE,MAAM,CAAK;IACrB,OAAO,EAAE,OAAO,CAAC;IACF,YAAY,EAAE,sBAAsB,CAAC;IAC7D,OAAO,CAAC,aAAa,CAAe;IAE9B,iBAAiB;IAUvB,oBAAoB;IAOpB;;;OAGG;YACW,iBAAiB;IAc/B;;;OAGG;IACH,OAAO,CAAC,mBAAmB,CAEzB;CACH"}

package/dist/dts/components/foundation-inbox/inbox-base/inbox-base.d.ts

@@ -15,6 +15,7 @@ export declare class FoundationInboxBase extends GenesisElement {
     private connectionSub;
     private alerts;
     alertsFilter: Alert[];
+    moreAlerts: boolean;
     ruleService: RuleService;
     rules: Rule[];
     rulesFilter: Rule[];
@@ -43,6 +44,7 @@ export declare class FoundationInboxBase extends GenesisElement {
     severityTypeChanged(): void;
     inboxTabChanged(inboxTab: InboxTab): Promise<void>;
     alertsChanged: () => Alert[];
+    loadMoreAlerts(): void;
     rulesChanged: () => Rule[];
     templatesChanged: () => RuleTemplate[];
     debouncedFilterSearchAlertLog: any;

package/dist/dts/components/foundation-inbox/inbox-base/inbox-base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inbox-base.d.ts","sourceRoot":"","sources":["../../../../../src/components/foundation-inbox/inbox-base/inbox-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAEL,UAAU,EAKX,MAAM,kCAAkC,CAAC;AAE1C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AACvD,OAAO,EAAE,cAAc,EAAc,MAAM,uBAAuB,CAAC;AAKnE,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,sBAAsB,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAGrE,OAAO,EACL,KAAK,EACL,QAAQ,EACR,6BAA6B,EAC7B,IAAI,EAEJ,YAAY,EACb,MAAM,gBAAgB,CAAC;AAgBxB,qBAAa,mBAAoB,SAAQ,cAAc;IAC/C,IAAI,EAAE,IAAI,CAAC;IACR,OAAO,EAAE,OAAO,CAAC;IAEZ,YAAY,EAAE,YAAY,CAAC;IACjB,YAAY,EAAE,sBAAsB,CAAC;IAC7D,OAAO,CAAC,aAAa,CAAe;IACxB,OAAO,CAAC,MAAM,CAAe;IAC7B,YAAY,EAAE,KAAK,EAAE,CAAM;IAE1B,WAAW,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,IAAI,EAAE,CAAM;IACnB,WAAW,EAAE,IAAI,EAAE,CAAM;IAEpB,eAAe,EAAE,eAAe,CAAC;IACtC,SAAS,EAAE,YAAY,EAAE,CAAM;IAC/B,eAAe,EAAE,YAAY,EAAE,CAAM;IAErC,cAAc,EAAE,MAAM,CAAQ;IAC9B,gBAAgB,EAAE,MAAM,CAAQ;IAChC,eAAe,EAAE,MAAM,CAAQ;IAE/B,eAAe,EAAE,MAAM,CAAQ;IAC/B,mBAAmB,EAAE,6BAA6B,CAAQ;IAC1D,WAAW,EAAE,QAAQ,CAAuB;IAE5C,mBAAmB,EAAE,MAAM,CAAQ;IACnC,iBAAiB,EAAE,MAAM,CAAQ;IAEjC,wBAAwB,EAAE,UAAU,CAAC;IACrC,OAAO,EAAE,OAAO,CAAS;IACzB,aAAa,EAAE,MAAM,CAAS;IAC9B,oBAAoB,EAAE,OAAO,CAAS;IAEtC,YAAY,QAAM;IAEvB,IAAI,EAAE,IAAI,CAAC;IAEZ,iBAAiB;IAqBvB,oBAAoB;IAMpB,iBAAiB,GAAI;;KAAS,UAG5B;IAEF,mBAAmB;IAKb,eAAe,CAAC,QAAQ,EAAE,QAAQ;IA+BxC,aAAa,gBAA2C;IAExD,YAAY,eAAyC;IAErD,gBAAgB,uBAAiD;IAEjE,6BAA6B,MAAsD;IAEnF,oBAAoB;IAgEpB,oBAAoB;IAKpB,qBAAqB;IAWrB,WAAW;IAaX,YAAY,CAAC,OAAO,EAAE,MAAM;IAI5B,gBAAgB,CAAC,QAAQ,KAAA;IASzB,gBAAgB;IA4BhB,SAAS;IAEH,cAAc,CAAC,WAAW,EAAE,IAAI;IAgBhC,WAAW,CAAC,WAAW,EAAE,IAAI;IAO7B,wBAAwB,CAAC,YAAY,EAAE,GAAG;IAYhD,6BAA6B,CAAC,IAAI,CAAC,EAAE,MAAM;CAG5C"}
+{"version":3,"file":"inbox-base.d.ts","sourceRoot":"","sources":["../../../../../src/components/foundation-inbox/inbox-base/inbox-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAEL,UAAU,EAKX,MAAM,kCAAkC,CAAC;AAE1C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AACvD,OAAO,EAAE,cAAc,EAAc,MAAM,uBAAuB,CAAC;AAKnE,OAAO,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAC/D,OAAO,EAAE,sBAAsB,EAAmB,MAAM,iCAAiC,CAAC;AAC1F,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAGrE,OAAO,EACL,KAAK,EACL,QAAQ,EACR,6BAA6B,EAC7B,IAAI,EAEJ,YAAY,EACb,MAAM,gBAAgB,CAAC;AAgBxB,qBAAa,mBAAoB,SAAQ,cAAc;IAC/C,IAAI,EAAE,IAAI,CAAC;IACR,OAAO,EAAE,OAAO,CAAC;IAEZ,YAAY,EAAE,YAAY,CAAC;IACjB,YAAY,EAAE,sBAAsB,CAAC;IAC7D,OAAO,CAAC,aAAa,CAAe;IACxB,OAAO,CAAC,MAAM,CAAe;IAC7B,YAAY,EAAE,KAAK,EAAE,CAAM;IAC3B,UAAU,EAAE,OAAO,CAAS;IAE3B,WAAW,EAAE,WAAW,CAAC;IAC1B,KAAK,EAAE,IAAI,EAAE,CAAM;IACnB,WAAW,EAAE,IAAI,EAAE,CAAM;IAEpB,eAAe,EAAE,eAAe,CAAC;IACtC,SAAS,EAAE,YAAY,EAAE,CAAM;IAC/B,eAAe,EAAE,YAAY,EAAE,CAAM;IAErC,cAAc,EAAE,MAAM,CAAQ;IAC9B,gBAAgB,EAAE,MAAM,CAAQ;IAChC,eAAe,EAAE,MAAM,CAAQ;IAE/B,eAAe,EAAE,MAAM,CAAQ;IAC/B,mBAAmB,EAAE,6BAA6B,CAAQ;IAC1D,WAAW,EAAE,QAAQ,CAAuB;IAE5C,mBAAmB,EAAE,MAAM,CAAQ;IACnC,iBAAiB,EAAE,MAAM,CAAQ;IAEjC,wBAAwB,EAAE,UAAU,CAAC;IACrC,OAAO,EAAE,OAAO,CAAS;IACzB,aAAa,EAAE,MAAM,CAAS;IAC9B,oBAAoB,EAAE,OAAO,CAAS;IAEtC,YAAY,QAAM;IAEvB,IAAI,EAAE,IAAI,CAAC;IAEZ,iBAAiB;IAsBvB,oBAAoB;IAMpB,iBAAiB,GAAI;;KAAS,UAI5B;IAEF,mBAAmB;IAKb,eAAe,CAAC,QAAQ,EAAE,QAAQ;IA+BxC,aAAa,gBAA2C;IAExD,cAAc;IAId,YAAY,eAAyC;IAErD,gBAAgB,uBAAiD;IAEjE,6BAA6B,MAAsD;IAEnF,oBAAoB;IAgEpB,oBAAoB;IAKpB,qBAAqB;IAWrB,WAAW;IAaX,YAAY,CAAC,OAAO,EAAE,MAAM;IAI5B,gBAAgB,CAAC,QAAQ,KAAA;IASzB,gBAAgB;IA4BhB,SAAS;IAEH,cAAc,CAAC,WAAW,EAAE,IAAI;IAgBhC,WAAW,CAAC,WAAW,EAAE,IAAI;IAO7B,wBAAwB,CAAC,YAAY,EAAE,GAAG;IAYhD,6BAA6B,CAAC,IAAI,CAAC,EAAE,MAAM;CAG5C"}

package/dist/dts/components/foundation-inbox/inbox.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inbox.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/foundation-inbox/inbox.styles.ts"],"names":[],"mappings":"AA4JA,eAAO,MAAM,WAAW,iDA+BvB,CAAC;AAEF,eAAO,MAAM,yBAAyB,iDAwErC,CAAC;AAEF,eAAO,MAAM,aAAa,iDAYzB,CAAC;AAEF,eAAO,MAAM,SAAS,iDAYrB,CAAC;AAEF,eAAO,MAAM,eAAe,iDAmF3B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,iDAyBjC,CAAC"}
+{"version":3,"file":"inbox.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/foundation-inbox/inbox.styles.ts"],"names":[],"mappings":"AA4JA,eAAO,MAAM,WAAW,iDA+BvB,CAAC;AAEF,eAAO,MAAM,yBAAyB,iDA8ErC,CAAC;AAEF,eAAO,MAAM,aAAa,iDAYzB,CAAC;AAEF,eAAO,MAAM,SAAS,iDAYrB,CAAC;AAEF,eAAO,MAAM,eAAe,iDAmF3B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,iDAyBjC,CAAC"}

package/dist/dts/components/foundation-inbox/inbox.template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inbox.template.d.ts","sourceRoot":"","sources":["../../../../src/components/foundation-inbox/inbox.template.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAyL/C;;GAEG;AACH,eAAO,MAAM,uBAAuB,sEAoJnC,CAAC"}
+{"version":3,"file":"inbox.template.d.ts","sourceRoot":"","sources":["../../../../src/components/foundation-inbox/inbox.template.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAmM/C;;GAEG;AACH,eAAO,MAAM,uBAAuB,sEAoJnC,CAAC"}

package/dist/dts/services/inbox.service.d.ts

@@ -1,6 +1,12 @@
 import { SocketSubscription } from '@genesislcap/foundation-comms';
+/**
+ * Number of alert rows fetched per data server batch. The first batch is loaded
+ * on subscribe; subsequent batches are fetched via {@link FoundationInboxService.getMoreRows}.
+ */
+export declare const INBOX_PAGE_SIZE = 20;
 export interface FoundationInboxServiceStore {
     items: Array<any>;
+    moreRows: boolean;
 }
 export type SubscribeCallback = ({ store }: {
     store: FoundationInboxServiceStore;
@@ -10,8 +16,18 @@ export type Subscription = {
     socketSubscription: SocketSubscription;
 };
 export interface FoundationInboxService {
-    subscribe(callback: SubscribeCallback, reverse: boolean, criteriaMatch: string): void;
+    /**
+     * Subscribes to the alerts stream.
+     * @param maxRows - when provided, limits the initial batch (enabling
+     * {@link FoundationInboxService.getMoreRows} pagination). Omit to stream the
+     * full result set, e.g. for an unread counter that needs the total.
+     * @param fields - comma-separated list of fields to return. Omit for all
+     * fields; pass a minimal set (e.g. just the id) when only the row count
+     * matters, to keep the payload small.
+     */
+    subscribe(callback: SubscribeCallback, reverse: boolean, criteriaMatch: string, maxRows?: number, fields?: string): void;
     unsubscribe(callback: SubscribeCallback): void;
+    getMoreRows(): void;
 }
 export declare const FoundationInboxService: import("@microsoft/fast-foundation").InterfaceSymbol<FoundationInboxService>;
 //# sourceMappingURL=inbox.service.d.ts.map

package/dist/dts/services/inbox.service.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inbox.service.d.ts","sourceRoot":"","sources":["../../../src/services/inbox.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmC,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAIpG,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;CACnB;AAED,MAAM,MAAM,iBAAiB,GAAG,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,2BAA2B,CAAA;CAAE,KAAK,GAAG,CAAC;AAE3F,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,kBAAkB,EAAE,kBAAkB,CAAC;CACxC,CAAC;AAEF,MAAM,WAAW,sBAAsB;IACrC,SAAS,CAAC,QAAQ,EAAE,iBAAiB,EAAE,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IACtF,WAAW,CAAC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAC;CAChD;AAgED,eAAO,MAAM,sBAAsB,8EAElC,CAAC"}
+{"version":3,"file":"inbox.service.d.ts","sourceRoot":"","sources":["../../../src/services/inbox.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmC,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAIpG;;;GAGG;AACH,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,MAAM,iBAAiB,GAAG,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,2BAA2B,CAAA;CAAE,KAAK,GAAG,CAAC;AAE3F,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,kBAAkB,EAAE,kBAAkB,CAAC;CACxC,CAAC;AAEF,MAAM,WAAW,sBAAsB;IACrC;;;;;;;;OAQG;IACH,SAAS,CACP,QAAQ,EAAE,iBAAiB,EAC3B,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,MAAM,EACrB,OAAO,CAAC,EAAE,MAAM,EAChB,MAAM,CAAC,EAAE,MAAM,GACd,IAAI,CAAC;IACR,WAAW,CAAC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC/C,WAAW,IAAI,IAAI,CAAC;CACrB;AAmGD,eAAO,MAAM,sBAAsB,8EAElC,CAAC"}

package/dist/dts/utils/updateArray.d.ts

@@ -1,2 +1,9 @@
-export declare const updateArray: (newData: Array<any>, oldData: Array<any>) => Array<any>;
+/**
+ * Merges streamed data server rows into the existing list.
+ *
+ * New INSERT rows are prepended by default so real-time alerts surface at the
+ * top. When {@link append} is set (e.g. for `getMoreRows` pagination batches),
+ * rows are appended instead so they continue the existing order at the bottom.
+ */
+export declare const updateArray: (newData: Array<any>, oldData: Array<any>, append?: boolean) => Array<any>;
 //# sourceMappingURL=updateArray.d.ts.map

package/dist/dts/utils/updateArray.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"updateArray.d.ts","sourceRoot":"","sources":["../../../src/utils/updateArray.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW,GAAI,SAAS,KAAK,CAAC,GAAG,CAAC,EAAE,SAAS,KAAK,CAAC,GAAG,CAAC,KAAG,KAAK,CAAC,GAAG,CAgC/E,CAAC"}
+{"version":3,"file":"updateArray.d.ts","sourceRoot":"","sources":["../../../src/utils/updateArray.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,eAAO,MAAM,WAAW,GACtB,SAAS,KAAK,CAAC,GAAG,CAAC,EACnB,SAAS,KAAK,CAAC,GAAG,CAAC,EACnB,gBAAc,KACb,KAAK,CAAC,GAAG,CAoCX,CAAC"}

package/dist/esm/components/foundation-inbox/components/foundation-inbox-counter/foundation-inbox-counter.js

@@ -5,6 +5,11 @@ import { FoundationInboxService } from '../../../../services/inbox.service';
 import { AlertStatus } from '../../inbox.types';
 import { FoundationInboxCounterStyles } from './foundation-inbox-counter.styles';
 import { FoundationInboxCounterTemplate } from './foundation-inbox-counter.template';
+/**
+ * The counter renders "99+" once the count exceeds 99, so there is no need to
+ * stream more than 100 rows just to know the total to display.
+ */
+const COUNTER_MAX_ROWS = 100;
 let FoundationInboxCounter = class FoundationInboxCounter extends GenesisElement {
     constructor() {
         super(...arguments);
@@ -43,7 +48,9 @@ let FoundationInboxCounter = class FoundationInboxCounter extends GenesisElement
     subscribeToAlerts() {
         return __awaiter(this, void 0, void 0, function* () {
             this.inboxService.unsubscribe(this.subscriptionHandler);
-            this.inboxService.subscribe(this.subscriptionHandler, false, `ALERT_STATUS=='${AlertStatus.NEW}'`);
+            // Only the row count matters here: cap rows at the display ceiling and
+            // request just the id to keep the payload small.
+            this.inboxService.subscribe(this.subscriptionHandler, false, `ALERT_STATUS=='${AlertStatus.NEW}'`, COUNTER_MAX_ROWS, 'ALERT_ID');
         });
     }
 };

package/dist/esm/components/foundation-inbox/inbox-base/inbox-base.js

@@ -7,7 +7,7 @@ import dayjs from 'dayjs';
 import utc from 'dayjs/plugin/utc';
 import debounce from 'lodash.debounce';
 import { AlertService } from '../../../services/alert.service';
-import { FoundationInboxService } from '../../../services/inbox.service';
+import { FoundationInboxService, INBOX_PAGE_SIZE } from '../../../services/inbox.service';
 import { RuleService } from '../../../services/rule.service';
 import { TemplateService } from '../../../services/template.service';
 import { logger } from '../../../utils';
@@ -28,6 +28,7 @@ export class FoundationInboxBase extends GenesisElement {
         super(...arguments);
         this.alerts = [];
         this.alertsFilter = [];
+        this.moreAlerts = false;
         this.rules = [];
         this.rulesFilter = [];
         this.templates = [];
@@ -45,7 +46,9 @@ export class FoundationInboxBase extends GenesisElement {
         this.showLoadingIndicator = false;
         this.severityType = [];
         this.alertSubscription = ({ store }) => {
+            var _a;
             this.alerts = (store === null || store === void 0 ? void 0 : store.items) || [];
+            this.moreAlerts = (_a = store === null || store === void 0 ? void 0 : store.moreRows) !== null && _a !== void 0 ? _a : false;
             this.showLoadingIndicator = false;
         };
         // #endregion
@@ -65,7 +68,7 @@ export class FoundationInboxBase extends GenesisElement {
             this.connectionSub = this.connect.isConnected$.subscribe((isConnected) => {
                 if (isConnected) {
                     this.inboxService.unsubscribe(this.alertSubscription);
-                    this.inboxService.subscribe(this.alertSubscription, false, criteriaBuilder().withExpression(this.criteriaMatchAlertStatus).build());
+                    this.inboxService.subscribe(this.alertSubscription, false, criteriaBuilder().withExpression(this.criteriaMatchAlertStatus).build(), INBOX_PAGE_SIZE);
                 }
             });
             this.rules = yield this.ruleService.getRules();
@@ -106,6 +109,9 @@ export class FoundationInboxBase extends GenesisElement {
             }
         });
     }
+    loadMoreAlerts() {
+        this.inboxService.getMoreRows();
+    }
     filterSearchAlertLog() {
         this.showLoadingIndicator = true;
         const filterCriteria = criteriaBuilder();
@@ -136,7 +142,7 @@ export class FoundationInboxBase extends GenesisElement {
         // Refresh the data subscription
         this.inboxService.unsubscribe(this.alertSubscription);
         const criteria = filterCriteria.build();
-        this.inboxService.subscribe(this.alertSubscription, this.reverse, criteria);
+        this.inboxService.subscribe(this.alertSubscription, this.reverse, criteria, INBOX_PAGE_SIZE);
     }
     sortDirectionChanged() {
         this.reverse = this.sortDirection === 'Asc';
@@ -251,6 +257,9 @@ __decorate([
 __decorate([
     observable
 ], FoundationInboxBase.prototype, "alertsFilter", void 0);
+__decorate([
+    observable
+], FoundationInboxBase.prototype, "moreAlerts", void 0);
 __decorate([
     RuleService
 ], FoundationInboxBase.prototype, "ruleService", void 0);

package/dist/esm/components/foundation-inbox/inbox.styles.js

@@ -247,6 +247,12 @@ export const alertsNewAndAlertsHistory = css `
     color: var(--neutral-stroke-rest);
   }
 
+  .load-more-container {
+    display: flex;
+    justify-content: center;
+    padding: calc(var(--design-unit) * 2px);
+  }
+
   .loading-indicator {
     border: calc(var(--stroke-width) * 1px) solid var(--neutral-fill-input-rest);
     background: var(--neutral-layer-3);

package/dist/esm/components/foundation-inbox/inbox.template.js

@@ -159,6 +159,13 @@ const alertsTab = (tab) => html `
       ${when((x) => x.alertsFilter.length === 0 && !x.showLoadingIndicator, html `
           <div class="no-row-container">No Alerts To Show</div>
         `)}
+      ${when((x) => x.moreAlerts && !x.showLoadingIndicator, html `
+          <div class="load-more-container">
+            <rapid-button class="load-more" @click=${(x) => x.loadMoreAlerts()}>
+              Load More
+            </rapid-button>
+          </div>
+        `)}
       ${when((x) => x.showLoadingIndicator, html `
           <div class="no-row-container">
             <div class="loading-indicator">Loading...</div>

package/dist/esm/services/inbox.service.js

@@ -2,31 +2,56 @@ import { __decorate } from "tslib";
 import { Auth, Connect } from '@genesislcap/foundation-comms';
 import { DI } from '@genesislcap/web-core';
 import { logger, updateArray } from '../utils';
+/**
+ * Number of alert rows fetched per data server batch. The first batch is loaded
+ * on subscribe; subsequent batches are fetched via {@link FoundationInboxService.getMoreRows}.
+ */
+export const INBOX_PAGE_SIZE = 20;
 class FoundationInboxServiceImpl {
     constructor() {
         this.subscriptions = [];
+        this.sourceRef = null;
+        this.fetchingMore = false;
         this.store = {
             items: [],
+            moreRows: false,
         };
     }
-    getStream(reverse, criteriaMatch) {
+    getStream(reverse, criteriaMatch, maxRows, fields) {
         return this.connect.stream('ALL_NOTIFY_ALERT_RECORDS', (result) => {
+            var _a;
             if (result.ERROR) {
                 logger.error(result.ERROR);
                 return;
             }
-            this.store.items = updateArray(result === null || result === void 0 ? void 0 : result.ROW, this.store.items);
+            if (result.SOURCE_REF) {
+                this.sourceRef = result.SOURCE_REF;
+            }
+            this.store.moreRows = Boolean(result.MORE_ROWS);
+            // getMoreRows batches continue the existing order, so append them
+            // rather than prepending like real-time inserts.
+            const append = this.fetchingMore;
+            this.store.items = updateArray(result === null || result === void 0 ? void 0 : result.ROW, this.store.items, append);
+            if (append && ((_a = result === null || result === void 0 ? void 0 : result.ROW) === null || _a === void 0 ? void 0 : _a.length)) {
+                this.fetchingMore = false;
+            }
             this.subscriptions.forEach((subscription) => {
                 subscription.callback({ store: this.store });
             });
-        }, (response) => logger.error(response), Object.assign({ REVERSE: reverse }, (criteriaMatch != '' && { CRITERIA_MATCH: criteriaMatch })));
+        }, (response) => logger.error(response), Object.assign(Object.assign(Object.assign({ REVERSE: reverse }, (maxRows != null && { MAX_ROWS: maxRows })), (fields && { FIELDS: fields })), (criteriaMatch != '' && { CRITERIA_MATCH: criteriaMatch })));
+    }
+    getMoreRows() {
+        if (this.sourceRef) {
+            this.fetchingMore = true;
+            this.connect.getMoreRows(this.sourceRef);
+        }
     }
-    subscribe(callback, reverse, criteriaMatch) {
+    subscribe(callback, reverse, criteriaMatch, maxRows, fields) {
         if (this.stream) {
             callback({ store: this.store });
             return;
         }
-        this.stream = this.getStream(reverse, criteriaMatch);
+        this.stream = this.getStream(reverse, criteriaMatch, maxRows, fields);
         const socketSubscription = this.stream.subscribe();
         this.subscriptions.push({ callback, socketSubscription });
     }
@@ -36,11 +61,13 @@ class FoundationInboxServiceImpl {
             const found = this.subscriptions.splice(index, 1);
             found.forEach((subscription) => {
                 subscription.socketSubscription.unsubscribe();
-                subscription.callback({ store: { items: [] } });
+                subscription.callback({ store: { items: [], moreRows: false } });
             });
         }
         this.stream = undefined;
-        this.store = { items: [] };
+        this.sourceRef = null;
+        this.fetchingMore = false;
+        this.store = { items: [], moreRows: false };
     }
 }
 __decorate([

package/dist/esm/utils/updateArray.js

@@ -1,4 +1,11 @@
-export const updateArray = (newData, oldData) => {
+/**
+ * Merges streamed data server rows into the existing list.
+ *
+ * New INSERT rows are prepended by default so real-time alerts surface at the
+ * top. When {@link append} is set (e.g. for `getMoreRows` pagination batches),
+ * rows are appended instead so they continue the existing order at the bottom.
+ */
+export const updateArray = (newData, oldData, append = false) => {
     if (newData && oldData && oldData.length > 0) {
         newData.forEach((row) => {
             const eventData = row;
@@ -7,7 +14,12 @@ export const updateArray = (newData, oldData) => {
                 const type = eventData.DETAILS.OPERATION;
                 if (type === 'INSERT') {
                     if (!oldData.find((x) => { var _a; return ((_a = x.DETAILS) === null || _a === void 0 ? void 0 : _a.ROW_REF) === ref; })) {
-                        oldData.unshift(eventData);
+                        if (append) {
+                            oldData.push(eventData);
+                        }
+                        else {
+                            oldData.unshift(eventData);
+                        }
                     }
                 }
                 if (type === 'DELETE') {

package/dist/pbc-notify-ui.d.ts

@@ -52,6 +52,7 @@ declare class FoundationInboxBase extends GenesisElement {
     private connectionSub;
     private alerts;
     alertsFilter: Alert[];
+    moreAlerts: boolean;
     ruleService: RuleService;
     rules: Rule_2[];
     rulesFilter: Rule_2[];
@@ -80,6 +81,7 @@ declare class FoundationInboxBase extends GenesisElement {
     severityTypeChanged(): void;
     inboxTabChanged(inboxTab: InboxTab): Promise<void>;
     alertsChanged: () => Alert[];
+    loadMoreAlerts(): void;
     rulesChanged: () => Rule_2[];
     templatesChanged: () => RuleTemplate[];
     debouncedFilterSearchAlertLog: any;
@@ -128,14 +130,25 @@ export declare class FoundationInboxFlyout extends FoundationInboxBase {
 }
 
 declare interface FoundationInboxService {
-    subscribe(callback: SubscribeCallback, reverse: boolean, criteriaMatch: string): void;
+    /**
+     * Subscribes to the alerts stream.
+     * @param maxRows - when provided, limits the initial batch (enabling
+     * {@link FoundationInboxService.getMoreRows} pagination). Omit to stream the
+     * full result set, e.g. for an unread counter that needs the total.
+     * @param fields - comma-separated list of fields to return. Omit for all
+     * fields; pass a minimal set (e.g. just the id) when only the row count
+     * matters, to keep the payload small.
+     */
+    subscribe(callback: SubscribeCallback, reverse: boolean, criteriaMatch: string, maxRows?: number, fields?: string): void;
     unsubscribe(callback: SubscribeCallback): void;
+    getMoreRows(): void;
 }
 
 declare const FoundationInboxService: InterfaceSymbol<FoundationInboxService>;
 
 declare interface FoundationInboxServiceStore {
     items: Array<any>;
+    moreRows: boolean;
 }
 
 /**

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/pbc-notify-ui",
   "description": "Genesis PBC Notify UI",
-  "version": "14.454.2-GENC-1321.1",
+  "version": "14.455.0",
   "license": "SEE LICENSE IN license.txt",
   "workspaces": [
     "client"
@@ -83,34 +83,34 @@
     "@commitlint/format": "^19.0.3",
     "@genesiscommunitysuccess/cep-fast-plugin": "5.0.3",
     "@genesiscommunitysuccess/custom-elements-lsp": "5.0.3",
-    "@genesislcap/design-system-configurator": "14.454.2-GENC-1321.1",
-    "@genesislcap/eslint-config": "14.454.2-GENC-1321.1",
-    "@genesislcap/eslint-stylelint-builder": "14.454.2-GENC-1321.1",
-    "@genesislcap/foundation-testing": "14.454.2-GENC-1321.1",
-    "@genesislcap/genx": "14.454.2-GENC-1321.1",
-    "@genesislcap/prettier-config": "14.454.2-GENC-1321.1",
-    "@genesislcap/stylelint-config": "14.454.2-GENC-1321.1",
-    "@genesislcap/vite-builder": "14.454.2-GENC-1321.1",
-    "@genesislcap/webpack-builder": "14.454.2-GENC-1321.1",
+    "@genesislcap/design-system-configurator": "14.455.0",
+    "@genesislcap/eslint-config": "14.455.0",
+    "@genesislcap/eslint-stylelint-builder": "14.455.0",
+    "@genesislcap/foundation-testing": "14.455.0",
+    "@genesislcap/genx": "14.455.0",
+    "@genesislcap/prettier-config": "14.455.0",
+    "@genesislcap/stylelint-config": "14.455.0",
+    "@genesislcap/vite-builder": "14.455.0",
+    "@genesislcap/webpack-builder": "14.455.0",
     "dayjs": "^1.11.7"
   },
   "dependencies": {
-    "@genesislcap/foundation-comms": "14.454.2-GENC-1321.1",
-    "@genesislcap/foundation-criteria": "14.454.2-GENC-1321.1",
-    "@genesislcap/foundation-entity-management": "14.454.2-GENC-1321.1",
-    "@genesislcap/foundation-forms": "14.454.2-GENC-1321.1",
-    "@genesislcap/foundation-layout": "14.454.2-GENC-1321.1",
-    "@genesislcap/foundation-logger": "14.454.2-GENC-1321.1",
-    "@genesislcap/foundation-notifications": "14.454.2-GENC-1321.1",
-    "@genesislcap/foundation-utils": "14.454.2-GENC-1321.1",
-    "@genesislcap/rapid-design-system": "14.454.2-GENC-1321.1",
-    "@genesislcap/rapid-grid-pro": "14.454.2-GENC-1321.1",
-    "@genesislcap/web-core": "14.454.2-GENC-1321.1",
+    "@genesislcap/foundation-comms": "14.455.0",
+    "@genesislcap/foundation-criteria": "14.455.0",
+    "@genesislcap/foundation-entity-management": "14.455.0",
+    "@genesislcap/foundation-forms": "14.455.0",
+    "@genesislcap/foundation-layout": "14.455.0",
+    "@genesislcap/foundation-logger": "14.455.0",
+    "@genesislcap/foundation-notifications": "14.455.0",
+    "@genesislcap/foundation-utils": "14.455.0",
+    "@genesislcap/rapid-design-system": "14.455.0",
+    "@genesislcap/rapid-grid-pro": "14.455.0",
+    "@genesislcap/web-core": "14.455.0",
     "lodash.debounce": "^4.0.8",
     "rxjs": "^7.5.4"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b007200ac54f1dbc01bfd52eeafefc18956e51df"
+  "gitHead": "4bc53b57369917a4760419c851494aa486bbe2a0"
 }

package/src/components/foundation-inbox/components/foundation-inbox-counter/foundation-inbox-counter.ts

@@ -6,6 +6,12 @@ import { AlertStatus } from '../../inbox.types';
 import { FoundationInboxCounterStyles } from './foundation-inbox-counter.styles';
 import { FoundationInboxCounterTemplate } from './foundation-inbox-counter.template';
 
+/**
+ * The counter renders "99+" once the count exceeds 99, so there is no need to
+ * stream more than 100 rows just to know the total to display.
+ */
+const COUNTER_MAX_ROWS = 100;
+
 @customElement({
   name: 'foundation-inbox-counter',
   template: FoundationInboxCounterTemplate,
@@ -41,10 +47,14 @@ export class FoundationInboxCounter extends GenesisElement {
   private async subscribeToAlerts(): Promise<void> {
     this.inboxService.unsubscribe(this.subscriptionHandler);
 
+    // Only the row count matters here: cap rows at the display ceiling and
+    // request just the id to keep the payload small.
     this.inboxService.subscribe(
       this.subscriptionHandler,
       false,
       `ALERT_STATUS=='${AlertStatus.NEW}'`,
+      COUNTER_MAX_ROWS,
+      'ALERT_ID',
     );
   }
 

package/src/components/foundation-inbox/inbox-base/inbox-base.ts

@@ -15,7 +15,7 @@ import utc from 'dayjs/plugin/utc';
 import debounce from 'lodash.debounce';
 import { Subscription } from 'rxjs';
 import { AlertService } from '../../../services/alert.service';
-import { FoundationInboxService } from '../../../services/inbox.service';
+import { FoundationInboxService, INBOX_PAGE_SIZE } from '../../../services/inbox.service';
 import { RuleService } from '../../../services/rule.service';
 import { TemplateService } from '../../../services/template.service';
 import { logger } from '../../../utils';
@@ -52,6 +52,7 @@ export class FoundationInboxBase extends GenesisElement {
   private connectionSub: Subscription;
   @observable private alerts: Alert[] = [];
   @observable alertsFilter: Alert[] = [];
+  @observable moreAlerts: boolean = false;
 
   @RuleService ruleService: RuleService;
   @observable rules: Rule[] = [];
@@ -94,6 +95,7 @@ export class FoundationInboxBase extends GenesisElement {
           this.alertSubscription,
           false,
           criteriaBuilder().withExpression(this.criteriaMatchAlertStatus).build(),
+          INBOX_PAGE_SIZE,
         );
       }
     });
@@ -110,6 +112,7 @@ export class FoundationInboxBase extends GenesisElement {
 
   alertSubscription = ({ store }) => {
     this.alerts = store?.items || [];
+    this.moreAlerts = store?.moreRows ?? false;
     this.showLoadingIndicator = false;
   };
 
@@ -151,6 +154,10 @@ export class FoundationInboxBase extends GenesisElement {
   // #region Changed Events
   alertsChanged = () => (this.alertsFilter = this.alerts);
 
+  loadMoreAlerts() {
+    this.inboxService.getMoreRows();
+  }
+
   rulesChanged = () => (this.rulesFilter = this.rules);
 
   templatesChanged = () => (this.templatesFilter = this.templates);
@@ -218,7 +225,7 @@ export class FoundationInboxBase extends GenesisElement {
     // Refresh the data subscription
     this.inboxService.unsubscribe(this.alertSubscription);
     const criteria = filterCriteria.build();
-    this.inboxService.subscribe(this.alertSubscription, this.reverse, criteria);
+    this.inboxService.subscribe(this.alertSubscription, this.reverse, criteria, INBOX_PAGE_SIZE);
   }
 
   sortDirectionChanged() {

package/src/components/foundation-inbox/inbox.styles.ts

@@ -251,6 +251,12 @@ export const alertsNewAndAlertsHistory = css`
     color: var(--neutral-stroke-rest);
   }
 
+  .load-more-container {
+    display: flex;
+    justify-content: center;
+    padding: calc(var(--design-unit) * 2px);
+  }
+
   .loading-indicator {
     border: calc(var(--stroke-width) * 1px) solid var(--neutral-fill-input-rest);
     background: var(--neutral-layer-3);

package/src/components/foundation-inbox/inbox.template.ts

@@ -173,6 +173,16 @@ const alertsTab = (tab: InboxTab) => html<FoundationInbox>`
           <div class="no-row-container">No Alerts To Show</div>
         `,
       )}
+      ${when(
+        (x) => x.moreAlerts && !x.showLoadingIndicator,
+        html`
+          <div class="load-more-container">
+            <rapid-button class="load-more" @click=${(x) => x.loadMoreAlerts()}>
+              Load More
+            </rapid-button>
+          </div>
+        `,
+      )}
       ${when(
         (x) => x.showLoadingIndicator,
         html`

package/src/services/inbox.service.ts

@@ -2,8 +2,15 @@ import { Auth, Connect, SocketObservable, SocketSubscription } from '@genesislca
 import { DI } from '@genesislcap/web-core';
 import { logger, updateArray } from '../utils';
 
+/**
+ * Number of alert rows fetched per data server batch. The first batch is loaded
+ * on subscribe; subsequent batches are fetched via {@link FoundationInboxService.getMoreRows}.
+ */
+export const INBOX_PAGE_SIZE = 20;
+
 export interface FoundationInboxServiceStore {
   items: Array<any>;
+  moreRows: boolean;
 }
 
 export type SubscribeCallback = ({ store }: { store: FoundationInboxServiceStore }) => any;
@@ -14,8 +21,24 @@ export type Subscription = {
 };
 
 export interface FoundationInboxService {
-  subscribe(callback: SubscribeCallback, reverse: boolean, criteriaMatch: string): void;
+  /**
+   * Subscribes to the alerts stream.
+   * @param maxRows - when provided, limits the initial batch (enabling
+   * {@link FoundationInboxService.getMoreRows} pagination). Omit to stream the
+   * full result set, e.g. for an unread counter that needs the total.
+   * @param fields - comma-separated list of fields to return. Omit for all
+   * fields; pass a minimal set (e.g. just the id) when only the row count
+   * matters, to keep the payload small.
+   */
+  subscribe(
+    callback: SubscribeCallback,
+    reverse: boolean,
+    criteriaMatch: string,
+    maxRows?: number,
+    fields?: string,
+  ): void;
   unsubscribe(callback: SubscribeCallback): void;
+  getMoreRows(): void;
 }
 
 class FoundationInboxServiceImpl implements FoundationInboxService {
@@ -23,11 +46,19 @@ class FoundationInboxServiceImpl implements FoundationInboxService {
   @Auth private auth: Auth;
   private stream: SocketObservable<any> | null;
   private subscriptions: Subscription[] = [];
+  private sourceRef: string | null = null;
+  private fetchingMore = false;
   public store: FoundationInboxServiceStore = {
     items: [],
+    moreRows: false,
   };
 
-  private getStream(reverse: boolean, criteriaMatch: string): SocketObservable<any> {
+  private getStream(
+    reverse: boolean,
+    criteriaMatch: string,
+    maxRows?: number,
+    fields?: string,
+  ): SocketObservable<any> {
     return this.connect.stream(
       'ALL_NOTIFY_ALERT_RECORDS',
       (result) => {
@@ -36,7 +67,17 @@ class FoundationInboxServiceImpl implements FoundationInboxService {
           return;
         }
 
-        this.store.items = updateArray(result?.ROW, this.store.items);
+        if (result.SOURCE_REF) {
+          this.sourceRef = result.SOURCE_REF;
+        }
+        this.store.moreRows = Boolean(result.MORE_ROWS);
+        // getMoreRows batches continue the existing order, so append them
+        // rather than prepending like real-time inserts.
+        const append = this.fetchingMore;
+        this.store.items = updateArray(result?.ROW, this.store.items, append);
+        if (append && result?.ROW?.length) {
+          this.fetchingMore = false;
+        }
 
         this.subscriptions.forEach((subscription) => {
           subscription.callback({ store: this.store });
@@ -45,18 +86,33 @@ class FoundationInboxServiceImpl implements FoundationInboxService {
       (response) => logger.error(response),
       {
         REVERSE: reverse,
+        ...(maxRows != null && { MAX_ROWS: maxRows }),
+        ...(fields && { FIELDS: fields }),
         ...(criteriaMatch != '' && { CRITERIA_MATCH: criteriaMatch }),
       },
     ) as SocketObservable<any>;
   }
 
-  public subscribe(callback: SubscribeCallback, reverse: boolean, criteriaMatch: string): void {
+  public getMoreRows(): void {
+    if (this.sourceRef) {
+      this.fetchingMore = true;
+      this.connect.getMoreRows(this.sourceRef);
+    }
+  }
+
+  public subscribe(
+    callback: SubscribeCallback,
+    reverse: boolean,
+    criteriaMatch: string,
+    maxRows?: number,
+    fields?: string,
+  ): void {
     if (this.stream) {
       callback({ store: this.store });
       return;
     }
 
-    this.stream = this.getStream(reverse, criteriaMatch);
+    this.stream = this.getStream(reverse, criteriaMatch, maxRows, fields);
     const socketSubscription = this.stream.subscribe();
 
     this.subscriptions.push({ callback, socketSubscription });
@@ -71,12 +127,14 @@ class FoundationInboxServiceImpl implements FoundationInboxService {
       const found = this.subscriptions.splice(index, 1);
       found.forEach((subscription) => {
         subscription.socketSubscription.unsubscribe();
-        subscription.callback({ store: { items: [] } });
+        subscription.callback({ store: { items: [], moreRows: false } });
       });
     }
 
     this.stream = undefined;
-    this.store = { items: [] };
+    this.sourceRef = null;
+    this.fetchingMore = false;
+    this.store = { items: [], moreRows: false };
   }
 }
 

package/src/utils/updateArray.ts

@@ -1,4 +1,15 @@
-export const updateArray = (newData: Array<any>, oldData: Array<any>): Array<any> => {
+/**
+ * Merges streamed data server rows into the existing list.
+ *
+ * New INSERT rows are prepended by default so real-time alerts surface at the
+ * top. When {@link append} is set (e.g. for `getMoreRows` pagination batches),
+ * rows are appended instead so they continue the existing order at the bottom.
+ */
+export const updateArray = (
+  newData: Array<any>,
+  oldData: Array<any>,
+  append = false,
+): Array<any> => {
   if (newData && oldData && oldData.length > 0) {
     newData.forEach((row) => {
       const eventData = row;
@@ -9,7 +20,11 @@ export const updateArray = (newData: Array<any>, oldData: Array<any>): Array<any
 
         if (type === 'INSERT') {
           if (!oldData.find((x) => x.DETAILS?.ROW_REF === ref)) {
-            oldData.unshift(eventData);
+            if (append) {
+              oldData.push(eventData);
+            } else {
+              oldData.unshift(eventData);
+            }
           }
         }