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

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

@@ -20,18 +20,14 @@ const translateAction = (actionType) => {
             return actionType;
     }
 };
-const formatTimeStamp = (timestamp, dateFormat = "dd-MM-yyyy HH:mm") => {
-    return format(Date.parse(timestamp), dateFormat);
-};
+const formatTimeStamp = (timestamp, dateFormat = "dd-MM-yyyy HH:mm") => format(Date.parse(timestamp), dateFormat);
 const renderActionHistoryItems = (notificationActionsHistory) => {
     if (!notificationActionsHistory || notificationActionsHistory.length === 0) {
         return React.createElement("span", null, "No actions to display");
     }
     else {
         return notificationActionsHistory
-            .sort((a, b) => {
-            return Date.parse(b.datePerformed) - Date.parse(a.datePerformed);
-        })
+            .sort((a, b) => Date.parse(b.datePerformed) - Date.parse(a.datePerformed))
             .map((actionHistoryItem, index) => {
             const performedAction = actionHistoryItem;
             return (React.createElement("div", { key: performedAction.id || index, className: "notification-details__performed-action" },

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

@@ -1 +1 @@
-{"version":3,"file":"NotificationDetailsView.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/views/NotificationDetailsView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useState } from \"react\";\r\nimport { format } from \"date-fns\";\r\n\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport { NotificationsContext } from \"../../notificationsContext\";\r\nimport IPerformedAction from \"common/notifications/definitions/IPerformedAction\";\r\nimport { Button } from \"../../../common/Button\";\r\n\r\nconst translateAction = (actionType: string): string => {\r\n\t// TODO: Make these constants or type\r\n\tswitch (actionType) {\r\n\t\tcase \"FINSEMBLE:RECEIVED\":\r\n\t\t\treturn \"Notification received\";\r\n\r\n\t\tcase \"FINSEMBLE:READ\":\r\n\t\t\treturn \"Notification marked as read\";\r\n\r\n\t\tcase \"FINSEMBLE:UNREAD\":\r\n\t\t\treturn \"Notification marked as unread\";\r\n\r\n\t\tcase \"SNOOZE\":\r\n\t\t\treturn \"Snoozed\";\r\n\r\n\t\tcase \"FINSEMBLE:WAKE\":\r\n\t\t\treturn \"Renotified\";\r\n\r\n\t\tcase \"SPAWN\":\r\n\t\t\treturn \"Action: Spawn\";\r\n\r\n\t\tdefault:\r\n\t\t\treturn actionType;\r\n\t}\r\n};\r\n\r\nconst formatTimeStamp = (timestamp: string, dateFormat = \"dd-MM-yyyy HH:mm\") => {\r\n\treturn format(Date.parse(timestamp), dateFormat);\r\n};\r\n\r\nconst renderActionHistoryItems = (notificationActionsHistory: IPerformedAction[] | undefined) => {\r\n\tif (!notificationActionsHistory || notificationActionsHistory.length === 0) {\r\n\t\treturn <span>No actions to display</span>;\r\n\t} else {\r\n\t\treturn notificationActionsHistory\r\n\t\t\t.sort((a: IPerformedAction, b: IPerformedAction) => {\r\n\t\t\t\treturn Date.parse(b.datePerformed) - Date.parse(a.datePerformed);\r\n\t\t\t})\r\n\t\t\t.map((actionHistoryItem, index) => {\r\n\t\t\t\tconst performedAction = actionHistoryItem as IPerformedAction;\r\n\t\t\t\treturn (\r\n\t\t\t\t\t<div key={performedAction.id || index} className=\"notification-details__performed-action\">\r\n\t\t\t\t\t\t<span className=\"notification-details__performed-action-timestamp\">\r\n\t\t\t\t\t\t\t{formatTimeStamp(performedAction.datePerformed, \"HH:mm dd-MM-yyyy\")}\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t<span className=\"notification-details__performed-action-translated\">\r\n\t\t\t\t\t\t\t{translateAction(performedAction.type)}\r\n\t\t\t\t\t\t</span>\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\r\nconst NotificationDetailsView: React.FunctionComponent<{ notification: INotification | null }> = ({ notification }) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst [showDefaultIcon, setShowDefaultIcon] = useState(false);\r\n\r\n\tconst goBack = () => {\r\n\t\tnotificationsContext.setSelectedNotification(null);\r\n\t};\r\n\r\n\treturn notification ? (\r\n\t\t<div className=\"notifications-details__container\">\r\n\t\t\t<div style={{ paddingRight: 8, marginLeft: -3 }}>\r\n\t\t\t\t<Button onClick={() => goBack()} fashion=\"primary\" iconBefore=\"chevron-left\" text=\"Back\" />\r\n\t\t\t</div>\r\n\t\t\t<div className=\"notification-details__header\">\r\n\t\t\t\t<img\r\n\t\t\t\t\tsrc={notification.headerLogo}\r\n\t\t\t\t\tstyle={showDefaultIcon ? { display: \"none\" } : {}}\r\n\t\t\t\t\tonError={() => setShowDefaultIcon(true)}\r\n\t\t\t\t/>\r\n\t\t\t\t{showDefaultIcon ? <i className=\"ff-finsemble default-img\" /> : null}\r\n\t\t\t\t<div className=\"notification-card__title\">{notification.title}</div>\r\n\t\t\t</div>\r\n\t\t\t<div className=\"notification-details__body\">{notification.details}</div>\r\n\t\t\t<div className=\"notification-details__section\">\r\n\t\t\t\t<div className=\"notification-details__section-title\">History</div>\r\n\t\t\t\t{renderActionHistoryItems(notification.actionsHistory)}\r\n\t\t\t</div>\r\n\t\t\t<div className=\"notification-details__section\">\r\n\t\t\t\t<div className=\"notification-details__section-title\">App</div>\r\n\t\t\t\t{notification.source ? notification.source : \"Uknown\"}\r\n\t\t\t</div>\r\n\t\t\t{notification.type ? (\r\n\t\t\t\t<div className=\"notification-details__section\">\r\n\t\t\t\t\t<div className=\"notification-details__section-title\">Type</div>\r\n\t\t\t\t\t<span className=\"notification-details__section-type-label\">{notification.type}</span>\r\n\t\t\t\t</div>\r\n\t\t\t) : null}\r\n\t\t</div>\r\n\t) : null;\r\n};\r\n\r\nexport default NotificationDetailsView;\r\n"]}
+{"version":3,"file":"NotificationDetailsView.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/views/NotificationDetailsView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useState } from \"react\";\r\nimport { format } from \"date-fns\";\r\n\r\nimport { NotificationsContext } from \"../../notificationsContext\";\r\nimport { Button } from \"../../../common/Button\";\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 translateAction = (actionType: string): string => {\r\n\tswitch (actionType) {\r\n\t\tcase \"FINSEMBLE:RECEIVED\":\r\n\t\t\treturn \"Notification received\";\r\n\r\n\t\tcase \"FINSEMBLE:READ\":\r\n\t\t\treturn \"Notification marked as read\";\r\n\r\n\t\tcase \"FINSEMBLE:UNREAD\":\r\n\t\t\treturn \"Notification marked as unread\";\r\n\r\n\t\tcase \"SNOOZE\":\r\n\t\t\treturn \"Snoozed\";\r\n\r\n\t\tcase \"FINSEMBLE:WAKE\":\r\n\t\t\treturn \"Renotified\";\r\n\r\n\t\tcase \"SPAWN\":\r\n\t\t\treturn \"Action: Spawn\";\r\n\r\n\t\tdefault:\r\n\t\t\treturn actionType;\r\n\t}\r\n};\r\n\r\nconst formatTimeStamp = (timestamp: string, dateFormat = \"dd-MM-yyyy HH:mm\") =>\r\n\tformat(Date.parse(timestamp), dateFormat);\r\n\r\nconst renderActionHistoryItems = (notificationActionsHistory: IPerformedAction[] | undefined) => {\r\n\tif (!notificationActionsHistory || notificationActionsHistory.length === 0) {\r\n\t\treturn <span>No actions to display</span>;\r\n\t} else {\r\n\t\treturn notificationActionsHistory\r\n\t\t\t.sort((a: IPerformedAction, b: IPerformedAction) => Date.parse(b.datePerformed) - Date.parse(a.datePerformed))\r\n\t\t\t.map((actionHistoryItem, index) => {\r\n\t\t\t\tconst performedAction = actionHistoryItem as IPerformedAction;\r\n\t\t\t\treturn (\r\n\t\t\t\t\t<div key={performedAction.id || index} className=\"notification-details__performed-action\">\r\n\t\t\t\t\t\t<span className=\"notification-details__performed-action-timestamp\">\r\n\t\t\t\t\t\t\t{formatTimeStamp(performedAction.datePerformed, \"HH:mm dd-MM-yyyy\")}\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t<span className=\"notification-details__performed-action-translated\">\r\n\t\t\t\t\t\t\t{translateAction(performedAction.type)}\r\n\t\t\t\t\t\t</span>\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\r\nconst NotificationDetailsView: React.FunctionComponent<{ notification: INotification | null }> = ({ notification }) => {\r\n\tconst notificationsContext = useContext(NotificationsContext);\r\n\tconst [showDefaultIcon, setShowDefaultIcon] = useState(false);\r\n\r\n\tconst goBack = () => {\r\n\t\tnotificationsContext.setSelectedNotification(null);\r\n\t};\r\n\r\n\treturn notification ? (\r\n\t\t<div className=\"notifications-details__container\">\r\n\t\t\t<div style={{ paddingRight: 8, marginLeft: -3 }}>\r\n\t\t\t\t<Button onClick={() => goBack()} fashion=\"primary\" iconBefore=\"chevron-left\" text=\"Back\" />\r\n\t\t\t</div>\r\n\t\t\t<div className=\"notification-details__header\">\r\n\t\t\t\t<img\r\n\t\t\t\t\tsrc={notification.headerLogo}\r\n\t\t\t\t\tstyle={showDefaultIcon ? { display: \"none\" } : {}}\r\n\t\t\t\t\tonError={() => setShowDefaultIcon(true)}\r\n\t\t\t\t/>\r\n\t\t\t\t{showDefaultIcon ? <i className=\"ff-finsemble default-img\" /> : null}\r\n\t\t\t\t<div className=\"notification-card__title\">{notification.title}</div>\r\n\t\t\t</div>\r\n\t\t\t<div className=\"notification-details__body\">{notification.details}</div>\r\n\t\t\t<div className=\"notification-details__section\">\r\n\t\t\t\t<div className=\"notification-details__section-title\">History</div>\r\n\t\t\t\t{renderActionHistoryItems(notification.actionsHistory)}\r\n\t\t\t</div>\r\n\t\t\t<div className=\"notification-details__section\">\r\n\t\t\t\t<div className=\"notification-details__section-title\">App</div>\r\n\t\t\t\t{notification.source ? notification.source : \"Uknown\"}\r\n\t\t\t</div>\r\n\t\t\t{notification.type ? (\r\n\t\t\t\t<div className=\"notification-details__section\">\r\n\t\t\t\t\t<div className=\"notification-details__section-title\">Type</div>\r\n\t\t\t\t\t<span className=\"notification-details__section-type-label\">{notification.type}</span>\r\n\t\t\t\t</div>\r\n\t\t\t) : null}\r\n\t\t</div>\r\n\t) : null;\r\n};\r\n\r\nexport default NotificationDetailsView;\r\n"]}

package/react/components/notifications/constants.d.ts

@@ -7,16 +7,3 @@ export declare enum SelectionMode {
     SELECTION = 0,
     NO_SELECTION = 1
 }
-export declare type NotificationServiceState = {
-    showDrawer: boolean;
-    showCenter: boolean;
-    poppedOut: boolean;
-    position: number;
-    toasterMonitor: string;
-    mostRecentWindowName?: string;
-    overFlowMenu: {
-        notification: boolean;
-        overflowCount: boolean;
-        clickCoordinates: boolean;
-    };
-};

package/react/components/notifications/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../src/components/notifications/constants.ts"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,0BAA0B,GAAG,iBAAiB,CAAC;AAE5D,MAAM,CAAN,IAAY,QAGX;AAHD,WAAY,QAAQ;IACnB,uCAAI,CAAA;IACJ,uCAAI,CAAA;AACL,CAAC,EAHW,QAAQ,KAAR,QAAQ,QAGnB;AAED,MAAM,CAAN,IAAY,aAGX;AAHD,WAAY,aAAa;IACxB,2DAAS,CAAA;IACT,iEAAY,CAAA;AACb,CAAC,EAHW,aAAa,KAAb,aAAa,QAGxB","sourcesContent":["// @todo, import from core notificationService.ts when that is possible\r\nexport const NOTIFICATIONS_PUBSUB_TOPIC = \"notification-ui\";\r\n\r\nexport enum ViewMode {\r\n\tLIST,\r\n\tCARD,\r\n}\r\n\r\nexport enum SelectionMode {\r\n\tSELECTION,\r\n\tNO_SELECTION,\r\n}\r\n\r\n// @todo, import from core notificationService.ts when that's possible\r\nexport type NotificationServiceState = {\r\n\tshowDrawer: boolean;\r\n\tshowCenter: boolean;\r\n\tpoppedOut: boolean;\r\n\tposition: number;\r\n\ttoasterMonitor: string;\r\n\t/**\r\n\t * Contains the windowName of the most recent UI state change call.\r\n\t */\r\n\tmostRecentWindowName?: string;\r\n\toverFlowMenu: {\r\n\t\tnotification: boolean;\r\n\t\toverflowCount: boolean;\r\n\t\tclickCoordinates: boolean;\r\n\t};\r\n};\r\n"]}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../src/components/notifications/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,0BAA0B,GAAG,iBAAiB,CAAC;AAE5D,MAAM,CAAN,IAAY,QAGX;AAHD,WAAY,QAAQ;IACnB,uCAAI,CAAA;IACJ,uCAAI,CAAA;AACL,CAAC,EAHW,QAAQ,KAAR,QAAQ,QAGnB;AAED,MAAM,CAAN,IAAY,aAGX;AAHD,WAAY,aAAa;IACxB,2DAAS,CAAA;IACT,iEAAY,CAAA;AACb,CAAC,EAHW,aAAa,KAAb,aAAa,QAGxB","sourcesContent":["export const NOTIFICATIONS_PUBSUB_TOPIC = \"notification-ui\";\r\n\r\nexport enum ViewMode {\r\n\tLIST,\r\n\tCARD,\r\n}\r\n\r\nexport enum SelectionMode {\r\n\tSELECTION,\r\n\tNO_SELECTION,\r\n}\r\n"]}

package/react/components/notifications/types.d.ts

@@ -1,11 +1,11 @@
-/// <reference types="finsemble-core" />
 import React from "react";
-import { INotification } from "common/notifications/definitions/INotification";
-import { SpawnParams } from "services/window/Launcher/launcher";
 import { ViewMode, SelectionMode } from "./constants";
-import { INotificationHistoryOptions } from "common/notifications/definitions/INotificationHistoryOptions";
-import IFilter from "common/notifications/definitions/IFilter";
-import IMuteFilter from "common/notifications/definitions/IMuteFilter";
+import { services } from "@finsemble/finsemble-core";
+declare type INotification = services.notification.types.INotification;
+declare type INotificationHistoryOptions = services.notification.types.INotificationHistoryOptions;
+declare type IMuteFilter = services.notification.types.IMuteFilter;
+declare type IFilter = services.notification.types.IFilter;
+declare type SpawnParams = services.window.types.SpawnParams;
 export interface Control {
     action: string;
     label: string;
@@ -82,3 +82,4 @@ export declare type OverFlowMenuAction = {
     action: (notification: INotification) => void;
     label: string;
 };
+export {};

package/react/components/notifications/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/notifications/types.ts"],"names":[],"mappings":"","sourcesContent":["/**\r\n * Notification types\r\n */\r\nimport React from \"react\";\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport { SpawnParams } from \"services/window/Launcher/launcher\";\r\nimport { ViewMode, SelectionMode } from \"./constants\";\r\nimport { INotificationHistoryOptions } from \"common/notifications/definitions/INotificationHistoryOptions\";\r\nimport IFilter from \"common/notifications/definitions/IFilter\";\r\nimport IMuteFilter from \"common/notifications/definitions/IMuteFilter\";\r\n\r\nexport interface Control {\r\n\taction: string;\r\n\tlabel: string;\r\n\trun?: Function;\r\n}\r\n\r\nexport interface NotificationCenterControlsProps {\r\n\tcontrols: Array<Control>;\r\n\tactive?: Control[\"action\"];\r\n}\r\n\r\nexport interface INotificationCenterProps {\r\n\tcontrols?: NotificationCenterControlsProps;\r\n\tnotificationCard?: React.ComponentType<any>;\r\n\tnotificationHeaderRow?: React.ComponentType<any>;\r\n\tnotificationListRow?: React.ComponentType<any>;\r\n}\r\n\r\nexport interface INotificationToastsProps {\r\n\tnotificationCard?: React.ComponentType<any>;\r\n}\r\n\r\nexport interface INotificationDetailProps {\r\n\tnotification: INotification;\r\n}\r\n\r\nexport type NotificationListViewProps = {\r\n\tnotifications: INotification[];\r\n\tnotificationListRow?: React.ComponentType<INotificationDetailProps>;\r\n\tnotificationHeaderRow?: React.ComponentType<any>;\r\n};\r\n\r\nexport type NotificationCardViewProps = {\r\n\tnotifications: INotification[];\r\n\tnotificationCard?: React.ComponentType<any>; // A custom component used to render a notification\r\n};\r\n\r\nexport type NotificationsContextType = {\r\n\tviewMode: ViewMode;\r\n\tsetViewMode: React.Dispatch<React.SetStateAction<ViewMode>>;\r\n\tselectionMode: SelectionMode;\r\n\tsetSelectionMode: React.Dispatch<React.SetStateAction<SelectionMode>>;\r\n\tdrawerControlProps: NotificationCenterControlsProps;\r\n\tsetDrawerControlProps: React.Dispatch<React.SetStateAction<NotificationCenterControlsProps>>;\r\n\tselectedNotification: INotification | null;\r\n\tsetSelectedNotification: React.Dispatch<React.SetStateAction<INotification | null>>;\r\n\tsearchString: string;\r\n\tsetSearchString: React.Dispatch<React.SetStateAction<string>>;\r\n\tfilteredNotifications: INotification[];\r\n\tcheckedNotifications: INotification[];\r\n\tsetFilteredNotifications: React.Dispatch<React.SetStateAction<INotification[]>>;\r\n\tmuteFilters: IMuteFilter[];\r\n\tsetMuteFilters: React.Dispatch<React.SetStateAction<IMuteFilter[]>>;\r\n};\r\n\r\n// TODO: Review the fields below when implementing the core notifications functionality.\r\nexport interface NotificationsConfig {\r\n\tfilter?: {\r\n\t\tinclude?: [];\r\n\t\texclude?: [];\r\n\t};\r\n\tposition?: {};\r\n\tanimation?: {\r\n\t\tdisplayDuration: number;\r\n\t\tanimateIn: string;\r\n\t\tanimateOut: string;\r\n\t};\r\n\tisTransparent?: boolean;\r\n\tnotificationsHistory?: { since?: string; filter?: IFilter; options?: INotificationHistoryOptions } | boolean;\r\n\tapplyMuteFilters?: boolean;\r\n\twindowName: string;\r\n}\r\n\r\nexport interface WindowConfig {\r\n\twindow: SpawnParams & NotificationsConfig;\r\n}\r\n\r\nexport type OverFlowMenuAction = {\r\n\tname: string;\r\n\ticon: React.ReactElement;\r\n\taction: (notification: INotification) => void;\r\n\tlabel: string;\r\n};\r\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/notifications/types.ts"],"names":[],"mappings":"","sourcesContent":["/**\r\n * Notification types\r\n */\r\nimport React from \"react\";\r\nimport { ViewMode, SelectionMode } from \"./constants\";\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\ntype INotificationHistoryOptions = services.notification.types.INotificationHistoryOptions;\r\ntype IMuteFilter = services.notification.types.IMuteFilter;\r\ntype IFilter = services.notification.types.IFilter;\r\ntype SpawnParams = services.window.types.SpawnParams;\r\n\r\nexport interface Control {\r\n\taction: string;\r\n\tlabel: string;\r\n\trun?: Function;\r\n}\r\n\r\nexport interface NotificationCenterControlsProps {\r\n\tcontrols: Array<Control>;\r\n\tactive?: Control[\"action\"];\r\n}\r\n\r\nexport interface INotificationCenterProps {\r\n\tcontrols?: NotificationCenterControlsProps;\r\n\tnotificationCard?: React.ComponentType<any>;\r\n\tnotificationHeaderRow?: React.ComponentType<any>;\r\n\tnotificationListRow?: React.ComponentType<any>;\r\n}\r\n\r\nexport interface INotificationToastsProps {\r\n\tnotificationCard?: React.ComponentType<any>;\r\n}\r\n\r\nexport interface INotificationDetailProps {\r\n\tnotification: INotification;\r\n}\r\n\r\nexport type NotificationListViewProps = {\r\n\tnotifications: INotification[];\r\n\tnotificationListRow?: React.ComponentType<INotificationDetailProps>;\r\n\tnotificationHeaderRow?: React.ComponentType<any>;\r\n};\r\n\r\nexport type NotificationCardViewProps = {\r\n\tnotifications: INotification[];\r\n\tnotificationCard?: React.ComponentType<any>; // A custom component used to render a notification\r\n};\r\n\r\nexport type NotificationsContextType = {\r\n\tviewMode: ViewMode;\r\n\tsetViewMode: React.Dispatch<React.SetStateAction<ViewMode>>;\r\n\tselectionMode: SelectionMode;\r\n\tsetSelectionMode: React.Dispatch<React.SetStateAction<SelectionMode>>;\r\n\tdrawerControlProps: NotificationCenterControlsProps;\r\n\tsetDrawerControlProps: React.Dispatch<React.SetStateAction<NotificationCenterControlsProps>>;\r\n\tselectedNotification: INotification | null;\r\n\tsetSelectedNotification: React.Dispatch<React.SetStateAction<INotification | null>>;\r\n\tsearchString: string;\r\n\tsetSearchString: React.Dispatch<React.SetStateAction<string>>;\r\n\tfilteredNotifications: INotification[];\r\n\tcheckedNotifications: INotification[];\r\n\tsetFilteredNotifications: React.Dispatch<React.SetStateAction<INotification[]>>;\r\n\tmuteFilters: IMuteFilter[];\r\n\tsetMuteFilters: React.Dispatch<React.SetStateAction<IMuteFilter[]>>;\r\n};\r\n\r\nexport interface NotificationsConfig {\r\n\tfilter?: {\r\n\t\tinclude?: [];\r\n\t\texclude?: [];\r\n\t};\r\n\tposition?: {};\r\n\tanimation?: {\r\n\t\tdisplayDuration: number;\r\n\t\tanimateIn: string;\r\n\t\tanimateOut: string;\r\n\t};\r\n\tisTransparent?: boolean;\r\n\tnotificationsHistory?: { since?: string; filter?: IFilter; options?: INotificationHistoryOptions } | boolean;\r\n\tapplyMuteFilters?: boolean;\r\n\twindowName: string;\r\n}\r\n\r\nexport interface WindowConfig {\r\n\twindow: SpawnParams & NotificationsConfig;\r\n}\r\n\r\nexport type OverFlowMenuAction = {\r\n\tname: string;\r\n\ticon: React.ReactElement;\r\n\taction: (notification: INotification) => void;\r\n\tlabel: string;\r\n};\r\n"]}

