@finsemble/finsemble-ui 6.2.0 → 6.3.0-beta.20211008

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\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"]}

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 * @todo Ian says 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,17 @@ 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";
 class ProcessMonitorBase extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
             processList: [],
-            viewMode: "simple",
+            viewMode: ViewModeEnums.SIMPLE,
         };
         this.bindCorrectContext();
     }
@@ -44,29 +45,35 @@ class ProcessMonitorBase extends React.Component {
     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")))));
+                        } }, 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, ProcessStatisticsType, ViewModeEnums, ChildWindowType } from \"./ProcessMonitorTypes\";\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: string, 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: string, 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\t// @ts-ignore: Store types will be figured out in another PR\r\n\t\t\tStore.addListener({ field: \"processList\" }, this.onProcessListChanged);\r\n\t\t\t// @ts-ignore: Store types will be figured out in another PR\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\t// @ts-ignore: Store types will be figured out in another PR\r\n\t\tStore.removeListener({ field: \"processList\" }, this.onProcessListChanged);\r\n\t\t// @ts-ignore: Store types will be figured out in another PR\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: ProcessStatisticsType = this.state.processList.length\r\n\t\t\t? // @ts-ignore: Helper file hasn't been converted to TS yet. Ignoring this line until it is.\r\n\t\t\t  this.state.processList.reduce(statReducer)\r\n\t\t\t: 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>\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,30 @@
 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: () => {
+                    Actions.closeWindow(cw);
+                } }))),
+            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;oBAEb,OAAO,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;gBACzB,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\t// @ts-ignore - We have a check for this above, but TS isn't picking up on it\r\n\t\t\t\t\t\t\t\tActions.closeWindow(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)}\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,18 @@
-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";
+interface IProps {
+    fields: ModeStatsType[];
+}
+interface IState {
+    sort: SortObjectType;
+}
+export default class ListHeader extends React.Component<IProps, IState> {
+    constructor(props: IProps);
+    onSortChanged(err: string, response: {
+        value: SortObjectType;
+    }): void;
+    UNSAFE_componentWillMount(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+}
+export {};

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

@@ -1 +1 @@
-{"version":3,"file":"ListHeader.js","sourceRoot":"","sources":["../../../../src/components/processMonitor/components/ListHeader.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AAM/D,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,KAAK,CAAC,SAAS;IACtD,YAAY,KAAK;QAChB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YACZ,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;SACvC,CAAC;QACF,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACpD,CAAC;IAGD,aAAa,CAAC,GAAG,EAAE,QAAQ;QAC1B,IAAI,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC;QACzB,IAAI,CAAC,QAAQ,CAAC;YACb,IAAI,EAAE,KAAK;SACX,CAAC,CAAC;IACJ,CAAC;IAED,yBAAyB;QACxB,KAAK,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC1D,CAAC;IAED,oBAAoB;QACnB,KAAK,CAAC,cAAc,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC7D,CAAC;IAED,MAAM;QAEL,OAAO,CACN,6BAAK,SAAS,EAAC,aAAa;YAE3B,6BACC,SAAS,EAAC,8CAA8C,EACxD,OAAO,EAAE,GAAG,EAAE;oBACb,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;gBACzB,CAAC;;gBAIA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,CACnC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,CAC3C,2BAAG,SAAS,EAAC,4BAA4B,GAAK,CAC9C,CAAC,CAAC,CAAC,CACH,2BAAG,SAAS,EAAC,8BAA8B,GAAK,CAChD,CACD,CAAC,CAAC,CAAC,IAAI,CACH;YACN,6BAAK,SAAS,EAAC,8BAA8B;gBAC3C,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACpC,6BACC,GAAG,EAAE,CAAC,EACN,SAAS,EAAC,6BAA6B,EACvC,OAAO,EAAE,GAAG,EAAE;wBACb,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;oBAC9B,CAAC;oBAEA,KAAK,CAAC,KAAK;oBAEX,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CACxC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,CAC3C,2BAAG,SAAS,EAAC,4BAA4B,GAAK,CAC9C,CAAC,CAAC,CAAC,CACH,2BAAG,SAAS,EAAC,8BAA8B,GAAK,CAChD,CACD,CAAC,CAAC,CAAC,IAAI,CACH,CACN,CAAC;gBACF,6BAAK,SAAS,EAAC,6BAA6B,GAAO,CAC9C,CACD,CACN,CAAC;IACH,CAAC;CACD","sourcesContent":["import React from \"react\";\r\nimport { Store, Actions } from \"../stores/ProcessMonitorStore\";\r\n/**\r\n * This is the \"table header\" that shows which columns are visible.\r\n * Since we aren't using an HTML table, this component exists.\r\n * It handles column display and sorting.\r\n **/\r\nexport default class ListHeader extends React.Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\t\tthis.state = {\r\n\t\t\tsort: Store.getValue({ field: \"sort\" }),\r\n\t\t};\r\n\t\tthis.onSortChanged = this.onSortChanged.bind(this);\r\n\t}\r\n\r\n\t//When the sort value changes in the store, change it locally, and re-render the direction arrow.\r\n\tonSortChanged(err, response) {\r\n\t\tlet { value } = response;\r\n\t\tthis.setState({\r\n\t\t\tsort: value,\r\n\t\t});\r\n\t}\r\n\r\n\tUNSAFE_componentWillMount() {\r\n\t\tStore.addListener({ field: \"sort\" }, this.onSortChanged);\r\n\t}\r\n\r\n\tcomponentWillUnmount() {\r\n\t\tStore.removeListener({ field: \"sort\" }, this.onSortChanged);\r\n\t}\r\n\r\n\trender() {\r\n\t\t//Just a list of the things beneath it. name, CPU, mem, etc. drive from store.\r\n\t\treturn (\r\n\t\t\t<div className=\"list-header\">\r\n\t\t\t\t{/* The name is separate because it isn't a statistic, per se. So I split it out. */}\r\n\t\t\t\t<div\r\n\t\t\t\t\tclassName=\"list-header-statistic-label list-header-name\"\r\n\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\tActions.setSort(\"name\");\r\n\t\t\t\t\t}}\r\n\t\t\t\t>\r\n\t\t\t\t\tName\r\n\t\t\t\t\t{/* If this field is the one being sorted, render the direction of the sort. Otherwise return null. */}\r\n\t\t\t\t\t{this.state.sort.field === \"name\" ? (\r\n\t\t\t\t\t\tthis.state.sort.direction === \"ascending\" ? (\r\n\t\t\t\t\t\t\t<i className=\"sort-direction ff-arrow-up\"></i>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<i className=\"sort-direction ff-arrow-down\"></i>\r\n\t\t\t\t\t\t)\r\n\t\t\t\t\t) : null}\r\n\t\t\t\t</div>\r\n\t\t\t\t<div className=\"list-header-statistic-labels\">\r\n\t\t\t\t\t{this.props.fields.map((field, i) => (\r\n\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\tkey={i}\r\n\t\t\t\t\t\t\tclassName=\"list-header-statistic-label\"\r\n\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\tActions.setSort(field.value);\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{field.label}\r\n\t\t\t\t\t\t\t{/* If this field is the one being sorted, render the direction of the sort. Otherwise return null. */}\r\n\t\t\t\t\t\t\t{this.state.sort.field === field.value ? (\r\n\t\t\t\t\t\t\t\tthis.state.sort.direction === \"ascending\" ? (\r\n\t\t\t\t\t\t\t\t\t<i className=\"sort-direction ff-arrow-up\"></i>\r\n\t\t\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t\t\t<i className=\"sort-direction ff-arrow-down\"></i>\r\n\t\t\t\t\t\t\t\t)\r\n\t\t\t\t\t\t\t) : null}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t))}\r\n\t\t\t\t\t<div className=\"list-header-statistic-label\"></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"]}
+{"version":3,"file":"ListHeader.js","sourceRoot":"","sources":["../../../../src/components/processMonitor/components/ListHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AAgB/D,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,KAAK,CAAC,SAAyB;IACtE,YAAY,KAAa;QACxB,KAAK,CAAC,KAAK,CAAC,CAAC;QACb,IAAI,CAAC,KAAK,GAAG;YAEZ,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;SACvC,CAAC;QACF,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACpD,CAAC;IAGD,aAAa,CAAC,GAAW,EAAE,QAAmC;QAC7D,IAAI,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC;QACzB,IAAI,CAAC,QAAQ,CAAC;YACb,IAAI,EAAE,KAAK;SACX,CAAC,CAAC;IACJ,CAAC;IAED,yBAAyB;QAExB,KAAK,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC1D,CAAC;IAED,oBAAoB;QAEnB,KAAK,CAAC,cAAc,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC7D,CAAC;IAED,MAAM;QAEL,OAAO,CACN,6BAAK,SAAS,EAAC,aAAa;YAE3B,6BACC,SAAS,EAAC,8CAA8C,EACxD,OAAO,EAAE,GAAG,EAAE;oBACb,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;gBACzB,CAAC;;gBAIA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,CACnC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,CAC3C,2BAAG,SAAS,EAAC,4BAA4B,GAAK,CAC9C,CAAC,CAAC,CAAC,CACH,2BAAG,SAAS,EAAC,8BAA8B,GAAK,CAChD,CACD,CAAC,CAAC,CAAC,IAAI,CACH;YACN,6BAAK,SAAS,EAAC,8BAA8B;gBAC3C,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACpC,6BACC,GAAG,EAAE,CAAC,EACN,SAAS,EAAC,6BAA6B,EACvC,OAAO,EAAE,GAAG,EAAE;wBACb,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;oBAC9B,CAAC;oBAEA,KAAK,CAAC,KAAK;oBAEX,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CACxC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,CAC3C,2BAAG,SAAS,EAAC,4BAA4B,GAAK,CAC9C,CAAC,CAAC,CAAC,CACH,2BAAG,SAAS,EAAC,8BAA8B,GAAK,CAChD,CACD,CAAC,CAAC,CAAC,IAAI,CACH,CACN,CAAC;gBACF,6BAAK,SAAS,EAAC,6BAA6B,GAAO,CAC9C,CACD,CACN,CAAC;IACH,CAAC;CACD","sourcesContent":["import React from \"react\";\r\nimport { Store, Actions } from \"../stores/ProcessMonitorStore\";\r\nimport { SortObjectType, ModeStatsType } from \"../ProcessMonitorTypes\";\r\n\r\ninterface IProps {\r\n\tfields: ModeStatsType[];\r\n}\r\n\r\ninterface IState {\r\n\tsort: SortObjectType;\r\n}\r\n\r\n/**\r\n * This is the \"table header\" that shows which columns are visible.\r\n * Since we aren't using an HTML table, this component exists.\r\n * It handles column display and sorting.\r\n **/\r\nexport default class ListHeader extends React.Component<IProps, IState> {\r\n\tconstructor(props: IProps) {\r\n\t\tsuper(props);\r\n\t\tthis.state = {\r\n\t\t\t// @ts-ignore\r\n\t\t\tsort: Store.getValue({ field: \"sort\" }),\r\n\t\t};\r\n\t\tthis.onSortChanged = this.onSortChanged.bind(this);\r\n\t}\r\n\r\n\t// When the sort value changes in the store, change it locally, and re-render the direction arrow.\r\n\tonSortChanged(err: string, response: { value: SortObjectType }) {\r\n\t\tlet { value } = response;\r\n\t\tthis.setState({\r\n\t\t\tsort: value,\r\n\t\t});\r\n\t}\r\n\r\n\tUNSAFE_componentWillMount() {\r\n\t\t// @ts-ignore\r\n\t\tStore.addListener({ field: \"sort\" }, this.onSortChanged);\r\n\t}\r\n\r\n\tcomponentWillUnmount() {\r\n\t\t// @ts-ignore\r\n\t\tStore.removeListener({ field: \"sort\" }, this.onSortChanged);\r\n\t}\r\n\r\n\trender() {\r\n\t\t//Just a list of the things beneath it. name, CPU, mem, etc. drive from store.\r\n\t\treturn (\r\n\t\t\t<div className=\"list-header\">\r\n\t\t\t\t{/* The name is separate because it isn't a statistic, per se. So I split it out. */}\r\n\t\t\t\t<div\r\n\t\t\t\t\tclassName=\"list-header-statistic-label list-header-name\"\r\n\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\tActions.setSort(\"name\");\r\n\t\t\t\t\t}}\r\n\t\t\t\t>\r\n\t\t\t\t\tName\r\n\t\t\t\t\t{/* If this field is the one being sorted, render the direction of the sort. Otherwise return null. */}\r\n\t\t\t\t\t{this.state.sort.field === \"name\" ? (\r\n\t\t\t\t\t\tthis.state.sort.direction === \"ascending\" ? (\r\n\t\t\t\t\t\t\t<i className=\"sort-direction ff-arrow-up\"></i>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<i className=\"sort-direction ff-arrow-down\"></i>\r\n\t\t\t\t\t\t)\r\n\t\t\t\t\t) : null}\r\n\t\t\t\t</div>\r\n\t\t\t\t<div className=\"list-header-statistic-labels\">\r\n\t\t\t\t\t{this.props.fields.map((field, i) => (\r\n\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\tkey={i}\r\n\t\t\t\t\t\t\tclassName=\"list-header-statistic-label\"\r\n\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\tActions.setSort(field.value);\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{field.label}\r\n\t\t\t\t\t\t\t{/* If this field is the one being sorted, render the direction of the sort. Otherwise return null. */}\r\n\t\t\t\t\t\t\t{this.state.sort.field === field.value ? (\r\n\t\t\t\t\t\t\t\tthis.state.sort.direction === \"ascending\" ? (\r\n\t\t\t\t\t\t\t\t\t<i className=\"sort-direction ff-arrow-up\"></i>\r\n\t\t\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t\t\t<i className=\"sort-direction ff-arrow-down\"></i>\r\n\t\t\t\t\t\t\t\t)\r\n\t\t\t\t\t\t\t) : null}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t))}\r\n\t\t\t\t\t<div className=\"list-header-statistic-label\"></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"]}

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

@@ -1,4 +1,12 @@
-export default class ProcessStatistics extends React.Component<any, any, any> {
-    constructor(props: any);
-}
 import React from "react";
+import { ProcessType, ViewModeEnums, ModeStatsType } from "../ProcessMonitorTypes";
+interface IProps {
+    mode: ViewModeEnums;
+    fields: ModeStatsType[];
+    stats: ProcessType["statistics"];
+}
+export default class ProcessStatistics extends React.Component<IProps> {
+    constructor(props: IProps);
+    render(): JSX.Element;
+}
+export {};

package/react/components/processMonitor/components/ProcessStatistics.js

@@ -1,37 +1,30 @@
 import React from "react";
 import { Actions } from "../stores/ProcessMonitorStore";
 import { HIGH_CPU, HIGH_MEMORY_USAGE, MODERATE_CPU_USAGE, MODERATE_MEMORY_USAGE, TO_MB } from "../constants";
-import { bytesToSize, round } from "../helpers";
-export default class ProcessStatistics extends React.Component {
-    constructor(props) {
-        super(props);
-    }
-    render() {
-        return (React.createElement("div", { className: "process-row" },
-            React.createElement("div", { className: "process-name" }, this.props.mode === "simple" ? "Process Group" : this.props.stats.name),
-            React.createElement("div", { className: "process-statistics" },
-                this.props.fields.map((field, i) => (React.createElement("div", { key: i, className: getClassesForStat(this.props.stats[field.value], field.label) }, prettyPrint(this.props.stats[field.value], field.label)))),
-                React.createElement("div", { className: "statistic process-actions" }, this.props.stats.type === "Tab" ? (React.createElement("div", { className: " terminate fsbl-button-negative process-action", onClick: () => {
-                        Actions.terminateProcess(this.props.stats);
-                    } }, "Terminate")) : null))));
-    }
-}
+import { bytesToSize, roundDecimalToPrecision } from "../helpers";
+import { ViewModeEnums } from "../ProcessMonitorTypes";
 function getClassesForStat(number, statType) {
     let classes = "statistic", high_comparison = HIGH_MEMORY_USAGE * TO_MB, moderate_comparison = MODERATE_MEMORY_USAGE * TO_MB;
+    if (typeof number === "undefined") {
+        return classes;
+    }
     if (statType === "CPU") {
         (high_comparison = HIGH_CPU), (moderate_comparison = MODERATE_CPU_USAGE);
     }
     if (number > high_comparison) {
-        classes += " high-usage";
+        classes = `${classes} high-usage`;
     }
     else if (number > moderate_comparison) {
-        classes += " moderate-usage";
+        classes = `${classes} moderate-usage`;
     }
     return classes;
 }
 function prettyPrint(number, statType) {
+    if (typeof number === "undefined") {
+        return "";
+    }
     if (statType === "CPU") {
-        return round(number, 2) + "%";
+        return `${roundDecimalToPrecision(number, 2)}%`;
     }
     else if (statType !== "PID") {
         return bytesToSize(number);
@@ -40,4 +33,18 @@ function prettyPrint(number, statType) {
         return number;
     }
 }
+export default class ProcessStatistics extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        return (React.createElement("div", { className: "process-row" },
+            React.createElement("div", { className: "process-name" }, this.props.mode === ViewModeEnums.SIMPLE ? "Process Group" : this.props.stats.name),
+            React.createElement("div", { className: "process-statistics" },
+                this.props.fields.map((field, i) => (React.createElement("div", { key: i, className: getClassesForStat(this.props.stats[field.value], field.label) }, prettyPrint(this.props.stats[field.value], field.label)))),
+                React.createElement("div", { className: "statistic process-actions" }, this.props.stats.type === "Tab" && typeof this.props.stats.uuid === "string" ? (React.createElement("div", { className: " terminate fsbl-button-negative process-action", onClick: () => {
+                        Actions.terminateProcess(this.props.stats);
+                    } }, "Terminate")) : null))));
+    }
+}
 //# sourceMappingURL=ProcessStatistics.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ProcessStatistics.js","sourceRoot":"","sources":["../../../../src/components/processMonitor/components/ProcessStatistics.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAC7G,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEhD,MAAM,CAAC,OAAO,OAAO,iBAAkB,SAAQ,KAAK,CAAC,SAAS;IAC7D,YAAY,KAAK;QAChB,KAAK,CAAC,KAAK,CAAC,CAAC;IACd,CAAC;IAED,MAAM;QAGL,OAAO,CACN,6BAAK,SAAS,EAAC,aAAa;YAC3B,6BAAK,SAAS,EAAC,cAAc,IAE3B,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAClE;YACN,6BAAK,SAAS,EAAC,oBAAoB;gBACjC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CACpC,6BAAK,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,IACnF,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,CACnD,CACN,CAAC;gBACF,6BAAK,SAAS,EAAC,2BAA2B,IACxC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,CAClC,6BACC,SAAS,EAAC,gDAAgD,EAC1D,OAAO,EAAE,GAAG,EAAE;wBACb,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;oBAC5C,CAAC,gBAGI,CACN,CAAC,CAAC,CAAC,IAAI,CACH,CACD,CACD,CACN,CAAC;IACH,CAAC;CACD;AAOD,SAAS,iBAAiB,CAAC,MAAM,EAAE,QAAQ;IAC1C,IAAI,OAAO,GAAG,WAAW,EACxB,eAAe,GAAG,iBAAiB,GAAG,KAAK,EAC3C,mBAAmB,GAAG,qBAAqB,GAAG,KAAK,CAAC;IAErD,IAAI,QAAQ,KAAK,KAAK,EAAE;QACvB,CAAC,eAAe,GAAG,QAAQ,CAAC,EAAE,CAAC,mBAAmB,GAAG,kBAAkB,CAAC,CAAC;KACzE;IACD,IAAI,MAAM,GAAG,eAAe,EAAE;QAC7B,OAAO,IAAI,aAAa,CAAC;KACzB;SAAM,IAAI,MAAM,GAAG,mBAAmB,EAAE;QACxC,OAAO,IAAI,iBAAiB,CAAC;KAC7B;IACD,OAAO,OAAO,CAAC;AAChB,CAAC;AAQD,SAAS,WAAW,CAAC,MAAM,EAAE,QAAQ;IACpC,IAAI,QAAQ,KAAK,KAAK,EAAE;QAEvB,OAAO,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,GAAG,GAAG,CAAC;KAC9B;SAAM,IAAI,QAAQ,KAAK,KAAK,EAAE;QAC9B,OAAO,WAAW,CAAC,MAAM,CAAC,CAAC;KAC3B;SAAM;QACN,OAAO,MAAM,CAAC;KACd;AACF,CAAC","sourcesContent":["import React from \"react\";\r\nimport { Actions } from \"../stores/ProcessMonitorStore\";\r\nimport { HIGH_CPU, HIGH_MEMORY_USAGE, MODERATE_CPU_USAGE, MODERATE_MEMORY_USAGE, TO_MB } from \"../constants\";\r\nimport { bytesToSize, round } from \"../helpers\";\r\n//Not used right now. Currently using alerts. This is for the future.\r\nexport default class ProcessStatistics extends React.Component {\r\n\tconstructor(props) {\r\n\t\tsuper(props);\r\n\t}\r\n\r\n\trender() {\r\n\t\t//simple mode: CPU, memory\r\n\t\t//Advanced mode: add Peak Memory.\r\n\t\treturn (\r\n\t\t\t<div className=\"process-row\">\r\n\t\t\t\t<div className=\"process-name\">\r\n\t\t\t\t\t{/* In simple mode, we print out \"Group 1\", \"Group 2\", etc. The belief is that end users don't care about our wonderful process names (\"e.g., Default-Agent-62-4421). In advanced mode, you get the actual name of the process.  */}\r\n\t\t\t\t\t{this.props.mode === \"simple\" ? \"Process Group\" : this.props.stats.name}\r\n\t\t\t\t</div>\r\n\t\t\t\t<div className=\"process-statistics\">\r\n\t\t\t\t\t{this.props.fields.map((field, i) => (\r\n\t\t\t\t\t\t<div key={i} className={getClassesForStat(this.props.stats[field.value], field.label)}>\r\n\t\t\t\t\t\t\t{prettyPrint(this.props.stats[field.value], field.label)}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t))}\r\n\t\t\t\t\t<div className=\"statistic process-actions\">\r\n\t\t\t\t\t\t{this.props.stats.type === \"Tab\" ? (\r\n\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\tclassName=\" terminate fsbl-button-negative process-action\"\r\n\t\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\t\tActions.terminateProcess(this.props.stats);\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\t\tTerminate\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t) : null}\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 * Given a number, will return modifier classes that change the background. High usage === red. Moderate === orange.\r\n * @param {number} number\r\n * @param {string} statType\r\n */\r\nfunction getClassesForStat(number, statType) {\r\n\tlet classes = \"statistic\",\r\n\t\thigh_comparison = HIGH_MEMORY_USAGE * TO_MB,\r\n\t\tmoderate_comparison = MODERATE_MEMORY_USAGE * TO_MB;\r\n\r\n\tif (statType === \"CPU\") {\r\n\t\t(high_comparison = HIGH_CPU), (moderate_comparison = MODERATE_CPU_USAGE);\r\n\t}\r\n\tif (number > high_comparison) {\r\n\t\tclasses += \" high-usage\";\r\n\t} else if (number > moderate_comparison) {\r\n\t\tclasses += \" moderate-usage\";\r\n\t}\r\n\treturn classes;\r\n}\r\n\r\n/**\r\n * Outputs something nice,. 102423465243 outputs whatever that number is in KB/MB/GB.\r\n * 0.035123 will output 0.35% for CPU.\r\n * @param {number} number\r\n * @param {string} statType\r\n */\r\nfunction prettyPrint(number, statType) {\r\n\tif (statType === \"CPU\") {\r\n\t\t//make it a percent.\r\n\t\treturn round(number, 2) + \"%\";\r\n\t} else if (statType !== \"PID\") {\r\n\t\treturn bytesToSize(number);\r\n\t} else {\r\n\t\treturn number;\r\n\t}\r\n}\r\n"]}
+{"version":3,"file":"ProcessStatistics.js","sourceRoot":"","sources":["../../../../src/components/processMonitor/components/ProcessStatistics.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\r\nimport { Actions } from \"../stores/ProcessMonitorStore\";\r\nimport { HIGH_CPU, HIGH_MEMORY_USAGE, MODERATE_CPU_USAGE, MODERATE_MEMORY_USAGE, TO_MB } from \"../constants\";\r\nimport { bytesToSize, roundDecimalToPrecision } from \"../helpers\";\r\nimport { ProcessType, ViewModeEnums, ModeStatsType } from \"../ProcessMonitorTypes\";\r\n//Not used right now. Currently using alerts. This is for the future.\r\n\r\ninterface IProps {\r\n\tmode: ViewModeEnums;\r\n\tfields: ModeStatsType[];\r\n\tstats: ProcessType[\"statistics\"];\r\n}\r\n\r\n/**\r\n * Given a number, will return modifier classes that change the background. High usage === red. Moderate === orange.\r\n */\r\nfunction getClassesForStat(number: number | undefined, statType: string) {\r\n\tlet classes = \"statistic\",\r\n\t\thigh_comparison = HIGH_MEMORY_USAGE * TO_MB,\r\n\t\tmoderate_comparison = MODERATE_MEMORY_USAGE * TO_MB;\r\n\r\n\tif (typeof number === \"undefined\") {\r\n\t\treturn classes;\r\n\t}\r\n\r\n\tif (statType === \"CPU\") {\r\n\t\t(high_comparison = HIGH_CPU), (moderate_comparison = MODERATE_CPU_USAGE);\r\n\t}\r\n\tif (number > high_comparison) {\r\n\t\tclasses = `${classes} high-usage`;\r\n\t} else if (number > moderate_comparison) {\r\n\t\tclasses = `${classes} moderate-usage`;\r\n\t}\r\n\treturn classes;\r\n}\r\n\r\n/**\r\n * Outputs something nice. 102423465243 outputs whatever that number is in KB/MB/GB.\r\n * 0.35123 will output 0.35% for CPU.\r\n */\r\nfunction prettyPrint(number: number | undefined, statType: string) {\r\n\tif (typeof number === \"undefined\") {\r\n\t\treturn \"\";\r\n\t}\r\n\r\n\tif (statType === \"CPU\") {\r\n\t\t//make it a percent.\r\n\t\treturn `${roundDecimalToPrecision(number, 2)}%`;\r\n\t} else if (statType !== \"PID\") {\r\n\t\treturn bytesToSize(number);\r\n\t} else {\r\n\t\treturn number;\r\n\t}\r\n}\r\n\r\nexport default class ProcessStatistics 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\t//simple mode: CPU, memory\r\n\t\t//Advanced mode: add Peak Memory.\r\n\t\treturn (\r\n\t\t\t<div className=\"process-row\">\r\n\t\t\t\t<div className=\"process-name\">\r\n\t\t\t\t\t{/* In simple mode, we print out \"Group 1\", \"Group 2\", etc. The belief is that end users don't care about our wonderful process names (\"e.g., Default-Agent-62-4421). In advanced mode, you get the actual name of the process.  */}\r\n\t\t\t\t\t{this.props.mode === ViewModeEnums.SIMPLE ? \"Process Group\" : this.props.stats.name}\r\n\t\t\t\t</div>\r\n\t\t\t\t<div className=\"process-statistics\">\r\n\t\t\t\t\t{this.props.fields.map((field, i) => (\r\n\t\t\t\t\t\t<div key={i} className={getClassesForStat(this.props.stats[field.value], field.label)}>\r\n\t\t\t\t\t\t\t{prettyPrint(this.props.stats[field.value], field.label)}\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t))}\r\n\t\t\t\t\t<div className=\"statistic process-actions\">\r\n\t\t\t\t\t\t{this.props.stats.type === \"Tab\" && typeof this.props.stats.uuid === \"string\" ? (\r\n\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\tclassName=\" terminate fsbl-button-negative process-action\"\r\n\t\t\t\t\t\t\t\tonClick={() => {\r\n\t\t\t\t\t\t\t\t\t// @ts-ignore - We are checking for `uuid` being a string, but TS doesn't detect it\r\n\t\t\t\t\t\t\t\t\tActions.terminateProcess(this.props.stats);\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\t\tTerminate\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t) : null}\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"]}