@everymatrix/nuts-inbox-widget 1.94.115 → 1.94.117
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{index-4522ef7e.js → index-a1087740.js} +8 -3
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/nuts-inbox-widget.cjs.js +2 -2
- package/dist/cjs/nuts-inbox-widget_3.cjs.entry.js +44 -20
- package/dist/collection/api/methods/index.js +3 -2
- package/dist/collection/cache/notification-cache.js +17 -10
- package/dist/collection/components/nuts-popover/nuts-popover.js +25 -8
- package/dist/esm/{index-0160662f.js → index-2eda31b2.js} +8 -3
- package/dist/esm/loader.js +3 -3
- package/dist/esm/nuts-inbox-widget.js +3 -3
- package/dist/esm/nuts-inbox-widget_3.entry.js +44 -20
- package/dist/nuts-inbox-widget/{index-0160662f.js → index-2eda31b2.js} +2 -2
- package/dist/nuts-inbox-widget/nuts-inbox-widget.esm.js +1 -1
- package/dist/nuts-inbox-widget/nuts-inbox-widget_3.entry.js +1 -1
- package/dist/types/cache/notification-cache.d.ts +1 -0
- package/dist/types/components/nuts-popover/nuts-popover.d.ts +2 -0
- package/hydrate/index.js +46 -21
- package/hydrate/index.mjs +46 -21
- package/package.json +1 -1
|
@@ -8,6 +8,7 @@ declare class NotificationCache {
|
|
|
8
8
|
setCurrentPage(page: number): void;
|
|
9
9
|
private updateCache;
|
|
10
10
|
private syncCurrentPage;
|
|
11
|
+
private updatePagesInPlace;
|
|
11
12
|
deleteById(id: string): void;
|
|
12
13
|
addToFront(notification: Notification): void;
|
|
13
14
|
markAsRead(id: string, mark: Partial<Notification>): void;
|
|
@@ -53,6 +53,7 @@ export declare class NutsPopover {
|
|
|
53
53
|
private hasMore;
|
|
54
54
|
private currentPage;
|
|
55
55
|
private stylingContainer;
|
|
56
|
+
private loadGeneration;
|
|
56
57
|
private dropdownRef;
|
|
57
58
|
private baseUrl;
|
|
58
59
|
allNotificationsRead: EventEmitter<any>;
|
|
@@ -73,6 +74,7 @@ export declare class NutsPopover {
|
|
|
73
74
|
setClientStyling: () => void;
|
|
74
75
|
setClientStylingURL: () => void;
|
|
75
76
|
connectedCallback(): void;
|
|
77
|
+
disconnectedCallback(): void;
|
|
76
78
|
markAllNotificationsAsRead: () => Promise<void>;
|
|
77
79
|
deleteAllNotifications: () => Promise<void>;
|
|
78
80
|
closePopover: () => void;
|
package/hydrate/index.js
CHANGED
|
@@ -124,7 +124,7 @@ function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResu
|
|
|
124
124
|
|
|
125
125
|
|
|
126
126
|
const NAMESPACE = 'nuts-inbox-widget';
|
|
127
|
-
const BUILD = /* nuts-inbox-widget */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, devTools: false, disconnectedCallback:
|
|
127
|
+
const BUILD = /* nuts-inbox-widget */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: false, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, shadowDomShim: true, slot: false, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: false, vdomText: true, vdomXlink: false, watchCallback: true };
|
|
128
128
|
|
|
129
129
|
/*
|
|
130
130
|
Stencil Hydrate Platform v4.19.2 | MIT Licensed | https://stenciljs.com
|
|
@@ -6401,6 +6401,7 @@ const markAsRead = async ({ baseUrl, body, token, unread }) => {
|
|
|
6401
6401
|
}
|
|
6402
6402
|
};
|
|
6403
6403
|
const getNotifications = async ({ baseUrl, page, token }) => {
|
|
6404
|
+
var _a;
|
|
6404
6405
|
const url = new URL(`${baseUrl}/widgets/notifications/feed`);
|
|
6405
6406
|
const headers = new Headers();
|
|
6406
6407
|
url.searchParams.append('page', page.toString());
|
|
@@ -6415,7 +6416,7 @@ const getNotifications = async ({ baseUrl, page, token }) => {
|
|
|
6415
6416
|
return {
|
|
6416
6417
|
numberOfNotifications: data.totalCount,
|
|
6417
6418
|
notifications: data.data,
|
|
6418
|
-
hasMore: data.hasMore
|
|
6419
|
+
hasMore: (_a = data.hasMore) !== null && _a !== void 0 ? _a : false
|
|
6419
6420
|
};
|
|
6420
6421
|
}
|
|
6421
6422
|
catch (error) {
|
|
@@ -6423,7 +6424,7 @@ const getNotifications = async ({ baseUrl, page, token }) => {
|
|
|
6423
6424
|
return {
|
|
6424
6425
|
numberOfNotifications: 0,
|
|
6425
6426
|
notifications: [],
|
|
6426
|
-
hasMore:
|
|
6427
|
+
hasMore: false
|
|
6427
6428
|
};
|
|
6428
6429
|
}
|
|
6429
6430
|
};
|
|
@@ -6488,15 +6489,23 @@ class NotificationCache {
|
|
|
6488
6489
|
this.syncCurrentPage();
|
|
6489
6490
|
}
|
|
6490
6491
|
syncCurrentPage() {
|
|
6491
|
-
var _a;
|
|
6492
|
+
var _a, _b, _c;
|
|
6492
6493
|
const entry = this.cache.get(this.currentPage);
|
|
6493
6494
|
const notifications = (_a = entry === null || entry === void 0 ? void 0 : entry.notifications) !== null && _a !== void 0 ? _a : [];
|
|
6494
|
-
const hasMore = entry === null || entry === void 0 ? void 0 : entry.hasMore;
|
|
6495
|
-
this.onPageUpdate([...notifications], hasMore);
|
|
6495
|
+
const hasMore = (_b = entry === null || entry === void 0 ? void 0 : entry.hasMore) !== null && _b !== void 0 ? _b : false;
|
|
6496
|
+
(_c = this.onPageUpdate) === null || _c === void 0 ? void 0 : _c.call(this, [...notifications], hasMore);
|
|
6497
|
+
}
|
|
6498
|
+
updatePagesInPlace(updater) {
|
|
6499
|
+
for (const [page, entry] of this.cache.entries()) {
|
|
6500
|
+
this.cache.set(page, {
|
|
6501
|
+
notifications: updater(entry.notifications, page),
|
|
6502
|
+
hasMore: entry.hasMore
|
|
6503
|
+
});
|
|
6504
|
+
}
|
|
6505
|
+
this.syncCurrentPage();
|
|
6496
6506
|
}
|
|
6497
6507
|
deleteById(id) {
|
|
6498
|
-
|
|
6499
|
-
this.updateCache(updatedNotifications);
|
|
6508
|
+
this.updatePagesInPlace((notifications) => notifications.filter((n) => n.id !== id));
|
|
6500
6509
|
}
|
|
6501
6510
|
addToFront(notification) {
|
|
6502
6511
|
if (!this.cache.get(0)) {
|
|
@@ -6506,12 +6515,10 @@ class NotificationCache {
|
|
|
6506
6515
|
this.updateCache(updatedNotifications);
|
|
6507
6516
|
}
|
|
6508
6517
|
markAsRead(id, mark) {
|
|
6509
|
-
|
|
6510
|
-
this.updateCache(updatedNotifications);
|
|
6518
|
+
this.updatePagesInPlace((notifications) => notifications.map((n) => (n.id === id ? Object.assign(Object.assign({}, n), mark) : n)));
|
|
6511
6519
|
}
|
|
6512
6520
|
markAllAsRead() {
|
|
6513
|
-
|
|
6514
|
-
this.updateCache(updatedNotifications);
|
|
6521
|
+
this.updatePagesInPlace((notifications) => notifications.map((n) => (Object.assign(Object.assign({}, n), { read: true, seen: true }))));
|
|
6515
6522
|
}
|
|
6516
6523
|
clearAll() {
|
|
6517
6524
|
this.resetCache();
|
|
@@ -6522,12 +6529,13 @@ class NotificationCache {
|
|
|
6522
6529
|
this.cache.set(0, { notifications: [], hasMore: false });
|
|
6523
6530
|
}
|
|
6524
6531
|
async loadPageFromApi(page, loader) {
|
|
6532
|
+
var _a;
|
|
6525
6533
|
if (this.cache.has(page)) {
|
|
6526
6534
|
this.setCurrentPage(page);
|
|
6527
6535
|
return;
|
|
6528
6536
|
}
|
|
6529
6537
|
const data = await loader();
|
|
6530
|
-
this.cache.set(page, { notifications: data.notifications, hasMore: data.hasMore });
|
|
6538
|
+
this.cache.set(page, { notifications: data.notifications, hasMore: (_a = data.hasMore) !== null && _a !== void 0 ? _a : false });
|
|
6531
6539
|
this.setCurrentPage(page);
|
|
6532
6540
|
}
|
|
6533
6541
|
getAllFromCache() {
|
|
@@ -44847,7 +44855,7 @@ class NutsPopover {
|
|
|
44847
44855
|
this.allNotificationsRead = createEvent(this, "allNotificationsRead", 7);
|
|
44848
44856
|
this.allMessagesDeteled = createEvent(this, "allMessagesDeleted", 7);
|
|
44849
44857
|
this.closePopoverEmmiter = createEvent(this, "closePopover", 7);
|
|
44850
|
-
this.
|
|
44858
|
+
this.loadGeneration = 0;
|
|
44851
44859
|
this.nextPage = async () => {
|
|
44852
44860
|
this.currentPage++;
|
|
44853
44861
|
this.triggerGetNotifications();
|
|
@@ -44932,7 +44940,8 @@ class NutsPopover {
|
|
|
44932
44940
|
this.showMarkAll = false;
|
|
44933
44941
|
this.limitStylingAppends = false;
|
|
44934
44942
|
this.showDeleteAllPopup = false;
|
|
44935
|
-
this.hasMore =
|
|
44943
|
+
this.hasMore = false;
|
|
44944
|
+
this.currentPage = 0;
|
|
44936
44945
|
}
|
|
44937
44946
|
messageDeletedHandler(event) {
|
|
44938
44947
|
notificationCache.deleteById(event.detail);
|
|
@@ -44987,6 +44996,7 @@ class NutsPopover {
|
|
|
44987
44996
|
// end custom styling area
|
|
44988
44997
|
}
|
|
44989
44998
|
async triggerGetNotifications() {
|
|
44999
|
+
const generation = this.loadGeneration;
|
|
44990
45000
|
this.isNotificationsLoading = true;
|
|
44991
45001
|
try {
|
|
44992
45002
|
await notificationCache.loadPageFromApi(this.currentPage, async () => getNotifications({
|
|
@@ -44996,12 +45006,22 @@ class NutsPopover {
|
|
|
44996
45006
|
}));
|
|
44997
45007
|
}
|
|
44998
45008
|
finally {
|
|
44999
|
-
this.
|
|
45009
|
+
if (generation === this.loadGeneration) {
|
|
45010
|
+
this.isNotificationsLoading = false;
|
|
45011
|
+
}
|
|
45000
45012
|
}
|
|
45001
45013
|
}
|
|
45002
45014
|
connectedCallback() {
|
|
45003
45015
|
this.baseUrl = `${this.backendUrl}/v1/${this.operatorId}`;
|
|
45016
|
+
this.currentPage = 0;
|
|
45017
|
+
this.hasMore = false;
|
|
45018
|
+
this.isNotificationsLoading = true;
|
|
45019
|
+
this.loadGeneration++;
|
|
45020
|
+
const generation = this.loadGeneration;
|
|
45004
45021
|
notificationCache.observePageUpdate((notifications, hasMore) => {
|
|
45022
|
+
if (generation !== this.loadGeneration) {
|
|
45023
|
+
return;
|
|
45024
|
+
}
|
|
45005
45025
|
if ((notifications === null || notifications === void 0 ? void 0 : notifications.length) === 0 && this.currentPage > 0) {
|
|
45006
45026
|
// if it's last notification on it's page go back a page and retrigger
|
|
45007
45027
|
this.currentPage--;
|
|
@@ -45009,23 +45029,27 @@ class NutsPopover {
|
|
|
45009
45029
|
return;
|
|
45010
45030
|
}
|
|
45011
45031
|
this.notifications = notifications;
|
|
45012
|
-
this.hasMore = hasMore;
|
|
45032
|
+
this.hasMore = hasMore !== null && hasMore !== void 0 ? hasMore : false;
|
|
45013
45033
|
});
|
|
45014
45034
|
this.triggerGetNotifications();
|
|
45015
45035
|
if (this.unseenCount != 0) {
|
|
45016
45036
|
this.showMarkAll = true;
|
|
45017
45037
|
}
|
|
45018
45038
|
}
|
|
45039
|
+
disconnectedCallback() {
|
|
45040
|
+
this.loadGeneration++;
|
|
45041
|
+
this.isNotificationsLoading = false;
|
|
45042
|
+
}
|
|
45019
45043
|
render() {
|
|
45020
45044
|
var _a, _b;
|
|
45021
|
-
return (hAsync("div", { key: '
|
|
45045
|
+
return (hAsync("div", { key: 'df45b2b7da683f9895151d698a4c7def899e13d4', class: "Popover", ref: this.assignRefToStylingContainer }, hAsync("div", { key: '87e638b07e89b39d9b9fa60807d5e792ef9ecece', class: "Header" }, hAsync("div", { key: '238839de9ec5734950b916924d3469081b10714c', class: "Title" }, translate$1('notifications', this.language), this.unseenCount > 0 ? hAsync("div", { class: "UnseenCounter" }, this.unseenCount) : ''), this.showMarkAll && (hAsync("div", { key: 'efc165ffdc077d09ee2f90c5758eca8b1c048d9f', class: "MarkAsRead", onClick: this.markAllNotificationsAsRead }, translate$1('markAllAsRead', this.language))), hAsync("div", { key: 'b941c6a87a071d9e45d38528d889e7dbc8848ef4', class: "ActionButtons" }, hAsync("button", { key: '33d9e1f7857a80936e6b65e1fa2ecbc3c55e4e4f', class: `DeleteAll${this.showDeleteAllPopup ? ' Active' : ''}`, onClick: this.showDeletePopup, disabled: !((_a = this.notifications) === null || _a === void 0 ? void 0 : _a.length) }, hAsync("svg", { key: '3b87ea1d8e1c5942db86e18cf26e176031afef6a', width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '915823d5da7a4e12d578fe9db6b968253ceba418', d: "M4.375 15.4375C4.375 16.1758 4.94922 16.75 5.6875 16.75H13.5625C14.2734 16.75 14.875 16.1758 14.875 15.4375V6.25H4.375V15.4375ZM11.8125 8.4375C11.8125 8.21875 12.0039 8 12.25 8C12.4688 8 12.6875 8.21875 12.6875 8.4375V14.5625C12.6875 14.8086 12.4688 15 12.25 15C12.0039 15 11.8125 14.8086 11.8125 14.5625V8.4375ZM9.1875 8.4375C9.1875 8.21875 9.37891 8 9.625 8C9.84375 8 10.0625 8.21875 10.0625 8.4375V14.5625C10.0625 14.8086 9.84375 15 9.625 15C9.37891 15 9.1875 14.8086 9.1875 14.5625V8.4375ZM6.5625 8.4375C6.5625 8.21875 6.75391 8 7 8C7.21875 8 7.4375 8.21875 7.4375 8.4375V14.5625C7.4375 14.8086 7.21875 15 7 15C6.75391 15 6.5625 14.8086 6.5625 14.5625V8.4375ZM15.3125 3.625H12.25L11.9219 2.99609C11.8398 2.85938 11.7031 2.75 11.5391 2.75H7.68359C7.51953 2.75 7.38281 2.85938 7.30078 2.99609L7 3.625H3.9375C3.69141 3.625 3.5 3.84375 3.5 4.0625V4.9375C3.5 5.18359 3.69141 5.375 3.9375 5.375H15.3125C15.5312 5.375 15.75 5.18359 15.75 4.9375V4.0625C15.75 3.84375 15.5312 3.625 15.3125 3.625Z", fill: "currentColor" }))), hAsync("button", { key: '49d50d9f7cf56d778788dcf0d87804fa687c7b98', class: "ClosePopover", onClick: this.closePopover }, hAsync("div", { key: '57f0f1d6980036373200e0e5ace18d7f09b9f292', innerHTML: renderIconDefinitionToSVGElement(CloseCircleOutlined$1, {
|
|
45022
45046
|
extraSVGAttrs: { width: '20px', height: '20px', fill: '#A1A1B2' }
|
|
45023
|
-
}) }))), this.showDeleteAllPopup && (hAsync("div", { key: '
|
|
45047
|
+
}) }))), this.showDeleteAllPopup && (hAsync("div", { key: '6a8733b4153724154ed148d8794c336131a32ef4', class: "DeleteAllDropdown", ref: (el) => (this.dropdownRef = el) }, hAsync("button", { key: 'e5b886482308972cbfe1916dce40bcc6b15d21dd', onClick: this.deleteAllNotifications }, translate$1('deleteAllMessages', this.language))))), !this.isLoading && (hAsync("div", { key: 'db28490ea2ae39401719df67c0783944b2aa6fdd', class: "NotificationList" }, this.isNotificationsLoading ? (hAsync("div", { class: "Loading", innerHTML: renderIconDefinitionToSVGElement(LoadingOutlined$1, {
|
|
45024
45048
|
extraSVGAttrs: { width: '30px', height: '30px', fill: '#A1A1B2' }
|
|
45025
45049
|
}) })) : ((_b = this.notifications) === null || _b === void 0 ? void 0 : _b.length) > 0 ? (this.notifications.map((item) => {
|
|
45026
45050
|
var _a, _b;
|
|
45027
45051
|
return (hAsync("nuts-notification", { "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, key: item.id, "user-id": this.userId, "operator-id": this.operatorId, content: item.content, "message-id": item.id, badge: ((_a = item.avatar) === null || _a === void 0 ? void 0 : _a.data) || ((_b = item.actor) === null || _b === void 0 ? void 0 : _b.data) || '', sessionId: this.sessionId, date: item.createdAt, read: item.read, seen: item.seen, language: this.language, "notification-action": this.notificationAction, token: this.token, "backend-url": this.backendUrl, "redirect-url": item.cta.data.url, "translation-url": this.translationUrl, "max-text-length": 200, "max-lines": 5 }));
|
|
45028
|
-
})) : (hAsync("div", { class: "NoMessages" }, hAsync("svg", { width: "120", height: "108", viewBox: "0 0 120 108", fill: "none" }, hAsync("circle", { cx: "11.3191", cy: "30.7872", r: "6.31915", stroke: "#3D3D4D", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("ellipse", { cx: "60.117", cy: "27.9787", rx: "5.96809", ry: "5.61702", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M79.5424 49.4934C79.5424 44.1598 77.6437 39.0446 74.2641 35.2732C70.8844 31.5017 66.3006 29.3829 61.5211 29.3829C56.7415 29.3829 52.1578 31.5017 48.7781 35.2732C45.3985 39.0446 43.4998 44.1598 43.4998 49.4934C43.4998 72.9557 34.4892 79.6592 34.4892 79.6592H88.553C88.553 79.6592 79.5424 72.9557 79.5424 49.4934Z", fill: "#292933" }), hAsync("path", { d: "M68.8995 81.7552C68.1496 83.551 67.0731 85.0417 65.778 86.0779C64.4828 87.1141 63.0144 87.6595 61.5198 87.6595C60.0252 87.6595 58.5568 87.1141 57.2617 86.0779C55.9665 85.0417 54.8901 83.551 54.1401 81.7552", fill: "#292933" }), hAsync("path", { d: "M81.2976 50.2203C81.2976 68.2545 87.2222 76.7327 90.2814 79.9083C90.7671 80.4126 90.3802 81.4764 89.68 81.4764C88.0927 81.4764 86.5488 81.4764 85.0422 81.4764M68.5814 82.946C67.6854 84.8068 66.3993 86.3513 64.8518 87.425C63.3044 88.4987 61.5499 89.0638 59.7641 89.0638C57.9783 89.0638 56.2239 88.4987 54.6765 87.425C53.129 86.3513 51.8429 84.8068 50.9468 82.946M79.712 42.3723C78.6394 39.8192 77.0439 37.4727 74.991 35.4861C70.953 31.5783 65.4763 29.3829 59.7656 29.3829C54.055 29.3829 48.5783 31.5783 44.5403 35.4861C43.3681 36.6205 42.345 37.8722 41.4832 39.2127C40.4958 40.7487 39.7202 42.4013 39.1747 44.1276C38.5563 46.0847 38.2337 48.1364 38.2337 50.2203C38.2337 53.2503 38.0665 56.0106 37.7737 58.5212M34.8401 70.7608C32.9874 75.4551 30.7688 78.331 29.2526 79.9055C28.767 80.4099 29.155 81.4764 29.8551 81.4764C47.1962 81.4764 59.3571 81.4764 74.1593 81.4764", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M55.6345 59.0737C55.1665 59.7144 54.4949 60.2462 53.6868 60.6159C52.8787 60.9855 51.9625 61.1801 51.0299 61.1801C50.0973 61.1801 49.1811 60.9855 48.373 60.6159C47.5649 60.2462 46.8933 59.7144 46.4254 59.0737", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M73.1877 59.0737C72.7197 59.7144 72.0481 60.2462 71.24 60.6159C70.4319 60.9855 69.5157 61.1801 68.5831 61.1801C67.6506 61.1801 66.7344 60.9855 65.9263 60.6159C65.1182 60.2462 64.4465 59.7144 63.9786 59.0737", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("circle", { cx: "107.511", cy: "56.0638", r: "7.02128", stroke: "#3D3D4D", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("circle", { cx: "16.4252", cy: "58.1703", r: "4.21277", fill: "#3D3D4D" }), hAsync("ellipse", { cx: "59.9573", cy: "104.511", rx: "25.2766", ry: "2.80851", fill: "#3D3D4D" }), hAsync("path", { d: "M81.5317 18.1489H88.553L81.5317 25.1702H88.553", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M96.6807 2H106.51L96.6807 11.8298H106.51", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), hAsync("p", null, translate$1('noMessages', this.language)))))), !this.isLoading && (hAsync("div", { key: '
|
|
45052
|
+
})) : (hAsync("div", { class: "NoMessages" }, hAsync("svg", { width: "120", height: "108", viewBox: "0 0 120 108", fill: "none" }, hAsync("circle", { cx: "11.3191", cy: "30.7872", r: "6.31915", stroke: "#3D3D4D", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("ellipse", { cx: "60.117", cy: "27.9787", rx: "5.96809", ry: "5.61702", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M79.5424 49.4934C79.5424 44.1598 77.6437 39.0446 74.2641 35.2732C70.8844 31.5017 66.3006 29.3829 61.5211 29.3829C56.7415 29.3829 52.1578 31.5017 48.7781 35.2732C45.3985 39.0446 43.4998 44.1598 43.4998 49.4934C43.4998 72.9557 34.4892 79.6592 34.4892 79.6592H88.553C88.553 79.6592 79.5424 72.9557 79.5424 49.4934Z", fill: "#292933" }), hAsync("path", { d: "M68.8995 81.7552C68.1496 83.551 67.0731 85.0417 65.778 86.0779C64.4828 87.1141 63.0144 87.6595 61.5198 87.6595C60.0252 87.6595 58.5568 87.1141 57.2617 86.0779C55.9665 85.0417 54.8901 83.551 54.1401 81.7552", fill: "#292933" }), hAsync("path", { d: "M81.2976 50.2203C81.2976 68.2545 87.2222 76.7327 90.2814 79.9083C90.7671 80.4126 90.3802 81.4764 89.68 81.4764C88.0927 81.4764 86.5488 81.4764 85.0422 81.4764M68.5814 82.946C67.6854 84.8068 66.3993 86.3513 64.8518 87.425C63.3044 88.4987 61.5499 89.0638 59.7641 89.0638C57.9783 89.0638 56.2239 88.4987 54.6765 87.425C53.129 86.3513 51.8429 84.8068 50.9468 82.946M79.712 42.3723C78.6394 39.8192 77.0439 37.4727 74.991 35.4861C70.953 31.5783 65.4763 29.3829 59.7656 29.3829C54.055 29.3829 48.5783 31.5783 44.5403 35.4861C43.3681 36.6205 42.345 37.8722 41.4832 39.2127C40.4958 40.7487 39.7202 42.4013 39.1747 44.1276C38.5563 46.0847 38.2337 48.1364 38.2337 50.2203C38.2337 53.2503 38.0665 56.0106 37.7737 58.5212M34.8401 70.7608C32.9874 75.4551 30.7688 78.331 29.2526 79.9055C28.767 80.4099 29.155 81.4764 29.8551 81.4764C47.1962 81.4764 59.3571 81.4764 74.1593 81.4764", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M55.6345 59.0737C55.1665 59.7144 54.4949 60.2462 53.6868 60.6159C52.8787 60.9855 51.9625 61.1801 51.0299 61.1801C50.0973 61.1801 49.1811 60.9855 48.373 60.6159C47.5649 60.2462 46.8933 59.7144 46.4254 59.0737", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M73.1877 59.0737C72.7197 59.7144 72.0481 60.2462 71.24 60.6159C70.4319 60.9855 69.5157 61.1801 68.5831 61.1801C67.6506 61.1801 66.7344 60.9855 65.9263 60.6159C65.1182 60.2462 64.4465 59.7144 63.9786 59.0737", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("circle", { cx: "107.511", cy: "56.0638", r: "7.02128", stroke: "#3D3D4D", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("circle", { cx: "16.4252", cy: "58.1703", r: "4.21277", fill: "#3D3D4D" }), hAsync("ellipse", { cx: "59.9573", cy: "104.511", rx: "25.2766", ry: "2.80851", fill: "#3D3D4D" }), hAsync("path", { d: "M81.5317 18.1489H88.553L81.5317 25.1702H88.553", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M96.6807 2H106.51L96.6807 11.8298H106.51", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), hAsync("p", null, translate$1('noMessages', this.language)))))), !this.isLoading && (hAsync("div", { key: 'f1cd67f7c3d6de56531b5469c3e788b9c9d2c182', class: "Pagination" }, hAsync("div", { key: 'd0390f412b25475603df37adf9b381e681f1dc9b', class: "Button" }, hAsync("button", { key: '935f7d8e73a4418bf6fdb4602b1681c449cb2689', disabled: this.isNotificationsLoading || this.currentPage <= 0, onClick: this.prevPage }, hAsync("svg", { key: 'bffd0ffe5d7cf60202c7e058912fbf38c1246cd7', class: "svg-icon", viewBox: "0 0 20 20" }, hAsync("path", { key: 'b5f65704f71920d3290a818b5f4aece7607cb1b2', d: "M8.388,10.049l4.76-4.873c0.303-0.31,0.297-0.804-0.012-1.105c-0.309-0.304-0.803-0.293-1.105,0.012L6.726,9.516c-0.303,0.31-0.296,0.805,0.012,1.105l5.433,5.307c0.152,0.148,0.35,0.223,0.547,0.223c0.203,0,0.406-0.08,0.559-0.236c0.303-0.309,0.295-0.803-0.012-1.104L8.388,10.049z" })), translate$1('prev', this.language))), hAsync("div", { key: '8f82ceaeaa50c9b7053a1aac2d3db813607d71ca', class: "Button" }, hAsync("button", { key: '65638cc3b4c02637e0ee1198c7bd7b5f5168c71e', disabled: this.isNotificationsLoading || !this.hasMore, onClick: this.nextPage }, translate$1('next', this.language), hAsync("svg", { key: '95b97901bcac88c8c4d1e449b9db87503dc1a60c', class: "svg-icon", viewBox: "0 0 20 20" }, hAsync("path", { key: '7cfe484dfa41bced8c092dfa341a66951fc78de5', d: "M11.611,10.049l-4.76-4.873c-0.303-0.31-0.297-0.804,0.012-1.105c0.309-0.304,0.803-0.293,1.105,0.012l5.306,5.433c0.304,0.31,0.296,0.805-0.012,1.105L7.83,15.928c-0.152,0.148-0.35,0.223-0.547,0.223c-0.203,0-0.406-0.08-0.559-0.236c-0.303-0.309-0.295-0.803,0.012-1.104L11.611,10.049z" }))))))));
|
|
45029
45053
|
}
|
|
45030
45054
|
static get watchers() { return {
|
|
45031
45055
|
"unseenCount": ["unseenCountHandler"],
|
|
@@ -45055,7 +45079,8 @@ class NutsPopover {
|
|
|
45055
45079
|
"showMarkAll": [32],
|
|
45056
45080
|
"limitStylingAppends": [32],
|
|
45057
45081
|
"showDeleteAllPopup": [32],
|
|
45058
|
-
"hasMore": [32]
|
|
45082
|
+
"hasMore": [32],
|
|
45083
|
+
"currentPage": [32]
|
|
45059
45084
|
},
|
|
45060
45085
|
"$listeners$": [[8, "messageDeleted", "messageDeletedHandler"], [8, "messageRead", "messageReadHandler"], [8, "click", "clickOutsideHandle"]],
|
|
45061
45086
|
"$lazyBundleId$": "-",
|
package/hydrate/index.mjs
CHANGED
|
@@ -120,7 +120,7 @@ function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResu
|
|
|
120
120
|
|
|
121
121
|
|
|
122
122
|
const NAMESPACE = 'nuts-inbox-widget';
|
|
123
|
-
const BUILD = /* nuts-inbox-widget */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, devTools: false, disconnectedCallback:
|
|
123
|
+
const BUILD = /* nuts-inbox-widget */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: false, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, shadowDomShim: true, slot: false, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: false, vdomText: true, vdomXlink: false, watchCallback: true };
|
|
124
124
|
|
|
125
125
|
/*
|
|
126
126
|
Stencil Hydrate Platform v4.19.2 | MIT Licensed | https://stenciljs.com
|
|
@@ -6397,6 +6397,7 @@ const markAsRead = async ({ baseUrl, body, token, unread }) => {
|
|
|
6397
6397
|
}
|
|
6398
6398
|
};
|
|
6399
6399
|
const getNotifications = async ({ baseUrl, page, token }) => {
|
|
6400
|
+
var _a;
|
|
6400
6401
|
const url = new URL(`${baseUrl}/widgets/notifications/feed`);
|
|
6401
6402
|
const headers = new Headers();
|
|
6402
6403
|
url.searchParams.append('page', page.toString());
|
|
@@ -6411,7 +6412,7 @@ const getNotifications = async ({ baseUrl, page, token }) => {
|
|
|
6411
6412
|
return {
|
|
6412
6413
|
numberOfNotifications: data.totalCount,
|
|
6413
6414
|
notifications: data.data,
|
|
6414
|
-
hasMore: data.hasMore
|
|
6415
|
+
hasMore: (_a = data.hasMore) !== null && _a !== void 0 ? _a : false
|
|
6415
6416
|
};
|
|
6416
6417
|
}
|
|
6417
6418
|
catch (error) {
|
|
@@ -6419,7 +6420,7 @@ const getNotifications = async ({ baseUrl, page, token }) => {
|
|
|
6419
6420
|
return {
|
|
6420
6421
|
numberOfNotifications: 0,
|
|
6421
6422
|
notifications: [],
|
|
6422
|
-
hasMore:
|
|
6423
|
+
hasMore: false
|
|
6423
6424
|
};
|
|
6424
6425
|
}
|
|
6425
6426
|
};
|
|
@@ -6484,15 +6485,23 @@ class NotificationCache {
|
|
|
6484
6485
|
this.syncCurrentPage();
|
|
6485
6486
|
}
|
|
6486
6487
|
syncCurrentPage() {
|
|
6487
|
-
var _a;
|
|
6488
|
+
var _a, _b, _c;
|
|
6488
6489
|
const entry = this.cache.get(this.currentPage);
|
|
6489
6490
|
const notifications = (_a = entry === null || entry === void 0 ? void 0 : entry.notifications) !== null && _a !== void 0 ? _a : [];
|
|
6490
|
-
const hasMore = entry === null || entry === void 0 ? void 0 : entry.hasMore;
|
|
6491
|
-
this.onPageUpdate([...notifications], hasMore);
|
|
6491
|
+
const hasMore = (_b = entry === null || entry === void 0 ? void 0 : entry.hasMore) !== null && _b !== void 0 ? _b : false;
|
|
6492
|
+
(_c = this.onPageUpdate) === null || _c === void 0 ? void 0 : _c.call(this, [...notifications], hasMore);
|
|
6493
|
+
}
|
|
6494
|
+
updatePagesInPlace(updater) {
|
|
6495
|
+
for (const [page, entry] of this.cache.entries()) {
|
|
6496
|
+
this.cache.set(page, {
|
|
6497
|
+
notifications: updater(entry.notifications, page),
|
|
6498
|
+
hasMore: entry.hasMore
|
|
6499
|
+
});
|
|
6500
|
+
}
|
|
6501
|
+
this.syncCurrentPage();
|
|
6492
6502
|
}
|
|
6493
6503
|
deleteById(id) {
|
|
6494
|
-
|
|
6495
|
-
this.updateCache(updatedNotifications);
|
|
6504
|
+
this.updatePagesInPlace((notifications) => notifications.filter((n) => n.id !== id));
|
|
6496
6505
|
}
|
|
6497
6506
|
addToFront(notification) {
|
|
6498
6507
|
if (!this.cache.get(0)) {
|
|
@@ -6502,12 +6511,10 @@ class NotificationCache {
|
|
|
6502
6511
|
this.updateCache(updatedNotifications);
|
|
6503
6512
|
}
|
|
6504
6513
|
markAsRead(id, mark) {
|
|
6505
|
-
|
|
6506
|
-
this.updateCache(updatedNotifications);
|
|
6514
|
+
this.updatePagesInPlace((notifications) => notifications.map((n) => (n.id === id ? Object.assign(Object.assign({}, n), mark) : n)));
|
|
6507
6515
|
}
|
|
6508
6516
|
markAllAsRead() {
|
|
6509
|
-
|
|
6510
|
-
this.updateCache(updatedNotifications);
|
|
6517
|
+
this.updatePagesInPlace((notifications) => notifications.map((n) => (Object.assign(Object.assign({}, n), { read: true, seen: true }))));
|
|
6511
6518
|
}
|
|
6512
6519
|
clearAll() {
|
|
6513
6520
|
this.resetCache();
|
|
@@ -6518,12 +6525,13 @@ class NotificationCache {
|
|
|
6518
6525
|
this.cache.set(0, { notifications: [], hasMore: false });
|
|
6519
6526
|
}
|
|
6520
6527
|
async loadPageFromApi(page, loader) {
|
|
6528
|
+
var _a;
|
|
6521
6529
|
if (this.cache.has(page)) {
|
|
6522
6530
|
this.setCurrentPage(page);
|
|
6523
6531
|
return;
|
|
6524
6532
|
}
|
|
6525
6533
|
const data = await loader();
|
|
6526
|
-
this.cache.set(page, { notifications: data.notifications, hasMore: data.hasMore });
|
|
6534
|
+
this.cache.set(page, { notifications: data.notifications, hasMore: (_a = data.hasMore) !== null && _a !== void 0 ? _a : false });
|
|
6527
6535
|
this.setCurrentPage(page);
|
|
6528
6536
|
}
|
|
6529
6537
|
getAllFromCache() {
|
|
@@ -44843,7 +44851,7 @@ class NutsPopover {
|
|
|
44843
44851
|
this.allNotificationsRead = createEvent(this, "allNotificationsRead", 7);
|
|
44844
44852
|
this.allMessagesDeteled = createEvent(this, "allMessagesDeleted", 7);
|
|
44845
44853
|
this.closePopoverEmmiter = createEvent(this, "closePopover", 7);
|
|
44846
|
-
this.
|
|
44854
|
+
this.loadGeneration = 0;
|
|
44847
44855
|
this.nextPage = async () => {
|
|
44848
44856
|
this.currentPage++;
|
|
44849
44857
|
this.triggerGetNotifications();
|
|
@@ -44928,7 +44936,8 @@ class NutsPopover {
|
|
|
44928
44936
|
this.showMarkAll = false;
|
|
44929
44937
|
this.limitStylingAppends = false;
|
|
44930
44938
|
this.showDeleteAllPopup = false;
|
|
44931
|
-
this.hasMore =
|
|
44939
|
+
this.hasMore = false;
|
|
44940
|
+
this.currentPage = 0;
|
|
44932
44941
|
}
|
|
44933
44942
|
messageDeletedHandler(event) {
|
|
44934
44943
|
notificationCache.deleteById(event.detail);
|
|
@@ -44983,6 +44992,7 @@ class NutsPopover {
|
|
|
44983
44992
|
// end custom styling area
|
|
44984
44993
|
}
|
|
44985
44994
|
async triggerGetNotifications() {
|
|
44995
|
+
const generation = this.loadGeneration;
|
|
44986
44996
|
this.isNotificationsLoading = true;
|
|
44987
44997
|
try {
|
|
44988
44998
|
await notificationCache.loadPageFromApi(this.currentPage, async () => getNotifications({
|
|
@@ -44992,12 +45002,22 @@ class NutsPopover {
|
|
|
44992
45002
|
}));
|
|
44993
45003
|
}
|
|
44994
45004
|
finally {
|
|
44995
|
-
this.
|
|
45005
|
+
if (generation === this.loadGeneration) {
|
|
45006
|
+
this.isNotificationsLoading = false;
|
|
45007
|
+
}
|
|
44996
45008
|
}
|
|
44997
45009
|
}
|
|
44998
45010
|
connectedCallback() {
|
|
44999
45011
|
this.baseUrl = `${this.backendUrl}/v1/${this.operatorId}`;
|
|
45012
|
+
this.currentPage = 0;
|
|
45013
|
+
this.hasMore = false;
|
|
45014
|
+
this.isNotificationsLoading = true;
|
|
45015
|
+
this.loadGeneration++;
|
|
45016
|
+
const generation = this.loadGeneration;
|
|
45000
45017
|
notificationCache.observePageUpdate((notifications, hasMore) => {
|
|
45018
|
+
if (generation !== this.loadGeneration) {
|
|
45019
|
+
return;
|
|
45020
|
+
}
|
|
45001
45021
|
if ((notifications === null || notifications === void 0 ? void 0 : notifications.length) === 0 && this.currentPage > 0) {
|
|
45002
45022
|
// if it's last notification on it's page go back a page and retrigger
|
|
45003
45023
|
this.currentPage--;
|
|
@@ -45005,23 +45025,27 @@ class NutsPopover {
|
|
|
45005
45025
|
return;
|
|
45006
45026
|
}
|
|
45007
45027
|
this.notifications = notifications;
|
|
45008
|
-
this.hasMore = hasMore;
|
|
45028
|
+
this.hasMore = hasMore !== null && hasMore !== void 0 ? hasMore : false;
|
|
45009
45029
|
});
|
|
45010
45030
|
this.triggerGetNotifications();
|
|
45011
45031
|
if (this.unseenCount != 0) {
|
|
45012
45032
|
this.showMarkAll = true;
|
|
45013
45033
|
}
|
|
45014
45034
|
}
|
|
45035
|
+
disconnectedCallback() {
|
|
45036
|
+
this.loadGeneration++;
|
|
45037
|
+
this.isNotificationsLoading = false;
|
|
45038
|
+
}
|
|
45015
45039
|
render() {
|
|
45016
45040
|
var _a, _b;
|
|
45017
|
-
return (hAsync("div", { key: '
|
|
45041
|
+
return (hAsync("div", { key: 'df45b2b7da683f9895151d698a4c7def899e13d4', class: "Popover", ref: this.assignRefToStylingContainer }, hAsync("div", { key: '87e638b07e89b39d9b9fa60807d5e792ef9ecece', class: "Header" }, hAsync("div", { key: '238839de9ec5734950b916924d3469081b10714c', class: "Title" }, translate$1('notifications', this.language), this.unseenCount > 0 ? hAsync("div", { class: "UnseenCounter" }, this.unseenCount) : ''), this.showMarkAll && (hAsync("div", { key: 'efc165ffdc077d09ee2f90c5758eca8b1c048d9f', class: "MarkAsRead", onClick: this.markAllNotificationsAsRead }, translate$1('markAllAsRead', this.language))), hAsync("div", { key: 'b941c6a87a071d9e45d38528d889e7dbc8848ef4', class: "ActionButtons" }, hAsync("button", { key: '33d9e1f7857a80936e6b65e1fa2ecbc3c55e4e4f', class: `DeleteAll${this.showDeleteAllPopup ? ' Active' : ''}`, onClick: this.showDeletePopup, disabled: !((_a = this.notifications) === null || _a === void 0 ? void 0 : _a.length) }, hAsync("svg", { key: '3b87ea1d8e1c5942db86e18cf26e176031afef6a', width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '915823d5da7a4e12d578fe9db6b968253ceba418', d: "M4.375 15.4375C4.375 16.1758 4.94922 16.75 5.6875 16.75H13.5625C14.2734 16.75 14.875 16.1758 14.875 15.4375V6.25H4.375V15.4375ZM11.8125 8.4375C11.8125 8.21875 12.0039 8 12.25 8C12.4688 8 12.6875 8.21875 12.6875 8.4375V14.5625C12.6875 14.8086 12.4688 15 12.25 15C12.0039 15 11.8125 14.8086 11.8125 14.5625V8.4375ZM9.1875 8.4375C9.1875 8.21875 9.37891 8 9.625 8C9.84375 8 10.0625 8.21875 10.0625 8.4375V14.5625C10.0625 14.8086 9.84375 15 9.625 15C9.37891 15 9.1875 14.8086 9.1875 14.5625V8.4375ZM6.5625 8.4375C6.5625 8.21875 6.75391 8 7 8C7.21875 8 7.4375 8.21875 7.4375 8.4375V14.5625C7.4375 14.8086 7.21875 15 7 15C6.75391 15 6.5625 14.8086 6.5625 14.5625V8.4375ZM15.3125 3.625H12.25L11.9219 2.99609C11.8398 2.85938 11.7031 2.75 11.5391 2.75H7.68359C7.51953 2.75 7.38281 2.85938 7.30078 2.99609L7 3.625H3.9375C3.69141 3.625 3.5 3.84375 3.5 4.0625V4.9375C3.5 5.18359 3.69141 5.375 3.9375 5.375H15.3125C15.5312 5.375 15.75 5.18359 15.75 4.9375V4.0625C15.75 3.84375 15.5312 3.625 15.3125 3.625Z", fill: "currentColor" }))), hAsync("button", { key: '49d50d9f7cf56d778788dcf0d87804fa687c7b98', class: "ClosePopover", onClick: this.closePopover }, hAsync("div", { key: '57f0f1d6980036373200e0e5ace18d7f09b9f292', innerHTML: renderIconDefinitionToSVGElement(CloseCircleOutlined$1, {
|
|
45018
45042
|
extraSVGAttrs: { width: '20px', height: '20px', fill: '#A1A1B2' }
|
|
45019
|
-
}) }))), this.showDeleteAllPopup && (hAsync("div", { key: '
|
|
45043
|
+
}) }))), this.showDeleteAllPopup && (hAsync("div", { key: '6a8733b4153724154ed148d8794c336131a32ef4', class: "DeleteAllDropdown", ref: (el) => (this.dropdownRef = el) }, hAsync("button", { key: 'e5b886482308972cbfe1916dce40bcc6b15d21dd', onClick: this.deleteAllNotifications }, translate$1('deleteAllMessages', this.language))))), !this.isLoading && (hAsync("div", { key: 'db28490ea2ae39401719df67c0783944b2aa6fdd', class: "NotificationList" }, this.isNotificationsLoading ? (hAsync("div", { class: "Loading", innerHTML: renderIconDefinitionToSVGElement(LoadingOutlined$1, {
|
|
45020
45044
|
extraSVGAttrs: { width: '30px', height: '30px', fill: '#A1A1B2' }
|
|
45021
45045
|
}) })) : ((_b = this.notifications) === null || _b === void 0 ? void 0 : _b.length) > 0 ? (this.notifications.map((item) => {
|
|
45022
45046
|
var _a, _b;
|
|
45023
45047
|
return (hAsync("nuts-notification", { "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, key: item.id, "user-id": this.userId, "operator-id": this.operatorId, content: item.content, "message-id": item.id, badge: ((_a = item.avatar) === null || _a === void 0 ? void 0 : _a.data) || ((_b = item.actor) === null || _b === void 0 ? void 0 : _b.data) || '', sessionId: this.sessionId, date: item.createdAt, read: item.read, seen: item.seen, language: this.language, "notification-action": this.notificationAction, token: this.token, "backend-url": this.backendUrl, "redirect-url": item.cta.data.url, "translation-url": this.translationUrl, "max-text-length": 200, "max-lines": 5 }));
|
|
45024
|
-
})) : (hAsync("div", { class: "NoMessages" }, hAsync("svg", { width: "120", height: "108", viewBox: "0 0 120 108", fill: "none" }, hAsync("circle", { cx: "11.3191", cy: "30.7872", r: "6.31915", stroke: "#3D3D4D", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("ellipse", { cx: "60.117", cy: "27.9787", rx: "5.96809", ry: "5.61702", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M79.5424 49.4934C79.5424 44.1598 77.6437 39.0446 74.2641 35.2732C70.8844 31.5017 66.3006 29.3829 61.5211 29.3829C56.7415 29.3829 52.1578 31.5017 48.7781 35.2732C45.3985 39.0446 43.4998 44.1598 43.4998 49.4934C43.4998 72.9557 34.4892 79.6592 34.4892 79.6592H88.553C88.553 79.6592 79.5424 72.9557 79.5424 49.4934Z", fill: "#292933" }), hAsync("path", { d: "M68.8995 81.7552C68.1496 83.551 67.0731 85.0417 65.778 86.0779C64.4828 87.1141 63.0144 87.6595 61.5198 87.6595C60.0252 87.6595 58.5568 87.1141 57.2617 86.0779C55.9665 85.0417 54.8901 83.551 54.1401 81.7552", fill: "#292933" }), hAsync("path", { d: "M81.2976 50.2203C81.2976 68.2545 87.2222 76.7327 90.2814 79.9083C90.7671 80.4126 90.3802 81.4764 89.68 81.4764C88.0927 81.4764 86.5488 81.4764 85.0422 81.4764M68.5814 82.946C67.6854 84.8068 66.3993 86.3513 64.8518 87.425C63.3044 88.4987 61.5499 89.0638 59.7641 89.0638C57.9783 89.0638 56.2239 88.4987 54.6765 87.425C53.129 86.3513 51.8429 84.8068 50.9468 82.946M79.712 42.3723C78.6394 39.8192 77.0439 37.4727 74.991 35.4861C70.953 31.5783 65.4763 29.3829 59.7656 29.3829C54.055 29.3829 48.5783 31.5783 44.5403 35.4861C43.3681 36.6205 42.345 37.8722 41.4832 39.2127C40.4958 40.7487 39.7202 42.4013 39.1747 44.1276C38.5563 46.0847 38.2337 48.1364 38.2337 50.2203C38.2337 53.2503 38.0665 56.0106 37.7737 58.5212M34.8401 70.7608C32.9874 75.4551 30.7688 78.331 29.2526 79.9055C28.767 80.4099 29.155 81.4764 29.8551 81.4764C47.1962 81.4764 59.3571 81.4764 74.1593 81.4764", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M55.6345 59.0737C55.1665 59.7144 54.4949 60.2462 53.6868 60.6159C52.8787 60.9855 51.9625 61.1801 51.0299 61.1801C50.0973 61.1801 49.1811 60.9855 48.373 60.6159C47.5649 60.2462 46.8933 59.7144 46.4254 59.0737", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M73.1877 59.0737C72.7197 59.7144 72.0481 60.2462 71.24 60.6159C70.4319 60.9855 69.5157 61.1801 68.5831 61.1801C67.6506 61.1801 66.7344 60.9855 65.9263 60.6159C65.1182 60.2462 64.4465 59.7144 63.9786 59.0737", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("circle", { cx: "107.511", cy: "56.0638", r: "7.02128", stroke: "#3D3D4D", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("circle", { cx: "16.4252", cy: "58.1703", r: "4.21277", fill: "#3D3D4D" }), hAsync("ellipse", { cx: "59.9573", cy: "104.511", rx: "25.2766", ry: "2.80851", fill: "#3D3D4D" }), hAsync("path", { d: "M81.5317 18.1489H88.553L81.5317 25.1702H88.553", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M96.6807 2H106.51L96.6807 11.8298H106.51", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), hAsync("p", null, translate$1('noMessages', this.language)))))), !this.isLoading && (hAsync("div", { key: '
|
|
45048
|
+
})) : (hAsync("div", { class: "NoMessages" }, hAsync("svg", { width: "120", height: "108", viewBox: "0 0 120 108", fill: "none" }, hAsync("circle", { cx: "11.3191", cy: "30.7872", r: "6.31915", stroke: "#3D3D4D", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("ellipse", { cx: "60.117", cy: "27.9787", rx: "5.96809", ry: "5.61702", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M79.5424 49.4934C79.5424 44.1598 77.6437 39.0446 74.2641 35.2732C70.8844 31.5017 66.3006 29.3829 61.5211 29.3829C56.7415 29.3829 52.1578 31.5017 48.7781 35.2732C45.3985 39.0446 43.4998 44.1598 43.4998 49.4934C43.4998 72.9557 34.4892 79.6592 34.4892 79.6592H88.553C88.553 79.6592 79.5424 72.9557 79.5424 49.4934Z", fill: "#292933" }), hAsync("path", { d: "M68.8995 81.7552C68.1496 83.551 67.0731 85.0417 65.778 86.0779C64.4828 87.1141 63.0144 87.6595 61.5198 87.6595C60.0252 87.6595 58.5568 87.1141 57.2617 86.0779C55.9665 85.0417 54.8901 83.551 54.1401 81.7552", fill: "#292933" }), hAsync("path", { d: "M81.2976 50.2203C81.2976 68.2545 87.2222 76.7327 90.2814 79.9083C90.7671 80.4126 90.3802 81.4764 89.68 81.4764C88.0927 81.4764 86.5488 81.4764 85.0422 81.4764M68.5814 82.946C67.6854 84.8068 66.3993 86.3513 64.8518 87.425C63.3044 88.4987 61.5499 89.0638 59.7641 89.0638C57.9783 89.0638 56.2239 88.4987 54.6765 87.425C53.129 86.3513 51.8429 84.8068 50.9468 82.946M79.712 42.3723C78.6394 39.8192 77.0439 37.4727 74.991 35.4861C70.953 31.5783 65.4763 29.3829 59.7656 29.3829C54.055 29.3829 48.5783 31.5783 44.5403 35.4861C43.3681 36.6205 42.345 37.8722 41.4832 39.2127C40.4958 40.7487 39.7202 42.4013 39.1747 44.1276C38.5563 46.0847 38.2337 48.1364 38.2337 50.2203C38.2337 53.2503 38.0665 56.0106 37.7737 58.5212M34.8401 70.7608C32.9874 75.4551 30.7688 78.331 29.2526 79.9055C28.767 80.4099 29.155 81.4764 29.8551 81.4764C47.1962 81.4764 59.3571 81.4764 74.1593 81.4764", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M55.6345 59.0737C55.1665 59.7144 54.4949 60.2462 53.6868 60.6159C52.8787 60.9855 51.9625 61.1801 51.0299 61.1801C50.0973 61.1801 49.1811 60.9855 48.373 60.6159C47.5649 60.2462 46.8933 59.7144 46.4254 59.0737", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M73.1877 59.0737C72.7197 59.7144 72.0481 60.2462 71.24 60.6159C70.4319 60.9855 69.5157 61.1801 68.5831 61.1801C67.6506 61.1801 66.7344 60.9855 65.9263 60.6159C65.1182 60.2462 64.4465 59.7144 63.9786 59.0737", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("circle", { cx: "107.511", cy: "56.0638", r: "7.02128", stroke: "#3D3D4D", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("circle", { cx: "16.4252", cy: "58.1703", r: "4.21277", fill: "#3D3D4D" }), hAsync("ellipse", { cx: "59.9573", cy: "104.511", rx: "25.2766", ry: "2.80851", fill: "#3D3D4D" }), hAsync("path", { d: "M81.5317 18.1489H88.553L81.5317 25.1702H88.553", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" }), hAsync("path", { d: "M96.6807 2H106.51L96.6807 11.8298H106.51", stroke: "#828299", "stroke-width": "3.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), hAsync("p", null, translate$1('noMessages', this.language)))))), !this.isLoading && (hAsync("div", { key: 'f1cd67f7c3d6de56531b5469c3e788b9c9d2c182', class: "Pagination" }, hAsync("div", { key: 'd0390f412b25475603df37adf9b381e681f1dc9b', class: "Button" }, hAsync("button", { key: '935f7d8e73a4418bf6fdb4602b1681c449cb2689', disabled: this.isNotificationsLoading || this.currentPage <= 0, onClick: this.prevPage }, hAsync("svg", { key: 'bffd0ffe5d7cf60202c7e058912fbf38c1246cd7', class: "svg-icon", viewBox: "0 0 20 20" }, hAsync("path", { key: 'b5f65704f71920d3290a818b5f4aece7607cb1b2', d: "M8.388,10.049l4.76-4.873c0.303-0.31,0.297-0.804-0.012-1.105c-0.309-0.304-0.803-0.293-1.105,0.012L6.726,9.516c-0.303,0.31-0.296,0.805,0.012,1.105l5.433,5.307c0.152,0.148,0.35,0.223,0.547,0.223c0.203,0,0.406-0.08,0.559-0.236c0.303-0.309,0.295-0.803-0.012-1.104L8.388,10.049z" })), translate$1('prev', this.language))), hAsync("div", { key: '8f82ceaeaa50c9b7053a1aac2d3db813607d71ca', class: "Button" }, hAsync("button", { key: '65638cc3b4c02637e0ee1198c7bd7b5f5168c71e', disabled: this.isNotificationsLoading || !this.hasMore, onClick: this.nextPage }, translate$1('next', this.language), hAsync("svg", { key: '95b97901bcac88c8c4d1e449b9db87503dc1a60c', class: "svg-icon", viewBox: "0 0 20 20" }, hAsync("path", { key: '7cfe484dfa41bced8c092dfa341a66951fc78de5', d: "M11.611,10.049l-4.76-4.873c-0.303-0.31-0.297-0.804,0.012-1.105c0.309-0.304,0.803-0.293,1.105,0.012l5.306,5.433c0.304,0.31,0.296,0.805-0.012,1.105L7.83,15.928c-0.152,0.148-0.35,0.223-0.547,0.223c-0.203,0-0.406-0.08-0.559-0.236c-0.303-0.309-0.295-0.803,0.012-1.104L11.611,10.049z" }))))))));
|
|
45025
45049
|
}
|
|
45026
45050
|
static get watchers() { return {
|
|
45027
45051
|
"unseenCount": ["unseenCountHandler"],
|
|
@@ -45051,7 +45075,8 @@ class NutsPopover {
|
|
|
45051
45075
|
"showMarkAll": [32],
|
|
45052
45076
|
"limitStylingAppends": [32],
|
|
45053
45077
|
"showDeleteAllPopup": [32],
|
|
45054
|
-
"hasMore": [32]
|
|
45078
|
+
"hasMore": [32],
|
|
45079
|
+
"currentPage": [32]
|
|
45055
45080
|
},
|
|
45056
45081
|
"$listeners$": [[8, "messageDeleted", "messageDeletedHandler"], [8, "messageRead", "messageReadHandler"], [8, "click", "clickOutsideHandle"]],
|
|
45057
45082
|
"$lazyBundleId$": "-",
|