package/react/components/notifications/utils.d.ts

@@ -1,10 +1,12 @@
-import { INotification } from "common/notifications/definitions/INotification";
 import { Control, NotificationCenterControlsProps } from "./types";
-import IPerformedAction from "common/notifications/definitions/IPerformedAction";
-import IMuteFilter from "common/notifications/definitions/IMuteFilter";
+import { services } from "@finsemble/finsemble-core";
+declare type INotification = services.notification.types.INotification;
+declare type IMuteFilter = services.notification.types.IMuteFilter;
+declare type IPerformedAction = services.notification.types.IPerformedAction;
+export declare const getMostRecentAction: (notification: INotification) => IPerformedAction | null;
 export declare const isNewNotification: (notification: INotification, newNotificationHaloPeriodSeconds: number) => boolean;
 export declare const isReNotification: (notification: INotification, newNotificationHaloPeriodSeconds: number) => boolean;
 export declare const getActiveFilter: (drawerControlProps: NotificationCenterControlsProps) => Control;
-export declare const getMostRecentAction: (notification: INotification) => IPerformedAction | null;
 export declare const searchNotifications: (notifications: INotification[], searchTerm: string) => INotification[];
 export declare const getMuteFilterFromNotification: (notification: INotification) => IMuteFilter;
+export {};

