npm - @digital-realty/ix-notifications - Versions diffs - 1.0.15 → 1.0.16 - Mend

@digital-realty/ix-notifications 1.0.15 → 1.0.16

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.

Files changed (21) hide show

package/dist/IxNotifications.d.ts +1 -0
package/dist/IxNotifications.js +8 -2
package/dist/IxNotifications.js.map +1 -1
package/dist/components/notifications/date-filters.js +6 -5
package/dist/components/notifications/date-filters.js.map +1 -1
package/dist/components/notifications/group-filters.js +3 -3
package/dist/components/notifications/group-filters.js.map +1 -1
package/dist/components/notifications/view-item-dialog.js +18 -16
package/dist/components/notifications/view-item-dialog.js.map +1 -1
package/dist/helper/common.d.ts +1 -0
package/dist/helper/common.js +11 -0
package/dist/helper/common.js.map +1 -0
package/dist/ix-notifications.min.js +1 -1
package/dist/services/notifications-service.js +2 -1
package/dist/services/notifications-service.js.map +1 -1
package/dist/state/NotificationState.d.ts +1 -0
package/dist/state/NotificationState.js +5 -0
package/dist/state/NotificationState.js.map +1 -1
package/dist/tw.js +754 -735
package/dist/tw.js.map +1 -1
package/package.json +2 -2

package/dist/IxNotifications.d.ts CHANGED Viewed

@@ -26,6 +26,7 @@ export declare class IxNotifications extends MobxLitElement {
     firstUpdated(): Promise<void>;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    handleOnbeforeunload(event: any): void;
     toggleDrawer(): void;
     renderUnReadCountText(): import("lit").TemplateResult<1>;
     markAllread(): void;

package/dist/IxNotifications.js CHANGED Viewed

@@ -36,10 +36,16 @@ export class IxNotifications extends MobxLitElement {
     connectedCallback() {
         super.connectedCallback();
         window.addEventListener('account-switched', NotificationsState.NewApiClient);
+        window.addEventListener('beforeunload', this.handleOnbeforeunload);
     }
     disconnectedCallback() {
-        super.disconnectedCallback();
         window.removeEventListener('account-switched', NotificationsState.NewApiClient);
+        window.removeEventListener('beforeunload', this.handleOnbeforeunload);
+        super.disconnectedCallback();
+    }
+    //Handle browser refresh event
+    handleOnbeforeunload(event) {
+        NotificationsState.clearStoredNotificationsData();
     }
     toggleDrawer() {
         this.showDrawer = !this.showDrawer;
@@ -83,7 +89,7 @@ export class IxNotifications extends MobxLitElement {
                     });
                 });
                 const apiResult = { State: allResultSuccesful === true ? ApiCallState.SUCCESS : ApiCallState.ERROR,
-                    Message: allResultSuccesful === true ? "Successfully marked all the notificaions as read" : "Error while marking the notifications read, Please try again"
+                    Message: allResultSuccesful === true ? "Successfully marked all the notifications as read" : "Error occurred while marking the notifications as read, Please try again"
                 };
                 this.showResultMessage(apiResult, unreadItems[0].id);
                 this.renderUnReadCountText();

