@acorex/modules 20.2.0-next.1 → 20.2.0-next.2

package/fesm2022/acorex-modules-notification-management.mjs

@@ -4,7 +4,7 @@ import * as i2$1 from '@acorex/platform/layout/builder';
 import { AXPWidgetsCatalog, AXPValueWidgetComponent, cloneProperty, AXPWidgetGroupEnum, AXPLayoutBuilderModule } from '@acorex/platform/layout/builder';
 import { AXMEntityCrudServiceImpl, AXPEntityService, AXP_ENTITY_DEFINITION_LOADER, AXPEntityStorageService, AXPEntityDataProviderImpl } from '@acorex/platform/layout/entity';
 import * as i0 from '@angular/core';
-import { Injectable, NgModule, inject, signal, computed, effect, input, output, ChangeDetectionStrategy, Component, Injector, ChangeDetectorRef } from '@angular/core';
+import { Injectable, NgModule, inject, signal, computed, effect, input, output, ChangeDetectionStrategy, Component, Injector, ChangeDetectorRef, InjectionToken } from '@angular/core';
 import { AXPSessionService } from '@acorex/platform/auth';
 import { firstValueFrom } from 'rxjs';
 import * as i4 from '@acorex/components/badge';
@@ -1561,9 +1561,18 @@ class AXMNotificationConnectorService {
             this.isLoading.set(true);
             this.error.set(null);
             const response = await this.notificationService.getList();
-            this.notifications.set(response.items);
+            // Sort notifications by createAt date in descending order (newest first)
+            const sortedItems = [...response.items].sort((a, b) => {
+                const dateA = new Date(a.createAt).getTime();
+                const dateB = new Date(b.createAt).getTime();
+                return dateB - dateA;
+            });
+            this.notifications.set(sortedItems);
             this.totalCount.set(response.total);
-            return response;
+            return {
+                ...response,
+                items: sortedItems,
+            };
         }
         catch (err) {
             this.error.set(err instanceof Error ? err.message : 'Failed to fetch notifications');
@@ -1627,28 +1636,25 @@ class AXMNotificationConnectorService {
      * Create a new notification
      */
     async create(payload, options) {
-        try {
-            this.isLoading.set(true);
-            this.error.set(null);
-            //send os notification
-            const isPermissionGranted = await this.osNotificationService.requestPermission();
-            if (payload && isPermissionGranted) {
-                this.osNotificationService.show(payload.title || 'Notification', {
-                    body: payload.body || 'No body',
-                    icon: payload.user.image || '',
-                    ...options,
-                });
-            }
-            await this.notificationService.create(payload);
-            // Refresh list after creating a notification
-            await this.getList();
-        }
-        catch (err) {
-            this.error.set(err instanceof Error ? err.message : 'Failed to create notification');
-        }
-        finally {
-            this.isLoading.set(false);
+        this.isLoading.set(true);
+        this.error.set(null);
+        //send os notification
+        const isPermissionGranted = await this.osNotificationService.requestPermission();
+        if (payload && isPermissionGranted) {
+            this.osNotificationService.show(payload.title || 'Notification', {
+                body: payload.body || 'No body',
+                ...options,
+            });
         }
+        const createdNotification = await this.notificationService.create(payload);
+        // Refresh list after creating a notification
+        this.notifications.update((notifications) => {
+            const newNotifications = [createdNotification, ...notifications];
+            return newNotifications.sort((a, b) => new Date(b.createAt).getTime() - new Date(a.createAt).getTime());
+        });
+        this.totalCount.update((count) => count + 1);
+        await this.getList();
+        this.isLoading.set(false);
     }
     // Methods from AXMEntityCrudServiceImpl
     /**
@@ -1770,7 +1776,7 @@ class AXMAdminNotificationItemComponent {
         this.onPressNotificationItem.emit(id);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AXMAdminNotificationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: AXMAdminNotificationItemComponent, isStandalone: true, selector: "axp-master-notification-item", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { onPressNotificationItem: "onPressNotificationItem" }, ngImport: i0, template: "<div\n  class=\"notification-item\"\n  [id]=\"data().id\"\n  (click)=\"pressNotificationItem(data().id)\"\n  [class]=\"[data().template.prority, data().readAt ? 'read' : 'unread']\"\n>\n  <div class=\"notification-avatar\">\n    <axp-user-avatar [size]=\"48\" [userId]=\"data().user.id\"></axp-user-avatar>\n    @if (!data().readAt) {\n      <div class=\"unread-badge\"></div>\n    }\n  </div>\n\n  <div class=\"notification-content\">\n    <div class=\"notification-header\">\n      <div class=\"notification-title\">{{ data().user.name || data().title }}</div>\n      <div class=\"notification-meta\">\n        @if (!data().template.isPinned) {\n          <div class=\"pin-notification\" (click)=\"$event.stopPropagation()\">\n            <ax-icon>\n              <i class=\"fa-solid fa-thumbtack\"></i>\n            </ax-icon>\n          </div>\n        }\n        <div class=\"notification-time\">{{ differentTime() | format: 'timeleft' | async }}</div>\n      </div>\n    </div>\n\n    <div class=\"notification-body\">{{ data().body }}</div>\n  </div>\n</div>\n", styles: [".notification-item{position:relative;margin-top:2px;margin-bottom:2px;display:flex;cursor:pointer;gap:1rem;border-radius:.125rem;padding:1rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;animation-duration:.2s;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.notification-item.read{background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.notification-item.unread{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.notification-item:hover{background-color:rgb(var(--ax-sys-color-light-surface));color:rgb(var(--ax-sys-color-on-light-surface));border-color:rgb(var(--ax-sys-color-border-light-surface))}.notification-item.Notice:before,.notification-item.Danger:before,.notification-item.Warning:before{content:\"\";position:absolute;top:.5rem;bottom:.5rem;inset-inline-start:0px;width:.125rem;border-radius:9999px}.notification-item.Notice:before{background:rgb(var(--ax-sys-color-success-500))}.notification-item.Danger:before{background:rgb(var(--ax-sys-color-danger-500))}.notification-item.Warning:before{background:rgb(var(--ax-sys-color-warning-500))}.notification-item .notification-avatar{position:relative}.notification-item .notification-avatar .unread-badge{position:absolute;bottom:.25rem;inset-inline-end:.25rem;width:10px;height:10px;background:rgb(var(--ax-sys-color-primary-500));border:2px solid rgb(var(--ax-sys-color-surface));border-radius:50%}.notification-item .notification-content{min-width:0px;flex:1 1 0%}.notification-item .notification-content .notification-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.notification-item .notification-content .notification-header .notification-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface))}.notification-item .notification-content .notification-header .notification-meta{display:flex;align-items:center;gap:.5rem}.notification-item .notification-content .notification-header .notification-meta .notification-time{white-space:nowrap;font-size:.75rem;line-height:1rem;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .notification-content .notification-body{margin-top:.25rem;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:.875rem;line-height:1.25rem;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .pin-notification{border-radius:9999px;padding:.375rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .pin-notification i{--tw-rotate: 45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXPUserAvatarComponent, selector: "axp-user-avatar", inputs: ["size", "userId"] }, { kind: "ngmodule", type: AXImageModule }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXFormatModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3$1.AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: AXMAdminNotificationItemComponent, isStandalone: true, selector: "axp-master-notification-item", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { onPressNotificationItem: "onPressNotificationItem" }, ngImport: i0, template: "<div\n  class=\"notification-item\"\n  [id]=\"data().id\"\n  (click)=\"pressNotificationItem(data().id)\"\n  [class]=\"[data().template.prority, data().readAt ? 'read' : 'unread']\"\n>\n  <div class=\"notification-avatar\">\n    <axp-user-avatar [size]=\"48\" [userId]=\"data().sender.id\"></axp-user-avatar>\n    @if (!data().readAt) {\n      <!-- <div class=\"unread-badge\"></div> -->\n    }\n  </div>\n\n  <div class=\"notification-content\">\n    <div class=\"notification-header\">\n      <div class=\"notification-title\">{{ data().sender.username || data().title }}</div>\n      <div class=\"notification-meta\">\n        @if (!data().template.isPinned) {\n          <div class=\"pin-notification\" (click)=\"$event.stopPropagation()\">\n            <ax-icon>\n              <i class=\"fa-solid fa-thumbtack\"></i>\n            </ax-icon>\n          </div>\n        }\n        <div class=\"notification-time\">{{ differentTime() | format: 'timeleft' | async }}</div>\n      </div>\n    </div>\n\n    <div class=\"notification-body\">{{ data().body }}</div>\n  </div>\n</div>\n", styles: [".notification-item{position:relative;margin-top:2px;margin-bottom:2px;display:flex;cursor:pointer;gap:1rem;border-radius:.125rem;padding:1rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;animation-duration:.2s;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.notification-item.read{background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.notification-item.unread{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.notification-item:hover{background-color:rgb(var(--ax-sys-color-light-surface));color:rgb(var(--ax-sys-color-on-light-surface));border-color:rgb(var(--ax-sys-color-border-light-surface))}.notification-item.Notice:before,.notification-item.Danger:before,.notification-item.Warning:before{content:\"\";position:absolute;top:.5rem;bottom:.5rem;inset-inline-start:0px;width:.125rem;border-radius:9999px}.notification-item.Notice:before{background:rgb(var(--ax-sys-color-success-500))}.notification-item.Danger:before{background:rgb(var(--ax-sys-color-danger-500))}.notification-item.Warning:before{background:rgb(var(--ax-sys-color-warning-500))}.notification-item .notification-avatar{position:relative}.notification-item .notification-avatar .unread-badge{position:absolute;bottom:.25rem;inset-inline-end:.25rem;width:10px;height:10px;background:rgb(var(--ax-sys-color-primary-500));border:2px solid rgb(var(--ax-sys-color-surface));border-radius:50%}.notification-item .notification-content{min-width:0px;flex:1 1 0%}.notification-item .notification-content .notification-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.notification-item .notification-content .notification-header .notification-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface))}.notification-item .notification-content .notification-header .notification-meta{display:flex;align-items:center;gap:.5rem}.notification-item .notification-content .notification-header .notification-meta .notification-time{white-space:nowrap;font-size:.75rem;line-height:1rem;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .notification-content .notification-body{margin-top:.25rem;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:.875rem;line-height:1.25rem;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .pin-notification{border-radius:9999px;padding:.375rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .pin-notification i{--tw-rotate: 45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i3.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXPUserAvatarComponent, selector: "axp-user-avatar", inputs: ["size", "userId"] }, { kind: "ngmodule", type: AXImageModule }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXFormatModule }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3$1.AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AXMAdminNotificationItemComponent, decorators: [{
             type: Component,
@@ -1782,7 +1788,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
                         AXImageModule,
                         AXBadgeModule,
                         AXFormatModule,
-                    ], template: "<div\n  class=\"notification-item\"\n  [id]=\"data().id\"\n  (click)=\"pressNotificationItem(data().id)\"\n  [class]=\"[data().template.prority, data().readAt ? 'read' : 'unread']\"\n>\n  <div class=\"notification-avatar\">\n    <axp-user-avatar [size]=\"48\" [userId]=\"data().user.id\"></axp-user-avatar>\n    @if (!data().readAt) {\n      <div class=\"unread-badge\"></div>\n    }\n  </div>\n\n  <div class=\"notification-content\">\n    <div class=\"notification-header\">\n      <div class=\"notification-title\">{{ data().user.name || data().title }}</div>\n      <div class=\"notification-meta\">\n        @if (!data().template.isPinned) {\n          <div class=\"pin-notification\" (click)=\"$event.stopPropagation()\">\n            <ax-icon>\n              <i class=\"fa-solid fa-thumbtack\"></i>\n            </ax-icon>\n          </div>\n        }\n        <div class=\"notification-time\">{{ differentTime() | format: 'timeleft' | async }}</div>\n      </div>\n    </div>\n\n    <div class=\"notification-body\">{{ data().body }}</div>\n  </div>\n</div>\n", styles: [".notification-item{position:relative;margin-top:2px;margin-bottom:2px;display:flex;cursor:pointer;gap:1rem;border-radius:.125rem;padding:1rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;animation-duration:.2s;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.notification-item.read{background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.notification-item.unread{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.notification-item:hover{background-color:rgb(var(--ax-sys-color-light-surface));color:rgb(var(--ax-sys-color-on-light-surface));border-color:rgb(var(--ax-sys-color-border-light-surface))}.notification-item.Notice:before,.notification-item.Danger:before,.notification-item.Warning:before{content:\"\";position:absolute;top:.5rem;bottom:.5rem;inset-inline-start:0px;width:.125rem;border-radius:9999px}.notification-item.Notice:before{background:rgb(var(--ax-sys-color-success-500))}.notification-item.Danger:before{background:rgb(var(--ax-sys-color-danger-500))}.notification-item.Warning:before{background:rgb(var(--ax-sys-color-warning-500))}.notification-item .notification-avatar{position:relative}.notification-item .notification-avatar .unread-badge{position:absolute;bottom:.25rem;inset-inline-end:.25rem;width:10px;height:10px;background:rgb(var(--ax-sys-color-primary-500));border:2px solid rgb(var(--ax-sys-color-surface));border-radius:50%}.notification-item .notification-content{min-width:0px;flex:1 1 0%}.notification-item .notification-content .notification-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.notification-item .notification-content .notification-header .notification-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface))}.notification-item .notification-content .notification-header .notification-meta{display:flex;align-items:center;gap:.5rem}.notification-item .notification-content .notification-header .notification-meta .notification-time{white-space:nowrap;font-size:.75rem;line-height:1rem;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .notification-content .notification-body{margin-top:.25rem;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:.875rem;line-height:1.25rem;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .pin-notification{border-radius:9999px;padding:.375rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .pin-notification i{--tw-rotate: 45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}\n"] }]
+                    ], template: "<div\n  class=\"notification-item\"\n  [id]=\"data().id\"\n  (click)=\"pressNotificationItem(data().id)\"\n  [class]=\"[data().template.prority, data().readAt ? 'read' : 'unread']\"\n>\n  <div class=\"notification-avatar\">\n    <axp-user-avatar [size]=\"48\" [userId]=\"data().sender.id\"></axp-user-avatar>\n    @if (!data().readAt) {\n      <!-- <div class=\"unread-badge\"></div> -->\n    }\n  </div>\n\n  <div class=\"notification-content\">\n    <div class=\"notification-header\">\n      <div class=\"notification-title\">{{ data().sender.username || data().title }}</div>\n      <div class=\"notification-meta\">\n        @if (!data().template.isPinned) {\n          <div class=\"pin-notification\" (click)=\"$event.stopPropagation()\">\n            <ax-icon>\n              <i class=\"fa-solid fa-thumbtack\"></i>\n            </ax-icon>\n          </div>\n        }\n        <div class=\"notification-time\">{{ differentTime() | format: 'timeleft' | async }}</div>\n      </div>\n    </div>\n\n    <div class=\"notification-body\">{{ data().body }}</div>\n  </div>\n</div>\n", styles: [".notification-item{position:relative;margin-top:2px;margin-bottom:2px;display:flex;cursor:pointer;gap:1rem;border-radius:.125rem;padding:1rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;animation-duration:.2s;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.notification-item.read{background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.notification-item.unread{background-color:rgb(var(--ax-sys-color-lighter-surface));color:rgb(var(--ax-sys-color-on-lighter-surface));border-color:rgb(var(--ax-sys-color-border-lighter-surface))}.notification-item:hover{background-color:rgb(var(--ax-sys-color-light-surface));color:rgb(var(--ax-sys-color-on-light-surface));border-color:rgb(var(--ax-sys-color-border-light-surface))}.notification-item.Notice:before,.notification-item.Danger:before,.notification-item.Warning:before{content:\"\";position:absolute;top:.5rem;bottom:.5rem;inset-inline-start:0px;width:.125rem;border-radius:9999px}.notification-item.Notice:before{background:rgb(var(--ax-sys-color-success-500))}.notification-item.Danger:before{background:rgb(var(--ax-sys-color-danger-500))}.notification-item.Warning:before{background:rgb(var(--ax-sys-color-warning-500))}.notification-item .notification-avatar{position:relative}.notification-item .notification-avatar .unread-badge{position:absolute;bottom:.25rem;inset-inline-end:.25rem;width:10px;height:10px;background:rgb(var(--ax-sys-color-primary-500));border:2px solid rgb(var(--ax-sys-color-surface));border-radius:50%}.notification-item .notification-content{min-width:0px;flex:1 1 0%}.notification-item .notification-content .notification-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.notification-item .notification-content .notification-header .notification-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface))}.notification-item .notification-content .notification-header .notification-meta{display:flex;align-items:center;gap:.5rem}.notification-item .notification-content .notification-header .notification-meta .notification-time{white-space:nowrap;font-size:.75rem;line-height:1rem;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .notification-content .notification-body{margin-top:.25rem;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:.875rem;line-height:1.25rem;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .pin-notification{border-radius:9999px;padding:.375rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;color:rgb(var(--ax-sys-color-on-surface-variant))}.notification-item .pin-notification i{--tw-rotate: 45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}\n"] }]
         }] });
 
 class AXMAdminNotificationPanelComponent {
@@ -1904,7 +1910,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
                         AXBadgeModule,
                         AXPopoverModule,
                         AXMAdminNotificationItemComponent,
-                        AXFormatModule
+                        AXFormatModule,
                     ], template: "<div class=\"ax-p-4 ax-flex ax-justify-between ax-items-center\">\n  <span class=\"ax-text-xl\">Notifications</span>\n  <ax-button color=\"default\" look=\"blank\">\n    <ax-icon>\n      <i class=\"fa-regular fa-gear fa-lg\"></i>\n    </ax-icon>\n  </ax-button>\n</div>\n<ax-tabs [content]=\"cons\" look=\"with-line\" location=\"bottom\">\n  @for (tab of tabItems(); track tab.text) {\n    <ax-tab-item [text]=\"tab.text\" [active]=\"activeTab() === tab.text\" (activeChange)=\"changeActiveTab(tab.text)\">\n      <ax-suffix>\n        @if (tab.count) {\n          <ax-badge [color]=\"activeTab() === tab.text ? 'primary' : 'ghost'\" [text]=\"tab.count.toString()\"></ax-badge>\n        }\n      </ax-suffix>\n      <ax-content>\n        <div class=\"ax-max-h-[50vh] ax-max-w-[30rem] ax-overflow-y-auto\">\n          @for (notif of getNotificationItems(tab.text); track notif.id) {\n            <axp-master-notification-item\n              [data]=\"notif\"\n              (onPressNotificationItem)=\"markAsRead($event)\"\n            ></axp-master-notification-item>\n          }\n        </div>\n        <div class=\"ax-flex ax-gap-4 ax-justify-between ax-p-4 ax-border-t ax-border-default\">\n          <ax-button\n            [disabled]=\"NewNotification() === 0\"\n            [color]=\"'default'\"\n            text=\"Mark all as read\"\n            (onClick)=\"markAllAsRead()\"\n          ></ax-button>\n          <ax-button color=\"primary\" text=\"View all notifications\" (onClick)=\"viewAllNotifications()\"></ax-button>\n        </div>\n      </ax-content>\n    </ax-tab-item>\n  }\n</ax-tabs>\n\n<ng-template [axTabContent] #cons=\"axTabContent\"></ng-template>\n" }]
         }] });
 
@@ -3067,9 +3073,84 @@ async function notificationLogEntityFactory(injector) {
     return entityDef;
 }
 
+class AXPNotificationDefinitionProvider {
+}
+const DEFAULT_NOTIFICATION_DEFINITION = [
+    {
+        name: 'File',
+        title: 'Email',
+        icon: 'fa-solid fa-envelope',
+        async execute(command, item) {
+            console.log('Execute for email', item);
+            // In a real implementation, you would perform an action
+            return Promise.resolve();
+        },
+    },
+    {
+        name: 'Chat',
+        title: 'SMS',
+        icon: 'fa-solid fa-comment-sms',
+        async execute(command, item) {
+            console.log('Execute for sms', item);
+            // In a real implementation, you would perform an action
+            return Promise.resolve();
+        },
+    },
+    {
+        name: 'Comment',
+        title: 'Comment',
+        icon: 'fa-solid fa-comment',
+        async execute(command, item) {
+            console.log('Execute for comment', item);
+            // In a real implementation, you would perform an action
+            return Promise.resolve();
+        },
+    },
+    {
+        name: 'Log',
+        title: 'Log',
+        icon: 'fa-solid fa-file-lines',
+        async execute(command, item) {
+            console.log('Execute for log', item);
+            // In a real implementation, you would perform an action
+            return Promise.resolve();
+        },
+    },
+];
+class AXPNotificationDefinitionProviderDefault extends AXPNotificationDefinitionProvider {
+    async provide() {
+        return DEFAULT_NOTIFICATION_DEFINITION;
+    }
+}
+const AXP_NOTIFICATION_DEFINITION_PROVIDER = new InjectionToken('AXP_NOTIFICATION_DEFINITION_PROVIDER');
+class AXPNotificationDefinitionService {
+    constructor() {
+        this.providers = inject(AXP_NOTIFICATION_DEFINITION_PROVIDER, { optional: true });
+    }
+    getProviders() {
+        return this.providers ?? [];
+    }
+    resolve(name) {
+        return this.providers?.find((p) => p.name === name) ?? new AXPNotificationDefinitionProviderDefault();
+    }
+    execute(command, item) {
+        const provider = this.providers?.find((p) => p.name === item.type);
+        if (!provider) {
+            throw new Error('Notification provider not found');
+        }
+        provider.execute(command, item);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AXPNotificationDefinitionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AXPNotificationDefinitionService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AXPNotificationDefinitionService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AXMNotificationConnectorService, AXMNotificationEntityService, AXMNotificationEntityServiceImpl, AXMNotificationManagementChannelEntityService, AXMNotificationManagementChannelEntityServiceImpl, AXMNotificationManagementModule, AXMNotificationManagementTemplateEntityModule, AXMNotificationManagementTemplateEntityService, AXMNotificationManagementTemplateEntityServiceImpl, AXMNotificationManagmentModuleMenuProvider, AXMOsNotificationService, AXMSettingProvider, AXPMyNotificationDashboardWidget, AXPNotificationWidgetViewComponent, RootConfig, myNotificationEntityFactory, notificationChannelEntityFactory, notificationEntityFactory, notificationLogEntityFactory, notificationTemplateEntityFactory };
+export { AXMNotificationConnectorService, AXMNotificationEntityService, AXMNotificationEntityServiceImpl, AXMNotificationManagementChannelEntityService, AXMNotificationManagementChannelEntityServiceImpl, AXMNotificationManagementModule, AXMNotificationManagementTemplateEntityModule, AXMNotificationManagementTemplateEntityService, AXMNotificationManagementTemplateEntityServiceImpl, AXMNotificationManagmentModuleMenuProvider, AXMOsNotificationService, AXMSettingProvider, AXPMyNotificationDashboardWidget, AXPNotificationDefinitionProvider, AXPNotificationDefinitionProviderDefault, AXPNotificationDefinitionService, AXPNotificationWidgetViewComponent, AXP_NOTIFICATION_DEFINITION_PROVIDER, RootConfig, myNotificationEntityFactory, notificationChannelEntityFactory, notificationEntityFactory, notificationLogEntityFactory, notificationTemplateEntityFactory };
 //# sourceMappingURL=acorex-modules-notification-management.mjs.map