package/react/components/notifications/utils.js

@@ -1,4 +1,17 @@
 import { parseISO, differenceInSeconds } from "date-fns";
+export const getMostRecentAction = (notification) => {
+    if (!notification || !notification.actionsHistory)
+        return null;
+    let actionHistoryArray = [
+        ...notification.actionsHistory.sort((a, b) => Date.parse(b.datePerformed) - Date.parse(a.datePerformed)),
+    ];
+    if (actionHistoryArray.length > 0) {
+        return actionHistoryArray[0];
+    }
+    else {
+        return null;
+    }
+};
 export const isNewNotification = (notification, newNotificationHaloPeriodSeconds) => {
     const mostRecentAction = getMostRecentAction(notification);
     if ((mostRecentAction && mostRecentAction.type === "FINSEMBLE:READ") ||
@@ -14,24 +27,7 @@ export const isReNotification = (notification, newNotificationHaloPeriodSeconds)
         return false;
     return differenceInSeconds(Date.now(), parseISO(mostRecentAction.datePerformed)) < newNotificationHaloPeriodSeconds;
 };
-export const getActiveFilter = (drawerControlProps) => {
-    return drawerControlProps.controls.filter((control) => control.action === drawerControlProps.active)[0];
-};
-export const getMostRecentAction = (notification) => {
-    if (!notification || !notification.actionsHistory)
-        return null;
-    let actionHistoryArray = [
-        ...notification.actionsHistory.sort((a, b) => {
-            return Date.parse(b.datePerformed) - Date.parse(a.datePerformed);
-        }),
-    ];
-    if (actionHistoryArray.length > 0) {
-        return actionHistoryArray[0];
-    }
-    else {
-        return null;
-    }
-};
+export const getActiveFilter = (drawerControlProps) => drawerControlProps.controls.filter((control) => control.action === drawerControlProps.active)[0];
 const search = (notification, searchField, searchString) => {
     if (searchField) {
         return notification[searchField].toLowerCase().includes(searchString.toLowerCase());
@@ -43,23 +39,21 @@ const search = (notification, searchField, searchString) => {
     }
     return false;
 };
-export const searchNotifications = (notifications, searchTerm) => {
-    return [...notifications].filter((notification) => {
-        const searchTermSplit = searchTerm.split(":");
-        if (searchTermSplit.length === 1) {
-            return search(notification, null, searchTermSplit[0].trim());
+export const searchNotifications = (notifications, searchTerm) => [...notifications].filter((notification) => {
+    const searchTermSplit = searchTerm.split(":");
+    if (searchTermSplit.length === 1) {
+        return search(notification, null, searchTermSplit[0].trim());
+    }
+    else {
+        const field = searchTermSplit[0].trim();
+        if (["title", "details", "source"].includes(field) && notification.hasOwnProperty(field)) {
+            return search(notification, field, searchTermSplit[1].trim());
         }
         else {
-            const field = searchTermSplit[0].trim();
-            if (["title", "details", "source"].includes(field) && notification.hasOwnProperty(field)) {
-                return search(notification, field, searchTermSplit[1].trim());
-            }
-            else {
-                return search(notification, null, searchTermSplit[1].trim());
-            }
+            return search(notification, null, searchTermSplit[1].trim());
         }
-    });
-};
+    }
+});
 export const getMuteFilterFromNotification = (notification) => {
     const muteFilter = {};
     if (notification.source) {

package/react/components/notifications/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/notifications/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { parseISO, differenceInSeconds } from \"date-fns\";\r\n\r\n// Types\r\nimport { INotification } from \"common/notifications/definitions/INotification\";\r\nimport { Control, NotificationCenterControlsProps } from \"./types\";\r\nimport IPerformedAction from \"common/notifications/definitions/IPerformedAction\";\r\nimport IMuteFilter from \"common/notifications/definitions/IMuteFilter\";\r\n\r\nexport const isNewNotification = (notification: INotification, newNotificationHaloPeriodSeconds: number) => {\r\n\tconst mostRecentAction = getMostRecentAction(notification);\r\n\r\n\tif (\r\n\t\t(mostRecentAction && mostRecentAction.type === \"FINSEMBLE:READ\") ||\r\n\t\tnotification.isRead ||\r\n\t\t(notification.actionsHistory && notification.actionsHistory.length > 1)\r\n\t) {\r\n\t\treturn false;\r\n\t}\r\n\treturn differenceInSeconds(Date.now(), parseISO(notification.issuedAt)) < newNotificationHaloPeriodSeconds;\r\n};\r\n\r\nexport const isReNotification = (notification: INotification, newNotificationHaloPeriodSeconds: number) => {\r\n\tconst mostRecentAction = getMostRecentAction(notification);\r\n\r\n\tif (!mostRecentAction || mostRecentAction.type !== \"FINSEMBLE:WAKE\") return false;\r\n\r\n\treturn differenceInSeconds(Date.now(), parseISO(mostRecentAction.datePerformed)) < newNotificationHaloPeriodSeconds;\r\n};\r\n\r\nexport const getActiveFilter = (drawerControlProps: NotificationCenterControlsProps): Control => {\r\n\treturn drawerControlProps.controls.filter((control: Control) => control.action === drawerControlProps.active)[0];\r\n};\r\n\r\nexport const getMostRecentAction = (notification: INotification): IPerformedAction | null => {\r\n\tif (!notification || !notification.actionsHistory) return null;\r\n\r\n\tlet actionHistoryArray = [\r\n\t\t...notification.actionsHistory.sort((a: IPerformedAction, b: IPerformedAction) => {\r\n\t\t\treturn Date.parse(b.datePerformed) - Date.parse(a.datePerformed);\r\n\t\t}),\r\n\t];\r\n\r\n\tif (actionHistoryArray.length > 0) {\r\n\t\treturn actionHistoryArray[0];\r\n\t} else {\r\n\t\treturn null;\r\n\t}\r\n};\r\n\r\nconst search = (\r\n\tnotification: INotification,\r\n\tsearchField: \"title\" | \"details\" | \"source\" | null,\r\n\tsearchString: string\r\n): boolean => {\r\n\tif (searchField) {\r\n\t\treturn (notification[searchField] as string).toLowerCase().includes(searchString.toLowerCase());\r\n\t} else {\r\n\t\treturn (\r\n\t\t\t(notification[\"title\"] as string).toLowerCase().includes(searchString.toLowerCase()) ||\r\n\t\t\t(notification[\"details\"] as string).toLowerCase().includes(searchString.toLowerCase()) ||\r\n\t\t\t(notification[\"source\"] as string).toLowerCase().includes(searchString.toLowerCase())\r\n\t\t);\r\n\t}\r\n\treturn false;\r\n};\r\n\r\nexport const searchNotifications = (notifications: INotification[], searchTerm: string): INotification[] => {\r\n\treturn [...notifications].filter((notification) => {\r\n\t\tconst searchTermSplit = searchTerm.split(\":\");\r\n\t\tif (searchTermSplit.length === 1) {\r\n\t\t\treturn search(notification, null, searchTermSplit[0].trim());\r\n\t\t} else {\r\n\t\t\tconst field = searchTermSplit[0].trim();\r\n\t\t\tif ([\"title\", \"details\", \"source\"].includes(field) && notification.hasOwnProperty(field)) {\r\n\t\t\t\treturn search(notification, field as \"title\" | \"details\" | \"source\" | null, searchTermSplit[1].trim());\r\n\t\t\t} else {\r\n\t\t\t\treturn search(notification, null, searchTermSplit[1].trim());\r\n\t\t\t}\r\n\t\t}\r\n\t});\r\n};\r\n\r\nexport const getMuteFilterFromNotification = (notification: INotification): IMuteFilter => {\r\n\tconst muteFilter: IMuteFilter = {};\r\n\tif (notification.source) {\r\n\t\tmuteFilter.source = notification.source;\r\n\t}\r\n\tif (notification.type) {\r\n\t\tmuteFilter.type = notification.type;\r\n\t}\r\n\treturn muteFilter;\r\n};\r\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/notifications/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { parseISO, differenceInSeconds } from \"date-fns\";\r\n\r\n// Types\r\nimport { Control, NotificationCenterControlsProps } from \"./types\";\r\nimport { services } from \"@finsemble/finsemble-core\";\r\n\r\ntype INotification = services.notification.types.INotification;\r\ntype IMuteFilter = services.notification.types.IMuteFilter;\r\ntype IPerformedAction = services.notification.types.IPerformedAction;\r\n\r\n/**\r\n * Simplify this function with optional chaining\r\nreturn notification?.actionsHistory?.sort((a: IPerformedAction, b: IPerformedAction) => Date.parse(b.datePerformed) - Date.parse(a.datePerformed))?.[0]\r\n */\r\nexport const getMostRecentAction = (notification: INotification): IPerformedAction | null => {\r\n\tif (!notification || !notification.actionsHistory) return null;\r\n\r\n\tlet actionHistoryArray = [\r\n\t\t...notification.actionsHistory.sort(\r\n\t\t\t(a: IPerformedAction, b: IPerformedAction) => Date.parse(b.datePerformed) - Date.parse(a.datePerformed)\r\n\t\t),\r\n\t];\r\n\r\n\tif (actionHistoryArray.length > 0) {\r\n\t\treturn actionHistoryArray[0];\r\n\t} else {\r\n\t\treturn null;\r\n\t}\r\n};\r\n\r\nexport const isNewNotification = (notification: INotification, newNotificationHaloPeriodSeconds: number) => {\r\n\tconst mostRecentAction = getMostRecentAction(notification);\r\n\r\n\tif (\r\n\t\t(mostRecentAction && mostRecentAction.type === \"FINSEMBLE:READ\") ||\r\n\t\tnotification.isRead ||\r\n\t\t(notification.actionsHistory && notification.actionsHistory.length > 1)\r\n\t) {\r\n\t\treturn false;\r\n\t}\r\n\treturn differenceInSeconds(Date.now(), parseISO(notification.issuedAt)) < newNotificationHaloPeriodSeconds;\r\n};\r\n\r\nexport const isReNotification = (notification: INotification, newNotificationHaloPeriodSeconds: number) => {\r\n\tconst mostRecentAction = getMostRecentAction(notification);\r\n\r\n\tif (!mostRecentAction || mostRecentAction.type !== \"FINSEMBLE:WAKE\") return false;\r\n\r\n\treturn differenceInSeconds(Date.now(), parseISO(mostRecentAction.datePerformed)) < newNotificationHaloPeriodSeconds;\r\n};\r\n\r\nexport const getActiveFilter = (drawerControlProps: NotificationCenterControlsProps): Control =>\r\n\tdrawerControlProps.controls.filter((control: Control) => control.action === drawerControlProps.active)[0];\r\n\r\nconst search = (\r\n\tnotification: INotification,\r\n\tsearchField: \"title\" | \"details\" | \"source\" | null,\r\n\tsearchString: string\r\n): boolean => {\r\n\tif (searchField) {\r\n\t\treturn (notification[searchField] as string).toLowerCase().includes(searchString.toLowerCase());\r\n\t} else {\r\n\t\treturn (\r\n\t\t\t(notification[\"title\"] as string).toLowerCase().includes(searchString.toLowerCase()) ||\r\n\t\t\t(notification[\"details\"] as string).toLowerCase().includes(searchString.toLowerCase()) ||\r\n\t\t\t(notification[\"source\"] as string).toLowerCase().includes(searchString.toLowerCase())\r\n\t\t);\r\n\t}\r\n\treturn false;\r\n};\r\n\r\nexport const searchNotifications = (notifications: INotification[], searchTerm: string): INotification[] =>\r\n\t[...notifications].filter((notification) => {\r\n\t\tconst searchTermSplit = searchTerm.split(\":\");\r\n\t\tif (searchTermSplit.length === 1) {\r\n\t\t\treturn search(notification, null, searchTermSplit[0].trim());\r\n\t\t} else {\r\n\t\t\tconst field = searchTermSplit[0].trim();\r\n\t\t\tif ([\"title\", \"details\", \"source\"].includes(field) && notification.hasOwnProperty(field)) {\r\n\t\t\t\treturn search(notification, field as \"title\" | \"details\" | \"source\" | null, searchTermSplit[1].trim());\r\n\t\t\t} else {\r\n\t\t\t\treturn search(notification, null, searchTermSplit[1].trim());\r\n\t\t\t}\r\n\t\t}\r\n\t});\r\n\r\nexport const getMuteFilterFromNotification = (notification: INotification): IMuteFilter => {\r\n\tconst muteFilter: IMuteFilter = {};\r\n\tif (notification.source) {\r\n\t\tmuteFilter.source = notification.source;\r\n\t}\r\n\tif (notification.type) {\r\n\t\tmuteFilter.type = notification.type;\r\n\t}\r\n\treturn muteFilter;\r\n};\r\n"]}

package/react/components/processMonitor/ProcessMonitor.d.ts

@@ -1 +1,3 @@
-export function ProcessMonitor(): JSX.Element;
+/// <reference types="react" />
+import "../../assets/css/processMonitor.css";
+export declare const ProcessMonitor: () => JSX.Element;

package/react/components/processMonitor/ProcessMonitor.js

@@ -2,16 +2,19 @@ import React from "react";
 import { Store, Actions } from "./stores/ProcessMonitorStore";
 import ListHeader from "./components/ListHeader";
 import ProcessStatistics from "./components/ProcessStatistics";
-import ChildWindows from "./components/ChildWindows";
+import ChildWindow from "./components/ChildWindow";
 import { EMPTY_TOTALS, SIMPLE_MODE_STATISTICS, ADVANCED_MODE_STATISTICS } from "./constants.js";
-import { statReducer, round, bytesToSize } from "./helpers.js";
+import { statReducer, roundDecimalToPrecision, bytesToSize } from "./helpers.js";
 import "../../assets/css/processMonitor.css";
+import { ViewModeEnums } from "./ProcessMonitorTypes";
+import FloatingFocus from "@q42/floating-focus-a11y";
+new FloatingFocus();
 class ProcessMonitorBase extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
             processList: [],
-            viewMode: "simple",
+            viewMode: ViewModeEnums.SIMPLE,
         };
         this.bindCorrectContext();
     }
@@ -33,40 +36,47 @@ class ProcessMonitorBase extends React.Component {
     }
     componentDidMount() {
         Actions.initialize(() => {
-            Store.addListener({ field: "processList" }, this.onProcessListChanged);
-            Store.addListener({ field: "viewMode" }, this.onViewModeChanged);
+            Store === null || Store === void 0 ? void 0 : Store.addListener({ field: "processList" }, this.onProcessListChanged);
+            Store === null || Store === void 0 ? void 0 : Store.addListener({ field: "viewMode" }, this.onViewModeChanged);
         });
     }
     componentWillUnmount() {
-        Store.removeListener({ field: "processList" }, this.onProcessListChanged);
-        Store.removeListener({ field: "viewMode" }, this.onViewModeChanged);
+        Store === null || Store === void 0 ? void 0 : Store.removeListener({ field: "processList" }, this.onProcessListChanged);
+        Store === null || Store === void 0 ? void 0 : Store.removeListener({ field: "viewMode" }, this.onViewModeChanged);
     }
     render() {
         if (!Store)
             return null;
-        let totals = this.state.processList.length ? this.state.processList.reduce(statReducer) : EMPTY_TOTALS;
+        const totals = this.state.processList.length ? this.state.processList.reduce(statReducer) : EMPTY_TOTALS;
         return (React.createElement("div", null,
             React.createElement("div", { className: "process-list-wrapper" },
-                React.createElement(ListHeader, { fields: this.state.viewMode === "simple" ? SIMPLE_MODE_STATISTICS : ADVANCED_MODE_STATISTICS }),
+                React.createElement(ListHeader, { fields: this.state.viewMode === ViewModeEnums.SIMPLE ? SIMPLE_MODE_STATISTICS : ADVANCED_MODE_STATISTICS }),
                 React.createElement("div", { className: "process-list" }, this.state.processList
                     .filter((proc) => proc.visible)
-                    .map((proc, i) => (React.createElement("div", { key: i, className: "process" },
-                    React.createElement(ProcessStatistics, { mode: this.state.viewMode, fields: this.state.viewMode === "simple" ? SIMPLE_MODE_STATISTICS : ADVANCED_MODE_STATISTICS, stats: proc.statistics }),
-                    React.createElement(ChildWindows, { viewMode: this.state.viewMode, childWindows: proc.childWindows })))))),
+                    .map((proc, i) => {
+                    var _a;
+                    return (React.createElement("div", { key: i, className: "process" },
+                        React.createElement(ProcessStatistics, { mode: this.state.viewMode, fields: this.state.viewMode === ViewModeEnums.SIMPLE ? SIMPLE_MODE_STATISTICS : ADVANCED_MODE_STATISTICS, stats: proc.statistics }), (_a = proc.childWindows) === null || _a === void 0 ? void 0 :
+                        _a.map((cw, j) => (React.createElement(ChildWindow, { key: j, viewMode: this.state.viewMode, cw: cw })))));
+                }))),
             React.createElement("div", { className: "bottom-section" },
                 React.createElement("div", { className: "summary-statistics-wrapper" },
                     React.createElement("div", { className: "summary-statistics-header" }, "Finsemble Total Usage"),
                     React.createElement("div", { className: "summary-statistics" },
                         typeof totals.statistics.cpuUsage !== "undefined" && (React.createElement("div", { className: "summary-statistic" },
                             React.createElement("div", { className: "summary-statistic-label" }, "CPU"),
-                            React.createElement("div", { className: "summary-statistic-number" }, `${round(totals.statistics.cpuUsage, 2)}%`))),
+                            React.createElement("div", { className: "summary-statistic-number" }, `${roundDecimalToPrecision(totals.statistics.cpuUsage, 2)}%`))),
                         typeof totals.statistics.workingSetSize !== "undefined" && (React.createElement("div", { className: "summary-statistic" },
                             React.createElement("div", { className: "summary-statistic-label" }, "Memory"),
                             React.createElement("div", { className: "summary-statistic-number" }, bytesToSize(totals.statistics.workingSetSize)))))),
                 React.createElement("div", { className: "advanced-button-wrapper" },
                     React.createElement("div", { className: "fsbl-button advanced-button", onClick: () => {
                             Actions.toggleViewMode();
-                        } }, this.state.viewMode === "advanced" ? "Simple" : "Advanced")))));
+                        }, tabIndex: 0, role: "button", onKeyDown: (e) => {
+                            if (e.key === "Enter" || e.key === " ") {
+                                Actions.toggleViewMode();
+                            }
+                        } }, this.state.viewMode === ViewModeEnums.ADVANCED ? "Simple" : "Advanced")))));
     }
 }
 export const ProcessMonitor = () => React.createElement(ProcessMonitorBase, null);

