@digital-realty/ix-notifications 1.1.28 → 1.1.30

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.
@@ -8,7 +8,7 @@ import { formatDistance } from 'date-fns/formatDistance.js';
8
8
  import { differenceInHours } from 'date-fns/differenceInHours.js';
9
9
  import { TWStyles } from '../../tw.js';
10
10
  import { NotificationsState } from '../../state/NotificationState.js';
11
- import { NotificationStatus, NotificationGroups, SubGroups } from '../../constants/notifications.js';
11
+ import { NotificationStatus, NotificationGroups, SubGroups, } from '../../constants/notifications.js';
12
12
  import { NotificationsStyle } from '../../styles/notifications-style.js';
13
13
  import './confirmation-dialog.js';
14
14
  import './view-item-dialog.js';
@@ -116,7 +116,7 @@ let NotificationItem = class NotificationItem extends MobxLitElement {
116
116
  case SubGroups.FacilityAccessPermanentBadge:
117
117
  case SubGroups.FacilityAccessOspAccess:
118
118
  case SubGroups.FacilityAccessPopPoeAccess:
119
- return "Facility Access";
119
+ return 'Facility Access';
120
120
  default:
121
121
  return (_b = this.notification) === null || _b === void 0 ? void 0 : _b.subGroup;
122
122
  }