package/dist/IxNotifications.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IxNotifications.js","sourceRoot":"","sources":["../src/IxNotifications.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { differenceInDays, differenceInHours } from 'date-fns';\nimport { TWStyles } from './tw.js';\nimport '@digital-realty/ix-button/ix-button.js';\nimport '@digital-realty/ix-drawer/ix-drawer.js';\nimport '@digital-realty/ix-icon';\nimport '@material/web/icon/icon.js';\nimport { NotificationsState } from './state/NotificationState.js';\nimport { ApiCallResult, Notification } from './models/notification.js';\nimport {\n ConfirmationDialogEventDetail,\n FilterDialogEventDetail,\n} from './constants/notification-types.js';\nimport {\n ApiCallState,\n NotificationGroups,\n NotificationStatus,\n} from './constants/notifications.js';\nimport './components/notifications/notification-item.js';\nimport './components/notifications/grouped-item.js';\nimport './components/notifications/group-filters.js';\nimport './components/notifications/date-filters.js';\nimport './components/notifications/confirmation-dialog.js';\nimport { NotificationsStyle } from './styles/notifications-style.js';\n\nexport class IxNotifications extends MobxLitElement {\n static styles = [TWStyles, NotificationsStyle];\n\n @query('group-filters') groupFilters!: HTMLElement;\n\n @query('ix-icon-button#group-filter-button') groupFiltersButton!: HTMLElement;\n\n @query('date-filters') dateFilters!: HTMLElement;\n\n @query('ix-icon-button#date-filters-button') dateFiltersButton!: HTMLElement;\n\n @state() private showDrawer = false;\n\n @state() private showGroupedView = false;\n\n @state() private showFilters = false;\n\n @state() private showDateFilters = false;\n\n @state() private showMarkAllReadConfirmation = false;\n\n @property({ type: String }) baseApiUrl = '';\n\n @property({ type: String }) localStorageKey = '';\n\n async firstUpdated() {\n // Construct ApiClient form baseApiUrl and localStorageKey\n NotificationsState.baseApiUrl = this.baseApiUrl;\n NotificationsState.localStorageKey = this.localStorageKey;\n NotificationsState.ConstructApiClient();\n }\n\n connectedCallback() {\n super.connectedCallback();\n window.addEventListener(\n 'account-switched',\n NotificationsState.NewApiClient\n );\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n window.removeEventListener(\n 'account-switched',\n NotificationsState.NewApiClient\n );\n }\n\n toggleDrawer() {\n this.showDrawer = !this.showDrawer;\n if (!this.showDrawer) {\n this.showFilters = false;\n this.showDateFilters = false;\n }\n }\n\n /* eslint-disable-next-line /\n renderUnReadCountText() {\n if (NotificationsState.unreadNotificationCount <= 0) {\n return html`${nothing}`;\n }\n\n let unreadCountText = '';\n if (NotificationsState.unreadNotificationCount > 99) {\n unreadCountText = '99+';\n } else {\n unreadCountText = NotificationsState.unreadNotificationCount.toString();\n }\n\n return html` <div\n class=\"unread rounded-full text-center text-white text-sm absolute icon-position -start-0\"\n >\n ${unreadCountText}\n </div>`;\n }\n\n markAllread() {\n this.showMarkAllReadConfirmation = true;\n }\n\n private confirmedMarkAllRead(e: CustomEvent<ConfirmationDialogEventDetail>) {\n // Mark All read if Confirmed True\n if (e.detail.returnValue) {\n const filterNotification = this.applyNotificationFilters();\n const unreadItems = filterNotification?.filter(item => item.status === NotificationStatus.UNREAD);\n\n if(unreadItems.length > 0) {\n let allResultSuccesful = true;\n\n filterNotification?.forEach(item => {\n NotificationsState.setNotificationReadStatus(item.id).then((result : any) => \n { \n if(allResultSuccesful)\n allResultSuccesful = result;\n });\n });\n\n const apiResult = { State : allResultSuccesful === true? ApiCallState.SUCCESS : ApiCallState.ERROR,\n Message : allResultSuccesful === true? \"Successfully marked all the notificaions as read\" : \"Error while marking the notifications read, Please try again\"\n } as ApiCallResult;\n\n this.showResultMessage(apiResult,unreadItems[0].id);\n\n this.renderUnReadCountText();\n\n this.requestUpdate();\n }\n }\n\n this.showMarkAllReadConfirmation = false;\n }\n\n private showResultMessage(result: ApiCallResult, id: string )\n { \n window.dispatchEvent(\n new CustomEvent(\"add-toast\", { detail: {\n id,\n content: html`\n <ix-message-toast toastId=${id} .TMessageToast=${result.State.toLowerCase()} forceClose> \n ${result.Message}\n </ix-message-toast>`,\n autoClose: 3000,\n durationOut: 3000,\n vertical: 'bottom',\n horizontal: 'center',\n animated: true, \n above: false,\n } })\n );\n }\n\n toggleGroupView() {\n this.showGroupedView = !this.showGroupedView;\n }\n\n displayFilters() {\n this.showFilters = !this.showFilters;\n }\n\n / eslint-disable-next-line /\n applyNotificationFilters() {\n const filterredNotifications = NotificationsState.notifications?.filter(\n (x: Notification) =>\n (x.resourceType === NotificationGroups.PLANNED_MAINTENANCE &&\n NotificationsState.notificationFilters.SHOW_PLANNED_MAINTENANCE ===\n true) \|\|\n (x.resourceType === NotificationGroups.SERVICE_TICKETS &&\n NotificationsState.notificationFilters.SHOW_SERVICE_TICKETS ===\n true) \|\|\n (x.resourceType === NotificationGroups.DCIM_ALERTS &&\n NotificationsState.notificationFilters.SHOW_DCIM_ALERTS === true) \|\|\n x.resourceType === NotificationGroups.INCIDENTS\n ); // Always display incidents\n\n if (\n NotificationsState.dateFilters.FROM_DATE === undefined &&\n NotificationsState.dateFilters.TO_DATE === undefined\n )\n return filterredNotifications;\n\n if ( NotificationsState.dateFilters.FROM_DATE === undefined)\n return filterredNotifications.filter(\n x => differenceInDays(\n new Date(x.createdAt),\n NotificationsState.dateFilters.TO_DATE!\n ) <= 0\n );\n \n if ( NotificationsState.dateFilters.TO_DATE === undefined)\n return filterredNotifications.filter(\n x =>\n differenceInHours(\n new Date(x.createdAt),\n NotificationsState.dateFilters.FROM_DATE!\n ) >= 0); \n\n return filterredNotifications.filter(\n x =>\n differenceInHours(\n new Date(x.createdAt),\n NotificationsState.dateFilters.FROM_DATE!\n ) >= 0 &&\n differenceInDays(\n new Date(x.createdAt),\n NotificationsState.dateFilters.TO_DATE!\n ) <= 0\n );\n }\n\n displayDateFilters() {\n this.showDateFilters = !this.showDateFilters;\n }\n\n renderGroupedView() {\n const filteredNotifications = this.applyNotificationFilters();\n\n return html`<div style=\"margin:0px\">\n <grouped-item\n groupTitle=${NotificationGroups.PLANNED_MAINTENANCE}\n iconName=\"lab_profile\"\n .childItems=${filteredNotifications?.filter(\n item => item.resourceType === NotificationGroups.PLANNED_MAINTENANCE\n )}\n ></grouped-item>\n <grouped-item\n groupTitle=${NotificationGroups.INCIDENTS}\n iconName=\"emergency_home\"\n .childItems=${filteredNotifications?.filter(\n item => item.resourceType === NotificationGroups.INCIDENTS\n )}\n ></grouped-item>\n <grouped-item\n groupTitle=${NotificationGroups.SERVICE_TICKETS}\n iconName=\"dvr\"\n .childItems=${filteredNotifications?.filter(\n item => item.resourceType === NotificationGroups.SERVICE_TICKETS\n )}\n ></grouped-item>\n <grouped-item\n groupTitle=${NotificationGroups.DCIM_ALERTS}\n iconName=\"public\"\n .childItems=${filteredNotifications?.filter(\n item => item.resourceType === NotificationGroups.DCIM_ALERTS\n )}\n ></grouped-item> \n </div>`;\n }\n\n renderDefaultView() {\n const filterNotification = this.applyNotificationFilters();\n const filterTodayItems = filterNotification.filter(\n x => differenceInDays(x.createdAt, new Date()) === 0\n );\n const filterEarlierItems = filterNotification.filter(\n x => differenceInDays(x.createdAt, new Date()) !== 0\n );\n\n if (filterNotification?.length! > 0) {\n return html` <h3 class=\"grow\">Latest</h3>\n <div class=\"m-0 p-0\">\n ${filterTodayItems.length > 0\n ? filterTodayItems?.map(\n item => html`<notification-item\n .notificaiton=${item}\n ?disabled=${item.resourceType ===\n NotificationGroups.INCIDENTS}\n >\n </notification-item> `\n )\n : this.renderNoResult()}\n </div>\n <h3 class=\"grow\">Earlier</h3>\n <div>\n ${filterEarlierItems.length > 0\n ? filterEarlierItems?.map(\n item => html`<notification-item\n .notificaiton=${item}\n ?disabled=${item.resourceType ===\n NotificationGroups.INCIDENTS}\n >\n </notification-item> `\n )\n : this.renderNoResult()}\n </div>`;\n }\n\n return html`<p class=\"empty\">No notifications yet.</p>`;\n }\n\n / eslint-disable-next-line */\n renderNoResult() {\n return html`<p class=\"empty\">No notifications yet.</p>`;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n handleCloseClick(_e: CustomEvent<FilterDialogEventDetail>) {\n this.showDateFilters = false;\n this.showFilters = false;\n }\n\n // eslint-disable-next-line\n handleContentScroll(e: CustomEvent) {\n // when scrollbar at the end, retrieve next page\n if (\n e !== null &&\n e.detail.scrollTop + e.detail.clientHeight >= e.detail.scrollHeight\n ) {\n NotificationsState.getNotifications();\n }\n }\n\n manageFilterVisibility(e: Event) {\n const path = e.composedPath();\n if (\n this.showFilters &&\n !path.includes(this.groupFilters) &&\n !path.includes(this.groupFiltersButton)\n ) {\n this.showFilters = false;\n }\n if (\n this.showDateFilters &&\n !path.includes(this.dateFilters) &&\n !path.includes(this.dateFiltersButton)\n ) {\n this.showDateFilters = false;\n }\n }\n\n render() {\n return html`\n <div class=\"relative\">\n <ix-icon-button class=\"blue-icon\" @click=${() => this.toggleDrawer()}>\n <slot name=\"icon\" slot=\"default\"></slot>\n </ix-icon-button>\n ${this.renderUnReadCountText()}\n </div>\n <confirmation-dialog\n ?open=${this.showMarkAllReadConfirmation}\n @confirm-dialog-closed=${() => {\n this.showMarkAllReadConfirmation = false;\n }}\n @on-confirm-selection=${this.confirmedMarkAllRead}\n textMessage=\"Are you sure you want to mark all notifications as read?\"\n >\n </confirmation-dialog>\n <ix-drawer\n ?isVisible=${this.showDrawer}\n .onClosed=${() => this.toggleDrawer()}\n animate-vertical\n hide-close\n @on-content-scroll=${this.handleContentScroll}\n @click=${this.manageFilterVisibility}\n >\n <div class=\"flex flex-row justify-between grow py-2\" slot=\"header\">\n <h2 class=\"grow items-center notification-header\">Notifications</h2>\n <div class=\"flex flex-row justify-end grow items-center options\">\n <ix-icon-button\n @click=${this.markAllread}\n icon=\"markunread_mailbox\"\n class=\"blue-icon\"\n ></ix-icon-button>\n <ix-icon-button\n @click=${this.toggleGroupView}\n icon=\"sort\"\n class=\"blue-icon\"\n ></ix-icon-button>\n <ix-icon-button\n @click=${this.displayFilters}\n icon=\"list\"\n class=\"blue-icon\"\n id=\"group-filter-button\"\n ></ix-icon-button>\n <div\n class=\"filter-dropdown-content ${this.showFilters\n ? 'active z-50'\n : ''}\"\n >\n <group-filters></group-filters>\n </div>\n <ix-icon-button\n @click=${this.displayDateFilters}\n icon=\"calendar_month\"\n class=\"blue-icon\"\n id=\"date-filters-button\"\n ></ix-icon-button>\n <div\n class=\"datefilter-dropdown-content ${this.showDateFilters\n ? 'active z-50'\n : ''}\"\n @on-selection=${this.handleCloseClick}\n >\n <date-filters></date-filters>\n </div>\n </div>\n </div>\n <div slot=\"content\">\n ${this.showGroupedView\n ? this.renderGroupedView()\n : this.renderDefaultView()}\n </div> \n </ix-drawer>\n `;\n }\n}\n"]}
1	+ {"version":3,"file":"IxNotifications.js","sourceRoot":"","sources":["../src/IxNotifications.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { differenceInDays, differenceInHours } from 'date-fns';\nimport { TWStyles } from './tw.js';\nimport '@digital-realty/ix-button/ix-button.js';\nimport '@digital-realty/ix-drawer/ix-drawer.js';\nimport '@digital-realty/ix-icon';\nimport '@material/web/icon/icon.js';\nimport { NotificationsState } from './state/NotificationState.js';\nimport { ApiCallResult, Notification } from './models/notification.js';\nimport {\n ConfirmationDialogEventDetail,\n FilterDialogEventDetail,\n} from './constants/notification-types.js';\nimport {\n ApiCallState,\n NotificationGroups,\n NotificationStatus,\n} from './constants/notifications.js';\nimport './components/notifications/notification-item.js';\nimport './components/notifications/grouped-item.js';\nimport './components/notifications/group-filters.js';\nimport './components/notifications/date-filters.js';\nimport './components/notifications/confirmation-dialog.js';\nimport { NotificationsStyle } from './styles/notifications-style.js';\n\nexport class IxNotifications extends MobxLitElement {\n static styles = [TWStyles, NotificationsStyle];\n\n @query('group-filters') groupFilters!: HTMLElement;\n\n @query('ix-icon-button#group-filter-button') groupFiltersButton!: HTMLElement;\n\n @query('date-filters') dateFilters!: HTMLElement;\n\n @query('ix-icon-button#date-filters-button') dateFiltersButton!: HTMLElement;\n\n @state() private showDrawer = false;\n\n @state() private showGroupedView = false;\n\n @state() private showFilters = false;\n\n @state() private showDateFilters = false;\n\n @state() private showMarkAllReadConfirmation = false;\n\n @property({ type: String }) baseApiUrl = '';\n\n @property({ type: String }) localStorageKey = '';\n\n async firstUpdated() { \n // Construct ApiClient form baseApiUrl and localStorageKey\n NotificationsState.baseApiUrl = this.baseApiUrl;\n NotificationsState.localStorageKey = this.localStorageKey;\n NotificationsState.ConstructApiClient();\n }\n\n connectedCallback() {\n super.connectedCallback();\n window.addEventListener(\n 'account-switched',\n NotificationsState.NewApiClient\n );\n window.addEventListener('beforeunload', this.handleOnbeforeunload);\n }\n\n disconnectedCallback() {\n window.removeEventListener(\n 'account-switched',\n NotificationsState.NewApiClient\n );\n window.removeEventListener('beforeunload', this.handleOnbeforeunload);\n super.disconnectedCallback();\n }\n\n //Handle browser refresh event\n handleOnbeforeunload(event : any){ \n NotificationsState.clearStoredNotificationsData();\n }\n\n toggleDrawer() {\n this.showDrawer = !this.showDrawer;\n if (!this.showDrawer) {\n this.showFilters = false;\n this.showDateFilters = false;\n }\n }\n\n /* eslint-disable-next-line /\n renderUnReadCountText() {\n if (NotificationsState.unreadNotificationCount <= 0) {\n return html`${nothing}`;\n }\n\n let unreadCountText = '';\n if (NotificationsState.unreadNotificationCount > 99) {\n unreadCountText = '99+';\n } else {\n unreadCountText = NotificationsState.unreadNotificationCount.toString();\n }\n\n return html` <div\n class=\"unread rounded-full text-center text-white text-sm absolute icon-position -start-0\"\n >\n ${unreadCountText}\n </div>`;\n }\n\n markAllread() {\n this.showMarkAllReadConfirmation = true;\n }\n\n private confirmedMarkAllRead(e: CustomEvent<ConfirmationDialogEventDetail>) {\n // Mark All read if Confirmed True\n if (e.detail.returnValue) {\n const filterNotification = this.applyNotificationFilters();\n const unreadItems = filterNotification?.filter(item => item.status === NotificationStatus.UNREAD);\n\n if(unreadItems.length > 0) {\n let allResultSuccesful = true;\n\n filterNotification?.forEach(item => {\n NotificationsState.setNotificationReadStatus(item.id).then((result : any) => \n { \n if(allResultSuccesful)\n allResultSuccesful = result;\n });\n });\n\n const apiResult = { State : allResultSuccesful === true? ApiCallState.SUCCESS : ApiCallState.ERROR,\n Message : allResultSuccesful === true? \"Successfully marked all the notifications as read\" : \"Error occurred while marking the notifications as read, Please try again\"\n } as ApiCallResult;\n\n this.showResultMessage(apiResult,unreadItems[0].id);\n\n this.renderUnReadCountText();\n\n this.requestUpdate();\n }\n }\n\n this.showMarkAllReadConfirmation = false;\n }\n\n private showResultMessage(result: ApiCallResult, id: string )\n { \n window.dispatchEvent(\n new CustomEvent(\"add-toast\", { detail: {\n id,\n content: html`\n <ix-message-toast toastId=${id} .TMessageToast=${result.State.toLowerCase()} forceClose> \n ${result.Message}\n </ix-message-toast>`,\n autoClose: 3000,\n durationOut: 3000,\n vertical: 'bottom',\n horizontal: 'center',\n animated: true, \n above: false,\n } })\n );\n }\n\n toggleGroupView() {\n this.showGroupedView = !this.showGroupedView;\n }\n\n displayFilters() {\n this.showFilters = !this.showFilters;\n }\n\n / eslint-disable-next-line /\n applyNotificationFilters() {\n const filterredNotifications = NotificationsState.notifications?.filter(\n (x: Notification) =>\n (x.resourceType === NotificationGroups.PLANNED_MAINTENANCE &&\n NotificationsState.notificationFilters.SHOW_PLANNED_MAINTENANCE ===\n true) \|\|\n (x.resourceType === NotificationGroups.SERVICE_TICKETS &&\n NotificationsState.notificationFilters.SHOW_SERVICE_TICKETS ===\n true) \|\|\n (x.resourceType === NotificationGroups.DCIM_ALERTS &&\n NotificationsState.notificationFilters.SHOW_DCIM_ALERTS === true) \|\|\n x.resourceType === NotificationGroups.INCIDENTS\n ); // Always display incidents\n\n if (\n NotificationsState.dateFilters.FROM_DATE === undefined &&\n NotificationsState.dateFilters.TO_DATE === undefined\n )\n return filterredNotifications;\n\n if ( NotificationsState.dateFilters.FROM_DATE === undefined)\n return filterredNotifications.filter(\n x => differenceInDays(\n new Date(x.createdAt),\n NotificationsState.dateFilters.TO_DATE!\n ) <= 0\n );\n \n if ( NotificationsState.dateFilters.TO_DATE === undefined)\n return filterredNotifications.filter(\n x =>\n differenceInHours(\n new Date(x.createdAt),\n NotificationsState.dateFilters.FROM_DATE!\n ) >= 0); \n\n return filterredNotifications.filter(\n x =>\n differenceInHours(\n new Date(x.createdAt),\n NotificationsState.dateFilters.FROM_DATE!\n ) >= 0 &&\n differenceInDays(\n new Date(x.createdAt),\n NotificationsState.dateFilters.TO_DATE!\n ) <= 0\n );\n }\n\n displayDateFilters() {\n this.showDateFilters = !this.showDateFilters;\n }\n\n renderGroupedView() {\n const filteredNotifications = this.applyNotificationFilters();\n\n return html`<div style=\"margin:0px\">\n <grouped-item\n groupTitle=${NotificationGroups.PLANNED_MAINTENANCE}\n iconName=\"lab_profile\"\n .childItems=${filteredNotifications?.filter(\n item => item.resourceType === NotificationGroups.PLANNED_MAINTENANCE\n )}\n ></grouped-item>\n <grouped-item\n groupTitle=${NotificationGroups.INCIDENTS}\n iconName=\"emergency_home\"\n .childItems=${filteredNotifications?.filter(\n item => item.resourceType === NotificationGroups.INCIDENTS\n )}\n ></grouped-item>\n <grouped-item\n groupTitle=${NotificationGroups.SERVICE_TICKETS}\n iconName=\"dvr\"\n .childItems=${filteredNotifications?.filter(\n item => item.resourceType === NotificationGroups.SERVICE_TICKETS\n )}\n ></grouped-item>\n <grouped-item\n groupTitle=${NotificationGroups.DCIM_ALERTS}\n iconName=\"public\"\n .childItems=${filteredNotifications?.filter(\n item => item.resourceType === NotificationGroups.DCIM_ALERTS\n )}\n ></grouped-item> \n </div>`;\n }\n\n renderDefaultView() {\n const filterNotification = this.applyNotificationFilters();\n const filterTodayItems = filterNotification.filter(\n x => differenceInDays(x.createdAt, new Date()) === 0\n );\n const filterEarlierItems = filterNotification.filter(\n x => differenceInDays(x.createdAt, new Date()) !== 0\n );\n\n if (filterNotification?.length! > 0) {\n return html` <h3 class=\"grow\">Latest</h3>\n <div class=\"m-0 p-0\">\n ${filterTodayItems.length > 0\n ? filterTodayItems?.map(\n item => html`<notification-item\n .notificaiton=${item}\n ?disabled=${item.resourceType ===\n NotificationGroups.INCIDENTS}\n >\n </notification-item> `\n )\n : this.renderNoResult()}\n </div>\n <h3 class=\"grow\">Earlier</h3>\n <div>\n ${filterEarlierItems.length > 0\n ? filterEarlierItems?.map(\n item => html`<notification-item\n .notificaiton=${item}\n ?disabled=${item.resourceType ===\n NotificationGroups.INCIDENTS}\n >\n </notification-item> `\n )\n : this.renderNoResult()}\n </div>`;\n }\n\n return html`<p class=\"empty\">No notifications yet.</p>`;\n }\n\n / eslint-disable-next-line */\n renderNoResult() {\n return html`<p class=\"empty\">No notifications yet.</p>`;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n handleCloseClick(_e: CustomEvent<FilterDialogEventDetail>) {\n this.showDateFilters = false;\n this.showFilters = false;\n }\n\n // eslint-disable-next-line\n handleContentScroll(e: CustomEvent) {\n // when scrollbar at the end, retrieve next page\n if (\n e !== null &&\n e.detail.scrollTop + e.detail.clientHeight >= e.detail.scrollHeight\n ) {\n NotificationsState.getNotifications();\n }\n }\n\n manageFilterVisibility(e: Event) {\n const path = e.composedPath();\n if (\n this.showFilters &&\n !path.includes(this.groupFilters) &&\n !path.includes(this.groupFiltersButton)\n ) {\n this.showFilters = false;\n }\n if (\n this.showDateFilters &&\n !path.includes(this.dateFilters) &&\n !path.includes(this.dateFiltersButton)\n ) {\n this.showDateFilters = false;\n }\n }\n\n render() {\n return html`\n <div class=\"relative\">\n <ix-icon-button class=\"blue-icon\" @click=${() => this.toggleDrawer()}>\n <slot name=\"icon\" slot=\"default\"></slot>\n </ix-icon-button>\n ${this.renderUnReadCountText()}\n </div>\n <confirmation-dialog\n ?open=${this.showMarkAllReadConfirmation}\n @confirm-dialog-closed=${() => {\n this.showMarkAllReadConfirmation = false;\n }}\n @on-confirm-selection=${this.confirmedMarkAllRead}\n textMessage=\"Are you sure you want to mark all notifications as read?\"\n >\n </confirmation-dialog>\n <ix-drawer\n ?isVisible=${this.showDrawer}\n .onClosed=${() => this.toggleDrawer()}\n animate-vertical\n hide-close\n @on-content-scroll=${this.handleContentScroll}\n @click=${this.manageFilterVisibility}\n >\n <div class=\"flex flex-row justify-between grow py-2\" slot=\"header\">\n <h2 class=\"grow items-center notification-header\">Notifications</h2>\n <div class=\"flex flex-row justify-end grow items-center options\">\n <ix-icon-button\n @click=${this.markAllread}\n icon=\"markunread_mailbox\"\n class=\"blue-icon\"\n ></ix-icon-button>\n <ix-icon-button\n @click=${this.toggleGroupView}\n icon=\"sort\"\n class=\"blue-icon\"\n ></ix-icon-button>\n <ix-icon-button\n @click=${this.displayFilters}\n icon=\"list\"\n class=\"blue-icon\"\n id=\"group-filter-button\"\n ></ix-icon-button>\n <div\n class=\"filter-dropdown-content ${this.showFilters\n ? 'active z-50'\n : ''}\"\n >\n <group-filters></group-filters>\n </div>\n <ix-icon-button\n @click=${this.displayDateFilters}\n icon=\"calendar_month\"\n class=\"blue-icon\"\n id=\"date-filters-button\"\n ></ix-icon-button>\n <div\n class=\"datefilter-dropdown-content ${this.showDateFilters\n ? 'active z-50'\n : ''}\"\n @on-selection=${this.handleCloseClick}\n >\n <date-filters></date-filters>\n </div>\n </div>\n </div>\n <div slot=\"content\">\n ${this.showGroupedView\n ? this.renderGroupedView()\n : this.renderDefaultView()}\n </div> \n </ix-drawer>\n `;\n }\n}\n"]}

package/dist/components/notifications/date-filters.js CHANGED Viewed

@@ -13,13 +13,14 @@ import { TWStyles } from '../../tw.js';
 import { NotificationsState } from '../../state/NotificationState.js';
 import { NotificationsStyle } from '../../styles/notifications-style.js';
 import { DefaultDateFormat } from '../../constants/notifications.js';
+import { isNullOrUndefinedOrEmpty } from '../../helper/common.js';
 let DateFilters = class DateFilters extends MobxLitElement {
     constructor() {
         super(...arguments);
-        this.fromDate = format(NotificationsState.dateFilters.FROM_DATE, DefaultDateFormat) ||
-            undefined;
-        this.toDate = format(NotificationsState.dateFilters.TO_DATE, DefaultDateFormat) ||
-            undefined;
+        this.fromDate = !isNullOrUndefinedOrEmpty(NotificationsState.dateFilters.FROM_DATE) ?
+            format(NotificationsState.dateFilters.FROM_DATE, DefaultDateFormat) : undefined;
+        this.toDate = !isNullOrUndefinedOrEmpty(NotificationsState.dateFilters.TO_DATE) ?
+            format(NotificationsState.dateFilters.TO_DATE, DefaultDateFormat) : undefined;
         this.maxDate = format(new Date(), DefaultDateFormat);
         this.fromDateErrorText = '';
         this.toDateErrorText = '';
@@ -106,7 +107,7 @@ let DateFilters = class DateFilters extends MobxLitElement {
           @click=${this.clearDateFilters}
         >
           <label class="grow text-sm text-right pr-1 cursor-pointer"
-            >Cleare Filter</label
+            >Clear Filter</label
           >
           <ix-icon-button
             appearance="default"

package/dist/components/notifications/date-filters.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"date-filters.js","sourceRoot":"","sources":["../../../src/components/notifications/date-filters.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,kDAAkD,CAAC;AAC1D,OAAO,oCAAoC,CAAC;AAC5C,OAAO,0CAA0C,CAAC;AAClD,OAAO,yBAAyB,CAAC;AACjC,OAAO,4BAA4B,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACzE,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;~~AAI9D~~,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,cAAc;IAAxC;;QAKY,aAAQ,~~GACvB~~,MAAM,CAAC,kBAAkB,CAAC,WAAW,CAAC,SAAU,EAAE,iBAAiB,CAAC~~;YACpE~~,SAAS,CAAC;~~QAEK~~,WAAM,~~GACrB~~,MAAM,CAAC,kBAAkB,CAAC,WAAW,CAAC,OAAQ,EAAE,iBAAiB,CAAC~~;YAClE~~,SAAS,CAAC;~~QAEK~~,YAAO,GAAG,MAAM,CAAC,IAAI,IAAI,EAAE,EAAE,iBAAiB,CAAC,CAAC;QAEhD,sBAAiB,GAAI,EAAE,CAAC;QAExB,oBAAe,GAAI,EAAE,CAAC;IAmJzC,CAAC;~~IAnKC~~,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,kBAAkB,EAAE,SAAS,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;IACjE,CAAC;~~IAgBD~~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~~AA/JU~~;IAAR,KAAK,EAAE;~~6CAEI~~;~~AAEH~~;IAAR,KAAK,EAAE;~~2CAEI~~;~~AAEH~~;IAAR,KAAK,EAAE;4CAAyD;AAExD;IAAR,KAAK,EAAE;sDAAiC;AAEhC;IAAR,KAAK,EAAE;oDAA+B;~~AAjB5B~~,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,~~CAoKvB~~;~~SApKY~~,WAAW","sourcesContent":["import { html } from 'lit';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { customElement, state } from 'lit/decorators.js';\nimport { baseTheme, elementTheme } from '@digital-realty/theme';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-date/ix-date.js';\nimport '@digital-realty/ix-divider/ix-divider.js';\nimport '@digital-realty/ix-icon';\nimport '@material/web/icon/icon.js';\nimport { format } from 'date-fns';\nimport { TWStyles } from '../../tw.js';\nimport { NotificationsState } from '../../state/NotificationState.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\nimport { DefaultDateFormat } from '../../constants/notifications.js';\nimport { FilterDialogEventDetail } from '../../constants/notification-types.js';\n\n@customElement('date-filters')\nexport class DateFilters extends MobxLitElement {\n static get styles() {\n return [NotificationsStyle, baseTheme, elementTheme, TWStyles];\n }\n\n @state() private fromDate? =\n format(NotificationsState.dateFilters.FROM_DATE!, DefaultDateFormat) ~~\|\|\n~~ undefined;\n\n @state() private toDate? =\n format(NotificationsState.dateFilters.TO_DATE!, DefaultDateFormat) ~~\|\|\n~~ undefined;\n\n @state() private maxDate = format(new Date(), DefaultDateFormat);\n\n @state() private fromDateErrorText? = '';\n\n @state() private toDateErrorText? = '';\n\n onFromDateChange(fromDate: string) {\n \n //handling of clear date event of calender\n if(fromDate === null \|\| fromDate === \"\")\n this.fromDate = undefined;\n else\n {\n this.fromDate = fromDate; \n //clear error message \n if(this.fromDate !== undefined)\n this.fromDateErrorText = undefined;\n }\n \n }\n\n onToDateChange(toDate: string) {\n \n //handling of clear date event of calender\n if(toDate === null \|\| toDate === \"\")\n this.toDate = undefined;\n else\n {\n this.toDate = toDate;\n //clear error message \n if(this.toDate !== undefined)\n this.toDateErrorText = undefined;\n }\n }\n\n onApplyDateFilter(selectedvalue: Boolean) { \n if(selectedvalue)\n {\n if (this.toDate === undefined && this.fromDate !== undefined) {\n this.toDateErrorText = \"Please select to date\";\n return;\n }\n\n if (this.fromDate === undefined && this.toDate !== undefined) {\n this.fromDateErrorText = \"Please select from date\";\n return;\n }\n\n if (this.fromDate! > this.toDate!) {\n this.fromDateErrorText = 'From date cannot be later than To date.';\n this.fromDate = undefined;\n return;\n } else {\n this.fromDateErrorText = undefined;\n }\n \n if (this.toDate! < this.fromDate!) {\n this.toDateErrorText = 'To date cannot be earlier than From date.';\n this.toDate = undefined;\n return;\n } else {\n this.toDateErrorText = undefined;\n }\n }\n\n const datesChanged = selectedvalue && this.toDateErrorText === undefined && this.fromDateErrorText === undefined; \n if (datesChanged) {\n NotificationsState.setNotificationDateFilter(this.fromDate, this.toDate);\n this.requestUpdate();\n }\n\n const event = new CustomEvent<FilterDialogEventDetail>('on-selection', {\n detail: { returnValue: datesChanged },\n bubbles: true,\n composed: true,\n });\n this.dispatchEvent(event);\n }\n\n clearDateFilters() {\n this.fromDate = undefined;\n this.toDate = undefined;\n this.fromDateErrorText = undefined;\n this.toDateErrorText = undefined;\n }\n\n /* eslint-disable lit-a11y/click-events-have-key-events */\n render() {\n return html` <div class=\"flex flex-col p-2\">\n <div class=\"flex flex-row text-justify\">\n <div class=\"grow items-center text-xl font-bold text-left p-2\">\n Filter by Date\n </div>\n <div\n class=\"flex flex-row items-center p-2\"\n @click=${this.clearDateFilters}\n >\n <label class=\"grow text-sm text-right pr-1 cursor-pointer\"\n >~~Cleare~~ Filter</label\n >\n <ix-icon-button\n appearance=\"default\"\n icon=\"domain_verification_off\"\n class=\"blue-icon\"\n ></ix-icon-button>\n </div>\n </div>\n <ix-divider class=\"px-2\"></ix-divider>\n <div\n class=\"flex xl:flex-row lg:flex-col md:flex-col sm:flex-col justify-between item-center p-2\"\n >\n <div class=\"p-2\">\n <ix-date\n .value=${this.fromDate}\n max=${this.maxDate}\n label=\"From\"\n name=\"FromDate\"\n .errorText=${this.fromDateErrorText}\n .onChanged=${(e: any) => this.onFromDateChange(e)}\n >\n </ix-date>\n </div>\n <div class=\"p-2\">\n <ix-date\n .value=${this.toDate}\n max=${this.maxDate}\n label=\"To\"\n name=\"ToDate\"\n .errorText=${this.toDateErrorText}\n .onChanged=${(e: any) => this.onToDateChange(e)}\n ></ix-date>\n </div>\n </div>\n <div class=\"flex flex-row justify-between p-2\">\n <ix-button\n type=\"\"\n target=\"\"\n appearance=\"text\"\n @click=\"${() => this.onApplyDateFilter(false)}\"\n >Cancel</ix-button\n >\n <ix-button\n type=\"\"\n target=\"\"\n appearance=\"text\"\n @click=\"${() => this.onApplyDateFilter(true)}\"\n >Filter List</ix-button\n >\n </div>\n </div>`;\n }\n}\n"]}
1	+ {"version":3,"file":"date-filters.js","sourceRoot":"","sources":["../../../src/components/notifications/date-filters.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { customElement, state } from 'lit/decorators.js';\nimport { baseTheme, elementTheme } from '@digital-realty/theme';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-date/ix-date.js';\nimport '@digital-realty/ix-divider/ix-divider.js';\nimport '@digital-realty/ix-icon';\nimport '@material/web/icon/icon.js';\nimport { format } from 'date-fns';\nimport { TWStyles } from '../../tw.js';\nimport { NotificationsState } from '../../state/NotificationState.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\nimport { DefaultDateFormat } from '../../constants/notifications.js';\nimport { FilterDialogEventDetail } from '../../constants/notification-types.js';\nimport { isNullOrUndefinedOrEmpty } from '../../helper/common.js';\n\n@customElement('date-filters')\nexport class DateFilters extends MobxLitElement {\n static get styles() {\n return [NotificationsStyle, baseTheme, elementTheme, TWStyles];\n }\n\n @state() private fromDate? = !isNullOrUndefinedOrEmpty(NotificationsState.dateFilters.FROM_DATE) ?\n format(NotificationsState.dateFilters.FROM_DATE!, DefaultDateFormat) :undefined;\n\n @state() private toDate? = !isNullOrUndefinedOrEmpty(NotificationsState.dateFilters.TO_DATE) ?\n format(NotificationsState.dateFilters.TO_DATE!, DefaultDateFormat) :undefined;\n\n @state() private maxDate = format(new Date(), DefaultDateFormat);\n\n @state() private fromDateErrorText? = '';\n\n @state() private toDateErrorText? = '';\n\n onFromDateChange(fromDate: string) {\n \n //handling of clear date event of calender\n if(fromDate === null \|\| fromDate === \"\")\n this.fromDate = undefined;\n else\n {\n this.fromDate = fromDate; \n //clear error message \n if(this.fromDate !== undefined)\n this.fromDateErrorText = undefined;\n }\n \n }\n\n onToDateChange(toDate: string) {\n \n //handling of clear date event of calender\n if(toDate === null \|\| toDate === \"\")\n this.toDate = undefined;\n else\n {\n this.toDate = toDate;\n //clear error message \n if(this.toDate !== undefined)\n this.toDateErrorText = undefined;\n }\n }\n\n onApplyDateFilter(selectedvalue: Boolean) { \n if(selectedvalue)\n {\n if (this.toDate === undefined && this.fromDate !== undefined) {\n this.toDateErrorText = \"Please select to date\";\n return;\n }\n\n if (this.fromDate === undefined && this.toDate !== undefined) {\n this.fromDateErrorText = \"Please select from date\";\n return;\n }\n\n if (this.fromDate! > this.toDate!) {\n this.fromDateErrorText = 'From date cannot be later than To date.';\n this.fromDate = undefined;\n return;\n } else {\n this.fromDateErrorText = undefined;\n }\n \n if (this.toDate! < this.fromDate!) {\n this.toDateErrorText = 'To date cannot be earlier than From date.';\n this.toDate = undefined;\n return;\n } else {\n this.toDateErrorText = undefined;\n }\n }\n\n const datesChanged = selectedvalue && this.toDateErrorText === undefined && this.fromDateErrorText === undefined; \n if (datesChanged) {\n NotificationsState.setNotificationDateFilter(this.fromDate, this.toDate);\n this.requestUpdate();\n }\n\n const event = new CustomEvent<FilterDialogEventDetail>('on-selection', {\n detail: { returnValue: datesChanged },\n bubbles: true,\n composed: true,\n });\n this.dispatchEvent(event);\n }\n\n clearDateFilters() {\n this.fromDate = undefined;\n this.toDate = undefined;\n this.fromDateErrorText = undefined;\n this.toDateErrorText = undefined;\n }\n\n /* eslint-disable lit-a11y/click-events-have-key-events */\n render() {\n return html` <div class=\"flex flex-col p-2\">\n <div class=\"flex flex-row text-justify\">\n <div class=\"grow items-center text-xl font-bold text-left p-2\">\n Filter by Date\n </div>\n <div\n class=\"flex flex-row items-center p-2\"\n @click=${this.clearDateFilters}\n >\n <label class=\"grow text-sm text-right pr-1 cursor-pointer\"\n >Clear Filter</label\n >\n <ix-icon-button\n appearance=\"default\"\n icon=\"domain_verification_off\"\n class=\"blue-icon\"\n ></ix-icon-button>\n </div>\n </div>\n <ix-divider class=\"px-2\"></ix-divider>\n <div\n class=\"flex xl:flex-row lg:flex-col md:flex-col sm:flex-col justify-between item-center p-2\"\n >\n <div class=\"p-2\">\n <ix-date\n .value=${this.fromDate}\n max=${this.maxDate}\n label=\"From\"\n name=\"FromDate\"\n .errorText=${this.fromDateErrorText}\n .onChanged=${(e: any) => this.onFromDateChange(e)}\n >\n </ix-date>\n </div>\n <div class=\"p-2\">\n <ix-date\n .value=${this.toDate}\n max=${this.maxDate}\n label=\"To\"\n name=\"ToDate\"\n .errorText=${this.toDateErrorText}\n .onChanged=${(e: any) => this.onToDateChange(e)}\n ></ix-date>\n </div>\n </div>\n <div class=\"flex flex-row justify-between p-2\">\n <ix-button\n type=\"\"\n target=\"\"\n appearance=\"text\"\n @click=\"${() => this.onApplyDateFilter(false)}\"\n >Cancel</ix-button\n >\n <ix-button\n type=\"\"\n target=\"\"\n appearance=\"text\"\n @click=\"${() => this.onApplyDateFilter(true)}\"\n >Filter List</ix-button\n >\n </div>\n </div>`;\n }\n}\n"]}

package/dist/components/notifications/group-filters.js CHANGED Viewed

@@ -42,7 +42,7 @@ let GroupFilters = class GroupFilters extends MobxLitElement {
       <div class="ix-switch-wrapper">
         <ix-switch
           name=${NotificationGroups.PLANNED_MAINTENANCE}
-          selected=${NotificationsState.notificationFilters
+          .selected=${NotificationsState.notificationFilters
             .SHOW_PLANNED_MAINTENANCE}
           @change=${this.onSwitchChange}
         ></ix-switch>
@@ -51,7 +51,7 @@ let GroupFilters = class GroupFilters extends MobxLitElement {
       <div class="ix-switch-wrapper">
         <ix-switch
           name=${NotificationGroups.SERVICE_TICKETS}
-          selected=${NotificationsState.notificationFilters
+          .selected=${NotificationsState.notificationFilters
             .SHOW_SERVICE_TICKETS}
           @change=${this.onSwitchChange}
         ></ix-switch>
@@ -60,7 +60,7 @@ let GroupFilters = class GroupFilters extends MobxLitElement {
       <div class="ix-switch-wrapper">
         <ix-switch
           name=${NotificationGroups.DCIM_ALERTS}
-          selected=${NotificationsState.notificationFilters.SHOW_DCIM_ALERTS}
+          .selected=${NotificationsState.notificationFilters.SHOW_DCIM_ALERTS}
           @change=${this.onSwitchChange}
         ></ix-switch>
         <label class="pl-1">${NotificationGroups.DCIM_ALERTS}</label>

package/dist/components/notifications/group-filters.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"group-filters.js","sourceRoot":"","sources":["../../../src/components/notifications/group-filters.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,kDAAkD,CAAC;AAC1D,OAAO,wCAAwC,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAGlE,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,cAAc;IAC9C,MAAM,KAAK,MAAM;QACf,OAAO;YACL,kBAAkB;YAClB,QAAQ;YACR,GAAG,CAAA;;;;;;;;;;;;;;OAcF;SACF,CAAC;IACJ,CAAC;IAED,cAAc,CAAC,CAAQ;;QACrB,MAAM,MAAM,GAAG,CAAC,CAAC,MAAa,CAAC;QAC/B,MAAM,SAAS,GAAG,MAAA,MAAM,CAAC,UAAU,CAAC,YAAY,CAAC,MAAM,CAAC,0CAAE,KAAK,CAAC;QAEhE,kBAAkB,CAAC,qBAAqB,CAAC,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;QACrE,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;iBAGE,kBAAkB,CAAC,mBAAmB;~~qBAClC~~,kBAAkB,CAAC,mBAAmB;~~aAC9C~~,wBAAwB;oBACjB,IAAI,CAAC,cAAc;;8BAET,kBAAkB,CAAC,mBAAmB;;;;iBAInD,kBAAkB,CAAC,eAAe;~~qBAC9B~~,kBAAkB,CAAC,mBAAmB;~~aAC9C~~,oBAAoB;oBACb,IAAI,CAAC,cAAc;;8BAET,kBAAkB,CAAC,eAAe;;;;iBAI/C,kBAAkB,CAAC,WAAW;~~qBAC1B~~,kBAAkB,CAAC,mBAAmB,CAAC,gBAAgB;~~oBACxD~~,IAAI,CAAC,cAAc;;8BAET,kBAAkB,CAAC,WAAW;;WAEjD,CAAC;IACV,CAAC;CACF,CAAA;AA7DY,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CA6DxB;SA7DY,YAAY","sourcesContent":["import { html, css } from 'lit';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { customElement } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-switch/ix-switch.js';\nimport { TWStyles } from '../../tw.js';\nimport { NotificationsState } from '../../state/NotificationState.js';\nimport { NotificationGroups } from '../../constants/notifications.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\n\n@customElement('group-filters')\nexport class GroupFilters extends MobxLitElement {\n static get styles() {\n return [\n NotificationsStyle,\n TWStyles,\n css`\n :host {\n --md-switch-state-layer-size: 1rem;\n --md-switch-hover-handle-width: 1rem;\n --md-switch-hover-handle-height: 1rem;\n --md-switch-pressed-handle-width: 1rem;\n --md-switch-pressed-handle-height: 1rem;\n --md-switch-selected-handle-width: 1.3rem;\n --md-switch-selected-handle-height: 1.3rem;\n --md-switch-handle-width: 0.5rem;\n --md-switch-handle-height: 0.5rem;\n --md-switch-track-width: 2.5rem;\n --md-switch-track-height: 1rem;\n }\n `,\n ];\n }\n\n onSwitchChange(e: Event) {\n const target = e.target as any;\n const groupName = target.attributes.getNamedItem('name')?.value;\n\n NotificationsState.setNotificationFilter(groupName, target.selected);\n this.requestUpdate();\n }\n\n render() {\n return html` <div class=\"flex flex-col items-start p-2\">\n <div class=\"ix-switch-wrapper\">\n <ix-switch\n name=${NotificationGroups.PLANNED_MAINTENANCE}\n selected=${NotificationsState.notificationFilters\n .SHOW_PLANNED_MAINTENANCE}\n @change=${this.onSwitchChange}\n ></ix-switch>\n <label class=\"pl-1\">${NotificationGroups.PLANNED_MAINTENANCE}</label>\n </div>\n <div class=\"ix-switch-wrapper\">\n <ix-switch\n name=${NotificationGroups.SERVICE_TICKETS}\n selected=${NotificationsState.notificationFilters\n .SHOW_SERVICE_TICKETS}\n @change=${this.onSwitchChange}\n ></ix-switch>\n <label class=\"pl-1\">${NotificationGroups.SERVICE_TICKETS}</label>\n </div>\n <div class=\"ix-switch-wrapper\">\n <ix-switch\n name=${NotificationGroups.DCIM_ALERTS}\n selected=${NotificationsState.notificationFilters.SHOW_DCIM_ALERTS}\n @change=${this.onSwitchChange}\n ></ix-switch>\n <label class=\"pl-1\">${NotificationGroups.DCIM_ALERTS}</label>\n </div>\n </div>`;\n }\n}\n"]}
1	+ {"version":3,"file":"group-filters.js","sourceRoot":"","sources":["../../../src/components/notifications/group-filters.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,kDAAkD,CAAC;AAC1D,OAAO,wCAAwC,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAGlE,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,cAAc;IAC9C,MAAM,KAAK,MAAM;QACf,OAAO;YACL,kBAAkB;YAClB,QAAQ;YACR,GAAG,CAAA;;;;;;;;;;;;;;OAcF;SACF,CAAC;IACJ,CAAC;IAED,cAAc,CAAC,CAAQ;;QACrB,MAAM,MAAM,GAAG,CAAC,CAAC,MAAa,CAAC;QAC/B,MAAM,SAAS,GAAG,MAAA,MAAM,CAAC,UAAU,CAAC,YAAY,CAAC,MAAM,CAAC,0CAAE,KAAK,CAAC;QAEhE,kBAAkB,CAAC,qBAAqB,CAAC,SAAS,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;QACrE,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;iBAGE,kBAAkB,CAAC,mBAAmB;sBACjC,kBAAkB,CAAC,mBAAmB;aAC/C,wBAAwB;oBACjB,IAAI,CAAC,cAAc;;8BAET,kBAAkB,CAAC,mBAAmB;;;;iBAInD,kBAAkB,CAAC,eAAe;sBAC7B,kBAAkB,CAAC,mBAAmB;aAC/C,oBAAoB;oBACb,IAAI,CAAC,cAAc;;8BAET,kBAAkB,CAAC,eAAe;;;;iBAI/C,kBAAkB,CAAC,WAAW;sBACzB,kBAAkB,CAAC,mBAAmB,CAAC,gBAAgB;oBACzD,IAAI,CAAC,cAAc;;8BAET,kBAAkB,CAAC,WAAW;;WAEjD,CAAC;IACV,CAAC;CACF,CAAA;AA7DY,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CA6DxB;SA7DY,YAAY","sourcesContent":["import { html, css } from 'lit';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { customElement } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-switch/ix-switch.js';\nimport { TWStyles } from '../../tw.js';\nimport { NotificationsState } from '../../state/NotificationState.js';\nimport { NotificationGroups } from '../../constants/notifications.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\n\n@customElement('group-filters')\nexport class GroupFilters extends MobxLitElement {\n static get styles() {\n return [\n NotificationsStyle,\n TWStyles,\n css`\n :host {\n --md-switch-state-layer-size: 1rem;\n --md-switch-hover-handle-width: 1rem;\n --md-switch-hover-handle-height: 1rem;\n --md-switch-pressed-handle-width: 1rem;\n --md-switch-pressed-handle-height: 1rem;\n --md-switch-selected-handle-width: 1.3rem;\n --md-switch-selected-handle-height: 1.3rem;\n --md-switch-handle-width: 0.5rem;\n --md-switch-handle-height: 0.5rem;\n --md-switch-track-width: 2.5rem;\n --md-switch-track-height: 1rem;\n }\n `,\n ];\n }\n\n onSwitchChange(e: Event) {\n const target = e.target as any;\n const groupName = target.attributes.getNamedItem('name')?.value;\n\n NotificationsState.setNotificationFilter(groupName, target.selected);\n this.requestUpdate();\n }\n\n render() {\n return html` <div class=\"flex flex-col items-start p-2\">\n <div class=\"ix-switch-wrapper\">\n <ix-switch\n name=${NotificationGroups.PLANNED_MAINTENANCE}\n .selected=${NotificationsState.notificationFilters\n .SHOW_PLANNED_MAINTENANCE}\n @change=${this.onSwitchChange}\n ></ix-switch>\n <label class=\"pl-1\">${NotificationGroups.PLANNED_MAINTENANCE}</label>\n </div>\n <div class=\"ix-switch-wrapper\">\n <ix-switch\n name=${NotificationGroups.SERVICE_TICKETS}\n .selected=${NotificationsState.notificationFilters\n .SHOW_SERVICE_TICKETS}\n @change=${this.onSwitchChange}\n ></ix-switch>\n <label class=\"pl-1\">${NotificationGroups.SERVICE_TICKETS}</label>\n </div>\n <div class=\"ix-switch-wrapper\">\n <ix-switch\n name=${NotificationGroups.DCIM_ALERTS}\n .selected=${NotificationsState.notificationFilters.SHOW_DCIM_ALERTS}\n @change=${this.onSwitchChange}\n ></ix-switch>\n <label class=\"pl-1\">${NotificationGroups.DCIM_ALERTS}</label>\n </div>\n </div>`;\n }\n}\n"]}

package/dist/components/notifications/view-item-dialog.js CHANGED Viewed

@@ -48,41 +48,43 @@ let ViewItemDialog = class ViewItemDialog extends MobxLitElement {
     render() {
         return html ` <ix-dialog
       ?open=${this.open}
-      class="w-[480px]"
+      class="w-[420px]"
       @closed=${this.dialogClosed}
     >
-      <div class="flex flex-col  px-16" slot="headline">
-        <label class="text-xl font-bold w-[480px] py-2">
-          ${this.notificaiton.resourceType}
-        </label>
-        <label class="text-sm font-bold w-[480px] py-2">
-          ${this.notificaiton.subGroup}
-        </label>
+      <div  slot="headline" class="px-8">
+        <div class="flex flex-col flex-start">
+          <div class="text-xl font-bold py-2 text-balance">
+            ${this.notificaiton.resourceType}
+          </div>
+          <div class="text-sm font-bold py-2 text-balance">
+            ${this.notificaiton.subGroup}
+          </div>
+        </div>
       </div>
       <form
-        class="w-[480px]  px-16"
+        class="px-8"
         slot="content"
         id="form-id"
         method="dialog"
       >
         <div class="flex flex-row py-1">
-          <div class="py-1 w-[100px]">Subject</div>
-          <div class="grow py-1 pl-11 font-semibold">
+          <div class="w-[100px] block">Subject</div>
+          <div class="w-[280px] font-semibold text-wrap flex flex-start">
             ${this.notificaiton.subject}
           </div>
         </div>
         <div class="flex flex-row py-1">
-          <div class="py-1 w-[100px]">Create Date</div>
-          <div class="grow py-1 pl-11 font-semibold">
+          <div class="w-[100px] block">Create Date</div>
+          <div class="w-[280px] font-semibold flex">
             ${format(this.notificaiton.createdAt, 'dd/MM/yyyy HH:mm:ss')}
           </div>
         </div>
         <div class="flex flex-row py-1">
-          <div class="py-1 w-[100px]">Site</div>
-          <div class="grow py-1 pl-11 font-semibold">${this.getLocation()}</div>
+          <div class="w-[100px] block">Site</div>
+          <div class="font-semibold">${this.getLocation()}</div>
         </div>
       </form>
-      <div slot="actions" class="flex flex-row flex-end px-16 py-8">
+      <div slot="actions" class="flex flex-row flex-end px-8 py-8">
         <button form="form-id" class="modal-text-blue">CLOSE</button>
         <a href=${this.getUrl()} class="modal-text-blue">VIEW RECORD</a>
       </div>

package/dist/components/notifications/view-item-dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"view-item-dialog.js","sourceRoot":"","sources":["../../../src/components/notifications/view-item-dialog.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,kDAAkD,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAGlE,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,cAAc;IAA3C;;QAKyC,iBAAY,GACxD,EAAkB,CAAC;QAEyB,SAAI,GAAG,KAAK,CAAC;QAgC3D,iBAAY,GAAG,GAAG,EAAE;YAClB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,yBAAyB,CAAC,CAAC,CAAC;QACjE,CAAC,CAAC;~~IA6CJ~~,CAAC;~~IAtFC~~,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,kBAAkB,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;IACtD,CAAC;IAOD,MAAM;QACJ,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC;QAEtC,QAAQ,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE;YACtC,KAAK,kBAAkB,CAAC,mBAAmB;gBACzC,OAAO,2CAA2C,QAAQ,EAAE,CAAC;YAC/D,KAAK,kBAAkB,CAAC,eAAe;gBACrC,OAAO,uCAAuC,QAAQ,EAAE,CAAC;YAC3D,KAAK,kBAAkB,CAAC,SAAS;gBAC/B,OAAO,iCAAiC,QAAQ,EAAE,CAAC;YACrD,KAAK,kBAAkB,CAAC,WAAW;gBACjC,OAAO,SAAS,QAAQ,EAAE,CAAC;YAC7B;gBACE,OAAO,EAAE,CAAC;SACb;IACH,CAAC;IAED,WAAW;QACT,IACE,IAAI,CAAC,YAAY,CAAC,SAAS,KAAK,SAAS;YACzC,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EACtC;YACA,OAAO,EAAE,CAAC;SACX;QACD,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;YAC1C,OAAO,oBAAoB,CAAC;SAC7B;QACD,OAAO,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IACxC,CAAC;IAMD,MAAM;QACJ,OAAO,IAAI,CAAA;cACD,IAAI,CAAC,IAAI;;gBAEP,IAAI,CAAC,YAAY~~;;;;YAIrB~~,IAAI,CAAC,YAAY,CAAC,YAAY;;;~~YAG9B~~,IAAI,CAAC,YAAY,CAAC,QAAQ~~;;;;;;;;;;;;cAYxB~~,IAAI,CAAC,YAAY,CAAC,OAAO;;;;;;cAMzB,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,qBAAqB,CAAC;;;;;~~uDAKjB~~,IAAI,CAAC,WAAW,EAAE;;;;;~~kBAKvD~~,IAAI,CAAC,MAAM,EAAE;;iBAEd,CAAC;IAChB,CAAC;CACF,CAAA;~~AAlF~~+C;IAA7C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;oDACxB;AAEyB;IAA7C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;4CAAc;AARhD,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,~~CAuF1B~~;~~SAvFY~~,cAAc","sourcesContent":["import { html } from 'lit';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { customElement, property } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport { elementTheme } from '@digital-realty/theme';\nimport { format } from 'date-fns';\nimport { TWStyles } from '../../tw.js';\nimport { Notification } from '../../models/notification.js';\nimport { NotificationGroups } from '../../constants/notifications.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\n\n@customElement('view-item-dialog')\nexport class ViewItemDialog extends MobxLitElement {\n static get styles() {\n return [NotificationsStyle, elementTheme, TWStyles];\n }\n\n @property({ type: Object, attribute: false }) notificaiton =\n {} as Notification;\n\n @property({ type: Boolean, attribute: true }) open = false;\n\n getUrl(): string {\n const ticketid = this.notificaiton.id;\n\n switch (this.notificaiton.resourceType) {\n case NotificationGroups.PLANNED_MAINTENANCE:\n return `/service-management/planned-maintenance/${ticketid}`;\n case NotificationGroups.SERVICE_TICKETS:\n return `/service-management/service-tickets/${ticketid}`;\n case NotificationGroups.INCIDENTS:\n return `/service-management/incidents/${ticketid}`;\n case NotificationGroups.DCIM_ALERTS:\n return `/dcim/${ticketid}`;\n default:\n return '';\n }\n }\n\n getLocation() {\n if (\n this.notificaiton.locations === undefined \|\|\n this.notificaiton.locations.length < 1\n ) {\n return '';\n }\n if (this.notificaiton.locations.length > 1) {\n return 'Multiple Locations';\n }\n return this.notificaiton.locations[0];\n }\n\n dialogClosed = () => {\n this.dispatchEvent(new CustomEvent('view-item-dialog-closed'));\n };\n\n render() {\n return html` <ix-dialog\n ?open=${this.open}\n class=\"w-[~~480px~~]\"\n @closed=${this.dialogClosed}\n >\n <div class=\"~~flex flex-col~~ px-16\" ~~slot~~=\"~~headline~~\">\n <~~label~~ class=\"text-xl font-bold w-~~[480px]~~ py-2\">\n ${this.notificaiton.resourceType}\n </~~label~~>\n <~~label~~ class=\"text-sm font-bold w-~~[480px]~~ py-2\">\n ${this.notificaiton.subGroup}\n </~~label~~>\n </div>\n <form\n class=\"~~w-[480px]~~ px-16\"\n slot=\"content\"\n id=\"form-id\"\n method=\"dialog\"\n >\n <div class=\"flex flex-row py-1\">\n <div class=\"~~py-1~~ w-[100px]\">Subject</div>\n <div class=\"~~grow~~ py-1 pl-11 ~~font~~-~~semibold~~\">\n ${this.notificaiton.subject}\n </div>\n </div>\n <div class=\"flex flex-row py-1\">\n <div class=\"~~py-1~~ w-[100px]\">Create Date</div>\n <div class=\"~~grow py~~-1 ~~pl-11~~ font-semibold\">\n ${format(this.notificaiton.createdAt, 'dd/MM/yyyy HH:mm:ss')}\n </div>\n </div>\n <div class=\"flex flex-row py-1\">\n <div class=\"~~py-1~~ w-[100px]\">Site</div>\n <div class=\"~~grow py-1 pl-11~~ font-semibold\">${this.getLocation()}</div>\n </div>\n </form>\n <div slot=\"actions\" class=\"flex flex-row flex-end px-16 py-8\">\n <button form=\"form-id\" class=\"modal-text-blue\">CLOSE</button>\n <a href=${this.getUrl()} class=\"modal-text-blue\">VIEW RECORD</a>\n </div>\n </ix-dialog>`;\n }\n}\n"]}
1	+ {"version":3,"file":"view-item-dialog.js","sourceRoot":"","sources":["../../../src/components/notifications/view-item-dialog.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,kDAAkD,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAGlE,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,cAAc;IAA3C;;QAKyC,iBAAY,GACxD,EAAkB,CAAC;QAEyB,SAAI,GAAG,KAAK,CAAC;QAgC3D,iBAAY,GAAG,GAAG,EAAE;YAClB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,yBAAyB,CAAC,CAAC,CAAC;QACjE,CAAC,CAAC;IA+CJ,CAAC;IAxFC,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,kBAAkB,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;IACtD,CAAC;IAOD,MAAM;QACJ,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC;QAEtC,QAAQ,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE;YACtC,KAAK,kBAAkB,CAAC,mBAAmB;gBACzC,OAAO,2CAA2C,QAAQ,EAAE,CAAC;YAC/D,KAAK,kBAAkB,CAAC,eAAe;gBACrC,OAAO,uCAAuC,QAAQ,EAAE,CAAC;YAC3D,KAAK,kBAAkB,CAAC,SAAS;gBAC/B,OAAO,iCAAiC,QAAQ,EAAE,CAAC;YACrD,KAAK,kBAAkB,CAAC,WAAW;gBACjC,OAAO,SAAS,QAAQ,EAAE,CAAC;YAC7B;gBACE,OAAO,EAAE,CAAC;SACb;IACH,CAAC;IAED,WAAW;QACT,IACE,IAAI,CAAC,YAAY,CAAC,SAAS,KAAK,SAAS;YACzC,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EACtC;YACA,OAAO,EAAE,CAAC;SACX;QACD,IAAI,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;YAC1C,OAAO,oBAAoB,CAAC;SAC7B;QACD,OAAO,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IACxC,CAAC;IAMD,MAAM;QACJ,OAAO,IAAI,CAAA;cACD,IAAI,CAAC,IAAI;;gBAEP,IAAI,CAAC,YAAY;;;;;cAKnB,IAAI,CAAC,YAAY,CAAC,YAAY;;;cAG9B,IAAI,CAAC,YAAY,CAAC,QAAQ;;;;;;;;;;;;;cAa1B,IAAI,CAAC,YAAY,CAAC,OAAO;;;;;;cAMzB,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,qBAAqB,CAAC;;;;;uCAKjC,IAAI,CAAC,WAAW,EAAE;;;;;kBAKvC,IAAI,CAAC,MAAM,EAAE;;iBAEd,CAAC;IAChB,CAAC;CACF,CAAA;AApF+C;IAA7C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;oDACxB;AAEyB;IAA7C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;4CAAc;AARhD,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CAyF1B;SAzFY,cAAc","sourcesContent":["import { html } from 'lit';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { customElement, property } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport { elementTheme } from '@digital-realty/theme';\nimport { format } from 'date-fns';\nimport { TWStyles } from '../../tw.js';\nimport { Notification } from '../../models/notification.js';\nimport { NotificationGroups } from '../../constants/notifications.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\n\n@customElement('view-item-dialog')\nexport class ViewItemDialog extends MobxLitElement {\n static get styles() {\n return [NotificationsStyle, elementTheme, TWStyles];\n }\n\n @property({ type: Object, attribute: false }) notificaiton =\n {} as Notification;\n\n @property({ type: Boolean, attribute: true }) open = false;\n\n getUrl(): string {\n const ticketid = this.notificaiton.id;\n\n switch (this.notificaiton.resourceType) {\n case NotificationGroups.PLANNED_MAINTENANCE:\n return `/service-management/planned-maintenance/${ticketid}`;\n case NotificationGroups.SERVICE_TICKETS:\n return `/service-management/service-tickets/${ticketid}`;\n case NotificationGroups.INCIDENTS:\n return `/service-management/incidents/${ticketid}`;\n case NotificationGroups.DCIM_ALERTS:\n return `/dcim/${ticketid}`;\n default:\n return '';\n }\n }\n\n getLocation() {\n if (\n this.notificaiton.locations === undefined \|\|\n this.notificaiton.locations.length < 1\n ) {\n return '';\n }\n if (this.notificaiton.locations.length > 1) {\n return 'Multiple Locations';\n }\n return this.notificaiton.locations[0];\n }\n\n dialogClosed = () => {\n this.dispatchEvent(new CustomEvent('view-item-dialog-closed'));\n };\n\n render() {\n return html` <ix-dialog\n ?open=${this.open}\n class=\"w-[420px]\"\n @closed=${this.dialogClosed}\n >\n <div slot=\"headline\" class=\"px-8\">\n <div class=\"flex flex-col flex-start\">\n <div class=\"text-xl font-bold py-2 text-balance\">\n ${this.notificaiton.resourceType}\n </div>\n <div class=\"text-sm font-bold py-2 text-balance\">\n ${this.notificaiton.subGroup}\n </div>\n </div>\n </div>\n <form\n class=\"px-8\"\n slot=\"content\"\n id=\"form-id\"\n method=\"dialog\"\n >\n <div class=\"flex flex-row py-1\">\n <div class=\"w-[100px] block\">Subject</div>\n <div class=\"w-[280px] font-semibold text-wrap flex flex-start\">\n ${this.notificaiton.subject}\n </div>\n </div>\n <div class=\"flex flex-row py-1\">\n <div class=\"w-[100px] block\">Create Date</div>\n <div class=\"w-[280px] font-semibold flex\">\n ${format(this.notificaiton.createdAt, 'dd/MM/yyyy HH:mm:ss')}\n </div>\n </div>\n <div class=\"flex flex-row py-1\">\n <div class=\"w-[100px] block\">Site</div>\n <div class=\"font-semibold\">${this.getLocation()}</div>\n </div>\n </form>\n <div slot=\"actions\" class=\"flex flex-row flex-end px-8 py-8\">\n <button form=\"form-id\" class=\"modal-text-blue\">CLOSE</button>\n <a href=${this.getUrl()} class=\"modal-text-blue\">VIEW RECORD</a>\n </div>\n </ix-dialog>`;\n }\n}\n"]}

package/dist/helper/common.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare const isNullOrUndefinedOrEmpty: (value: string \| Date \| undefined \| null) => Boolean;

package/dist/helper/common.js ADDED Viewed

@@ -0,0 +1,11 @@
+export const isNullOrUndefinedOrEmpty = (value) => {
+    if (value === null)
+        return true;
+    else if (value === undefined)
+        return true;
+    else if (value === "")
+        return true;
+    else
+        return false;
+};
+//# sourceMappingURL=common.js.map

package/dist/helper/common.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"common.js","sourceRoot":"","sources":["../../src/helper/common.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,KAAwC,EAAY,EAAE;IAC3F,IAAG,KAAK,KAAK,IAAI;QACb,OAAO,IAAI,CAAC;SACX,IAAG,KAAK,KAAK,SAAS;QACvB,OAAO,IAAI,CAAC;SACX,IAAG,KAAM,KAAK,EAAE;QACjB,OAAO,IAAI,CAAC;;QAEZ,OAAO,KAAK,CAAC;AACnB,CAAC,CAAC","sourcesContent":["export const isNullOrUndefinedOrEmpty = (value : string | Date | undefined | null) : Boolean => {\n if(value === null)\n return true;\n else if(value === undefined)\n return true;\n else if(value! === \"\")\n return true;\n else\n return false;\n };"]}