package/react/components/processMonitor/ProcessMonitor.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProcessMonitor.js","sourceRoot":"","sources":["../../../src/components/processMonitor/ProcessMonitor.jsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\r\nimport { Store, Actions } from \"./stores/ProcessMonitorStore\";\r\nimport ListHeader from \"./components/ListHeader\";\r\nimport ProcessStatistics from \"./components/ProcessStatistics\";\r\nimport ChildWindows from \"./components/ChildWindows\";\r\nimport { EMPTY_TOTALS, SIMPLE_MODE_STATISTICS, ADVANCED_MODE_STATISTICS } from \"./constants.js\";\r\nimport { statReducer, round, bytesToSize } from \"./helpers.js\";\r\nimport \"../../assets/css/processMonitor.css\";\r\nclass ProcessMonitorBase extends React.Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\t\tthis.state = {\r\n\t\t\tprocessList: [],\r\n\t\t\tviewMode: \"simple\",\r\n\t\t};\r\n\t\tthis.bindCorrectContext();\r\n\t}\r\n\r\n\tbindCorrectContext() {\r\n\t\tthis.onProcessListChanged = this.onProcessListChanged.bind(this);\r\n\t\tthis.onViewModeChanged = this.onViewModeChanged.bind(this);\r\n\t}\r\n\r\n\t/**\r\n\t * Handler for when we go from simple to advanced mode, or the opposite.\r\n\t * @param {} err\r\n\t * @param {*} response\r\n\t */\r\n\tonViewModeChanged(err, response) {\r\n\t\tlet { value } = response;\r\n\t\tthis.setState({\r\n\t\t\tviewMode: value,\r\n\t\t});\r\n\t}\r\n\r\n\t/**\r\n\t * Invoked at minimum, once per second. This listener handles updates that we receive from the system.\r\n\t * @param {*} err\r\n\t * @param {*} response\r\n\t */\r\n\tonProcessListChanged(err, response) {\r\n\t\tlet { value } = response;\r\n\t\tthis.setState({\r\n\t\t\tprocessList: value,\r\n\t\t});\r\n\t}\r\n\r\n\tcomponentDidMount() {\r\n\t\tActions.initialize(() => {\r\n\t\t\tStore.addListener({ field: \"processList\" }, this.onProcessListChanged);\r\n\t\t\tStore.addListener({ field: \"viewMode\" }, this.onViewModeChanged);\r\n\t\t});\r\n\t}\r\n\r\n\tcomponentWillUnmount() {\r\n\t\tStore.removeListener({ field: \"processList\" }, this.onProcessListChanged);\r\n\t\tStore.removeListener({ field: \"viewMode\" }, this.onViewModeChanged);\r\n\t}\r\n\r\n\trender() {\r\n\t\tif (!Store) return null;\r\n\t\t// simple mode: CPU, memory\r\n\t\t// Advanced mode: add more.\r\n\t\t// Use helpers.bytesToSize.\r\n\t\t// Array of process components.\r\n\t\t// statReducer is an array.reduce function that will sum all of the CPU/memory usage across the app.\r\n\t\tlet totals = this.state.processList.length ? this.state.processList.reduce(statReducer) : EMPTY_TOTALS;\r\n\t\treturn (\r\n\t\t\t<div>\r\n\t\t\t\t<div className=\"process-list-wrapper\">\r\n\t\t\t\t\t<ListHeader fields={this.state.viewMode === \"simple\" ? SIMPLE_MODE_STATISTICS : ADVANCED_MODE_STATISTICS} />\r\n\t\t\t\t\t<div className=\"process-list\">\r\n\t\t\t\t\t\t{/* Filter will remove the hidden processes. Afterwards, map will render the remaining processes in turn. */}\r\n\t\t\t\t\t\t{this.state.processList\r\n\t\t\t\t\t\t\t.filter((proc) => proc.visible)\r\n\t\t\t\t\t\t\t.map((proc, i) => (\r\n\t\t\t\t\t\t\t\t<div key={i} className=\"process\">\r\n\t\t\t\t\t\t\t\t\t{/* Process statistics is the meat of this component. It's the statistics and the child windows. */}\r\n\t\t\t\t\t\t\t\t\t<ProcessStatistics\r\n\t\t\t\t\t\t\t\t\t\tmode={this.state.viewMode}\r\n\t\t\t\t\t\t\t\t\t\tfields={this.state.viewMode === \"simple\" ? SIMPLE_MODE_STATISTICS : ADVANCED_MODE_STATISTICS}\r\n\t\t\t\t\t\t\t\t\t\tstats={proc.statistics}\r\n\t\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t\t\t<ChildWindows viewMode={this.state.viewMode} childWindows={proc.childWindows} />\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t))}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<div className=\"bottom-section\">\r\n\t\t\t\t\t<div className=\"summary-statistics-wrapper\">\r\n\t\t\t\t\t\t<div className=\"summary-statistics-header\">Finsemble Total Usage</div>\r\n\t\t\t\t\t\t<div className=\"summary-statistics\">\r\n\t\t\t\t\t\t\t{typeof totals.statistics.cpuUsage !== \"undefined\" && (\r\n\t\t\t\t\t\t\t\t<div className=\"summary-statistic\">\r\n\t\t\t\t\t\t\t\t\t<div className=\"summary-statistic-label\">CPU</div>\r\n\t\t\t\t\t\t\t\t\t<div className=\"summary-statistic-number\">{`${round(totals.statistics.cpuUsage, 2)}%`}</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t{typeof totals.statistics.workingSetSize !== \"undefined\" && (\r\n\t\t\t\t\t\t\t\t<div className=\"summary-statistic\">\r\n\t\t\t\t\t\t\t\t\t<div className=\"summary-statistic-label\">Memory</div>\r\n\t\t\t\t\t\t\t\t\t<div className=\"summary-statistic-number\">{bytesToSize(totals.statistics.workingSetSize)}</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div className=\"advanced-button-wrapper\">\r\n\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\tclassName=\"fsbl-button advanced-button\"\r\n\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\tActions.toggleViewMode();\r\n\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t{this.state.viewMode === \"advanced\" ? \"Simple\" : \"Advanced\"}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t);\r\n\t}\r\n}\r\n\r\n/**\r\n * The window that shows performance data for applications running in Finsemble, such as CPU and memory usage.\r\n */\r\nexport const ProcessMonitor = () => <ProcessMonitorBase />;\r\n"]}
+{"version":3,"file":"ProcessMonitor.js","sourceRoot":"","sources":["../../../src/components/processMonitor/ProcessMonitor.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\r\nimport { Store, Actions } from \"./stores/ProcessMonitorStore\";\r\nimport ListHeader from \"./components/ListHeader\";\r\nimport ProcessStatistics from \"./components/ProcessStatistics\";\r\nimport ChildWindow from \"./components/ChildWindow\";\r\nimport { EMPTY_TOTALS, SIMPLE_MODE_STATISTICS, ADVANCED_MODE_STATISTICS } from \"./constants.js\";\r\nimport { statReducer, roundDecimalToPrecision, bytesToSize } from \"./helpers.js\";\r\nimport \"../../assets/css/processMonitor.css\";\r\nimport { ProcessType, ViewModeEnums, ChildWindowType } from \"./ProcessMonitorTypes\";\r\nimport { StandardError } from \"@finsemble/finsemble-core/types/types\";\r\n\r\nimport FloatingFocus from \"@q42/floating-focus-a11y\";\r\n// The package FloatingFocus injects a focus indicator that moves around the page, but only for\r\n// keyboard users. (Mouse users don't see the indicator.) All that needs to be done is to envoke it.\r\nnew FloatingFocus();\r\n\r\ninterface IProps {}\r\ninterface IState {\r\n\tprocessList: ProcessType[];\r\n\tviewMode: ViewModeEnums;\r\n}\r\nclass ProcessMonitorBase extends React.Component<IProps, IState> {\r\n\tconstructor(props: {}) {\r\n\t\tsuper(props);\r\n\t\tthis.state = {\r\n\t\t\tprocessList: [],\r\n\t\t\tviewMode: ViewModeEnums.SIMPLE,\r\n\t\t};\r\n\t\tthis.bindCorrectContext();\r\n\t}\r\n\r\n\tbindCorrectContext() {\r\n\t\tthis.onProcessListChanged = this.onProcessListChanged.bind(this);\r\n\t\tthis.onViewModeChanged = this.onViewModeChanged.bind(this);\r\n\t}\r\n\r\n\t/**\r\n\t * Handler for when we go from simple to advanced mode, or the opposite.\r\n\t */\r\n\tonViewModeChanged(err: StandardError, response: { value: ViewModeEnums }) {\r\n\t\tlet { value } = response;\r\n\t\tthis.setState({\r\n\t\t\tviewMode: value,\r\n\t\t});\r\n\t}\r\n\r\n\t/**\r\n\t * Invoked at minimum, once per second. This listener handles updates that we receive from the system.\r\n\t */\r\n\tonProcessListChanged(err: StandardError, response: { value: ProcessType[] }) {\r\n\t\tlet { value } = response;\r\n\t\tthis.setState({\r\n\t\t\tprocessList: value,\r\n\t\t});\r\n\t}\r\n\r\n\tcomponentDidMount() {\r\n\t\tActions.initialize(() => {\r\n\t\t\tStore?.addListener({ field: \"processList\" }, this.onProcessListChanged);\r\n\t\t\tStore?.addListener({ field: \"viewMode\" }, this.onViewModeChanged);\r\n\t\t});\r\n\t}\r\n\r\n\tcomponentWillUnmount() {\r\n\t\tStore?.removeListener({ field: \"processList\" }, this.onProcessListChanged);\r\n\t\tStore?.removeListener({ field: \"viewMode\" }, this.onViewModeChanged);\r\n\t}\r\n\r\n\trender() {\r\n\t\tif (!Store) return null;\r\n\t\t// View modes are:\r\n\t\t// * Simple - Top-level views, showing stats: CPU, Memory\r\n\t\t// * Advanced - Expanded processes, showing stats: CPU, Memory, Peak Memory, PID\r\n\r\n\t\t// statReducer is an array.reduce function that will sum all of the CPU/memory usage across the app.\r\n\t\tconst totals = this.state.processList.length ? this.state.processList.reduce(statReducer) : EMPTY_TOTALS;\r\n\t\treturn (\r\n\t\t\t<div>\r\n\t\t\t\t<div className=\"process-list-wrapper\">\r\n\t\t\t\t\t<ListHeader\r\n\t\t\t\t\t\tfields={this.state.viewMode === ViewModeEnums.SIMPLE ? SIMPLE_MODE_STATISTICS : ADVANCED_MODE_STATISTICS}\r\n\t\t\t\t\t/>\r\n\t\t\t\t\t<div className=\"process-list\">\r\n\t\t\t\t\t\t{/* Filter will remove the hidden processes. Afterwards, map will render the remaining processes in turn. */}\r\n\t\t\t\t\t\t{this.state.processList\r\n\t\t\t\t\t\t\t.filter((proc) => proc.visible)\r\n\t\t\t\t\t\t\t.map((proc, i) => (\r\n\t\t\t\t\t\t\t\t<div key={i} className=\"process\">\r\n\t\t\t\t\t\t\t\t\t{/* Process statistics is the meat of this component. It's the statistics and the child windows. */}\r\n\t\t\t\t\t\t\t\t\t<ProcessStatistics\r\n\t\t\t\t\t\t\t\t\t\tmode={this.state.viewMode}\r\n\t\t\t\t\t\t\t\t\t\tfields={\r\n\t\t\t\t\t\t\t\t\t\t\tthis.state.viewMode === ViewModeEnums.SIMPLE ? SIMPLE_MODE_STATISTICS : ADVANCED_MODE_STATISTICS\r\n\t\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t\t\tstats={proc.statistics}\r\n\t\t\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t\t\t\t{proc.childWindows?.map((cw: ChildWindowType, j: number) => (\r\n\t\t\t\t\t\t\t\t\t\t<ChildWindow key={j} viewMode={this.state.viewMode} cw={cw} />\r\n\t\t\t\t\t\t\t\t\t))}\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t))}\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<div className=\"bottom-section\">\r\n\t\t\t\t\t<div className=\"summary-statistics-wrapper\">\r\n\t\t\t\t\t\t<div className=\"summary-statistics-header\">Finsemble Total Usage</div>\r\n\t\t\t\t\t\t<div className=\"summary-statistics\">\r\n\t\t\t\t\t\t\t{typeof totals.statistics.cpuUsage !== \"undefined\" && (\r\n\t\t\t\t\t\t\t\t<div className=\"summary-statistic\">\r\n\t\t\t\t\t\t\t\t\t<div className=\"summary-statistic-label\">CPU</div>\r\n\t\t\t\t\t\t\t\t\t<div className=\"summary-statistic-number\">{`${roundDecimalToPrecision(\r\n\t\t\t\t\t\t\t\t\t\ttotals.statistics.cpuUsage,\r\n\t\t\t\t\t\t\t\t\t\t2\r\n\t\t\t\t\t\t\t\t\t)}%`}</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t{typeof totals.statistics.workingSetSize !== \"undefined\" && (\r\n\t\t\t\t\t\t\t\t<div className=\"summary-statistic\">\r\n\t\t\t\t\t\t\t\t\t<div className=\"summary-statistic-label\">Memory</div>\r\n\t\t\t\t\t\t\t\t\t<div className=\"summary-statistic-number\">{bytesToSize(totals.statistics.workingSetSize)}</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t\t<div className=\"advanced-button-wrapper\">\r\n\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\tclassName=\"fsbl-button advanced-button\"\r\n\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\tActions.toggleViewMode();\r\n\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\ttabIndex={0}\r\n\t\t\t\t\t\t\trole=\"button\"\r\n\t\t\t\t\t\t\tonKeyDown={(e: React.KeyboardEvent) => {\r\n\t\t\t\t\t\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\r\n\t\t\t\t\t\t\t\t\tActions.toggleViewMode();\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t{this.state.viewMode === ViewModeEnums.ADVANCED ? \"Simple\" : \"Advanced\"}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t);\r\n\t}\r\n}\r\n\r\n/**\r\n * The window that shows performance data for applications running in Finsemble, such as CPU and memory usage.\r\n */\r\nexport const ProcessMonitor = () => <ProcessMonitorBase />;\r\n"]}

