@finsemble/finsemble-ui 6.2.1 → 6.3.1-beta-1

package/react/components/notifications/components/shared/NotificationCardShell.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationCardShell.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/shared/NotificationCardShell.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from \"react\";\r\nimport { parseISO, differenceInMilliseconds, addSeconds } from \"date-fns\";\r\n\r\n// Types\r\nimport IPerformedAction from \"common/notifications/definitions/IPerformedAction\";\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\n// Components\r\n\r\n// Utils\r\nimport { isNewNotification, isReNotification, getMostRecentAction } from \"../../utils\";\r\nimport { NotificationCardHeaderShell } from \"./notificationCard/NotificationCardHeaderShell\";\r\nimport { NotificationCardBodyShell } from \"./notificationCard/NotificationCardBodyShell\";\r\n\r\nexport type NotificationCardPropType = {\r\n\t/**\r\n\t * The Notification to be displayed\r\n\t */\r\n\tnotification: INotification;\r\n\r\n\t/**\r\n\t * Which UI context the Card is being used in\r\n\t */\r\n\tuiContext: \"toasts\" | \"center\";\r\n\r\n\t/**\r\n\t * The internal function that will be called on toasts when dismissed or marked as read\r\n\t */\r\n\tremoveNotification: Function;\r\n};\r\n\r\nexport const NotificationCardShell: React.FunctionComponent<NotificationCardPropType> = ({\r\n\tnotification,\r\n\tuiContext,\r\n\tremoveNotification,\r\n\tchildren,\r\n}) => {\r\n\tconst { isRead } = notification;\r\n\r\n\tconst [newNotificationHaloPeriodSeconds, setNotificationHaloPeriodSeconds] = useState(0);\r\n\r\n\tconst [isNew, setIsNew] = useState(isNewNotification(notification, newNotificationHaloPeriodSeconds));\r\n\tconst [wokeFromSnooze, setWokeFromSnooze] = useState(\r\n\t\tisReNotification(notification, newNotificationHaloPeriodSeconds)\r\n\t);\r\n\r\n\t// Sets the current default preference\r\n\tuseEffect(() => {\r\n\t\tasync function getNotificationsPreferences() {\r\n\t\t\treturn await FSBL.Clients.NotificationClient.getPreferences();\r\n\t\t}\r\n\r\n\t\tgetNotificationsPreferences().then((preferences: any) => {\r\n\t\t\tsetNotificationHaloPeriodSeconds(preferences.newNotificationHaloPeriodSeconds);\r\n\t\t\tsetIsNew(isNewNotification(notification, preferences.newNotificationHaloPeriodSeconds));\r\n\t\t});\r\n\t}, []);\r\n\r\n\t// Listens for preferences change\r\n\tuseEffect(() => {\r\n\t\tasync function listenForPreferenceChange(error: any, response: any) {\r\n\t\t\tif (error) {\r\n\t\t\t\tconsole.error(\"FinsembleUserPreferencesChannel: \", error);\r\n\t\t\t} else {\r\n\t\t\t\tconst { data } = response;\r\n\t\t\t\tif (\r\n\t\t\t\t\tdata.notificationPreferences &&\r\n\t\t\t\t\tdata.notificationPreferences.hasOwnProperty(\"newNotificationHaloPeriodSeconds\")\r\n\t\t\t\t) {\r\n\t\t\t\t\tsetNotificationHaloPeriodSeconds(data.notificationPreferences.newNotificationHaloPeriodSeconds);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tFSBL.Clients.RouterClient.addListener(\"FinsembleUserPreferencesChannel\", listenForPreferenceChange);\r\n\t\treturn () => {\r\n\t\t\tFSBL.Clients.RouterClient.removeListener(\"FinsembleUserPreferencesChannel\", listenForPreferenceChange);\r\n\t\t};\r\n\t}, []);\r\n\r\n\tuseEffect(() => {\r\n\t\tlet isNewTimerId: any;\r\n\t\tif (isNew) {\r\n\t\t\tif (notification.isRead) {\r\n\t\t\t\tsetIsNew(false);\r\n\t\t\t\tclearTimeout(isNewTimerId);\r\n\t\t\t} else {\r\n\t\t\t\tisNewTimerId = setTimeout(() => {\r\n\t\t\t\t\tsetIsNew(false);\r\n\t\t\t\t}, differenceInMilliseconds(addSeconds(parseISO(notification.issuedAt), newNotificationHaloPeriodSeconds), Date.now()));\r\n\t\t\t}\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\tclearTimeout(isNewTimerId);\r\n\t\t};\r\n\t}, [isNew, notification]);\r\n\r\n\tuseEffect(() => {\r\n\t\tlet isRenotificationTimerId: any;\r\n\t\tif (isReNotification(notification, newNotificationHaloPeriodSeconds)) {\r\n\t\t\tconst mostRecentAction: IPerformedAction | null = getMostRecentAction(notification);\r\n\t\t\tif (mostRecentAction) {\r\n\t\t\t\tsetWokeFromSnooze(true);\r\n\t\t\t\tisRenotificationTimerId = setTimeout(() => {\r\n\t\t\t\t\tsetWokeFromSnooze(false);\r\n\t\t\t\t}, differenceInMilliseconds(addSeconds(parseISO(mostRecentAction.datePerformed), newNotificationHaloPeriodSeconds), Date.now()));\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tsetWokeFromSnooze(false);\r\n\t\t\tclearTimeout(isRenotificationTimerId);\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\tclearTimeout(isRenotificationTimerId);\r\n\t\t};\r\n\t}, [newNotificationHaloPeriodSeconds, notification]);\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={`notification-card ${isRead ? \"read\" : \"\"} ${isNew || wokeFromSnooze ? \"new\" : \"\"} \r\n\t\t\t${notification.cssClassName ? notification.cssClassName : \"\"}`}\r\n\t\t>\r\n\t\t\t{children ? (\r\n\t\t\t\tchildren\r\n\t\t\t) : (\r\n\t\t\t\t<>\r\n\t\t\t\t\t<NotificationCardHeaderShell\r\n\t\t\t\t\t\tnotification={notification}\r\n\t\t\t\t\t\tremoveNotification={removeNotification}\r\n\t\t\t\t\t\tuiContext={uiContext}\r\n\t\t\t\t\t/>\r\n\t\t\t\t\t<NotificationCardBodyShell notification={notification} />\r\n\t\t\t\t</>\r\n\t\t\t)}\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}
+{"version":3,"file":"NotificationCardShell.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/shared/NotificationCardShell.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from \"react\";\r\nimport { parseISO, differenceInMilliseconds, addSeconds } from \"date-fns\";\r\nimport { isNewNotification, isReNotification, getMostRecentAction } from \"../../utils\";\r\nimport { NotificationCardHeaderShell } from \"./notificationCard/NotificationCardHeaderShell\";\r\nimport { NotificationCardBodyShell } from \"./notificationCard/NotificationCardBodyShell\";\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\ntype IPerformedAction = services.notification.types.IPerformedAction;\r\n\r\nexport type NotificationCardPropType = {\r\n\t/**\r\n\t * The Notification to be displayed\r\n\t */\r\n\tnotification: INotification;\r\n\r\n\t/**\r\n\t * Which UI context the Card is being used in\r\n\t */\r\n\tuiContext: \"toasts\" | \"center\";\r\n\r\n\t/**\r\n\t * The internal function that will be called on toasts when dismissed or marked as read\r\n\t */\r\n\tremoveNotification: Function;\r\n};\r\n\r\nexport const NotificationCardShell: React.FunctionComponent<NotificationCardPropType> = ({\r\n\tnotification,\r\n\tuiContext,\r\n\tremoveNotification,\r\n\tchildren,\r\n}) => {\r\n\tconst { isRead } = notification;\r\n\r\n\tconst [newNotificationHaloPeriodSeconds, setNotificationHaloPeriodSeconds] = useState(0);\r\n\r\n\tconst [isNew, setIsNew] = useState(isNewNotification(notification, newNotificationHaloPeriodSeconds));\r\n\tconst [wokeFromSnooze, setWokeFromSnooze] = useState(\r\n\t\tisReNotification(notification, newNotificationHaloPeriodSeconds)\r\n\t);\r\n\r\n\t// Sets the current default preference\r\n\tuseEffect(() => {\r\n\t\tasync function getNotificationsPreferences() {\r\n\t\t\treturn await FSBL.Clients.NotificationClient.getPreferences();\r\n\t\t}\r\n\r\n\t\tgetNotificationsPreferences().then((preferences: any) => {\r\n\t\t\tsetNotificationHaloPeriodSeconds(preferences.newNotificationHaloPeriodSeconds);\r\n\t\t\tsetIsNew(isNewNotification(notification, preferences.newNotificationHaloPeriodSeconds));\r\n\t\t});\r\n\t}, []);\r\n\r\n\t// Listens for preferences change\r\n\tuseEffect(() => {\r\n\t\tasync function listenForPreferenceChange(error: any, response: any) {\r\n\t\t\tif (error) {\r\n\t\t\t\tconsole.error(\"FinsembleUserPreferencesChannel: \", error);\r\n\t\t\t} else {\r\n\t\t\t\tconst { data } = response;\r\n\t\t\t\tif (\r\n\t\t\t\t\tdata.notificationPreferences &&\r\n\t\t\t\t\tdata.notificationPreferences.hasOwnProperty(\"newNotificationHaloPeriodSeconds\")\r\n\t\t\t\t) {\r\n\t\t\t\t\tsetNotificationHaloPeriodSeconds(data.notificationPreferences.newNotificationHaloPeriodSeconds);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tFSBL.Clients.RouterClient.addListener(\"FinsembleUserPreferencesChannel\", listenForPreferenceChange);\r\n\t\treturn () => {\r\n\t\t\tFSBL.Clients.RouterClient.removeListener(\"FinsembleUserPreferencesChannel\", listenForPreferenceChange);\r\n\t\t};\r\n\t}, []);\r\n\r\n\tuseEffect(() => {\r\n\t\tlet isNewTimerId: any;\r\n\t\tif (isNew) {\r\n\t\t\tif (notification.isRead) {\r\n\t\t\t\tsetIsNew(false);\r\n\t\t\t\tclearTimeout(isNewTimerId);\r\n\t\t\t} else {\r\n\t\t\t\tisNewTimerId = setTimeout(() => {\r\n\t\t\t\t\tsetIsNew(false);\r\n\t\t\t\t}, differenceInMilliseconds(addSeconds(parseISO(notification.issuedAt), newNotificationHaloPeriodSeconds), Date.now()));\r\n\t\t\t}\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\tclearTimeout(isNewTimerId);\r\n\t\t};\r\n\t}, [isNew, notification]);\r\n\r\n\tuseEffect(() => {\r\n\t\tlet isRenotificationTimerId: any;\r\n\t\tif (isReNotification(notification, newNotificationHaloPeriodSeconds)) {\r\n\t\t\tconst mostRecentAction: IPerformedAction | null = getMostRecentAction(notification);\r\n\t\t\tif (mostRecentAction) {\r\n\t\t\t\tsetWokeFromSnooze(true);\r\n\t\t\t\tisRenotificationTimerId = setTimeout(() => {\r\n\t\t\t\t\tsetWokeFromSnooze(false);\r\n\t\t\t\t}, differenceInMilliseconds(addSeconds(parseISO(mostRecentAction.datePerformed), newNotificationHaloPeriodSeconds), Date.now()));\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tsetWokeFromSnooze(false);\r\n\t\t\tclearTimeout(isRenotificationTimerId);\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\tclearTimeout(isRenotificationTimerId);\r\n\t\t};\r\n\t}, [newNotificationHaloPeriodSeconds, notification]);\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={`notification-card ${isRead ? \"read\" : \"\"} ${isNew || wokeFromSnooze ? \"new\" : \"\"} \r\n\t\t\t${notification.cssClassName ? notification.cssClassName : \"\"}`}\r\n\t\t>\r\n\t\t\t{children ? (\r\n\t\t\t\tchildren\r\n\t\t\t) : (\r\n\t\t\t\t<>\r\n\t\t\t\t\t<NotificationCardHeaderShell\r\n\t\t\t\t\t\tnotification={notification}\r\n\t\t\t\t\t\tremoveNotification={removeNotification}\r\n\t\t\t\t\t\tuiContext={uiContext}\r\n\t\t\t\t\t/>\r\n\t\t\t\t\t<NotificationCardBodyShell notification={notification} />\r\n\t\t\t\t</>\r\n\t\t\t)}\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}

package/react/components/notifications/components/shared/OverflowMenu.d.ts

@@ -1,6 +1,7 @@
 import React, { Dispatch, SetStateAction } from "react";
-import { INotification } from "common/notifications/definitions/INotification";
 import { OverFlowMenuAction } from "../../types";
+import { services } from "@finsemble/finsemble-core";
+declare type INotification = services.notification.types.INotification;
 export declare const OverflowMenuActions: {
     [key: string]: OverFlowMenuAction;
 };

package/react/components/notifications/components/shared/OverflowMenu.js

@@ -69,18 +69,19 @@ export const renderOverflowMenuAction = (notification, menuAction, isMuted) => {
         return null;
     }
     return (React.createElement("div", { key: `${notification.id}_${menuAction.name}`, className: "overflow-menu__action", onClick: () => {
-            menuAction?.action(notification);
-        } },
-        menuAction?.icon,
-        React.createElement("span", { className: "btn-label" }, menuAction?.label)));
+            menuAction === null || menuAction === void 0 ? void 0 : menuAction.action(notification);
+        } }, menuAction === null || menuAction === void 0 ? void 0 :
+        menuAction.icon,
+        React.createElement("span", { className: "btn-label" }, menuAction === null || menuAction === void 0 ? void 0 : menuAction.label)));
 };
 const OverflowMenu = ({ closeSelf, children }) => {
     const wrapperRef = useRef(null);
     const [className, setClassName] = useState("overflow-menu__container");
     useOutsideClickDetector(wrapperRef, () => closeSelf(false));
     const moveElementIntoView = () => {
+        var _a;
         const bottomViewPort = window.innerHeight + window.scrollY;
-        const domRect = wrapperRef?.current?.getBoundingClientRect();
+        const domRect = (_a = wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
         const elementBottom = domRect ? domRect.y + domRect.height + window.scrollY : null;
         if (elementBottom && elementBottom > bottomViewPort) {
             setClassName("overflow-menu__container flow-up");

package/react/components/notifications/components/shared/OverflowMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverflowMenu.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/shared/OverflowMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { Dispatch, SetStateAction, useEffect, useRef, useState } from \"react\";\r\n\r\n// Hooks\r\nimport { useOutsideClickDetector } from \"../../../../hooks/useOutsideClickDetector\";\r\nimport {\r\n\tmarkNotificationsRead,\r\n\tmarkNotificationsUnread,\r\n\tsnoozeNotifications,\r\n} from \"../../../../hooks/useNotifications\";\r\n\r\n// Types\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport { OverFlowMenuAction } from \"../../types\";\r\n\r\n// Icons\r\nimport BellIcon from \"../../../shared/BellIcon\";\r\nimport BellIconCrossed from \"../../../shared/BellIconCrossed\";\r\nimport EnvelopeCloseIcon from \"../../icons/EnvelopeClose\";\r\nimport EnvelopeOpenIcon from \"../../icons/EnvelopeOpen\";\r\nimport IMuteFilter from \"common/notifications/definitions/IMuteFilter\";\r\nimport SnoozeIcon from \"../../icons/SnoozeIcon\";\r\nimport { getMuteFilterFromNotification } from \"../../utils\";\r\n\r\nexport const OverflowMenuActions: { [key: string]: OverFlowMenuAction } = {\r\n\tMARK_AS_UNREAD: {\r\n\t\tname: \"MARK_AS_UNREAD\",\r\n\t\ticon: <EnvelopeCloseIcon />,\r\n\t\tlabel: \"Mark Unread\",\r\n\t\taction: (notification: INotification) => markNotificationsUnread([notification]),\r\n\t},\r\n\tMARK_AS_READ: {\r\n\t\tname: \"MARK_AS_READ\",\r\n\t\ticon: <EnvelopeOpenIcon />,\r\n\t\tlabel: \"Mark Read\",\r\n\t\taction: (notification: INotification) => markNotificationsRead([notification]),\r\n\t},\r\n\tSNOOZE: {\r\n\t\tname: \"SNOOZE\",\r\n\t\ticon: <SnoozeIcon />,\r\n\t\tlabel: \"Snooze\",\r\n\t\taction: (notification: INotification) => snoozeNotifications([notification]),\r\n\t},\r\n\tDISMISS: {\r\n\t\tname: \"DISMISS\",\r\n\t\ticon: (\r\n\t\t\t<div className=\"finsemble-icon\">\r\n\t\t\t\t<i className=\"ff-close\" />\r\n\t\t\t</div>\r\n\t\t),\r\n\t\tlabel: \"Dismiss\",\r\n\t\taction: () => {\r\n\t\t\t// Empty - filled in later\r\n\t\t},\r\n\t},\r\n\tSETTINGS: {\r\n\t\tname: \"SETTINGS\",\r\n\t\ticon: (\r\n\t\t\t<div className=\"finsemble-icon\">\r\n\t\t\t\t<i className=\"ff-settings\" />\r\n\t\t\t</div>\r\n\t\t),\r\n\t\tlabel: \"Settings\",\r\n\t\taction: (notification: INotification) => {\r\n\t\t\tFSBL.Clients.LauncherClient.showWindow(\r\n\t\t\t\t{\r\n\t\t\t\t\tcomponentType: \"UserPreferences\",\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tmonitor: \"mine\",\r\n\t\t\t\t\tleft: \"center\",\r\n\t\t\t\t\ttop: \"center\",\r\n\t\t\t\t},\r\n\t\t\t\t() => {\r\n\t\t\t\t\tFSBL.Clients.RouterClient.transmit(\"FinsembleUserPreferencesChannel\", {\r\n\t\t\t\t\t\tpreferencesTab: \"Notifications\",\r\n\t\t\t\t\t\tnotification,\r\n\t\t\t\t\t});\r\n\t\t\t\t\t// we need this timeout otherwise the UserPreferences screen does not detect the message being transmited\r\n\t\t\t\t\tsetTimeout(() => {\r\n\t\t\t\t\t\tFSBL.Clients.RouterClient.transmit(\"FinsembleNotificationsNavigationChannel\", { notification });\r\n\t\t\t\t\t}, 50);\r\n\t\t\t\t}\r\n\t\t\t);\r\n\t\t},\r\n\t},\r\n\tDETAILS: {\r\n\t\tname: \"DETAILS\",\r\n\t\ticon: (\r\n\t\t\t<div className=\"finsemble-icon\">\r\n\t\t\t\t<i className=\"ff-dots-horz\" />\r\n\t\t\t</div>\r\n\t\t),\r\n\t\tlabel: \"Details\",\r\n\t\taction: () => {\r\n\t\t\t// Empty - filled in later\r\n\t\t},\r\n\t},\r\n};\r\n\r\nexport const renderOverflowMenuAction = (\r\n\tnotification: INotification,\r\n\tmenuAction: OverFlowMenuAction,\r\n\tisMuted: boolean\r\n) => {\r\n\tif (\r\n\t\t// Don't display read if notification is read\r\n\t\t(notification.isRead && menuAction.name === OverflowMenuActions.MARK_AS_READ.name) ||\r\n\t\t// Don't display unread if notification is unread\r\n\t\t(!notification.isRead && menuAction.name === OverflowMenuActions.MARK_AS_UNREAD.name)\r\n\t) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tkey={`${notification.id}_${menuAction.name}`}\r\n\t\t\tclassName=\"overflow-menu__action\"\r\n\t\t\tonClick={() => {\r\n\t\t\t\tmenuAction?.action(notification);\r\n\t\t\t}}\r\n\t\t>\r\n\t\t\t{menuAction?.icon}\r\n\t\t\t<span className=\"btn-label\">{menuAction?.label}</span>\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\n/**\r\n * Overflow menu component for notifications that will provide a set of actions\r\n * a user can perform on a notification (e.g. dismiss, snooze)\r\n */\r\nconst OverflowMenu: React.FunctionComponent<{\r\n\tcloseSelf: Dispatch<SetStateAction<boolean>>;\r\n}> = ({ closeSelf, children }) => {\r\n\tconst wrapperRef = useRef<HTMLDivElement>(null);\r\n\tconst [className, setClassName] = useState(\"overflow-menu__container\");\r\n\r\n\tuseOutsideClickDetector(wrapperRef, () => closeSelf(false));\r\n\r\n\tconst moveElementIntoView = () => {\r\n\t\tconst bottomViewPort = window.innerHeight + window.scrollY;\r\n\t\tconst domRect = wrapperRef?.current?.getBoundingClientRect();\r\n\t\tconst elementBottom = domRect ? domRect.y + domRect.height + window.scrollY : null;\r\n\r\n\t\tif (elementBottom && elementBottom > bottomViewPort) {\r\n\t\t\tsetClassName(\"overflow-menu__container flow-up\");\r\n\t\t}\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tmoveElementIntoView();\r\n\t});\r\n\r\n\treturn (\r\n\t\t<div ref={wrapperRef} className={className}>\r\n\t\t\t{children}\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default OverflowMenu;\r\n"]}
+{"version":3,"file":"OverflowMenu.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/shared/OverflowMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { Dispatch, SetStateAction, useEffect, useRef, useState } from \"react\";\r\n\r\n// Hooks\r\nimport { useOutsideClickDetector } from \"../../../../hooks/useOutsideClickDetector\";\r\nimport {\r\n\tmarkNotificationsRead,\r\n\tmarkNotificationsUnread,\r\n\tsnoozeNotifications,\r\n} from \"../../../../hooks/useNotifications\";\r\n\r\n// Types\r\nimport { OverFlowMenuAction } from \"../../types\";\r\n\r\n// Icons\r\nimport EnvelopeCloseIcon from \"../../icons/EnvelopeClose\";\r\nimport EnvelopeOpenIcon from \"../../icons/EnvelopeOpen\";\r\nimport SnoozeIcon from \"../../icons/SnoozeIcon\";\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\n\r\nexport const OverflowMenuActions: { [key: string]: OverFlowMenuAction } = {\r\n\tMARK_AS_UNREAD: {\r\n\t\tname: \"MARK_AS_UNREAD\",\r\n\t\ticon: <EnvelopeCloseIcon />,\r\n\t\tlabel: \"Mark Unread\",\r\n\t\taction: (notification: INotification) => markNotificationsUnread([notification]),\r\n\t},\r\n\tMARK_AS_READ: {\r\n\t\tname: \"MARK_AS_READ\",\r\n\t\ticon: <EnvelopeOpenIcon />,\r\n\t\tlabel: \"Mark Read\",\r\n\t\taction: (notification: INotification) => markNotificationsRead([notification]),\r\n\t},\r\n\tSNOOZE: {\r\n\t\tname: \"SNOOZE\",\r\n\t\ticon: <SnoozeIcon />,\r\n\t\tlabel: \"Snooze\",\r\n\t\taction: (notification: INotification) => snoozeNotifications([notification]),\r\n\t},\r\n\tDISMISS: {\r\n\t\tname: \"DISMISS\",\r\n\t\ticon: (\r\n\t\t\t<div className=\"finsemble-icon\">\r\n\t\t\t\t<i className=\"ff-close\" />\r\n\t\t\t</div>\r\n\t\t),\r\n\t\tlabel: \"Dismiss\",\r\n\t\taction: () => {\r\n\t\t\t// Empty - filled in later\r\n\t\t},\r\n\t},\r\n\tSETTINGS: {\r\n\t\tname: \"SETTINGS\",\r\n\t\ticon: (\r\n\t\t\t<div className=\"finsemble-icon\">\r\n\t\t\t\t<i className=\"ff-settings\" />\r\n\t\t\t</div>\r\n\t\t),\r\n\t\tlabel: \"Settings\",\r\n\t\taction: (notification: INotification) => {\r\n\t\t\tFSBL.Clients.LauncherClient.showWindow(\r\n\t\t\t\t{\r\n\t\t\t\t\tcomponentType: \"UserPreferences\",\r\n\t\t\t\t},\r\n\t\t\t\t{\r\n\t\t\t\t\tmonitor: \"mine\",\r\n\t\t\t\t\tleft: \"center\",\r\n\t\t\t\t\ttop: \"center\",\r\n\t\t\t\t},\r\n\t\t\t\t() => {\r\n\t\t\t\t\tFSBL.Clients.RouterClient.transmit(\"FinsembleUserPreferencesChannel\", {\r\n\t\t\t\t\t\tpreferencesTab: \"Notifications\",\r\n\t\t\t\t\t\tnotification,\r\n\t\t\t\t\t});\r\n\t\t\t\t\t// we need this timeout otherwise the UserPreferences screen does not detect the message being transmited\r\n\t\t\t\t\tsetTimeout(() => {\r\n\t\t\t\t\t\tFSBL.Clients.RouterClient.transmit(\"FinsembleNotificationsNavigationChannel\", { notification });\r\n\t\t\t\t\t}, 50);\r\n\t\t\t\t}\r\n\t\t\t);\r\n\t\t},\r\n\t},\r\n\tDETAILS: {\r\n\t\tname: \"DETAILS\",\r\n\t\ticon: (\r\n\t\t\t<div className=\"finsemble-icon\">\r\n\t\t\t\t<i className=\"ff-dots-horz\" />\r\n\t\t\t</div>\r\n\t\t),\r\n\t\tlabel: \"Details\",\r\n\t\taction: () => {\r\n\t\t\t// Empty - filled in later\r\n\t\t},\r\n\t},\r\n};\r\n\r\nexport const renderOverflowMenuAction = (\r\n\tnotification: INotification,\r\n\tmenuAction: OverFlowMenuAction,\r\n\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n\tisMuted: boolean\r\n) => {\r\n\tif (\r\n\t\t// Don't display read if notification is read\r\n\t\t(notification.isRead && menuAction.name === OverflowMenuActions.MARK_AS_READ.name) ||\r\n\t\t// Don't display unread if notification is unread\r\n\t\t(!notification.isRead && menuAction.name === OverflowMenuActions.MARK_AS_UNREAD.name)\r\n\t) {\r\n\t\treturn null;\r\n\t}\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tkey={`${notification.id}_${menuAction.name}`}\r\n\t\t\tclassName=\"overflow-menu__action\"\r\n\t\t\tonClick={() => {\r\n\t\t\t\tmenuAction?.action(notification);\r\n\t\t\t}}\r\n\t\t>\r\n\t\t\t{menuAction?.icon}\r\n\t\t\t<span className=\"btn-label\">{menuAction?.label}</span>\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\n/**\r\n * Overflow menu component for notifications that will provide a set of actions\r\n * a user can perform on a notification (e.g. dismiss, snooze)\r\n */\r\nconst OverflowMenu: React.FunctionComponent<{\r\n\tcloseSelf: Dispatch<SetStateAction<boolean>>;\r\n}> = ({ closeSelf, children }) => {\r\n\tconst wrapperRef = useRef<HTMLDivElement>(null);\r\n\tconst [className, setClassName] = useState(\"overflow-menu__container\");\r\n\r\n\tuseOutsideClickDetector(wrapperRef, () => closeSelf(false));\r\n\r\n\tconst moveElementIntoView = () => {\r\n\t\tconst bottomViewPort = window.innerHeight + window.scrollY;\r\n\t\tconst domRect = wrapperRef?.current?.getBoundingClientRect();\r\n\t\tconst elementBottom = domRect ? domRect.y + domRect.height + window.scrollY : null;\r\n\r\n\t\tif (elementBottom && elementBottom > bottomViewPort) {\r\n\t\t\tsetClassName(\"overflow-menu__container flow-up\");\r\n\t\t}\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tmoveElementIntoView();\r\n\t});\r\n\r\n\treturn (\r\n\t\t<div ref={wrapperRef} className={className}>\r\n\t\t\t{children}\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default OverflowMenu;\r\n"]}

package/react/components/notifications/components/shared/notificationCard/NotificationCardBodyActions.d.ts

@@ -1,6 +1,7 @@
-/// <reference types="finsemble-core" />
 import React from "react";
-import { INotification } from "common/notifications/definitions/INotification";
+import { services } from "@finsemble/finsemble-core";
+declare type INotification = services.notification.types.INotification;
 export declare const NotificationCardBodyActions: React.FunctionComponent<{
     notification: INotification;
 }>;
+export {};

package/react/components/notifications/components/shared/notificationCard/NotificationCardBodyActions.js

@@ -6,7 +6,7 @@ const renderActionButtons = (notification, action, id) => {
     if (Array.isArray(action)) {
         let buttonData = {};
         let buttonOptions = [];
-        action.map((compositeAction, index) => {
+        action.forEach((compositeAction, index) => {
             if (index === 0) {
                 buttonData.mainAction = () => doAction && doAction(notification, compositeAction);
                 buttonData.buttonLabel = compositeAction.buttonText;
@@ -27,6 +27,6 @@ const renderActionButtons = (notification, action, id) => {
 export const NotificationCardBodyActions = ({ notification, }) => {
     const { actions } = notification;
     const hasActions = actions && actions.length > 0;
-    return (React.createElement(React.Fragment, null, hasActions ? (React.createElement("div", { className: "actions-panel" }, actions?.map((action, index) => renderActionButtons(notification, action, index)))) : null));
+    return (React.createElement(React.Fragment, null, hasActions ? (React.createElement("div", { className: "actions-panel" }, actions === null || actions === void 0 ? void 0 : actions.map((action, index) => renderActionButtons(notification, action, index)))) : null));
 };
 //# sourceMappingURL=NotificationCardBodyActions.js.map

package/react/components/notifications/components/shared/notificationCard/NotificationCardBodyActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationCardBodyActions.js","sourceRoot":"","sources":["../../../../../../src/components/notifications/components/shared/notificationCard/NotificationCardBodyActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,cAAuD,MAAM,mCAAmC,CAAC;AACxG,OAAO,MAAiC,MAAM,2BAA2B,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AAEjE,MAAM,mBAAmB,GAAG,CAAC,YAA2B,EAAE,MAA2B,EAAE,EAAmB,EAAE,EAAE;IAC7G,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;QAC1B,IAAI,UAAU,GAAG,EAAyC,CAAC;QAC3D,IAAI,aAAa,GAA4B,EAAE,CAAC;QAChD,MAAM,CAAC,GAAG,CAAC,CAAC,eAAe,EAAE,KAAK,EAAE,EAAE;YACrC,IAAI,KAAK,KAAK,CAAC,EAAE;gBAChB,UAAU,CAAC,UAAU,GAAG,GAAG,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,YAAY,EAAE,eAAe,CAAC,CAAC;gBAClF,UAAU,CAAC,WAAW,GAAG,eAAe,CAAC,UAAU,CAAC;aACpD;iBAAM;gBACN,aAAa,CAAC,IAAI,CAAC;oBAClB,WAAW,EAAE,eAAe,CAAC,UAAU;oBACvC,YAAY,EAAE,GAAG,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,YAAY,EAAE,eAAe,CAAC;iBACvE,CAAC,CAAC;aACH;QACF,CAAC,CAAC,CAAC;QACH,OAAO,CACN,oBAAC,cAAc,IACd,GAAG,EAAE,EAAE,EACP,WAAW,EAAE,UAAU,CAAC,WAAW,EACnC,UAAU,EAAE,UAAU,CAAC,UAAU,EACjC,aAAa,EAAE,aAAa,GAC3B,CACF,CAAC;KACF;SAAM;QACN,OAAO,CACN,oBAAC,MAAM,IACN,GAAG,EAAE,EAAE,EACP,WAAW,EAAE,MAAM,CAAC,UAAU,EAC9B,YAAY,EAAE,GAAG,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC,GAC7D,CACF,CAAC;KACF;AACF,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,2BAA2B,GAA6D,CAAC,EACrG,YAAY,GACZ,EAAE,EAAE;IACJ,MAAM,EAAE,OAAO,EAAE,GAAG,YAAY,CAAC;IACjC,MAAM,UAAU,GAAG,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;IAEjD,OAAO,CACN,0CACE,UAAU,CAAC,CAAC,CAAC,CACb,6BAAK,SAAS,EAAC,eAAe,IAC5B,OAAO,EAAE,GAAG,CAAC,CAAC,MAA2B,EAAE,KAAU,EAAE,EAAE,CAAC,mBAAmB,CAAC,YAAY,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,CACvG,CACN,CAAC,CAAC,CAAC,IAAI,CACN,CACH,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React from \"react\";\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport IAction from \"common/notifications/definitions/IAction\";\r\nimport DropdownButton, { IFinsembleDropdownActionButtonProps } from \"../../../../common/DropdownButton\";\r\nimport Button, { IFinsembleButtonProps } from \"../../../../shared/Button\";\r\nimport { doAction } from \"../../../../../hooks/useNotifications\";\r\n\r\nconst renderActionButtons = (notification: INotification, action: IAction | IAction[], id: string | number) => {\r\n\tif (Array.isArray(action)) {\r\n\t\tlet buttonData = {} as IFinsembleDropdownActionButtonProps;\r\n\t\tlet buttonOptions: IFinsembleButtonProps[] = [];\r\n\t\taction.map((compositeAction, index) => {\r\n\t\t\tif (index === 0) {\r\n\t\t\t\tbuttonData.mainAction = () => doAction && doAction(notification, compositeAction);\r\n\t\t\t\tbuttonData.buttonLabel = compositeAction.buttonText;\r\n\t\t\t} else {\r\n\t\t\t\tbuttonOptions.push({\r\n\t\t\t\t\tbuttonLabel: compositeAction.buttonText,\r\n\t\t\t\t\tclickHandler: () => doAction && doAction(notification, compositeAction),\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t});\r\n\t\treturn (\r\n\t\t\t<DropdownButton\r\n\t\t\t\tkey={id}\r\n\t\t\t\tbuttonLabel={buttonData.buttonLabel}\r\n\t\t\t\tmainAction={buttonData.mainAction}\r\n\t\t\t\tbuttonOptions={buttonOptions}\r\n\t\t\t/>\r\n\t\t);\r\n\t} else {\r\n\t\treturn (\r\n\t\t\t<Button\r\n\t\t\t\tkey={id}\r\n\t\t\t\tbuttonLabel={action.buttonText}\r\n\t\t\t\tclickHandler={() => doAction && doAction(notification, action)}\r\n\t\t\t/>\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport const NotificationCardBodyActions: React.FunctionComponent<{ notification: INotification }> = ({\r\n\tnotification,\r\n}) => {\r\n\tconst { actions } = notification;\r\n\tconst hasActions = actions && actions.length > 0;\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t{hasActions ? (\r\n\t\t\t\t<div className=\"actions-panel\">\r\n\t\t\t\t\t{actions?.map((action: IAction | IAction[], index: any) => renderActionButtons(notification, action, index))}\r\n\t\t\t\t</div>\r\n\t\t\t) : null}\r\n\t\t</>\r\n\t);\r\n};\r\n"]}
+{"version":3,"file":"NotificationCardBodyActions.js","sourceRoot":"","sources":["../../../../../../src/components/notifications/components/shared/notificationCard/NotificationCardBodyActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,cAAuD,MAAM,mCAAmC,CAAC;AACxG,OAAO,MAAiC,MAAM,2BAA2B,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AAMjE,MAAM,mBAAmB,GAAG,CAAC,YAA2B,EAAE,MAA2B,EAAE,EAAmB,EAAE,EAAE;IAC7G,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;QAC1B,IAAI,UAAU,GAAG,EAAyC,CAAC;QAC3D,IAAI,aAAa,GAA4B,EAAE,CAAC;QAChD,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,EAAE,KAAK,EAAE,EAAE;YACzC,IAAI,KAAK,KAAK,CAAC,EAAE;gBAChB,UAAU,CAAC,UAAU,GAAG,GAAG,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,YAAY,EAAE,eAAe,CAAC,CAAC;gBAClF,UAAU,CAAC,WAAW,GAAG,eAAe,CAAC,UAAU,CAAC;aACpD;iBAAM;gBACN,aAAa,CAAC,IAAI,CAAC;oBAClB,WAAW,EAAE,eAAe,CAAC,UAAU;oBACvC,YAAY,EAAE,GAAG,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,YAAY,EAAE,eAAe,CAAC;iBACvE,CAAC,CAAC;aACH;QACF,CAAC,CAAC,CAAC;QACH,OAAO,CACN,oBAAC,cAAc,IACd,GAAG,EAAE,EAAE,EACP,WAAW,EAAE,UAAU,CAAC,WAAW,EACnC,UAAU,EAAE,UAAU,CAAC,UAAU,EACjC,aAAa,EAAE,aAAa,GAC3B,CACF,CAAC;KACF;SAAM;QACN,OAAO,CACN,oBAAC,MAAM,IACN,GAAG,EAAE,EAAE,EACP,WAAW,EAAE,MAAM,CAAC,UAAU,EAC9B,YAAY,EAAE,GAAG,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC,GAC7D,CACF,CAAC;KACF;AACF,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,2BAA2B,GAA6D,CAAC,EACrG,YAAY,GACZ,EAAE,EAAE;IACJ,MAAM,EAAE,OAAO,EAAE,GAAG,YAAY,CAAC;IACjC,MAAM,UAAU,GAAG,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;IAEjD,OAAO,CACN,0CACE,UAAU,CAAC,CAAC,CAAC,CACb,6BAAK,SAAS,EAAC,eAAe,IAC5B,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,GAAG,CAAC,CAAC,MAA2B,EAAE,KAAU,EAAE,EAAE,CAAC,mBAAmB,CAAC,YAAY,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,CACvG,CACN,CAAC,CAAC,CAAC,IAAI,CACN,CACH,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React from \"react\";\r\nimport DropdownButton, { IFinsembleDropdownActionButtonProps } from \"../../../../common/DropdownButton\";\r\nimport Button, { IFinsembleButtonProps } from \"../../../../shared/Button\";\r\nimport { doAction } from \"../../../../../hooks/useNotifications\";\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\ntype IAction = services.notification.types.IAction;\r\n\r\nconst renderActionButtons = (notification: INotification, action: IAction | IAction[], id: string | number) => {\r\n\tif (Array.isArray(action)) {\r\n\t\tlet buttonData = {} as IFinsembleDropdownActionButtonProps;\r\n\t\tlet buttonOptions: IFinsembleButtonProps[] = [];\r\n\t\taction.forEach((compositeAction, index) => {\r\n\t\t\tif (index === 0) {\r\n\t\t\t\tbuttonData.mainAction = () => doAction && doAction(notification, compositeAction);\r\n\t\t\t\tbuttonData.buttonLabel = compositeAction.buttonText;\r\n\t\t\t} else {\r\n\t\t\t\tbuttonOptions.push({\r\n\t\t\t\t\tbuttonLabel: compositeAction.buttonText,\r\n\t\t\t\t\tclickHandler: () => doAction && doAction(notification, compositeAction),\r\n\t\t\t\t});\r\n\t\t\t}\r\n\t\t});\r\n\t\treturn (\r\n\t\t\t<DropdownButton\r\n\t\t\t\tkey={id}\r\n\t\t\t\tbuttonLabel={buttonData.buttonLabel}\r\n\t\t\t\tmainAction={buttonData.mainAction}\r\n\t\t\t\tbuttonOptions={buttonOptions}\r\n\t\t\t/>\r\n\t\t);\r\n\t} else {\r\n\t\treturn (\r\n\t\t\t<Button\r\n\t\t\t\tkey={id}\r\n\t\t\t\tbuttonLabel={action.buttonText}\r\n\t\t\t\tclickHandler={() => doAction && doAction(notification, action)}\r\n\t\t\t/>\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport const NotificationCardBodyActions: React.FunctionComponent<{ notification: INotification }> = ({\r\n\tnotification,\r\n}) => {\r\n\tconst { actions } = notification;\r\n\tconst hasActions = actions && actions.length > 0;\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t{hasActions ? (\r\n\t\t\t\t<div className=\"actions-panel\">\r\n\t\t\t\t\t{actions?.map((action: IAction | IAction[], index: any) => renderActionButtons(notification, action, index))}\r\n\t\t\t\t</div>\r\n\t\t\t) : null}\r\n\t\t</>\r\n\t);\r\n};\r\n"]}

package/react/components/notifications/components/shared/notificationCard/NotificationCardBodyShell.d.ts

@@ -1,6 +1,7 @@
-/// <reference types="finsemble-core" />
 import React from "react";
-import { INotification } from "common/notifications/definitions/INotification";
+import { services } from "@finsemble/finsemble-core";
+declare type INotification = services.notification.types.INotification;
 export declare const NotificationCardBodyShell: React.FunctionComponent<{
     notification: INotification;
 }>;
+export {};

package/react/components/notifications/components/shared/notificationCard/NotificationCardBodyShell.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationCardBodyShell.js","sourceRoot":"","sources":["../../../../../../src/components/notifications/components/shared/notificationCard/NotificationCardBodyShell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,2BAA2B,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAE,+BAA+B,EAAE,MAAM,mCAAmC,CAAC;AAEpF,MAAM,CAAC,MAAM,yBAAyB,GAA6D,CAAC,EACnG,YAAY,EACZ,QAAQ,GACR,EAAE,EAAE;IACJ,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,YAAY,CAAC;IACvD,MAAM,UAAU,GAAG,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;IAEjD,OAAO,CACN,6BAAK,SAAS,EAAE,2BAA2B,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;QACtE,QAAQ,CAAC,CAAC,CAAC,CACX,QAAQ,CACR,CAAC,CAAC,CAAC,CACH;YACC,oBAAC,+BAA+B,IAAC,WAAW,EAAE,WAAW,GAAI;YAC7D,6BAAK,SAAS,EAAC,8BAA8B,IAAE,OAAO,CAAO,CAC3D,CACH;QACD,oBAAC,2BAA2B,IAAC,YAAY,EAAE,YAAY,GAAI,CACtD,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React from \"react\";\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport { NotificationCardBodyActions } from \"./NotificationCardBodyActions\";\r\nimport { NotificationCardBodyContentLogo } from \"./NotificationCardBodyContentLogo\";\r\n\r\nexport const NotificationCardBodyShell: React.FunctionComponent<{ notification: INotification }> = ({\r\n\tnotification,\r\n\tchildren,\r\n}) => {\r\n\tconst { actions, details, contentLogo } = notification;\r\n\tconst hasActions = actions && actions.length > 0;\r\n\r\n\treturn (\r\n\t\t<div className={`notification-card__body ${hasActions ? \"actions\" : \"\"}`}>\r\n\t\t\t{children ? (\r\n\t\t\t\tchildren\r\n\t\t\t) : (\r\n\t\t\t\t<>\r\n\t\t\t\t\t<NotificationCardBodyContentLogo contentLogo={contentLogo} />\r\n\t\t\t\t\t<div className=\"notification-card__body_text\">{details}</div>\r\n\t\t\t\t</>\r\n\t\t\t)}\r\n\t\t\t<NotificationCardBodyActions notification={notification} />\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}
+{"version":3,"file":"NotificationCardBodyShell.js","sourceRoot":"","sources":["../../../../../../src/components/notifications/components/shared/notificationCard/NotificationCardBodyShell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,2BAA2B,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAE,+BAA+B,EAAE,MAAM,mCAAmC,CAAC;AAKpF,MAAM,CAAC,MAAM,yBAAyB,GAA6D,CAAC,EACnG,YAAY,EACZ,QAAQ,GACR,EAAE,EAAE;IACJ,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,YAAY,CAAC;IACvD,MAAM,UAAU,GAAG,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;IAEjD,OAAO,CACN,6BAAK,SAAS,EAAE,2BAA2B,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;QACtE,QAAQ,CAAC,CAAC,CAAC,CACX,QAAQ,CACR,CAAC,CAAC,CAAC,CACH;YACC,oBAAC,+BAA+B,IAAC,WAAW,EAAE,WAAW,GAAI;YAC7D,6BAAK,SAAS,EAAC,8BAA8B,IAAE,OAAO,CAAO,CAC3D,CACH;QACD,oBAAC,2BAA2B,IAAC,YAAY,EAAE,YAAY,GAAI,CACtD,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React from \"react\";\r\nimport { NotificationCardBodyActions } from \"./NotificationCardBodyActions\";\r\nimport { NotificationCardBodyContentLogo } from \"./NotificationCardBodyContentLogo\";\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\n\r\nexport const NotificationCardBodyShell: React.FunctionComponent<{ notification: INotification }> = ({\r\n\tnotification,\r\n\tchildren,\r\n}) => {\r\n\tconst { actions, details, contentLogo } = notification;\r\n\tconst hasActions = actions && actions.length > 0;\r\n\r\n\treturn (\r\n\t\t<div className={`notification-card__body ${hasActions ? \"actions\" : \"\"}`}>\r\n\t\t\t{children ? (\r\n\t\t\t\tchildren\r\n\t\t\t) : (\r\n\t\t\t\t<>\r\n\t\t\t\t\t<NotificationCardBodyContentLogo contentLogo={contentLogo} />\r\n\t\t\t\t\t<div className=\"notification-card__body_text\">{details}</div>\r\n\t\t\t\t</>\r\n\t\t\t)}\r\n\t\t\t<NotificationCardBodyActions notification={notification} />\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}

package/react/components/notifications/components/shared/notificationCard/NotificationCardHeaderControls.d.ts

@@ -1,8 +1,9 @@
-/// <reference types="finsemble-core" />
 import React from "react";
-import { INotification } from "common/notifications/definitions/INotification";
+import { services } from "@finsemble/finsemble-core";
+declare type INotification = services.notification.types.INotification;
 export declare const NotificationCardHeaderControls: React.FunctionComponent<{
     notification: INotification;
     uiContext?: string;
     removeNotification?: Function;
 }>;
+export {};

package/react/components/notifications/components/shared/notificationCard/NotificationCardHeaderControls.js

@@ -6,9 +6,7 @@ import { formatDistanceToNow } from "date-fns";
 export const NotificationCardHeaderControls = ({ notification, removeNotification, uiContext = "center" }) => {
     const notificationsContext = useContext(NotificationsContext);
     const { setSelectedNotification, muteFilters } = notificationsContext;
-    const { title, headerLogo } = notification;
     const [overflowMenuOpen, setOverflowMenuOpen] = useState(false);
-    const [showDefaultIcon, setShowDefaultIcon] = useState(false);
     const [isMuteFilterApplied, setIsMuteFilterApplied] = useState(muteFilters
         ? muteFilters.some((filter) => filter.source === notification.source && filter.type === notification.type)
         : false);
@@ -30,8 +28,8 @@ export const NotificationCardHeaderControls = ({ notification, removeNotificatio
     let optionsToggleClassName = "notification-card__more-options__toggle";
     if (uiContext === "center") {
         delete overFlowActions.DISMISS;
-        overFlowActions.DETAILS.action = (notification) => {
-            setSelectedNotification(notification);
+        overFlowActions.DETAILS.action = (overflowNotification) => {
+            setSelectedNotification(overflowNotification);
         };
     }
     else {

package/react/components/notifications/components/shared/notificationCard/NotificationCardHeaderControls.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationCardHeaderControls.js","sourceRoot":"","sources":["../../../../../../src/components/notifications/components/shared/notificationCard/NotificationCardHeaderControls.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useEffect, useState } from \"react\";\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport IconButton from \"../IconButton\";\r\nimport OverflowMenu, { OverflowMenuActions, renderOverflowMenuAction } from \"../OverflowMenu\";\r\nimport { NotificationsContext } from \"../../../notificationsContext\";\r\nimport { formatDistanceToNow } from \"date-fns\";\r\n\r\nexport const NotificationCardHeaderControls: React.FunctionComponent<{\r\n\tnotification: INotification;\r\n\tuiContext?: string;\r\n\tremoveNotification?: Function;\r\n}> = ({ notification, removeNotification, uiContext = \"center\" }) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst { setSelectedNotification, muteFilters } = notificationsContext;\r\n\tconst { title, headerLogo } = notification;\r\n\r\n\tconst [overflowMenuOpen, setOverflowMenuOpen] = useState(false);\r\n\tconst [showDefaultIcon, setShowDefaultIcon] = useState(false);\r\n\tconst [isMuteFilterApplied, setIsMuteFilterApplied] = useState(\r\n\t\tmuteFilters\r\n\t\t\t? muteFilters.some((filter) => filter.source === notification.source && filter.type === notification.type)\r\n\t\t\t: false\r\n\t);\r\n\r\n\tconst [time, setTime] = useState(\r\n\t\tformatDistanceToNow(new Date(notification.issuedAt), {\r\n\t\t\tincludeSeconds: true,\r\n\t\t})\r\n\t);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst id = setInterval(() => {\r\n\t\t\tsetTime(\r\n\t\t\t\tformatDistanceToNow(new Date(notification.issuedAt), {\r\n\t\t\t\t\tincludeSeconds: true,\r\n\t\t\t\t})\r\n\t\t\t);\r\n\t\t}, 60000);\r\n\t\treturn () => clearInterval(id);\r\n\t});\r\n\r\n\tconst toggleOverflowMenu = () => {\r\n\t\tsetOverflowMenuOpen(!overflowMenuOpen);\r\n\t};\r\n\r\n\tconst overFlowActions = Object.assign({}, OverflowMenuActions);\r\n\tlet optionsToggleClassName = \"notification-card__more-options__toggle\";\r\n\r\n\tif (uiContext === \"center\") {\r\n\t\tdelete overFlowActions.DISMISS;\r\n\t\toverFlowActions.DETAILS.action = (notification: INotification) => {\r\n\t\t\tsetSelectedNotification(notification);\r\n\t\t};\r\n\t} else {\r\n\t\toptionsToggleClassName = \"notification-card__more-options__no-toggle\";\r\n\t\tdelete overFlowActions.MARK_AS_READ;\r\n\t\tdelete overFlowActions.MARK_AS_UNREAD;\r\n\t\tdelete overFlowActions.DETAILS;\r\n\t\tdelete overFlowActions.DISMISS;\r\n\t}\r\n\r\n\tuseEffect(() => {\r\n\t\tfunction listenMuteStateChanged(error: any, response: any) {\r\n\t\t\tif (error) {\r\n\t\t\t\tconsole.error(\"FinsembleNotificationsMuteStateChannel: \", error);\r\n\t\t\t} else {\r\n\t\t\t\tconst { data } = response;\r\n\t\t\t\tif (notification.source === data.source && notification.type === data.type) {\r\n\t\t\t\t\tsetIsMuteFilterApplied(data.isMuted);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t\tFSBL.Clients.RouterClient.addListener(\"FinsembleNotificationsMuteStateChannel\", listenMuteStateChanged);\r\n\t\treturn () => {\r\n\t\t\tFSBL.Clients.RouterClient.removeListener(\"FinsembleNotificationsMuteStateChannel\", listenMuteStateChanged);\r\n\t\t};\r\n\t}, []);\r\n\r\n\tconst menuActions = Object.values(overFlowActions).map((value) =>\r\n\t\trenderOverflowMenuAction(notification, value, isMuteFilterApplied)\r\n\t);\r\n\r\n\treturn (\r\n\t\t<div className={optionsToggleClassName} onMouseLeave={() => setOverflowMenuOpen(false)}>\r\n\t\t\t<span className=\"notification-card_overflow_menu\">\r\n\t\t\t\t<IconButton iconName=\"ff-dots-vert\" tooltip=\"Options\" clickHandler={toggleOverflowMenu}>\r\n\t\t\t\t\t{overflowMenuOpen ? <OverflowMenu closeSelf={setOverflowMenuOpen}>{menuActions}</OverflowMenu> : null}\r\n\t\t\t\t</IconButton>\r\n\t\t\t</span>\r\n\t\t\t{uiContext == \"toasts\" && (\r\n\t\t\t\t<IconButton\r\n\t\t\t\t\ticonName=\"ff-close\"\r\n\t\t\t\t\tclassNames={\"notification-card__dismiss no-hover\"}\r\n\t\t\t\t\ttooltip=\"Dismiss\"\r\n\t\t\t\t\tclickHandler={removeNotification}\r\n\t\t\t\t/>\r\n\t\t\t)}\r\n\t\t\t{uiContext == \"center\" && <span className=\"notification-card_timestamp\">{time}</span>}\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}
+{"version":3,"file":"NotificationCardHeaderControls.js","sourceRoot":"","sources":["../../../../../../src/components/notifications/components/shared/notificationCard/NotificationCardHeaderControls.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useEffect, useState } from \"react\";\r\nimport IconButton from \"../IconButton\";\r\nimport OverflowMenu, { OverflowMenuActions, renderOverflowMenuAction } from \"../OverflowMenu\";\r\nimport { NotificationsContext } from \"../../../notificationsContext\";\r\nimport { formatDistanceToNow } from \"date-fns\";\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\n\r\nexport const NotificationCardHeaderControls: React.FunctionComponent<{\r\n\tnotification: INotification;\r\n\tuiContext?: string;\r\n\tremoveNotification?: Function;\r\n}> = ({ notification, removeNotification, uiContext = \"center\" }) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst { setSelectedNotification, muteFilters } = notificationsContext;\r\n\r\n\tconst [overflowMenuOpen, setOverflowMenuOpen] = useState(false);\r\n\tconst [isMuteFilterApplied, setIsMuteFilterApplied] = useState(\r\n\t\tmuteFilters\r\n\t\t\t? muteFilters.some((filter) => filter.source === notification.source && filter.type === notification.type)\r\n\t\t\t: false\r\n\t);\r\n\r\n\tconst [time, setTime] = useState(\r\n\t\tformatDistanceToNow(new Date(notification.issuedAt), {\r\n\t\t\tincludeSeconds: true,\r\n\t\t})\r\n\t);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst id = setInterval(() => {\r\n\t\t\tsetTime(\r\n\t\t\t\tformatDistanceToNow(new Date(notification.issuedAt), {\r\n\t\t\t\t\tincludeSeconds: true,\r\n\t\t\t\t})\r\n\t\t\t);\r\n\t\t}, 60000);\r\n\t\treturn () => clearInterval(id);\r\n\t});\r\n\r\n\tconst toggleOverflowMenu = () => {\r\n\t\tsetOverflowMenuOpen(!overflowMenuOpen);\r\n\t};\r\n\r\n\tconst overFlowActions = Object.assign({}, OverflowMenuActions);\r\n\tlet optionsToggleClassName = \"notification-card__more-options__toggle\";\r\n\r\n\tif (uiContext === \"center\") {\r\n\t\tdelete overFlowActions.DISMISS;\r\n\t\toverFlowActions.DETAILS.action = (overflowNotification: INotification) => {\r\n\t\t\tsetSelectedNotification(overflowNotification);\r\n\t\t};\r\n\t} else {\r\n\t\toptionsToggleClassName = \"notification-card__more-options__no-toggle\";\r\n\t\tdelete overFlowActions.MARK_AS_READ;\r\n\t\tdelete overFlowActions.MARK_AS_UNREAD;\r\n\t\tdelete overFlowActions.DETAILS;\r\n\t\tdelete overFlowActions.DISMISS;\r\n\t}\r\n\r\n\tuseEffect(() => {\r\n\t\tfunction listenMuteStateChanged(error: any, response: any) {\r\n\t\t\tif (error) {\r\n\t\t\t\tconsole.error(\"FinsembleNotificationsMuteStateChannel: \", error);\r\n\t\t\t} else {\r\n\t\t\t\tconst { data } = response;\r\n\t\t\t\tif (notification.source === data.source && notification.type === data.type) {\r\n\t\t\t\t\tsetIsMuteFilterApplied(data.isMuted);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t\tFSBL.Clients.RouterClient.addListener(\"FinsembleNotificationsMuteStateChannel\", listenMuteStateChanged);\r\n\t\treturn () => {\r\n\t\t\tFSBL.Clients.RouterClient.removeListener(\"FinsembleNotificationsMuteStateChannel\", listenMuteStateChanged);\r\n\t\t};\r\n\t}, []);\r\n\r\n\tconst menuActions = Object.values(overFlowActions).map((value) =>\r\n\t\trenderOverflowMenuAction(notification, value, isMuteFilterApplied)\r\n\t);\r\n\r\n\treturn (\r\n\t\t<div className={optionsToggleClassName} onMouseLeave={() => setOverflowMenuOpen(false)}>\r\n\t\t\t<span className=\"notification-card_overflow_menu\">\r\n\t\t\t\t<IconButton iconName=\"ff-dots-vert\" tooltip=\"Options\" clickHandler={toggleOverflowMenu}>\r\n\t\t\t\t\t{overflowMenuOpen ? <OverflowMenu closeSelf={setOverflowMenuOpen}>{menuActions}</OverflowMenu> : null}\r\n\t\t\t\t</IconButton>\r\n\t\t\t</span>\r\n\t\t\t{uiContext == \"toasts\" && (\r\n\t\t\t\t<IconButton\r\n\t\t\t\t\ticonName=\"ff-close\"\r\n\t\t\t\t\tclassNames={\"notification-card__dismiss no-hover\"}\r\n\t\t\t\t\ttooltip=\"Dismiss\"\r\n\t\t\t\t\tclickHandler={removeNotification}\r\n\t\t\t\t/>\r\n\t\t\t)}\r\n\t\t\t{uiContext == \"center\" && <span className=\"notification-card_timestamp\">{time}</span>}\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}

package/react/components/notifications/components/shared/notificationCard/NotificationCardHeaderShell.d.ts

@@ -1,8 +1,9 @@
-/// <reference types="finsemble-core" />
 import React from "react";
-import { INotification } from "common/notifications/definitions/INotification";
+import { services } from "@finsemble/finsemble-core";
+declare type INotification = services.notification.types.INotification;
 export declare const NotificationCardHeaderShell: React.FunctionComponent<{
     notification: INotification;
     uiContext: string;
     removeNotification: Function;
 }>;
+export {};

package/react/components/notifications/components/shared/notificationCard/NotificationCardHeaderShell.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationCardHeaderShell.js","sourceRoot":"","sources":["../../../../../../src/components/notifications/components/shared/notificationCard/NotificationCardHeaderShell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,8BAA8B,EAAE,MAAM,kCAAkC,CAAC;AAClF,OAAO,EAAE,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AAC1E,OAAO,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,MAAM,CAAC,MAAM,2BAA2B,GAInC,CAAC,EAAE,YAAY,EAAE,kBAAkB,EAAE,SAAS,GAAG,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC7E,MAAM,oBAAoB,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAC9D,MAAM,EAAE,aAAa,EAAE,GAAG,oBAAoB,CAAC;IAE/C,OAAO,CACN,6BAAK,SAAS,EAAC,2BAA2B;QACxC,QAAQ,CAAC,CAAC,CAAC,CACX;YACE,aAAa,KAAK,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,oBAAC,WAAW,IAAC,YAAY,EAAE,YAAY,GAAI,CAAC,CAAC,CAAC,yCAAK;YAC/F,QAAQ,CACP,CACH,CAAC,CAAC,CAAC,CACH;YACE,aAAa,KAAK,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,CAC5C,oBAAC,WAAW,IAAC,YAAY,EAAE,YAAY,GAAI,CAC3C,CAAC,CAAC,CAAC,CACH,oBAAC,0BAA0B,IAAC,UAAU,EAAE,YAAY,CAAC,UAAU,GAAI,CACnE;YACD,6BAAK,SAAS,EAAC,0BAA0B,IAAE,YAAY,CAAC,KAAK,CAAO,CAClE,CACH;QACD,oBAAC,8BAA8B,IAC9B,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,kBAAkB,EACtC,SAAS,EAAE,SAAS,GACnB,CACG,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useContext } from \"react\";\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport { NotificationCardHeaderControls } from \"./NotificationCardHeaderControls\";\r\nimport { NotificationCardHeaderLogo } from \"./NotificationCardHeaderLogo\";\r\nimport { NotificationsContext } from \"../../../notificationsContext\";\r\nimport { SelectionMode } from \"../../../constants\";\r\nimport { CheckButton } from \"../CheckButton\";\r\n\r\nexport const NotificationCardHeaderShell: React.FunctionComponent<{\r\n\tnotification: INotification;\r\n\tuiContext: string;\r\n\tremoveNotification: Function;\r\n}> = ({ notification, removeNotification, uiContext = \"center\", children }) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst { selectionMode } = notificationsContext;\r\n\r\n\treturn (\r\n\t\t<div className=\"notification-card__header\">\r\n\t\t\t{children ? (\r\n\t\t\t\t<>\r\n\t\t\t\t\t{selectionMode === SelectionMode.SELECTION ? <CheckButton notification={notification} /> : <></>}\r\n\t\t\t\t\t{children}\r\n\t\t\t\t</>\r\n\t\t\t) : (\r\n\t\t\t\t<>\r\n\t\t\t\t\t{selectionMode === SelectionMode.SELECTION ? (\r\n\t\t\t\t\t\t<CheckButton notification={notification} />\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t<NotificationCardHeaderLogo headerLogo={notification.headerLogo} />\r\n\t\t\t\t\t)}\r\n\t\t\t\t\t<div className=\"notification-card__title\">{notification.title}</div>\r\n\t\t\t\t</>\r\n\t\t\t)}\r\n\t\t\t<NotificationCardHeaderControls\r\n\t\t\t\tnotification={notification}\r\n\t\t\t\tremoveNotification={removeNotification}\r\n\t\t\t\tuiContext={uiContext}\r\n\t\t\t/>\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}
+{"version":3,"file":"NotificationCardHeaderShell.js","sourceRoot":"","sources":["../../../../../../src/components/notifications/components/shared/notificationCard/NotificationCardHeaderShell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,8BAA8B,EAAE,MAAM,kCAAkC,CAAC;AAClF,OAAO,EAAE,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AAC1E,OAAO,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAK7C,MAAM,CAAC,MAAM,2BAA2B,GAInC,CAAC,EAAE,YAAY,EAAE,kBAAkB,EAAE,SAAS,GAAG,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC7E,MAAM,oBAAoB,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAC9D,MAAM,EAAE,aAAa,EAAE,GAAG,oBAAoB,CAAC;IAE/C,OAAO,CACN,6BAAK,SAAS,EAAC,2BAA2B;QACxC,QAAQ,CAAC,CAAC,CAAC,CACX;YACE,aAAa,KAAK,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,oBAAC,WAAW,IAAC,YAAY,EAAE,YAAY,GAAI,CAAC,CAAC,CAAC,yCAAK;YAC/F,QAAQ,CACP,CACH,CAAC,CAAC,CAAC,CACH;YACE,aAAa,KAAK,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,CAC5C,oBAAC,WAAW,IAAC,YAAY,EAAE,YAAY,GAAI,CAC3C,CAAC,CAAC,CAAC,CACH,oBAAC,0BAA0B,IAAC,UAAU,EAAE,YAAY,CAAC,UAAU,GAAI,CACnE;YACD,6BAAK,SAAS,EAAC,0BAA0B,IAAE,YAAY,CAAC,KAAK,CAAO,CAClE,CACH;QACD,oBAAC,8BAA8B,IAC9B,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,kBAAkB,EACtC,SAAS,EAAE,SAAS,GACnB,CACG,CACN,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useContext } from \"react\";\r\nimport { NotificationCardHeaderControls } from \"./NotificationCardHeaderControls\";\r\nimport { NotificationCardHeaderLogo } from \"./NotificationCardHeaderLogo\";\r\nimport { NotificationsContext } from \"../../../notificationsContext\";\r\nimport { SelectionMode } from \"../../../constants\";\r\nimport { CheckButton } from \"../CheckButton\";\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\n\r\nexport const NotificationCardHeaderShell: React.FunctionComponent<{\r\n\tnotification: INotification;\r\n\tuiContext: string;\r\n\tremoveNotification: Function;\r\n}> = ({ notification, removeNotification, uiContext = \"center\", children }) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst { selectionMode } = notificationsContext;\r\n\r\n\treturn (\r\n\t\t<div className=\"notification-card__header\">\r\n\t\t\t{children ? (\r\n\t\t\t\t<>\r\n\t\t\t\t\t{selectionMode === SelectionMode.SELECTION ? <CheckButton notification={notification} /> : <></>}\r\n\t\t\t\t\t{children}\r\n\t\t\t\t</>\r\n\t\t\t) : (\r\n\t\t\t\t<>\r\n\t\t\t\t\t{selectionMode === SelectionMode.SELECTION ? (\r\n\t\t\t\t\t\t<CheckButton notification={notification} />\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t<NotificationCardHeaderLogo headerLogo={notification.headerLogo} />\r\n\t\t\t\t\t)}\r\n\t\t\t\t\t<div className=\"notification-card__title\">{notification.title}</div>\r\n\t\t\t\t</>\r\n\t\t\t)}\r\n\t\t\t<NotificationCardHeaderControls\r\n\t\t\t\tnotification={notification}\r\n\t\t\t\tremoveNotification={removeNotification}\r\n\t\t\t\tuiContext={uiContext}\r\n\t\t\t/>\r\n\t\t</div>\r\n\t);\r\n};\r\n"]}

package/react/components/notifications/components/views/CardView.js

@@ -13,17 +13,14 @@ var Periods;
 })(Periods || (Periods = {}));
 const isEmpty = (byPeriodNotifications, accountForSnooze) => {
     if (accountForSnooze) {
-        return Object.values(byPeriodNotifications).every((value) => {
-            return value.length === 0;
-        });
+        return Object.values(byPeriodNotifications).every((value) => value.length === 0);
     }
     else {
-        return Object.values(byPeriodNotifications).every((value) => {
-            return value.length === 0 || value.filter((notification) => !notification.isSnoozed).length === 0;
-        });
+        return Object.values(byPeriodNotifications).every((value) => value.length === 0 || value.filter((notification) => !notification.isSnoozed).length === 0);
     }
 };
 export const CardView = (props) => {
+    var _a;
     const { notifications } = props;
     const notificationsContext = useContext(NotificationsContext);
     const { drawerControlProps, searchString, filteredNotifications, setFilteredNotifications } = notificationsContext;
@@ -42,7 +39,7 @@ export const CardView = (props) => {
             setFilteredNotifications(searchNotifications(notifications, searchString));
         }
     }, [searchString, notifications]);
-    const controlFilteredNotifications = activeFilter ? activeFilter.run?.(filteredNotifications) : [];
+    const controlFilteredNotifications = activeFilter ? (_a = activeFilter.run) === null || _a === void 0 ? void 0 : _a.call(activeFilter, filteredNotifications) : [];
     controlFilteredNotifications.reduce((accumulator, notification) => {
         const notificationDate = Date.parse(notification.issuedAt);
         if (isToday(notificationDate)) {
@@ -74,23 +71,17 @@ export const CardView = (props) => {
             return React.createElement("p", { className: "notification-day" }, "Older");
         }
     };
-    const renderNotificationsBlock = (period) => {
-        return byPeriodNotifications[period]
-            .sort((a, b) => {
-            return Date.parse(b.issuedAt) - Date.parse(a.issuedAt);
-        })
-            .filter((notification) => (activeFilter.action === "snoozed" ? notification.isSnoozed : !notification.isSnoozed))
-            .map((notification, index) => {
-            const id = notification.id || index.toString();
-            return (React.createElement("div", { key: id },
-                index === 0 ? renderSeparatorLabel(period) : null,
-                React.createElement(NotificationCardComponent, { notification: notification, removeNotification: () => { }, uiContext: "center" }),
-                React.createElement("div", { className: "divider" }, "\u00A0")));
-        });
-    };
-    return isEmpty(byPeriodNotifications, activeFilter.action === "snoozed") ? (React.createElement(NoNotifications, null)) : (React.createElement(React.Fragment, null, Object.keys(byPeriodNotifications).map((period) => {
-        return renderNotificationsBlock(period);
-    })));
+    const renderNotificationsBlock = (period) => byPeriodNotifications[period]
+        .sort((a, b) => Date.parse(b.issuedAt) - Date.parse(a.issuedAt))
+        .filter((notification) => (activeFilter.action === "snoozed" ? notification.isSnoozed : !notification.isSnoozed))
+        .map((notification, index) => {
+        const id = notification.id || index.toString();
+        return (React.createElement("div", { key: id },
+            index === 0 ? renderSeparatorLabel(period) : null,
+            React.createElement(NotificationCardComponent, { notification: notification, removeNotification: () => { }, uiContext: "center" }),
+            React.createElement("div", { className: "divider" }, "\u00A0")));
+    });
+    return isEmpty(byPeriodNotifications, activeFilter.action === "snoozed") ? (React.createElement(NoNotifications, null)) : (React.createElement(React.Fragment, null, Object.keys(byPeriodNotifications).map((period) => renderNotificationsBlock(period))));
 };
 export default CardView;
 //# sourceMappingURL=CardView.js.map

package/react/components/notifications/components/views/CardView.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardView.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/views/CardView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useEffect } from \"react\";\r\nimport { isToday, isYesterday, isThisWeek } from \"date-fns\";\r\n\r\n// Types\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport { NotificationCardViewProps } from \"../../types\";\r\n\r\n// Context\r\nimport { NotificationsContext } from \"../../notificationsContext\";\r\n\r\n// Components\r\nimport { NotificationCardShell } from \"../shared/NotificationCardShell\";\r\nimport NoNotifications from \"../NoNotifications\";\r\n\r\n// Utils\r\nimport { getActiveFilter, searchNotifications } from \"../../utils\";\r\n\r\nenum Periods {\r\n\tTODAY = \"today\",\r\n\tTHIS_WEEK = \"thisWeek\",\r\n\tYESTERDAY = \"yesterday\",\r\n\tOLDER = \"older\",\r\n}\r\n\r\nconst isEmpty = (byPeriodNotifications: Record<Periods, INotification[]>, accountForSnooze: boolean) => {\r\n\tif (accountForSnooze) {\r\n\t\treturn Object.values(byPeriodNotifications).every((value: INotification[]) => {\r\n\t\t\treturn value.length === 0;\r\n\t\t});\r\n\t} else {\r\n\t\treturn Object.values(byPeriodNotifications).every((value: INotification[]) => {\r\n\t\t\treturn value.length === 0 || value.filter((notification: INotification) => !notification.isSnoozed).length === 0;\r\n\t\t});\r\n\t}\r\n};\r\n\r\nexport const CardView: React.FunctionComponent<NotificationCardViewProps> = (props: NotificationCardViewProps) => {\r\n\tconst { notifications } = props;\r\n\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst { drawerControlProps, searchString, filteredNotifications, setFilteredNotifications } = notificationsContext;\r\n\tconst activeFilter = getActiveFilter(drawerControlProps);\r\n\r\n\tconst byPeriodNotifications: Record<Periods, INotification[]> = {\r\n\t\ttoday: [],\r\n\t\tyesterday: [],\r\n\t\tthisWeek: [],\r\n\t\tolder: [],\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tif (searchString === \"\") {\r\n\t\t\tsetFilteredNotifications(notifications);\r\n\t\t} else {\r\n\t\t\tsetFilteredNotifications(searchNotifications(notifications, searchString));\r\n\t\t}\r\n\t}, [searchString, notifications]);\r\n\r\n\tconst controlFilteredNotifications = activeFilter ? activeFilter.run?.(filteredNotifications) : [];\r\n\r\n\tcontrolFilteredNotifications.reduce((accumulator: any, notification: INotification) => {\r\n\t\tconst notificationDate: number = Date.parse(notification.issuedAt);\r\n\t\tif (isToday(notificationDate)) {\r\n\t\t\taccumulator.today.push(notification);\r\n\t\t} else if (isYesterday(notificationDate)) {\r\n\t\t\taccumulator.yesterday.push(notification);\r\n\t\t} else if (isThisWeek(notificationDate)) {\r\n\t\t\taccumulator.thisWeek.push(notification);\r\n\t\t} else {\r\n\t\t\taccumulator.older.push(notification);\r\n\t\t}\r\n\t\treturn accumulator;\r\n\t}, byPeriodNotifications);\r\n\r\n\tconst NotificationCardComponent = props.notificationCard ? props.notificationCard : NotificationCardShell;\r\n\r\n\tconst renderSeparatorLabel = (period: string) => {\r\n\t\tif (period === Periods.TODAY) {\r\n\t\t\treturn <p className=\"notification-day\">Today</p>;\r\n\t\t} else if (period === Periods.YESTERDAY) {\r\n\t\t\treturn <p className=\"notification-day\">Yesterday</p>;\r\n\t\t} else if (period === Periods.THIS_WEEK) {\r\n\t\t\treturn <p className=\"notification-day\">This Week</p>;\r\n\t\t} else {\r\n\t\t\treturn <p className=\"notification-day\">Older</p>;\r\n\t\t}\r\n\t};\r\n\r\n\tconst renderNotificationsBlock = (period: Periods) => {\r\n\t\treturn byPeriodNotifications[period]\r\n\t\t\t.sort((a: INotification, b: INotification) => {\r\n\t\t\t\treturn Date.parse(b.issuedAt) - Date.parse(a.issuedAt);\r\n\t\t\t})\r\n\t\t\t.filter((notification) => (activeFilter.action === \"snoozed\" ? notification.isSnoozed : !notification.isSnoozed))\r\n\t\t\t.map((notification, index) => {\r\n\t\t\t\tconst id = notification.id || index.toString();\r\n\t\t\t\treturn (\r\n\t\t\t\t\t<div key={id}>\r\n\t\t\t\t\t\t{index === 0 ? renderSeparatorLabel(period) : null}\r\n\t\t\t\t\t\t<NotificationCardComponent notification={notification} removeNotification={() => {}} uiContext={\"center\"} />\r\n\t\t\t\t\t\t<div className=\"divider\">&nbsp;</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t);\r\n\t\t\t});\r\n\t};\r\n\r\n\treturn isEmpty(byPeriodNotifications, activeFilter.action === \"snoozed\") ? (\r\n\t\t<NoNotifications />\r\n\t) : (\r\n\t\t<>\r\n\t\t\t{Object.keys(byPeriodNotifications).map((period) => {\r\n\t\t\t\treturn renderNotificationsBlock(period as Periods);\r\n\t\t\t})}\r\n\t\t</>\r\n\t);\r\n};\r\n\r\nexport default CardView;\r\n"]}
+{"version":3,"file":"CardView.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/views/CardView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useEffect } from \"react\";\r\nimport { isToday, isYesterday, isThisWeek } from \"date-fns\";\r\n\r\n// Types\r\nimport { NotificationCardViewProps } from \"../../types\";\r\n\r\n// Context\r\nimport { NotificationsContext } from \"../../notificationsContext\";\r\n\r\n// Components\r\nimport { NotificationCardShell } from \"../shared/NotificationCardShell\";\r\nimport NoNotifications from \"../NoNotifications\";\r\n\r\n// Utils\r\nimport { getActiveFilter, searchNotifications } from \"../../utils\";\r\n\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\n\r\nenum Periods {\r\n\tTODAY = \"today\",\r\n\tTHIS_WEEK = \"thisWeek\",\r\n\tYESTERDAY = \"yesterday\",\r\n\tOLDER = \"older\",\r\n}\r\n\r\nconst isEmpty = (byPeriodNotifications: Record<Periods, INotification[]>, accountForSnooze: boolean) => {\r\n\tif (accountForSnooze) {\r\n\t\treturn Object.values(byPeriodNotifications).every((value: INotification[]) => value.length === 0);\r\n\t} else {\r\n\t\treturn Object.values(byPeriodNotifications).every(\r\n\t\t\t(value: INotification[]) =>\r\n\t\t\t\tvalue.length === 0 || value.filter((notification: INotification) => !notification.isSnoozed).length === 0\r\n\t\t);\r\n\t}\r\n};\r\n\r\nexport const CardView: React.FunctionComponent<NotificationCardViewProps> = (props: NotificationCardViewProps) => {\r\n\tconst { notifications } = props;\r\n\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst { drawerControlProps, searchString, filteredNotifications, setFilteredNotifications } = notificationsContext;\r\n\tconst activeFilter = getActiveFilter(drawerControlProps);\r\n\r\n\tconst byPeriodNotifications: Record<Periods, INotification[]> = {\r\n\t\ttoday: [],\r\n\t\tyesterday: [],\r\n\t\tthisWeek: [],\r\n\t\tolder: [],\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tif (searchString === \"\") {\r\n\t\t\tsetFilteredNotifications(notifications);\r\n\t\t} else {\r\n\t\t\tsetFilteredNotifications(searchNotifications(notifications, searchString));\r\n\t\t}\r\n\t}, [searchString, notifications]);\r\n\r\n\tconst controlFilteredNotifications = activeFilter ? activeFilter.run?.(filteredNotifications) : [];\r\n\r\n\tcontrolFilteredNotifications.reduce((accumulator: any, notification: INotification) => {\r\n\t\tconst notificationDate: number = Date.parse(notification.issuedAt);\r\n\t\tif (isToday(notificationDate)) {\r\n\t\t\taccumulator.today.push(notification);\r\n\t\t} else if (isYesterday(notificationDate)) {\r\n\t\t\taccumulator.yesterday.push(notification);\r\n\t\t} else if (isThisWeek(notificationDate)) {\r\n\t\t\taccumulator.thisWeek.push(notification);\r\n\t\t} else {\r\n\t\t\taccumulator.older.push(notification);\r\n\t\t}\r\n\t\treturn accumulator;\r\n\t}, byPeriodNotifications);\r\n\r\n\tconst NotificationCardComponent = props.notificationCard ? props.notificationCard : NotificationCardShell;\r\n\r\n\tconst renderSeparatorLabel = (period: string) => {\r\n\t\tif (period === Periods.TODAY) {\r\n\t\t\treturn <p className=\"notification-day\">Today</p>;\r\n\t\t} else if (period === Periods.YESTERDAY) {\r\n\t\t\treturn <p className=\"notification-day\">Yesterday</p>;\r\n\t\t} else if (period === Periods.THIS_WEEK) {\r\n\t\t\treturn <p className=\"notification-day\">This Week</p>;\r\n\t\t} else {\r\n\t\t\treturn <p className=\"notification-day\">Older</p>;\r\n\t\t}\r\n\t};\r\n\r\n\tconst renderNotificationsBlock = (period: Periods) =>\r\n\t\tbyPeriodNotifications[period]\r\n\t\t\t.sort((a: INotification, b: INotification) => Date.parse(b.issuedAt) - Date.parse(a.issuedAt))\r\n\t\t\t.filter((notification) => (activeFilter.action === \"snoozed\" ? notification.isSnoozed : !notification.isSnoozed))\r\n\t\t\t.map((notification, index) => {\r\n\t\t\t\tconst id = notification.id || index.toString();\r\n\t\t\t\treturn (\r\n\t\t\t\t\t<div key={id}>\r\n\t\t\t\t\t\t{index === 0 ? renderSeparatorLabel(period) : null}\r\n\t\t\t\t\t\t<NotificationCardComponent notification={notification} removeNotification={() => {}} uiContext={\"center\"} />\r\n\t\t\t\t\t\t<div className=\"divider\">&nbsp;</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t);\r\n\t\t\t});\r\n\r\n\treturn isEmpty(byPeriodNotifications, activeFilter.action === \"snoozed\") ? (\r\n\t\t<NoNotifications />\r\n\t) : (\r\n\t\t<>{Object.keys(byPeriodNotifications).map((period) => renderNotificationsBlock(period as Periods))}</>\r\n\t);\r\n};\r\n\r\nexport default CardView;\r\n"]}

package/react/components/notifications/components/views/ListView.d.ts

@@ -1,7 +1,7 @@
-/// <reference types="finsemble-core" />
 import React from "react";
-import { INotification } from "common/notifications/definitions/INotification";
 import { NotificationListViewProps } from "../../types";
+import { services } from "@finsemble/finsemble-core";
+declare type INotification = services.notification.types.INotification;
 export declare type NotificationListRowPropType = {
     notification: INotification;
     newNotificationHaloPeriodSeconds: number;

package/react/components/notifications/components/views/ListView.js

@@ -15,9 +15,9 @@ const ListHeaderComponent = () => (React.createElement("div", { className: "list
     React.createElement("div", { className: "list-header_cell" }, "")));
 export const NotificationListRowShell = ({ notification, newNotificationHaloPeriodSeconds, children, }) => {
     const notificationsContext = useContext(NotificationsContext);
-    const { setSelectedNotification, muteFilters, selectionMode, checkedNotifications } = notificationsContext;
+    const { setSelectedNotification, muteFilters, selectionMode } = notificationsContext;
     const [overflowMenuOpen, setOverflowMenuOpen] = useState(false);
-    const toggleOverflowMenu = (event) => {
+    const toggleOverflowMenu = () => {
         setOverflowMenuOpen(!overflowMenuOpen);
     };
     const [isNew, setIsNew] = useState(isNewNotification(notification, newNotificationHaloPeriodSeconds));
@@ -50,10 +50,11 @@ export const NotificationListRowShell = ({ notification, newNotificationHaloPeri
         if (isReNotification(notification, newNotificationHaloPeriodSeconds)) {
             const mostRecentAction = getMostRecentAction(notification);
             if (mostRecentAction) {
+                const { datePerformed } = mostRecentAction;
                 setWokeFromSnooze(true);
                 isRenotificationTimerId = setTimeout(() => {
                     setWokeFromSnooze(false);
-                }, differenceInMilliseconds(addSeconds(parseISO(mostRecentAction.datePerformed), newNotificationHaloPeriodSeconds), Date.now()));
+                }, differenceInMilliseconds(addSeconds(parseISO(datePerformed), newNotificationHaloPeriodSeconds), Date.now()));
             }
         }
         else {
@@ -65,8 +66,8 @@ export const NotificationListRowShell = ({ notification, newNotificationHaloPeri
         };
     }, [newNotificationHaloPeriodSeconds, notification]);
     const overFlowActions = Object.assign({}, OverflowMenuActions);
-    overFlowActions.DETAILS.action = (notification) => {
-        setSelectedNotification(notification);
+    overFlowActions.DETAILS.action = (detailNotification) => {
+        setSelectedNotification(detailNotification);
     };
     delete overFlowActions.DISMISS;
     useEffect(() => {
@@ -102,6 +103,7 @@ export const NotificationListRowShell = ({ notification, newNotificationHaloPeri
                 React.createElement(IconButton, { iconName: "ff-dots-vert", tooltip: "Options", clickHandler: toggleOverflowMenu }, overflowMenuOpen ? React.createElement(OverflowMenu, { closeSelf: setOverflowMenuOpen }, menuActions) : null)))));
 };
 const ListView = ({ notificationHeaderRow, notificationListRow, notifications, }) => {
+    var _a;
     const notificationsContext = useContext(NotificationsContext);
     const { drawerControlProps, searchString, filteredNotifications, setFilteredNotifications } = notificationsContext;
     const activeFilter = getActiveFilter(drawerControlProps);
@@ -124,10 +126,8 @@ const ListView = ({ notificationHeaderRow, notificationListRow, notifications, }
             setFilteredNotifications(searchNotifications(notifications, searchString));
         }
     }, [searchString, notifications]);
-    let controlFilteredNotifications = activeFilter ? activeFilter.run?.(filteredNotifications) : [];
-    controlFilteredNotifications.sort((a, b) => {
-        return Date.parse(b.issuedAt) - Date.parse(a.issuedAt);
-    });
+    let controlFilteredNotifications = activeFilter ? (_a = activeFilter.run) === null || _a === void 0 ? void 0 : _a.call(activeFilter, filteredNotifications) : [];
+    controlFilteredNotifications.sort((a, b) => Date.parse(b.issuedAt) - Date.parse(a.issuedAt));
     controlFilteredNotifications = controlFilteredNotifications.filter((notification) => activeFilter.action === "snoozed" ? notification.isSnoozed : !notification.isSnoozed);
     return controlFilteredNotifications.length === 0 ? (React.createElement(NoNotifications, null)) : (React.createElement(React.Fragment, null,
         React.createElement(NotificationHeaderRow, null),

package/react/components/notifications/components/views/ListView.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListView.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/views/ListView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useState, useEffect } from \"react\";\r\nimport { format, differenceInMilliseconds, parseISO, addSeconds } from \"date-fns\";\r\n\r\n// types\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport { NotificationListViewProps } from \"../../types\";\r\nimport IPerformedAction from \"common/notifications/definitions/IPerformedAction\";\r\n\r\n// Context\r\nimport { NotificationsContext } from \"../../notificationsContext\";\r\n\r\n// Components\r\nimport IconButton from \"../shared/IconButton\";\r\nimport NoNotifications from \"../NoNotifications\";\r\nimport OverflowMenu, { OverflowMenuActions, renderOverflowMenuAction } from \"../shared/OverflowMenu\";\r\nimport { CheckButton } from \"../shared/CheckButton\";\r\n\r\n// Utils\r\nimport {\r\n\tgetActiveFilter,\r\n\tgetMostRecentAction,\r\n\tisNewNotification,\r\n\tisReNotification,\r\n\tsearchNotifications,\r\n} from \"../../utils\";\r\n\r\nimport { NotificationCardHeaderLogo } from \"../shared/notificationCard/NotificationCardHeaderLogo\";\r\n\r\n// Constants\r\nimport { SelectionMode } from \"../../constants\";\r\n\r\nconst ListHeaderComponent = () => (\r\n\t<div className=\"list-header__container\">\r\n\t\t<div className=\"list-header_cell\">Received</div>\r\n\t\t<div className=\"list-header_cell\">App</div>\r\n\t\t<div className=\"list-header_cell\">Content</div>\r\n\t\t<div className=\"list-header_cell\">{\"\"}</div>\r\n\t</div>\r\n);\r\n\r\nexport type NotificationListRowPropType = {\r\n\tnotification: INotification;\r\n\tnewNotificationHaloPeriodSeconds: number;\r\n};\r\n\r\nexport const NotificationListRowShell: React.FunctionComponent<NotificationListRowPropType> = ({\r\n\tnotification,\r\n\tnewNotificationHaloPeriodSeconds,\r\n\tchildren,\r\n}: any) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst { setSelectedNotification, muteFilters, selectionMode, checkedNotifications } = notificationsContext;\r\n\tconst [overflowMenuOpen, setOverflowMenuOpen] = useState(false);\r\n\tconst toggleOverflowMenu = (event: React.MouseEvent) => {\r\n\t\tsetOverflowMenuOpen(!overflowMenuOpen);\r\n\t};\r\n\r\n\tconst [isNew, setIsNew] = useState(isNewNotification(notification, newNotificationHaloPeriodSeconds));\r\n\tconst [wokeFromSnooze, setWokeFromSnooze] = useState(\r\n\t\tisReNotification(notification, newNotificationHaloPeriodSeconds)\r\n\t);\r\n\tconst [isMuteFilterApplied, setIsMuteFilterApplied] = useState(\r\n\t\tmuteFilters\r\n\t\t\t? muteFilters.some((filter) => filter.source === notification.source && filter.type === notification.type)\r\n\t\t\t: false\r\n\t);\r\n\r\n\t// effect needed as the newNotificationHaloPeriodSeconds is fecthed asynchronously in the parent component\r\n\t// and sometimes at the first render, this value is still 0\r\n\tuseEffect(() => {\r\n\t\tsetIsNew(isNewNotification(notification, newNotificationHaloPeriodSeconds));\r\n\t}, [newNotificationHaloPeriodSeconds]);\r\n\r\n\tuseEffect(() => {\r\n\t\tlet isNewTimerId: any;\r\n\t\tif (isNew) {\r\n\t\t\tif (notification.isRead) {\r\n\t\t\t\tsetIsNew(false);\r\n\t\t\t\tclearTimeout(isNewTimerId);\r\n\t\t\t} else {\r\n\t\t\t\tisNewTimerId = setTimeout(() => {\r\n\t\t\t\t\tsetIsNew(false);\r\n\t\t\t\t}, differenceInMilliseconds(addSeconds(parseISO(notification.issuedAt), newNotificationHaloPeriodSeconds), Date.now()));\r\n\t\t\t}\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\tclearTimeout(isNewTimerId);\r\n\t\t};\r\n\t}, [isNew, notification]);\r\n\r\n\tuseEffect(() => {\r\n\t\tlet isRenotificationTimerId: any;\r\n\t\tif (isReNotification(notification, newNotificationHaloPeriodSeconds)) {\r\n\t\t\tconst mostRecentAction: IPerformedAction | null = getMostRecentAction(notification);\r\n\t\t\tif (mostRecentAction) {\r\n\t\t\t\tsetWokeFromSnooze(true);\r\n\t\t\t\tisRenotificationTimerId = setTimeout(() => {\r\n\t\t\t\t\tsetWokeFromSnooze(false);\r\n\t\t\t\t}, differenceInMilliseconds(addSeconds(parseISO(mostRecentAction.datePerformed), newNotificationHaloPeriodSeconds), Date.now()));\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tsetWokeFromSnooze(false);\r\n\t\t\tclearTimeout(isRenotificationTimerId);\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\tclearTimeout(isRenotificationTimerId);\r\n\t\t};\r\n\t}, [newNotificationHaloPeriodSeconds, notification]);\r\n\r\n\tconst overFlowActions = Object.assign({}, OverflowMenuActions);\r\n\toverFlowActions.DETAILS.action = (notification: INotification) => {\r\n\t\tsetSelectedNotification(notification);\r\n\t};\r\n\r\n\tdelete overFlowActions.DISMISS;\r\n\r\n\tuseEffect(() => {\r\n\t\tfunction listenMuteStateChanged(error: any, response: any) {\r\n\t\t\tif (error) {\r\n\t\t\t\tconsole.error(\"FinsembleNotificationsMuteStateChannel: \", error);\r\n\t\t\t} else {\r\n\t\t\t\tconst { data } = response;\r\n\t\t\t\tif (notification.source === data.source && notification.type === data.type) {\r\n\t\t\t\t\tsetIsMuteFilterApplied(data.isMuted);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t\tFSBL.Clients.RouterClient.addListener(\"FinsembleNotificationsMuteStateChannel\", listenMuteStateChanged);\r\n\t\treturn () => {\r\n\t\t\tFSBL.Clients.RouterClient.removeListener(\"FinsembleNotificationsMuteStateChannel\", listenMuteStateChanged);\r\n\t\t};\r\n\t}, []);\r\n\r\n\tconst menuActions = Object.values(overFlowActions).map((value) =>\r\n\t\trenderOverflowMenuAction(notification, value, isMuteFilterApplied)\r\n\t);\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={`list-row__container notification-item ${notification.isRead ? \"is-read\" : \"\"} ${\r\n\t\t\t\tisNew || wokeFromSnooze ? \"new\" : \"\"\r\n\t\t\t}\r\n\t\t\t\t${notification.cssClassName ? notification.cssClassName : \"\"}`}\r\n\t\t>\r\n\t\t\t{children ? (\r\n\t\t\t\t<>\r\n\t\t\t\t\t{selectionMode === SelectionMode.SELECTION ? (\r\n\t\t\t\t\t\t<div className=\"list-row__cell\">\r\n\t\t\t\t\t\t\t<CheckButton notification={notification} />\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t<></>\r\n\t\t\t\t\t)}\r\n\t\t\t\t\t{children}\r\n\t\t\t\t</>\r\n\t\t\t) : (\r\n\t\t\t\t<>\r\n\t\t\t\t\t<div className=\"list-row__cell\">{format(Date.parse(notification.issuedAt), \"dd-MM-yyyy HH:mm\")}</div>\r\n\t\t\t\t\t<div className=\"list-row__cell\">\r\n\t\t\t\t\t\t{selectionMode === SelectionMode.SELECTION ? (\r\n\t\t\t\t\t\t\t<div className=\"list-row__cell\">\r\n\t\t\t\t\t\t\t\t<CheckButton notification={notification} />\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<NotificationCardHeaderLogo headerLogo={notification.headerLogo} />\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div className=\"list-row__cell\">{`${notification.title} - ${notification.details}`}</div>\r\n\t\t\t\t</>\r\n\t\t\t)}\r\n\t\t\t<div className=\"list-row__cell\">\r\n\t\t\t\t<span>\r\n\t\t\t\t\t<IconButton iconName=\"ff-dots-vert\" tooltip=\"Options\" clickHandler={toggleOverflowMenu}>\r\n\t\t\t\t\t\t{overflowMenuOpen ? <OverflowMenu closeSelf={setOverflowMenuOpen}>{menuActions}</OverflowMenu> : null}\r\n\t\t\t\t\t</IconButton>\r\n\t\t\t\t</span>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nconst ListView: React.FunctionComponent<NotificationListViewProps> = ({\r\n\tnotificationHeaderRow,\r\n\tnotificationListRow,\r\n\tnotifications,\r\n}) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\t// The context will be used to filter the notifications\r\n\tconst { drawerControlProps, searchString, filteredNotifications, setFilteredNotifications } = notificationsContext;\r\n\r\n\tconst activeFilter = getActiveFilter(drawerControlProps);\r\n\r\n\tconst [newNotificationHaloPeriodSeconds, setNotificationHaloPeriodSeconds] = useState(0);\r\n\r\n\tconst NotificationHeaderRow = notificationHeaderRow || ListHeaderComponent;\r\n\tconst NotificationListRow = notificationListRow || NotificationListRowShell;\r\n\r\n\t// Sets the current default preference\r\n\tuseEffect(() => {\r\n\t\tasync function getNotificationsPreferences() {\r\n\t\t\treturn await FSBL.Clients.NotificationClient.getPreferences();\r\n\t\t}\r\n\r\n\t\tgetNotificationsPreferences().then((preferences: any) => {\r\n\t\t\tsetNotificationHaloPeriodSeconds(preferences.newNotificationHaloPeriodSeconds);\r\n\t\t});\r\n\t}, []);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (searchString === \"\") {\r\n\t\t\tsetFilteredNotifications(notifications);\r\n\t\t} else {\r\n\t\t\tsetFilteredNotifications(searchNotifications(notifications, searchString));\r\n\t\t}\r\n\t}, [searchString, notifications]);\r\n\r\n\tlet controlFilteredNotifications = activeFilter ? activeFilter.run?.(filteredNotifications) : [];\r\n\tcontrolFilteredNotifications.sort((a: INotification, b: INotification) => {\r\n\t\treturn Date.parse(b.issuedAt) - Date.parse(a.issuedAt);\r\n\t});\r\n\r\n\tcontrolFilteredNotifications = controlFilteredNotifications.filter((notification: INotification) =>\r\n\t\tactiveFilter.action === \"snoozed\" ? notification.isSnoozed : !notification.isSnoozed\r\n\t);\r\n\r\n\treturn controlFilteredNotifications.length === 0 ? (\r\n\t\t<NoNotifications />\r\n\t) : (\r\n\t\t<>\r\n\t\t\t<NotificationHeaderRow />\r\n\t\t\t{controlFilteredNotifications.map((notification: INotification, index: number) => {\r\n\t\t\t\tconst key = `${index}_${notification.id ? notification.id : notification.issuedAt}`;\r\n\t\t\t\treturn (\r\n\t\t\t\t\t<NotificationListRow\r\n\t\t\t\t\t\tkey={key}\r\n\t\t\t\t\t\tnotification={notification}\r\n\t\t\t\t\t\tnewNotificationHaloPeriodSeconds={newNotificationHaloPeriodSeconds}\r\n\t\t\t\t\t/>\r\n\t\t\t\t);\r\n\t\t\t})}\r\n\t\t</>\r\n\t);\r\n};\r\n\r\nexport default ListView;\r\n"]}
+{"version":3,"file":"ListView.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/views/ListView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useState, useEffect } from \"react\";\r\nimport { format, differenceInMilliseconds, parseISO, addSeconds } from \"date-fns\";\r\n\r\n// types\r\nimport { NotificationListViewProps } from \"../../types\";\r\n\r\n// Context\r\nimport { NotificationsContext } from \"../../notificationsContext\";\r\n\r\n// Components\r\nimport IconButton from \"../shared/IconButton\";\r\nimport NoNotifications from \"../NoNotifications\";\r\nimport OverflowMenu, { OverflowMenuActions, renderOverflowMenuAction } from \"../shared/OverflowMenu\";\r\nimport { CheckButton } from \"../shared/CheckButton\";\r\n\r\n// Utils\r\nimport {\r\n\tgetActiveFilter,\r\n\tgetMostRecentAction,\r\n\tisNewNotification,\r\n\tisReNotification,\r\n\tsearchNotifications,\r\n} from \"../../utils\";\r\n\r\nimport { NotificationCardHeaderLogo } from \"../shared/notificationCard/NotificationCardHeaderLogo\";\r\n\r\n// Constants\r\nimport { SelectionMode } from \"../../constants\";\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\ntype IPerformedAction = services.notification.types.IPerformedAction;\r\n\r\nconst ListHeaderComponent = () => (\r\n\t<div className=\"list-header__container\">\r\n\t\t<div className=\"list-header_cell\">Received</div>\r\n\t\t<div className=\"list-header_cell\">App</div>\r\n\t\t<div className=\"list-header_cell\">Content</div>\r\n\t\t<div className=\"list-header_cell\">{\"\"}</div>\r\n\t</div>\r\n);\r\n\r\nexport type NotificationListRowPropType = {\r\n\tnotification: INotification;\r\n\tnewNotificationHaloPeriodSeconds: number;\r\n};\r\n\r\nexport const NotificationListRowShell: React.FunctionComponent<NotificationListRowPropType> = ({\r\n\tnotification,\r\n\tnewNotificationHaloPeriodSeconds,\r\n\tchildren,\r\n}: any) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst { setSelectedNotification, muteFilters, selectionMode } = notificationsContext;\r\n\tconst [overflowMenuOpen, setOverflowMenuOpen] = useState(false);\r\n\tconst toggleOverflowMenu = () => {\r\n\t\tsetOverflowMenuOpen(!overflowMenuOpen);\r\n\t};\r\n\r\n\tconst [isNew, setIsNew] = useState(isNewNotification(notification, newNotificationHaloPeriodSeconds));\r\n\tconst [wokeFromSnooze, setWokeFromSnooze] = useState(\r\n\t\tisReNotification(notification, newNotificationHaloPeriodSeconds)\r\n\t);\r\n\tconst [isMuteFilterApplied, setIsMuteFilterApplied] = useState(\r\n\t\tmuteFilters\r\n\t\t\t? muteFilters.some((filter) => filter.source === notification.source && filter.type === notification.type)\r\n\t\t\t: false\r\n\t);\r\n\r\n\t// effect needed as the newNotificationHaloPeriodSeconds is fecthed asynchronously in the parent component\r\n\t// and sometimes at the first render, this value is still 0\r\n\tuseEffect(() => {\r\n\t\tsetIsNew(isNewNotification(notification, newNotificationHaloPeriodSeconds));\r\n\t}, [newNotificationHaloPeriodSeconds]);\r\n\r\n\tuseEffect(() => {\r\n\t\tlet isNewTimerId: any;\r\n\t\tif (isNew) {\r\n\t\t\tif (notification.isRead) {\r\n\t\t\t\tsetIsNew(false);\r\n\t\t\t\tclearTimeout(isNewTimerId);\r\n\t\t\t} else {\r\n\t\t\t\tisNewTimerId = setTimeout(() => {\r\n\t\t\t\t\tsetIsNew(false);\r\n\t\t\t\t}, differenceInMilliseconds(addSeconds(parseISO(notification.issuedAt), newNotificationHaloPeriodSeconds), Date.now()));\r\n\t\t\t}\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\tclearTimeout(isNewTimerId);\r\n\t\t};\r\n\t}, [isNew, notification]);\r\n\r\n\tuseEffect(() => {\r\n\t\tlet isRenotificationTimerId: any;\r\n\t\tif (isReNotification(notification, newNotificationHaloPeriodSeconds)) {\r\n\t\t\tconst mostRecentAction: IPerformedAction | null = getMostRecentAction(notification);\r\n\t\t\tif (mostRecentAction) {\r\n\t\t\t\tconst { datePerformed } = mostRecentAction;\r\n\t\t\t\tsetWokeFromSnooze(true);\r\n\t\t\t\tisRenotificationTimerId = setTimeout(() => {\r\n\t\t\t\t\tsetWokeFromSnooze(false);\r\n\t\t\t\t}, differenceInMilliseconds(addSeconds(parseISO(datePerformed), newNotificationHaloPeriodSeconds), Date.now()));\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\tsetWokeFromSnooze(false);\r\n\t\t\tclearTimeout(isRenotificationTimerId);\r\n\t\t}\r\n\t\treturn () => {\r\n\t\t\tclearTimeout(isRenotificationTimerId);\r\n\t\t};\r\n\t}, [newNotificationHaloPeriodSeconds, notification]);\r\n\r\n\tconst overFlowActions = Object.assign({}, OverflowMenuActions);\r\n\toverFlowActions.DETAILS.action = (detailNotification: INotification) => {\r\n\t\tsetSelectedNotification(detailNotification);\r\n\t};\r\n\r\n\tdelete overFlowActions.DISMISS;\r\n\r\n\tuseEffect(() => {\r\n\t\tfunction listenMuteStateChanged(error: any, response: any) {\r\n\t\t\tif (error) {\r\n\t\t\t\tconsole.error(\"FinsembleNotificationsMuteStateChannel: \", error);\r\n\t\t\t} else {\r\n\t\t\t\tconst { data } = response;\r\n\t\t\t\tif (notification.source === data.source && notification.type === data.type) {\r\n\t\t\t\t\tsetIsMuteFilterApplied(data.isMuted);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t\tFSBL.Clients.RouterClient.addListener(\"FinsembleNotificationsMuteStateChannel\", listenMuteStateChanged);\r\n\t\treturn () => {\r\n\t\t\tFSBL.Clients.RouterClient.removeListener(\"FinsembleNotificationsMuteStateChannel\", listenMuteStateChanged);\r\n\t\t};\r\n\t}, []);\r\n\r\n\tconst menuActions = Object.values(overFlowActions).map((value) =>\r\n\t\trenderOverflowMenuAction(notification, value, isMuteFilterApplied)\r\n\t);\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={`list-row__container notification-item ${notification.isRead ? \"is-read\" : \"\"} ${\r\n\t\t\t\tisNew || wokeFromSnooze ? \"new\" : \"\"\r\n\t\t\t}\r\n\t\t\t\t${notification.cssClassName ? notification.cssClassName : \"\"}`}\r\n\t\t>\r\n\t\t\t{children ? (\r\n\t\t\t\t<>\r\n\t\t\t\t\t{selectionMode === SelectionMode.SELECTION ? (\r\n\t\t\t\t\t\t<div className=\"list-row__cell\">\r\n\t\t\t\t\t\t\t<CheckButton notification={notification} />\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t<></>\r\n\t\t\t\t\t)}\r\n\t\t\t\t\t{children}\r\n\t\t\t\t</>\r\n\t\t\t) : (\r\n\t\t\t\t<>\r\n\t\t\t\t\t<div className=\"list-row__cell\">{format(Date.parse(notification.issuedAt), \"dd-MM-yyyy HH:mm\")}</div>\r\n\t\t\t\t\t<div className=\"list-row__cell\">\r\n\t\t\t\t\t\t{selectionMode === SelectionMode.SELECTION ? (\r\n\t\t\t\t\t\t\t<div className=\"list-row__cell\">\r\n\t\t\t\t\t\t\t\t<CheckButton notification={notification} />\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<NotificationCardHeaderLogo headerLogo={notification.headerLogo} />\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div className=\"list-row__cell\">{`${notification.title} - ${notification.details}`}</div>\r\n\t\t\t\t</>\r\n\t\t\t)}\r\n\t\t\t<div className=\"list-row__cell\">\r\n\t\t\t\t<span>\r\n\t\t\t\t\t<IconButton iconName=\"ff-dots-vert\" tooltip=\"Options\" clickHandler={toggleOverflowMenu}>\r\n\t\t\t\t\t\t{overflowMenuOpen ? <OverflowMenu closeSelf={setOverflowMenuOpen}>{menuActions}</OverflowMenu> : null}\r\n\t\t\t\t\t</IconButton>\r\n\t\t\t\t</span>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nconst ListView: React.FunctionComponent<NotificationListViewProps> = ({\r\n\tnotificationHeaderRow,\r\n\tnotificationListRow,\r\n\tnotifications,\r\n}) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\t// The context will be used to filter the notifications\r\n\tconst { drawerControlProps, searchString, filteredNotifications, setFilteredNotifications } = notificationsContext;\r\n\r\n\tconst activeFilter = getActiveFilter(drawerControlProps);\r\n\r\n\tconst [newNotificationHaloPeriodSeconds, setNotificationHaloPeriodSeconds] = useState(0);\r\n\r\n\tconst NotificationHeaderRow = notificationHeaderRow || ListHeaderComponent;\r\n\tconst NotificationListRow = notificationListRow || NotificationListRowShell;\r\n\r\n\t// Sets the current default preference\r\n\tuseEffect(() => {\r\n\t\tasync function getNotificationsPreferences() {\r\n\t\t\treturn await FSBL.Clients.NotificationClient.getPreferences();\r\n\t\t}\r\n\r\n\t\tgetNotificationsPreferences().then((preferences: any) => {\r\n\t\t\tsetNotificationHaloPeriodSeconds(preferences.newNotificationHaloPeriodSeconds);\r\n\t\t});\r\n\t}, []);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (searchString === \"\") {\r\n\t\t\tsetFilteredNotifications(notifications);\r\n\t\t} else {\r\n\t\t\tsetFilteredNotifications(searchNotifications(notifications, searchString));\r\n\t\t}\r\n\t}, [searchString, notifications]);\r\n\r\n\tlet controlFilteredNotifications = activeFilter ? activeFilter.run?.(filteredNotifications) : [];\r\n\tcontrolFilteredNotifications.sort(\r\n\t\t(a: INotification, b: INotification) => Date.parse(b.issuedAt) - Date.parse(a.issuedAt)\r\n\t);\r\n\r\n\tcontrolFilteredNotifications = controlFilteredNotifications.filter((notification: INotification) =>\r\n\t\tactiveFilter.action === \"snoozed\" ? notification.isSnoozed : !notification.isSnoozed\r\n\t);\r\n\r\n\treturn controlFilteredNotifications.length === 0 ? (\r\n\t\t<NoNotifications />\r\n\t) : (\r\n\t\t<>\r\n\t\t\t<NotificationHeaderRow />\r\n\t\t\t{controlFilteredNotifications.map((notification: INotification, index: number) => {\r\n\t\t\t\tconst key = `${index}_${notification.id ? notification.id : notification.issuedAt}`;\r\n\t\t\t\treturn (\r\n\t\t\t\t\t<NotificationListRow\r\n\t\t\t\t\t\tkey={key}\r\n\t\t\t\t\t\tnotification={notification}\r\n\t\t\t\t\t\tnewNotificationHaloPeriodSeconds={newNotificationHaloPeriodSeconds}\r\n\t\t\t\t\t/>\r\n\t\t\t\t);\r\n\t\t\t})}\r\n\t\t</>\r\n\t);\r\n};\r\n\r\nexport default ListView;\r\n"]}

package/react/components/notifications/components/views/NotificationDetailsView.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="finsemble-core" />
 import React from "react";
-import { INotification } from "common/notifications/definitions/INotification";
+import { services } from "@finsemble/finsemble-core";
+declare type INotification = services.notification.types.INotification;
 declare const NotificationDetailsView: React.FunctionComponent<{
     notification: INotification | null;
 }>;