@@ -1 +1 @@
1
- {"version":3,"file":"notification-item.js","sourceRoot":"","sources":["../../../src/components/notifications/notification-item.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\nimport { formatDistance } from 'date-fns/formatDistance.js';\nimport { differenceInHours } from 'date-fns/differenceInHours.js';\nimport { TWStyles } from '../../tw.js';\nimport { NotificationsState } from '../../state/NotificationState.js';\nimport { ApiCallResult, Notification } from '../../models/notification.js';\nimport {\n NotificationStatus,\n NotificationGroups,\n SubGroups\n} from '../../constants/notifications.js';\nimport { ConfirmationDialogEventDetail } from '../../constants/notification-types.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\nimport './confirmation-dialog.js';\nimport './view-item-dialog.js';\nimport '@digital-realty/ix-toast/ix-message-toast.js';\nimport { dcim, plannedMaintenance, trash } from '../../assets/iconset.js';\n\n@customElement('notification-item')\nexport class NotificationItem extends MobxLitElement {\n @property({ type: Boolean }) disabled = false;\n\n @property({ type: Object, attribute: false }) notification =\n {} as Notification;\n\n @state() private showModal = false;\n\n @state() private showDeleteConfirmation = false;\n\n static get styles() {\n return [TWStyles, NotificationsStyle];\n }\n\n displayItem() {\n if (this.notification.status === NotificationStatus.UNREAD) {\n NotificationsState.setNotificationReadStatus(this.notification.id);\n }\n this.showModal = true;\n }\n\n deleteItem() {\n if (!this.disabled) {\n this.showDeleteConfirmation = true;\n }\n }\n\n private confirmedDelete(e: CustomEvent<ConfirmationDialogEventDetail>) {\n // DELETE IF CONFIRMED TRUE\n if (e.detail.returnValue) {\n NotificationsState.setNotificationDeleted(this.notification.id).then(\n (result: ApiCallResult) => {\n this.showDeleteResultMessage(result, this.notification.id);\n }\n );\n }\n this.showDeleteConfirmation = false;\n }\n\n // eslint-disable-next-line class-methods-use-this\n private showDeleteResultMessage(result: ApiCallResult, id: string) {\n window.dispatchEvent(\n new CustomEvent('add-toast', {\n detail: {\n id,\n content: html` <ix-message-toast\n toastId=${id}\n .TMessageToast=${result.State.toLowerCase()}\n forceClose\n >\n ${result.Message}\n </ix-message-toast>`,\n autoClose: 2000,\n durationOut: 2000,\n vertical: 'bottom',\n horizontal: 'center',\n animated: true,\n above: false,\n },\n })\n );\n }\n\n calculateDuration() {\n if (this.notification.createdAt !== undefined) {\n if (\n differenceInHours(new Date(), new Date(this.notification.createdAt)) <\n 24\n )\n return formatDistance(\n new Date(this.notification.createdAt),\n new Date(),\n {\n addSuffix: true,\n }\n );\n return html`<ix-date\n type=\"static\"\n variant=\"date-time\"\n .value=${this.notification.createdAt}\n ></ix-date>`;\n }\n return 'N/A';\n }\n\n getNotificationIcon() {\n switch (this.notification.resourceType) {\n case NotificationGroups.PLANNED_MAINTENANCE:\n return plannedMaintenance;\n case NotificationGroups.SERVICE_TICKETS:\n return 'sync_saved_locally';\n case NotificationGroups.INCIDENTS:\n return 'report';\n case NotificationGroups.DCIM_ALERTS:\n return dcim;\n default:\n return 'sync_saved_locally';\n }\n }\n\n getNotificationTitle() {\n switch (this.notification.resourceType) {\n case NotificationGroups.PLANNED_MAINTENANCE:\n return 'Planned Maintenance';\n case NotificationGroups.SERVICE_TICKETS:\n return `${this.getServiceTicketSubGroup()} Service Ticket Update`;\n case NotificationGroups.INCIDENTS:\n return 'Emergency Repair';\n case NotificationGroups.DCIM_ALERTS:\n return 'DCIM Alert';\n default:\n return 'sync_saved_locally';\n }\n }\n\n getServiceTicketSubGroup()\n {\n switch(this.notification?.subGroup) {\n case SubGroups.FacilityAccessVisitorAccess: \n case SubGroups.FacilityAccessPermanentBadge:\n case SubGroups.FacilityAccessOspAccess: \n case SubGroups.FacilityAccessPopPoeAccess: \n return \"Facility Access\"; \n default:\n return this.notification?.subGroup; \n }\n }\n\n /* eslint-disable lit-a11y/click-events-have-key-events */\n render() {\n return html`\n <div class=\"relative notification-item\">\n <div\n class=\"hover:bg-[rgba(0,0,0,0.04)] p-2 pl-3.5 flex gap-3 relative cursor-pointer items-center font-bold ${this\n .notification?.status === 'unread'\n ? 'notification-item-unread border-l-3 border-success'\n : 'notification-item-read border-l-3 border-transparent'}\"\n >\n <ix-icon\n style=\"--ix-icon-font-size: 24px;--ix-icon-line-height: 24px;\"\n icon=${this.getNotificationIcon()}\n class=${this.notification?.status === 'unread'\n ? 'active-icon'\n : 'inactive-icon'}\n @click=${this.displayItem}\n >${this.getNotificationIcon()}\n </ix-icon>\n <div class=\"flex flex-col grow\" @click=${this.displayItem}>\n <div class=\"grow text-base\">\n <h2 class=\"dlr-text-caption\">${this.getNotificationTitle()}</h2>\n </div>\n <div class=\"grow text-xs\">\n <h3 class=\"dlr-text-caption text-on-surface-disabled\">\n ${this.calculateDuration()}\n </h3>\n </div>\n </div>\n <div>\n <view-item-dialog\n ?open=${this.showModal}\n .notification=${this.notification}\n @view-item-dialog-closed=${() => {\n this.showModal = false;\n }}\n >\n </view-item-dialog>\n <confirmation-dialog\n ?open=${this.showDeleteConfirmation}\n @on-confirm-selection=${this.confirmedDelete}\n @confirm-dialog-closed=${() => {\n this.showModal = false;\n }}\n textMessage=\"Are you sure you want to delete this notification?\"\n >\n </confirmation-dialog>\n </div>\n <ix-icon-button\n style=\"--md-icon-button-icon-size:24px;\"\n @click=${this.deleteItem}\n @mouseover=${(e: any) => {\n this.dispatchEvent(\n new CustomEvent('show-notification-tooltip', {\n detail: {\n label: this.disabled\n ? 'Emergency Repair Notification cannot be removed'\n : 'Remove Notification',\n target: e.target,\n },\n })\n );\n }}\n @mouseout=${() =>\n this.dispatchEvent(new CustomEvent('hide-notification-tooltip'))}\n ?disabled=${this.disabled}\n >\n <ix-icon\n slot=\"default\"\n class=\"${this.disabled ? 'inactive-icon' : 'destructive-icon'}\"\n >\n ${trash}\n </ix-icon>\n </ix-icon-button>\n </div>\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"notification-item.js","sourceRoot":"","sources":["../../../src/components/notifications/notification-item.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { MobxLitElement } from '@adobe/lit-mobx';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\nimport { formatDistance } from 'date-fns/formatDistance.js';\nimport { differenceInHours } from 'date-fns/differenceInHours.js';\nimport { TWStyles } from '../../tw.js';\nimport { NotificationsState } from '../../state/NotificationState.js';\nimport { ApiCallResult, Notification } from '../../models/notification.js';\nimport {\n NotificationStatus,\n NotificationGroups,\n SubGroups,\n} from '../../constants/notifications.js';\nimport { ConfirmationDialogEventDetail } from '../../constants/notification-types.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\nimport './confirmation-dialog.js';\nimport './view-item-dialog.js';\nimport '@digital-realty/ix-toast/ix-message-toast.js';\nimport { dcim, plannedMaintenance, trash } from '../../assets/iconset.js';\n\n@customElement('notification-item')\nexport class NotificationItem extends MobxLitElement {\n @property({ type: Boolean }) disabled = false;\n\n @property({ type: Object, attribute: false }) notification =\n {} as Notification;\n\n @state() private showModal = false;\n\n @state() private showDeleteConfirmation = false;\n\n static get styles() {\n return [TWStyles, NotificationsStyle];\n }\n\n displayItem() {\n if (this.notification.status === NotificationStatus.UNREAD) {\n NotificationsState.setNotificationReadStatus(this.notification.id);\n }\n this.showModal = true;\n }\n\n deleteItem() {\n if (!this.disabled) {\n this.showDeleteConfirmation = true;\n }\n }\n\n private confirmedDelete(e: CustomEvent<ConfirmationDialogEventDetail>) {\n // DELETE IF CONFIRMED TRUE\n if (e.detail.returnValue) {\n NotificationsState.setNotificationDeleted(this.notification.id).then(\n (result: ApiCallResult) => {\n this.showDeleteResultMessage(result, this.notification.id);\n }\n );\n }\n this.showDeleteConfirmation = false;\n }\n\n // eslint-disable-next-line class-methods-use-this\n private showDeleteResultMessage(result: ApiCallResult, id: string) {\n window.dispatchEvent(\n new CustomEvent('add-toast', {\n detail: {\n id,\n content: html` <ix-message-toast\n toastId=${id}\n .TMessageToast=${result.State.toLowerCase()}\n forceClose\n >\n ${result.Message}\n </ix-message-toast>`,\n autoClose: 2000,\n durationOut: 2000,\n vertical: 'bottom',\n horizontal: 'center',\n animated: true,\n above: false,\n },\n })\n );\n }\n\n calculateDuration() {\n if (this.notification.createdAt !== undefined) {\n if (\n differenceInHours(new Date(), new Date(this.notification.createdAt)) <\n 24\n )\n return formatDistance(\n new Date(this.notification.createdAt),\n new Date(),\n {\n addSuffix: true,\n }\n );\n return html`<ix-date\n type=\"static\"\n variant=\"date-time\"\n .value=${this.notification.createdAt}\n ></ix-date>`;\n }\n return 'N/A';\n }\n\n getNotificationIcon() {\n switch (this.notification.resourceType) {\n case NotificationGroups.PLANNED_MAINTENANCE:\n return plannedMaintenance;\n case NotificationGroups.SERVICE_TICKETS:\n return 'sync_saved_locally';\n case NotificationGroups.INCIDENTS:\n return 'report';\n case NotificationGroups.DCIM_ALERTS:\n return dcim;\n default:\n return 'sync_saved_locally';\n }\n }\n\n getNotificationTitle() {\n switch (this.notification.resourceType) {\n case NotificationGroups.PLANNED_MAINTENANCE:\n return 'Planned Maintenance';\n case NotificationGroups.SERVICE_TICKETS:\n return `${this.getServiceTicketSubGroup()} Service Ticket Update`;\n case NotificationGroups.INCIDENTS:\n return 'Emergency Repair';\n case NotificationGroups.DCIM_ALERTS:\n return 'DCIM Alert';\n default:\n return 'sync_saved_locally';\n }\n }\n\n getServiceTicketSubGroup() {\n switch (this.notification?.subGroup) {\n case SubGroups.FacilityAccessVisitorAccess:\n case SubGroups.FacilityAccessPermanentBadge:\n case SubGroups.FacilityAccessOspAccess:\n case SubGroups.FacilityAccessPopPoeAccess:\n return 'Facility Access';\n default:\n return this.notification?.subGroup;\n }\n }\n\n /* eslint-disable lit-a11y/click-events-have-key-events */\n render() {\n return html`\n <div class=\"relative notification-item\">\n <div\n class=\"hover:bg-[rgba(0,0,0,0.04)] p-2 pl-3.5 flex gap-3 relative cursor-pointer items-center font-bold ${this\n .notification?.status === 'unread'\n ? 'notification-item-unread border-l-3 border-success'\n : 'notification-item-read border-l-3 border-transparent'}\"\n >\n <ix-icon\n style=\"--ix-icon-font-size: 24px;--ix-icon-line-height: 24px;\"\n icon=${this.getNotificationIcon()}\n class=${this.notification?.status === 'unread'\n ? 'active-icon'\n : 'inactive-icon'}\n @click=${this.displayItem}\n >${this.getNotificationIcon()}\n </ix-icon>\n <div class=\"flex flex-col grow\" @click=${this.displayItem}>\n <div class=\"grow text-base\">\n <h2 class=\"dlr-text-caption\">${this.getNotificationTitle()}</h2>\n </div>\n <div class=\"grow text-xs\">\n <h3 class=\"dlr-text-caption text-on-surface-disabled\">\n ${this.calculateDuration()}\n </h3>\n </div>\n </div>\n <div>\n <view-item-dialog\n ?open=${this.showModal}\n .notification=${this.notification}\n @view-item-dialog-closed=${() => {\n this.showModal = false;\n }}\n >\n </view-item-dialog>\n <confirmation-dialog\n ?open=${this.showDeleteConfirmation}\n @on-confirm-selection=${this.confirmedDelete}\n @confirm-dialog-closed=${() => {\n this.showModal = false;\n }}\n textMessage=\"Are you sure you want to delete this notification?\"\n >\n </confirmation-dialog>\n </div>\n <ix-icon-button\n style=\"--md-icon-button-icon-size:24px;\"\n @click=${this.deleteItem}\n @mouseover=${(e: any) => {\n this.dispatchEvent(\n new CustomEvent('show-notification-tooltip', {\n detail: {\n label: this.disabled\n ? 'Emergency Repair Notification cannot be removed'\n : 'Remove Notification',\n target: e.target,\n },\n })\n );\n }}\n @mouseout=${() =>\n this.dispatchEvent(new CustomEvent('hide-notification-tooltip'))}\n ?disabled=${this.disabled}\n >\n <ix-icon\n slot=\"default\"\n class=\"${this.disabled ? 'inactive-icon' : 'destructive-icon'}\"\n >\n ${trash}\n </ix-icon>\n </ix-icon-button>\n </div>\n </div>\n `;\n }\n}\n"]}
@@ -79,16 +79,15 @@ let ViewItemDialog = class ViewItemDialog extends MobxLitElement {
79
79
  case SubGroups.FacilityAccessPermanentBadge:
80
80
  case SubGroups.FacilityAccessOspAccess:
81
81
  case SubGroups.FacilityAccessPopPoeAccess:
82
- return "Facility Access";
83
- case "Incidents (GSN)":
84
- return "Incidents";
85
- case "Emergency Repairs (InSite 1.0)":
86
- return "Emergency Repairs";
82
+ return 'Facility Access';
83
+ case 'Incidents (GSN)':
84
+ return 'Incidents';
85
+ case 'Emergency Repairs (InSite 1.0)':
86
+ return 'Emergency Repairs';
87
87
  default:
88
88
  return this.notification.subGroup;
89
89
  }
90
90
  }
91
- ;
92
91
  render() {
93
92
  return html ` <ix-dialog
94
93
  ?open=${this.open}
@@ -1 +1 @@
1
- {"version":3,"file":"view-item-dialog.js","sourceRoot":"","sources":["../../../src/components/notifications/view-item-dialog.ts"],"names":[],"mappings":"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","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 '@digital-realty/ix-button/ix-button.js';\nimport { format } from 'date-fns/format.js';\nimport { TWStyles } from '../../tw.js';\nimport { Notification } from '../../models/notification.js';\nimport {\n NotificationGroups,\n SubGroups,\n} from '../../constants/notifications.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\nimport { NotificationsState } from '../../state/NotificationState.js';\n\n@customElement('view-item-dialog')\nexport class ViewItemDialog extends MobxLitElement {\n static get styles() {\n return [TWStyles, NotificationsStyle];\n }\n\n @property({ type: Object, attribute: false }) notification =\n {} as Notification;\n\n @property({ type: Boolean, attribute: true }) open = false;\n\n getUrl(): string {\n const ticketId = this.notification.resourceId;\n\n switch (this.notification.resourceType) {\n case NotificationGroups.PLANNED_MAINTENANCE:\n return `/service-management/reports?ticketId=${ticketId}`;\n case NotificationGroups.SERVICE_TICKETS:\n switch (this.notification.subGroup) {\n case SubGroups.Remote_Hands:\n return `/service-management/service-tickets/remote-hands/${ticketId}`;\n case SubGroups.Customer_Care:\n return `/service-management/service-tickets/customer-care/${ticketId}`;\n case SubGroups.Deliveries:\n return `/service-management/service-tickets/${SubGroups.Deliveries}/${ticketId}`;\n case SubGroups.Facility_Access:\n return `/service-management/service-tickets/facility-access/${ticketId}`;\n case SubGroups.Removals:\n return `/service-management/service-tickets/removals/${ticketId}`;\n case SubGroups.Trouble_Ticket:\n return `/service-management/service-tickets/trouble-tickets/${ticketId}`;\n case SubGroups.FacilityAccessVisitorAccess:\n return `/service-management/service-tickets/facility-access/visitor-access/${ticketId}`;\n case SubGroups.FacilityAccessPermanentBadge:\n return `/service-management/service-tickets/facility-access/permanent-badge/${ticketId}`;\n case SubGroups.FacilityAccessOspAccess:\n return `/service-management/service-tickets/facility-access/osp-access/${ticketId}`;\n case SubGroups.FacilityAccessPopPoeAccess:\n return `/service-management/service-tickets/facility-access/pop-poe-access/${ticketId}`;\n default:\n return '';\n }\n case NotificationGroups.INCIDENTS:\n return `/service-management/reports?ticketId=${ticketId}`;\n case NotificationGroups.DCIM_ALERTS:\n return `/dcim/${ticketId}`;\n default:\n return '';\n }\n }\n\n getLocation() {\n if (\n this.notification.locations === undefined ||\n this.notification.locations.length < 1\n ) {\n return '';\n }\n if (this.notification.locations.length > 1) {\n return 'Multiple Sites';\n }\n return this.notification.locations[0];\n }\n\n dialogClosed = () => {\n this.dispatchEvent(new CustomEvent('view-item-dialog-closed'));\n };\n\n viewRecord = () => {\n this.dialogClosed();\n NotificationsState.showDrawer = false;\n };\n\n getSubGroupDisplayName()\n {\n switch(this.notification.subGroup)\n {\n case SubGroups.FacilityAccessVisitorAccess: \n case SubGroups.FacilityAccessPermanentBadge:\n case SubGroups.FacilityAccessOspAccess: \n case SubGroups.FacilityAccessPopPoeAccess: \n return \"Facility Access\"; \n case \"Incidents (GSN)\" : \n return \"Incidents\"; \n case \"Emergency Repairs (InSite 1.0)\" : \n return \"Emergency Repairs\"; \n default:\n return this.notification.subGroup;\n }\n };\n\n render() {\n return html` <ix-dialog\n ?open=${this.open}\n @closed=${this.dialogClosed}\n class=\"notification-modal\"\n >\n <div slot=\"headline\" class=\"w-[560px]\">\n <div class=\"flex flex-col flex-start\">\n <div class=\"notification-modal-title text-2xl font-bold text-balance\">\n ${this.notification.resourceType}\n </div>\n <div\n class=\"notification-modal-subtitle pt-4 pb-0 font-bold text-balance\"\n >\n ${this.getSubGroupDisplayName()}\n </div>\n </div>\n </div>\n <form\n class=\"notification-modal-content\"\n slot=\"content\"\n id=\"form-id\"\n method=\"dialog\"\n >\n <div\n class=\"notification-modal-content-title notification-modal-subject-title\"\n >\n Subject\n </div>\n <div class=\"notification-modal-subject-text font-normal text-wrap\">\n ${this.notification.subject}\n </div>\n <div\n class=\"notification-modal-content-title notification-modal-created-date-title\"\n >\n Create Date\n </div>\n <div class=\"notification-modal-created-date-text font-normal text-wrap\">\n ${format(\n new Date(this.notification.createdAt),\n 'dd/MM/yyyy HH:mm:ss'\n )}\n </div>\n <div\n class=\"notification-modal-content-title notification-modal-site-title\"\n >\n Site\n </div>\n <div class=\"notification-modal-site-text font-normal text-wrap\">\n ${this.getLocation()}\n </div>\n </form>\n <div slot=\"actions\" class=\"flex flex-row flex-end\">\n <ix-button form=\"form-id\" appearance=\"text\"> Close </ix-button>\n <ix-button\n href=\"${this.getUrl()}\"\n @click=\"${this.viewRecord}\"\n appearance=\"text\"\n >View Record</ix-button\n >\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":"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","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 '@digital-realty/ix-button/ix-button.js';\nimport { format } from 'date-fns/format.js';\nimport { TWStyles } from '../../tw.js';\nimport { Notification } from '../../models/notification.js';\nimport {\n NotificationGroups,\n SubGroups,\n} from '../../constants/notifications.js';\nimport { NotificationsStyle } from '../../styles/notifications-style.js';\nimport { NotificationsState } from '../../state/NotificationState.js';\n\n@customElement('view-item-dialog')\nexport class ViewItemDialog extends MobxLitElement {\n static get styles() {\n return [TWStyles, NotificationsStyle];\n }\n\n @property({ type: Object, attribute: false }) notification =\n {} as Notification;\n\n @property({ type: Boolean, attribute: true }) open = false;\n\n getUrl(): string {\n const ticketId = this.notification.resourceId;\n\n switch (this.notification.resourceType) {\n case NotificationGroups.PLANNED_MAINTENANCE:\n return `/service-management/reports?ticketId=${ticketId}`;\n case NotificationGroups.SERVICE_TICKETS:\n switch (this.notification.subGroup) {\n case SubGroups.Remote_Hands:\n return `/service-management/service-tickets/remote-hands/${ticketId}`;\n case SubGroups.Customer_Care:\n return `/service-management/service-tickets/customer-care/${ticketId}`;\n case SubGroups.Deliveries:\n return `/service-management/service-tickets/${SubGroups.Deliveries}/${ticketId}`;\n case SubGroups.Facility_Access:\n return `/service-management/service-tickets/facility-access/${ticketId}`;\n case SubGroups.Removals:\n return `/service-management/service-tickets/removals/${ticketId}`;\n case SubGroups.Trouble_Ticket:\n return `/service-management/service-tickets/trouble-tickets/${ticketId}`;\n case SubGroups.FacilityAccessVisitorAccess:\n return `/service-management/service-tickets/facility-access/visitor-access/${ticketId}`;\n case SubGroups.FacilityAccessPermanentBadge:\n return `/service-management/service-tickets/facility-access/permanent-badge/${ticketId}`;\n case SubGroups.FacilityAccessOspAccess:\n return `/service-management/service-tickets/facility-access/osp-access/${ticketId}`;\n case SubGroups.FacilityAccessPopPoeAccess:\n return `/service-management/service-tickets/facility-access/pop-poe-access/${ticketId}`;\n default:\n return '';\n }\n case NotificationGroups.INCIDENTS:\n return `/service-management/reports?ticketId=${ticketId}`;\n case NotificationGroups.DCIM_ALERTS:\n return `/dcim/${ticketId}`;\n default:\n return '';\n }\n }\n\n getLocation() {\n if (\n this.notification.locations === undefined ||\n this.notification.locations.length < 1\n ) {\n return '';\n }\n if (this.notification.locations.length > 1) {\n return 'Multiple Sites';\n }\n return this.notification.locations[0];\n }\n\n dialogClosed = () => {\n this.dispatchEvent(new CustomEvent('view-item-dialog-closed'));\n };\n\n viewRecord = () => {\n this.dialogClosed();\n NotificationsState.showDrawer = false;\n };\n\n getSubGroupDisplayName() {\n switch (this.notification.subGroup) {\n case SubGroups.FacilityAccessVisitorAccess:\n case SubGroups.FacilityAccessPermanentBadge:\n case SubGroups.FacilityAccessOspAccess:\n case SubGroups.FacilityAccessPopPoeAccess:\n return 'Facility Access';\n case 'Incidents (GSN)':\n return 'Incidents';\n case 'Emergency Repairs (InSite 1.0)':\n return 'Emergency Repairs';\n default:\n return this.notification.subGroup;\n }\n }\n\n render() {\n return html` <ix-dialog\n ?open=${this.open}\n @closed=${this.dialogClosed}\n class=\"notification-modal\"\n >\n <div slot=\"headline\" class=\"w-[560px]\">\n <div class=\"flex flex-col flex-start\">\n <div class=\"notification-modal-title text-2xl font-bold text-balance\">\n ${this.notification.resourceType}\n </div>\n <div\n class=\"notification-modal-subtitle pt-4 pb-0 font-bold text-balance\"\n >\n ${this.getSubGroupDisplayName()}\n </div>\n </div>\n </div>\n <form\n class=\"notification-modal-content\"\n slot=\"content\"\n id=\"form-id\"\n method=\"dialog\"\n >\n <div\n class=\"notification-modal-content-title notification-modal-subject-title\"\n >\n Subject\n </div>\n <div class=\"notification-modal-subject-text font-normal text-wrap\">\n ${this.notification.subject}\n </div>\n <div\n class=\"notification-modal-content-title notification-modal-created-date-title\"\n >\n Create Date\n </div>\n <div class=\"notification-modal-created-date-text font-normal text-wrap\">\n ${format(\n new Date(this.notification.createdAt),\n 'dd/MM/yyyy HH:mm:ss'\n )}\n </div>\n <div\n class=\"notification-modal-content-title notification-modal-site-title\"\n >\n Site\n </div>\n <div class=\"notification-modal-site-text font-normal text-wrap\">\n ${this.getLocation()}\n </div>\n </form>\n <div slot=\"actions\" class=\"flex flex-row flex-end\">\n <ix-button form=\"form-id\" appearance=\"text\"> Close </ix-button>\n <ix-button\n href=\"${this.getUrl()}\"\n @click=\"${this.viewRecord}\"\n appearance=\"text\"\n >View Record</ix-button\n >\n </div>\n </ix-dialog>`;\n }\n}\n"]}
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Webcomponent ix-notifications following open-wc recommendations",
4
4
  "license": "MIT",
5
5
  "author": "Digital Realty",
6
- "version": "1.1.28",
6
+ "version": "1.1.30",
7
7
  "type": "module",
8
8
  "main": "dist/index.js",
9
9
  "module": "dist/index.js",
@@ -43,7 +43,7 @@
43
43
  "@digital-realty/ix-date": "^1.1.11",
44
44
  "@digital-realty/ix-dialog": "^1.1.14",
45
45
  "@digital-realty/ix-divider": "^1.1.7",
46
- "@digital-realty/ix-drawer": "^1.1.20",
46
+ "@digital-realty/ix-drawer": "^1.1.21",
47
47
  "@digital-realty/ix-icon": "^1.1.6",
48
48
  "@digital-realty/ix-icon-button": "^1.1.6",
49
49
  "@digital-realty/ix-switch": "^2.2.6",
@@ -138,5 +138,5 @@
138
138
  "README.md",
139
139
  "LICENSE"
140
140
  ],
141
- "gitHead": "0145fd7e21426000f7322d803fe82af81d143882"
141
+ "gitHead": "e605d674b71082303dbf0dda47081fa6525103f8"
142
142
  }