package/react/components/processMonitor/ProcessMonitorTypes.d.ts

@@ -0,0 +1,33 @@
+export declare enum ViewModeEnums {
+    SIMPLE = "simple",
+    ADVANCED = "advanced"
+}
+export declare type ModeStatsType = {
+    label: string;
+    value: "cpuUsage" | "workingSetSize" | "peakWorkingSetSize" | "processId";
+};
+export declare type ProcessStatisticsType = {
+    statistics: {
+        cpuUsage?: number;
+        workingSetSize?: number;
+        peakWorkingSetSize?: number;
+        processId?: number;
+        name?: string;
+        type?: string;
+        uuid?: string;
+    };
+};
+export declare type ProcessType = {
+    visible: boolean;
+    type?: string;
+    childWindows?: ChildWindowType[];
+} & ProcessStatisticsType;
+export declare type ChildWindowType = {
+    type: string;
+    name: string;
+    uuid?: string;
+};
+export declare type SortObjectType = {
+    field: keyof ProcessStatisticsType["statistics"];
+    direction: "ascending" | "descending";
+};

package/react/components/processMonitor/ProcessMonitorTypes.js

@@ -0,0 +1,6 @@
+export var ViewModeEnums;
+(function (ViewModeEnums) {
+    ViewModeEnums["SIMPLE"] = "simple";
+    ViewModeEnums["ADVANCED"] = "advanced";
+})(ViewModeEnums || (ViewModeEnums = {}));
+//# sourceMappingURL=ProcessMonitorTypes.js.map

package/react/components/processMonitor/ProcessMonitorTypes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProcessMonitorTypes.js","sourceRoot":"","sources":["../../../src/components/processMonitor/ProcessMonitorTypes.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,aAGX;AAHD,WAAY,aAAa;IACxB,kCAAiB,CAAA;IACjB,sCAAqB,CAAA;AACtB,CAAC,EAHW,aAAa,KAAb,aAAa,QAGxB","sourcesContent":["export enum ViewModeEnums {\r\n\tSIMPLE = \"simple\",\r\n\tADVANCED = \"advanced\",\r\n}\r\n\r\nexport type ModeStatsType = {\r\n\tlabel: string;\r\n\tvalue: \"cpuUsage\" | \"workingSetSize\" | \"peakWorkingSetSize\" | \"processId\";\r\n};\r\n\r\nexport type ProcessStatisticsType = {\r\n\tstatistics: {\r\n\t\tcpuUsage?: number;\r\n\t\tworkingSetSize?: number;\r\n\t\tpeakWorkingSetSize?: number;\r\n\t\tprocessId?: number;\r\n\t\tname?: string;\r\n\t\ttype?: string;\r\n\t\tuuid?: string;\r\n\t};\r\n};\r\nexport type ProcessType = {\r\n\tvisible: boolean;\r\n\ttype?: string;\r\n\tchildWindows?: ChildWindowType[];\r\n} & ProcessStatisticsType;\r\n\r\nexport type ChildWindowType = {\r\n\ttype: string;\r\n\tname: string;\r\n\tuuid?: string;\r\n};\r\n\r\nexport type SortObjectType = {\r\n\tfield: keyof ProcessStatisticsType[\"statistics\"];\r\n\tdirection: \"ascending\" | \"descending\";\r\n};\r\n"]}

package/react/components/processMonitor/components/ChildWindow.d.ts

@@ -1,4 +1,11 @@
-export default class ChildWindow extends React.Component<any, any, any> {
-    constructor(props: any);
-}
 import React from "react";
+import { ChildWindowType, ViewModeEnums } from "../ProcessMonitorTypes";
+interface IProps {
+    cw: ChildWindowType;
+    viewMode: ViewModeEnums;
+}
+export default class ChildWindow extends React.Component<IProps> {
+    constructor(props: IProps);
+    render(): JSX.Element;
+}
+export {};

package/react/components/processMonitor/components/ChildWindow.js

@@ -1,21 +1,40 @@
 import React from "react";
+import { ViewModeEnums } from "../ProcessMonitorTypes";
 import { Actions } from "../stores/ProcessMonitorStore";
 export default class ChildWindow extends React.Component {
     constructor(props) {
         super(props);
     }
     render() {
-        let cwClickHandler = this.props.viewMode === "simple"
-            ? Function.prototype
-            : () => {
-                Actions.identifyWindow(this.props.cw);
-            };
-        let childWindowClasses = `child-window ${this.props.viewMode}`;
+        const { cw, viewMode } = this.props;
+        const simpleClickHandler = () => { };
+        const advancedClickHandler = () => {
+            Actions.getFlashingState((err, flashState) => {
+                if (err) {
+                    console.error("Error getting current flashing state of window.", err);
+                }
+                if (!flashState) {
+                    Actions.identifyWindow(cw);
+                }
+            });
+        };
+        const cwClickHandler = viewMode === ViewModeEnums.SIMPLE ? simpleClickHandler : advancedClickHandler;
+        const childWindowClasses = `child-window ${viewMode}`;
         return (React.createElement("div", { className: childWindowClasses },
-            React.createElement("div", { className: "child-window-actions" }, this.props.cw.type === "window" ? (React.createElement("i", { className: "close-window ff-close", onClick: () => {
-                    Actions.closeWindow(this.props.cw);
-                } })) : null),
-            React.createElement("div", { className: "child-window-name", onClick: cwClickHandler }, this.props.cw.name)));
+            React.createElement("div", { className: "child-window-actions" }, this.props.cw.type === "window" && typeof this.props.cw.uuid === "string" && (React.createElement("i", { className: "close-window ff-close", onClick: () => {
+                    const { uuid, name } = cw;
+                    if (uuid) {
+                        Actions.closeWindow({ uuid, name });
+                    }
+                }, tabIndex: 0, role: "button", onKeyDown: (e) => {
+                    if (e.key === "Enter" || e.key === " ") {
+                        const { uuid, name } = cw;
+                        if (uuid) {
+                            Actions.closeWindow({ uuid, name });
+                        }
+                    }
+                } }))),
+            React.createElement("div", { className: "child-window-name", onClick: cwClickHandler }, cw.name)));
     }
 }
 //# sourceMappingURL=ChildWindow.js.map

package/react/components/processMonitor/components/ChildWindow.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChildWindow.js","sourceRoot":"","sources":["../../../../src/components/processMonitor/components/ChildWindow.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AAIxD,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,KAAK,CAAC,SAAS;IACvD,YAAY,KAAK;QAChB,KAAK,CAAC,KAAK,CAAC,CAAC;IACd,CAAC;IAED,MAAM;QAEL,IAAI,cAAc,GACjB,IAAI,CAAC,KAAK,CAAC,QAAQ,KAAK,QAAQ;YAC/B,CAAC,CAAC,QAAQ,CAAC,SAAS;YACpB,CAAC,CAAC,GAAG,EAAE;gBACL,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;YACtC,CAAC,CAAC;QACN,IAAI,kBAAkB,GAAG,gBAAgB,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;QAC/D,OAAO,CACN,6BAAK,SAAS,EAAE,kBAAkB;YACjC,6BAAK,SAAS,EAAC,sBAAsB,IACnC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CAClC,2BACC,SAAS,EAAC,uBAAuB,EACjC,OAAO,EAAE,GAAG,EAAE;oBACb,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;gBACpC,CAAC,GACG,CACL,CAAC,CAAC,CAAC,IAAI,CACH;YACN,6BAAK,SAAS,EAAC,mBAAmB,EAAC,OAAO,EAAE,cAAc,IACxD,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,IAAI,CACd,CACD,CACN,CAAC;IACH,CAAC;CACD","sourcesContent":["import React from \"react\";\r\nimport { Actions } from \"../stores/ProcessMonitorStore\";\r\n/**\r\n * This file is the react component for an individual window beneath a process. It allows the user to close the window.\r\n */\r\nexport default class ChildWindow extends React.Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\t}\r\n\r\n\trender() {\r\n\t\t//If we're in simple mode, onClick does nothing. In advanced mode, we'll identify the window by making it flash.\r\n\t\tlet cwClickHandler =\r\n\t\t\tthis.props.viewMode === \"simple\"\r\n\t\t\t\t? Function.prototype\r\n\t\t\t\t: () => {\r\n\t\t\t\t\t\tActions.identifyWindow(this.props.cw);\r\n\t\t\t\t  };\r\n\t\tlet childWindowClasses = `child-window ${this.props.viewMode}`;\r\n\t\treturn (\r\n\t\t\t<div className={childWindowClasses}>\r\n\t\t\t\t<div className=\"child-window-actions\">\r\n\t\t\t\t\t{this.props.cw.type === \"window\" ? (\r\n\t\t\t\t\t\t<i\r\n\t\t\t\t\t\t\tclassName=\"close-window ff-close\"\r\n\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\tActions.closeWindow(this.props.cw);\r\n\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t></i>\r\n\t\t\t\t\t) : null}\r\n\t\t\t\t</div>\r\n\t\t\t\t<div className=\"child-window-name\" onClick={cwClickHandler}>\r\n\t\t\t\t\t{this.props.cw.name}\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t);\r\n\t}\r\n}\r\n"]}
+{"version":3,"file":"ChildWindow.js","sourceRoot":"","sources":["../../../../src/components/processMonitor/components/ChildWindow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAmB,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACxE,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AAUxD,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,KAAK,CAAC,SAAiB;IAC/D,YAAY,KAAa;QACxB,KAAK,CAAC,KAAK,CAAC,CAAC;IACd,CAAC;IAED,MAAM;QACL,MAAM,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAGpC,MAAM,kBAAkB,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;QACpC,MAAM,oBAAoB,GAAG,GAAG,EAAE;YACjC,OAAO,CAAC,gBAAgB,CAAC,CAAC,GAAkB,EAAE,UAAmB,EAAE,EAAE;gBACpE,IAAI,GAAG,EAAE;oBACR,OAAO,CAAC,KAAK,CAAC,iDAAiD,EAAE,GAAG,CAAC,CAAC;iBACtE;gBAGD,IAAI,CAAC,UAAU,EAAE;oBAChB,OAAO,CAAC,cAAc,CAAC,EAAE,CAAC,CAAC;iBAC3B;YACF,CAAC,CAAC,CAAC;QACJ,CAAC,CAAC;QAEF,MAAM,cAAc,GAAG,QAAQ,KAAK,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,oBAAoB,CAAC;QAErG,MAAM,kBAAkB,GAAG,gBAAgB,QAAQ,EAAE,CAAC;QACtD,OAAO,CACN,6BAAK,SAAS,EAAE,kBAAkB;YACjC,6BAAK,SAAS,EAAC,sBAAsB,IACnC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,IAAI,KAAK,QAAQ,IAAI,OAAO,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,IAAI,KAAK,QAAQ,IAAI,CAC7E,2BACC,SAAS,EAAC,uBAAuB,EACjC,OAAO,EAAE,GAAG,EAAE;oBACb,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC;oBAC1B,IAAI,IAAI,EAAE;wBACT,OAAO,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;qBACpC;gBACF,CAAC,EACD,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,CAAC,CAAsB,EAAE,EAAE;oBACrC,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE;wBACvC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC;wBAC1B,IAAI,IAAI,EAAE;4BACT,OAAO,CAAC,WAAW,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;yBACpC;qBACD;gBACF,CAAC,GACG,CACL,CACI;YACN,6BAAK,SAAS,EAAC,mBAAmB,EAAC,OAAO,EAAE,cAAc,IACxD,EAAE,CAAC,IAAI,CACH,CACD,CACN,CAAC;IACH,CAAC;CACD","sourcesContent":["import React from \"react\";\r\nimport { StandardError } from \"@finsemble/finsemble-core/types/types\";\r\nimport { ChildWindowType, ViewModeEnums } from \"../ProcessMonitorTypes\";\r\nimport { Actions } from \"../stores/ProcessMonitorStore\";\r\n\r\ninterface IProps {\r\n\tcw: ChildWindowType;\r\n\tviewMode: ViewModeEnums;\r\n}\r\n\r\n/**\r\n * This file is the react component for an individual window beneath a process. It allows the user to close the window.\r\n */\r\nexport default class ChildWindow extends React.Component<IProps> {\r\n\tconstructor(props: IProps) {\r\n\t\tsuper(props);\r\n\t}\r\n\r\n\trender() {\r\n\t\tconst { cw, viewMode } = this.props;\r\n\r\n\t\t//If we're in simple mode, onClick does nothing. In advanced mode, we'll identify the window by making it flash.\r\n\t\tconst simpleClickHandler = () => {};\r\n\t\tconst advancedClickHandler = () => {\r\n\t\t\tActions.getFlashingState((err: StandardError, flashState: boolean) => {\r\n\t\t\t\tif (err) {\r\n\t\t\t\t\tconsole.error(\"Error getting current flashing state of window.\", err);\r\n\t\t\t\t}\r\n\r\n\t\t\t\t// Only begin flashing if not already started\r\n\t\t\t\tif (!flashState) {\r\n\t\t\t\t\tActions.identifyWindow(cw);\r\n\t\t\t\t}\r\n\t\t\t});\r\n\t\t};\r\n\r\n\t\tconst cwClickHandler = viewMode === ViewModeEnums.SIMPLE ? simpleClickHandler : advancedClickHandler;\r\n\r\n\t\tconst childWindowClasses = `child-window ${viewMode}`;\r\n\t\treturn (\r\n\t\t\t<div className={childWindowClasses}>\r\n\t\t\t\t<div className=\"child-window-actions\">\r\n\t\t\t\t\t{this.props.cw.type === \"window\" && typeof this.props.cw.uuid === \"string\" && (\r\n\t\t\t\t\t\t<i\r\n\t\t\t\t\t\t\tclassName=\"close-window ff-close\"\r\n\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\tconst { uuid, name } = cw;\r\n\t\t\t\t\t\t\t\tif (uuid) {\r\n\t\t\t\t\t\t\t\t\tActions.closeWindow({ uuid, name });\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\ttabIndex={0}\r\n\t\t\t\t\t\t\trole=\"button\"\r\n\t\t\t\t\t\t\tonKeyDown={(e: React.KeyboardEvent) => {\r\n\t\t\t\t\t\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\r\n\t\t\t\t\t\t\t\t\tconst { uuid, name } = cw;\r\n\t\t\t\t\t\t\t\t\tif (uuid) {\r\n\t\t\t\t\t\t\t\t\t\tActions.closeWindow({ uuid, name });\r\n\t\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t></i>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</div>\r\n\t\t\t\t<div className=\"child-window-name\" onClick={cwClickHandler}>\r\n\t\t\t\t\t{cw.name}\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t);\r\n\t}\r\n}\r\n"]}

package/react/components/processMonitor/components/ListHeader.d.ts

@@ -1,5 +1,19 @@
-export default class ListHeader extends React.Component<any, any, any> {
-    constructor(props: any);
-    onSortChanged(err: any, response: any): void;
-}
 import React from "react";
+import { SortObjectType, ModeStatsType } from "../ProcessMonitorTypes";
+import { StandardError } from "@finsemble/finsemble-core/types/types";
+interface IProps {
+    fields: ModeStatsType[];
+}
+interface IState {
+    sort: SortObjectType;
+}
+export default class ListHeader extends React.Component<IProps, IState> {
+    constructor(props: IProps);
+    onSortChanged(err: StandardError, response: {
+        value: SortObjectType;
+    }): void;
+    UNSAFE_componentWillMount(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+}
+export {};