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

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

@@ -4,7 +4,7 @@ export default class ListHeader extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
-            sort: Store.getValue({ field: "sort" }),
+            sort: Store === null || Store === void 0 ? void 0 : Store.getValue({ field: "sort" }),
         };
         this.onSortChanged = this.onSortChanged.bind(this);
     }
@@ -15,21 +15,29 @@ export default class ListHeader extends React.Component {
         });
     }
     UNSAFE_componentWillMount() {
-        Store.addListener({ field: "sort" }, this.onSortChanged);
+        Store === null || Store === void 0 ? void 0 : Store.addListener({ field: "sort" }, this.onSortChanged);
     }
     componentWillUnmount() {
-        Store.removeListener({ field: "sort" }, this.onSortChanged);
+        Store === null || Store === void 0 ? void 0 : Store.removeListener({ field: "sort" }, this.onSortChanged);
     }
     render() {
         return (React.createElement("div", { className: "list-header" },
             React.createElement("div", { className: "list-header-statistic-label list-header-name", onClick: () => {
                     Actions.setSort("name");
+                }, tabIndex: 0, role: "button", onKeyDown: (e) => {
+                    if (e.key === "Enter" || e.key === " ") {
+                        Actions.setSort("name");
+                    }
                 } },
                 "Name",
                 this.state.sort.field === "name" ? (this.state.sort.direction === "ascending" ? (React.createElement("i", { className: "sort-direction ff-arrow-up" })) : (React.createElement("i", { className: "sort-direction ff-arrow-down" }))) : null),
             React.createElement("div", { className: "list-header-statistic-labels" },
                 this.props.fields.map((field, i) => (React.createElement("div", { key: i, className: "list-header-statistic-label", onClick: () => {
                         Actions.setSort(field.value);
+                    }, tabIndex: 0, role: "button", onKeyDown: (e) => {
+                        if (e.key === "Enter" || e.key === " ") {
+                            Actions.setSort(field.value);
+                        }
                     } },
                     field.label,
                     this.state.sort.field === field.value ? (this.state.sort.direction === "ascending" ? (React.createElement("i", { className: "sort-direction ff-arrow-up" })) : (React.createElement("i", { className: "sort-direction ff-arrow-down" }))) : null))),

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":"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","sourcesContent":["import React from \"react\";\r\nimport { Store, Actions } from \"../stores/ProcessMonitorStore\";\r\nimport { SortObjectType, ModeStatsType } from \"../ProcessMonitorTypes\";\r\nimport { StandardError } from \"@finsemble/finsemble-core/types/types\";\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\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: StandardError, 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\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\ttabIndex={0}\r\n\t\t\t\t\trole=\"button\"\r\n\t\t\t\t\tonKeyDown={(e: React.KeyboardEvent) => {\r\n\t\t\t\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\r\n\t\t\t\t\t\t\tActions.setSort(\"name\");\r\n\t\t\t\t\t\t}\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\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.setSort(field.value);\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{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,28 @@ 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: () => {
+                        const { uuid } = this.props.stats;
+                        if (uuid) {
+                            Actions.terminateProcess({ uuid });
+                        }
+                    }, tabIndex: 0, role: "button", onKeyDown: (e) => {
+                        if (e.key === "Enter" || e.key === " ") {
+                            const { uuid } = this.props.stats;
+                            if (uuid) {
+                                Actions.terminateProcess({ uuid });
+                            }
+                        }
+                    } }, "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\tconst { uuid } = this.props.stats;\r\n\t\t\t\t\t\t\t\t\tif (uuid) {\r\n\t\t\t\t\t\t\t\t\t\tActions.terminateProcess({ uuid });\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\ttabIndex={0}\r\n\t\t\t\t\t\t\t\trole=\"button\"\r\n\t\t\t\t\t\t\t\tonKeyDown={(e: React.KeyboardEvent) => {\r\n\t\t\t\t\t\t\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\r\n\t\t\t\t\t\t\t\t\t\tconst { uuid } = this.props.stats;\r\n\t\t\t\t\t\t\t\t\t\tif (uuid) {\r\n\t\t\t\t\t\t\t\t\t\t\tActions.terminateProcess({ uuid });\r\n\t\t\t\t\t\t\t\t\t\t}\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\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"]}

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

@@ -1,16 +1,11 @@
-export const SIMPLE_MODE_STATISTICS: {
-    label: string;
-    value: string;
-}[];
-export const ADVANCED_MODE_STATISTICS: {
-    label: string;
-    value: string;
-}[];
-export const HIGH_CPU: 10;
-export const MODERATE_CPU_USAGE: 5;
-export const MODERATE_MEMORY_USAGE: 250;
-export const HIGH_MEMORY_USAGE: 400;
-export const TO_MB: 1000000;
-export namespace EMPTY_TOTALS {
-    const statistics: {};
-}
+import { ProcessType, ModeStatsType } from "./ProcessMonitorTypes";
+export declare const SIMPLE_MODE_STATISTICS: ModeStatsType[];
+export declare const ADVANCED_MODE_STATISTICS: ModeStatsType[];
+export declare const HIGH_CPU = 10;
+export declare const MODERATE_CPU_USAGE = 5;
+export declare const MODERATE_MEMORY_USAGE = 250;
+export declare const HIGH_MEMORY_USAGE = 400;
+export declare const TO_MB = 1000000;
+export declare const EMPTY_TOTALS: ProcessType;
+export declare const VIEW_DELIMITER = ": view-";
+export declare const VIEW_NAME_REGEXP: RegExp;

package/react/components/processMonitor/constants.js

@@ -13,9 +13,14 @@ export const MODERATE_CPU_USAGE = 5;
 export const MODERATE_MEMORY_USAGE = 250;
 export const HIGH_MEMORY_USAGE = 400;
 export const TO_MB = 1000000;
-let emptyTotals = { statistics: {} };
+const emptyTotals = {
+    visible: false,
+    statistics: {},
+};
 SIMPLE_MODE_STATISTICS.forEach((stat) => {
     emptyTotals.statistics[stat.value] = 0;
 });
 export const EMPTY_TOTALS = emptyTotals;
+export const VIEW_DELIMITER = ": view-";
+export const VIEW_NAME_REGEXP = new RegExp(`(.*)${VIEW_DELIMITER}\\d+$`);
 //# sourceMappingURL=constants.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../src/components/processMonitor/constants.js"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,sBAAsB,GAAG;IACrC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE;IACnC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,gBAAgB,EAAE;CAC5C,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACvC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE;IACnC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,gBAAgB,EAAE;IAC5C,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,oBAAoB,EAAE;IACrD,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE;CACpC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,EAAE,CAAC;AAC3B,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,CAAC;AAGpC,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAC;AACzC,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAC;AAGrC,MAAM,CAAC,MAAM,KAAK,GAAG,OAAO,CAAC;AAE7B,IAAI,WAAW,GAAG,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC;AAErC,sBAAsB,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;IACvC,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AACxC,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,WAAW,CAAC","sourcesContent":["//Stats to parse. Comment out statistics if they interest you.\r\nexport const SIMPLE_MODE_STATISTICS = [\r\n\t{ label: \"CPU\", value: \"cpuUsage\" },\r\n\t{ label: \"Memory\", value: \"workingSetSize\" },\r\n];\r\n//Same as Simple, but we also give peak memory.\r\nexport const ADVANCED_MODE_STATISTICS = [\r\n\t{ label: \"CPU\", value: \"cpuUsage\" },\r\n\t{ label: \"Memory\", value: \"workingSetSize\" },\r\n\t{ label: \"Peak Memory\", value: \"peakWorkingSetSize\" },\r\n\t{ label: \"PID\", value: \"processId\" },\r\n];\r\n//These are percentages\r\nexport const HIGH_CPU = 10;\r\nexport const MODERATE_CPU_USAGE = 5;\r\n\r\n//Usage in MB\r\nexport const MODERATE_MEMORY_USAGE = 250;\r\nexport const HIGH_MEMORY_USAGE = 400;\r\n\r\n//so the constants above can be in MB. This is just a multiplier.\r\nexport const TO_MB = 1000000;\r\n\r\nlet emptyTotals = { statistics: {} };\r\n//Just an object to hold the UI over until we get real information from the system.\r\nSIMPLE_MODE_STATISTICS.forEach((stat) => {\r\n\temptyTotals.statistics[stat.value] = 0;\r\n});\r\n\r\nexport const EMPTY_TOTALS = emptyTotals;\r\n"]}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../src/components/processMonitor/constants.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,MAAM,sBAAsB,GAAoB;IACtD,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE;IACnC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,gBAAgB,EAAE;CAC5C,CAAC;AAGF,MAAM,CAAC,MAAM,wBAAwB,GAAoB;IACxD,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE;IACnC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,gBAAgB,EAAE;IAC5C,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,oBAAoB,EAAE;IACrD,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE;CACpC,CAAC;AAGF,MAAM,CAAC,MAAM,QAAQ,GAAG,EAAE,CAAC;AAC3B,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,CAAC;AAGpC,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAC;AACzC,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAC;AAGrC,MAAM,CAAC,MAAM,KAAK,GAAG,OAAO,CAAC;AAE7B,MAAM,WAAW,GAAgB;IAChC,OAAO,EAAE,KAAK;IACd,UAAU,EAAE,EAAE;CACd,CAAC;AAEF,sBAAsB,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;IACvC,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AACxC,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,WAAW,CAAC;AAKxC,MAAM,CAAC,MAAM,cAAc,GAAG,SAAS,CAAC;AAKxC,MAAM,CAAC,MAAM,gBAAgB,GAAG,IAAI,MAAM,CAAC,OAAO,cAAc,OAAO,CAAC,CAAC","sourcesContent":["import { ProcessType, ModeStatsType } from \"./ProcessMonitorTypes\";\r\n\r\n// Stats to be displayed in simple mode\r\nexport const SIMPLE_MODE_STATISTICS: ModeStatsType[] = [\r\n\t{ label: \"CPU\", value: \"cpuUsage\" },\r\n\t{ label: \"Memory\", value: \"workingSetSize\" },\r\n];\r\n\r\n// Stats to be diesplayed in advanced mode\r\nexport const ADVANCED_MODE_STATISTICS: ModeStatsType[] = [\r\n\t{ label: \"CPU\", value: \"cpuUsage\" },\r\n\t{ label: \"Memory\", value: \"workingSetSize\" },\r\n\t{ label: \"Peak Memory\", value: \"peakWorkingSetSize\" },\r\n\t{ label: \"PID\", value: \"processId\" },\r\n];\r\n\r\n// These are percentages\r\nexport const HIGH_CPU = 10;\r\nexport const MODERATE_CPU_USAGE = 5;\r\n\r\n// Usage in MB\r\nexport const MODERATE_MEMORY_USAGE = 250;\r\nexport const HIGH_MEMORY_USAGE = 400;\r\n\r\n// Constant to convert megabytes (250) to bytes (250,000,000). Conversion is approximate.\r\nexport const TO_MB = 1000000;\r\n\r\nconst emptyTotals: ProcessType = {\r\n\tvisible: false,\r\n\tstatistics: {},\r\n};\r\n// Just an object to hold the UI over until we get real information from the system.\r\nSIMPLE_MODE_STATISTICS.forEach((stat) => {\r\n\temptyTotals.statistics[stat.value] = 0;\r\n});\r\n\r\nexport const EMPTY_TOTALS = emptyTotals;\r\n\r\n/**\r\n * Delimiter between window name and view identifier. Can be used in constructing view names as well as matching view names\r\n */\r\nexport const VIEW_DELIMITER = \": view-\";\r\n\r\n/**\r\n * RegExp for matching on view names or capturing the window name portion of the view\r\n */\r\nexport const VIEW_NAME_REGEXP = new RegExp(`(.*)${VIEW_DELIMITER}\\\\d+$`);\r\n"]}

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

@@ -1,8 +1,16 @@
-export function toProperCase(str: any): any;
-export function bytesToSize(bytes: number): string;
-export function statReducer(prev: any, curr: any): {
+import { ProcessType } from "./ProcessMonitorTypes";
+export declare function toProperCase(str: string): string;
+export declare function bytesToSize(bytes: number): string;
+export declare const statReducer: (prev: ProcessType, curr: ProcessType) => ProcessType;
+export declare const roundDecimalToPrecision: (number: number, precision: number) => number;
+declare type WindowViewItemType = {
+    windowName: string;
+    viewId: string;
+};
+export declare const getViewName: (item: WindowViewItemType) => string;
+declare type ViewObjectType = {
+    type: string;
     name: string;
-    uuid: string;
-    statistics: {};
 };
-export function round(number: any, precision: any): number;
+export declare const getViewBaseName: (view: ViewObjectType) => string;
+export {};

package/react/components/processMonitor/helpers.js

@@ -1,35 +1,43 @@
-import { SIMPLE_MODE_STATISTICS } from "./constants";
+import { SIMPLE_MODE_STATISTICS, VIEW_NAME_REGEXP, VIEW_DELIMITER } from "./constants";
 export function toProperCase(str) {
     return (str
         .replace(/([A-Z])/g, " $1")
-        .replace(/^./, (str) => str.toUpperCase()));
+        .replace(/^./, (char) => char.toUpperCase()));
 }
 export function bytesToSize(bytes) {
-    var sizes = ["Bytes", "KB", "MB", "GB", "TB"];
     if (bytes == 0)
         return "0 Byte";
-    var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
-    return `${Math.round(bytes / Math.pow(1024, i), 2)} ${sizes[i]}`;
+    const sizes = ["Bytes", "KB", "MB", "GB", "TB"];
+    const i = Math.floor(Math.log(bytes) / Math.log(1024));
+    return `${Math.round(bytes / Math.pow(1024, i))} ${sizes[i]}`;
 }
-export function statReducer(prev, curr) {
-    let ret = {
-        name: "Totals",
-        uuid: "Totals",
-        statistics: {},
-    };
+export const statReducer = (prev, curr) => {
+    const statistics = {};
     SIMPLE_MODE_STATISTICS.forEach((stat) => {
-        ret.statistics[stat.value] = prev.statistics[stat.value] + curr.statistics[stat.value];
-    });
-    return ret;
-}
-export function round(number, precision) {
-    var shift = function (number, precision, reverseShift) {
-        if (reverseShift) {
-            precision = -precision;
+        var _a, _b;
+        if (typeof prev.statistics[stat.value] === "undefined" || typeof curr.statistics[stat.value] === "undefined") {
+            statistics[stat.value] = undefined;
+            return;
         }
-        var numArray = `${number}`.split("e");
-        return +`${numArray[0]}e${numArray[1] ? +numArray[1] + precision : precision}`;
+        statistics[stat.value] = ((_a = prev.statistics[stat.value]) !== null && _a !== void 0 ? _a : 0) + ((_b = curr.statistics[stat.value]) !== null && _b !== void 0 ? _b : 0);
+    });
+    statistics.name = "Totals";
+    statistics.uuid = "Totals";
+    return {
+        visible: curr.visible,
+        statistics,
     };
-    return shift(Math.round(shift(number, precision, false)), precision, true);
-}
+};
+export const roundDecimalToPrecision = (number, precision) => {
+    const shiftedNumber = number * Math.pow(10, precision);
+    const roundedShiftedNumber = Math.round(shiftedNumber);
+    return roundedShiftedNumber / Math.pow(10, precision);
+};
+export const getViewName = (item) => `${item.windowName}${VIEW_DELIMITER}${item.viewId}`;
+export const getViewBaseName = (view) => {
+    if (view.type === "view") {
+        return view.name.match(VIEW_NAME_REGEXP)[1];
+    }
+    return view.name;
+};
 //# sourceMappingURL=helpers.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/components/processMonitor/helpers.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAGrD,MAAM,UAAU,YAAY,CAAC,GAAG;IAC/B,OAAO,CACN,GAAG;SACD,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC;SAE1B,OAAO,CAAC,IAAI,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC,CAC3C,CAAC;AACH,CAAC;AAKD,MAAM,UAAU,WAAW,CAAC,KAAK;IAChC,IAAI,KAAK,GAAG,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;IAC9C,IAAI,KAAK,IAAI,CAAC;QAAE,OAAO,QAAQ,CAAC;IAChC,IAAI,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IAC/D,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;AAClE,CAAC;AAOD,MAAM,UAAU,WAAW,CAAC,IAAI,EAAE,IAAI;IACrC,IAAI,GAAG,GAAG;QACT,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,QAAQ;QACd,UAAU,EAAE,EAAE;KACd,CAAC;IACF,sBAAsB,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;QACvC,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACxF,CAAC,CAAC,CAAC;IACH,OAAO,GAAG,CAAC;AACZ,CAAC;AAOD,MAAM,UAAU,KAAK,CAAC,MAAM,EAAE,SAAS;IACtC,IAAI,KAAK,GAAG,UAAU,MAAM,EAAE,SAAS,EAAE,YAAY;QACpD,IAAI,YAAY,EAAE;YACjB,SAAS,GAAG,CAAC,SAAS,CAAC;SACvB;QACD,IAAI,QAAQ,GAAG,GAAG,MAAM,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACtC,OAAO,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC;IAChF,CAAC,CAAC;IACF,OAAO,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC;AAC5E,CAAC","sourcesContent":["import { SIMPLE_MODE_STATISTICS } from \"./constants\";\r\n\r\n// This Is Proper Case\r\nexport function toProperCase(str) {\r\n\treturn (\r\n\t\tstr\r\n\t\t\t.replace(/([A-Z])/g, \" $1\")\r\n\t\t\t// uppercase the first character\r\n\t\t\t.replace(/^./, (str) => str.toUpperCase())\r\n\t);\r\n}\r\n/**\r\n * Given a number, will return a nice string, 1000 will return 1KB, 100 will return 100 Bytes, and so on.\r\n * @param {number} bytes\r\n */\r\nexport function bytesToSize(bytes) {\r\n\tvar sizes = [\"Bytes\", \"KB\", \"MB\", \"GB\", \"TB\"];\r\n\tif (bytes == 0) return \"0 Byte\";\r\n\tvar i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));\r\n\treturn `${Math.round(bytes / Math.pow(1024, i), 2)} ${sizes[i]}`;\r\n}\r\n\r\n/**\r\n * Handler for Array.reduce. It takes the array of statistics and sums each value. This outputs a nice object that has our total CPU and memory consumption.\r\n * @param {*} prev\r\n * @param {*} curr\r\n */\r\nexport function statReducer(prev, curr) {\r\n\tlet ret = {\r\n\t\tname: \"Totals\",\r\n\t\tuuid: \"Totals\",\r\n\t\tstatistics: {},\r\n\t};\r\n\tSIMPLE_MODE_STATISTICS.forEach((stat) => {\r\n\t\tret.statistics[stat.value] = prev.statistics[stat.value] + curr.statistics[stat.value];\r\n\t});\r\n\treturn ret;\r\n}\r\n\r\n/**\r\n * Convenience function for rounding numbers.\r\n * @param {*} number\r\n * @param {*} precision\r\n */\r\nexport function round(number, precision) {\r\n\tvar shift = function (number, precision, reverseShift) {\r\n\t\tif (reverseShift) {\r\n\t\t\tprecision = -precision;\r\n\t\t}\r\n\t\tvar numArray = `${number}`.split(\"e\");\r\n\t\treturn +`${numArray[0]}e${numArray[1] ? +numArray[1] + precision : precision}`;\r\n\t};\r\n\treturn shift(Math.round(shift(number, precision, false)), precision, true);\r\n}\r\n"]}
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/components/processMonitor/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAIvF,MAAM,UAAU,YAAY,CAAC,GAAW;IACvC,OAAO,CACN,GAAG;SACD,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC;SAE1B,OAAO,CAAC,IAAI,EAAE,CAAC,IAAY,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CACrD,CAAC;AACH,CAAC;AAID,MAAM,UAAU,WAAW,CAAC,KAAa;IACxC,IAAI,KAAK,IAAI,CAAC;QAAE,OAAO,QAAQ,CAAC;IAGhC,MAAM,KAAK,GAAG,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;IAGhD,MAAM,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC;IAGvD,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;AAC/D,CAAC;AAMD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAiB,EAAE,IAAiB,EAAe,EAAE;IAChF,MAAM,UAAU,GAAwC,EAAE,CAAC;IAC3D,sBAAsB,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;;QACvC,IAAI,OAAO,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,WAAW,IAAI,OAAO,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,WAAW,EAAE;YAC7G,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC;YACnC,OAAO;SACP;QAED,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,mCAAI,CAAC,CAAC,GAAG,CAAC,MAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,mCAAI,CAAC,CAAC,CAAC;IAClG,CAAC,CAAC,CAAC;IAEH,UAAU,CAAC,IAAI,GAAG,QAAQ,CAAC;IAC3B,UAAU,CAAC,IAAI,GAAG,QAAQ,CAAC;IAE3B,OAAO;QACN,OAAO,EAAE,IAAI,CAAC,OAAO;QACrB,UAAU;KACV,CAAC;AACH,CAAC,CAAC;AAMF,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,MAAc,EAAE,SAAiB,EAAU,EAAE;IAEpF,MAAM,aAAa,GAAG,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC;IACvD,MAAM,oBAAoB,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;IACvD,OAAO,oBAAoB,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC;AACvD,CAAC,CAAC;AAUF,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,IAAwB,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC,UAAU,GAAG,cAAc,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;AAS7G,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,IAAoB,EAAU,EAAE;IAC/D,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE;QAEzB,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAE,CAAC,CAAC,CAAC,CAAC;KAC7C;IACD,OAAO,IAAI,CAAC,IAAI,CAAC;AAClB,CAAC,CAAC","sourcesContent":["import { SIMPLE_MODE_STATISTICS, VIEW_NAME_REGEXP, VIEW_DELIMITER } from \"./constants\";\r\nimport { ProcessStatisticsType, ProcessType } from \"./ProcessMonitorTypes\";\r\n\r\n// This Is Proper Case\r\nexport function toProperCase(str: string) {\r\n\treturn (\r\n\t\tstr\r\n\t\t\t.replace(/([A-Z])/g, \" $1\")\r\n\t\t\t// uppercase the first character\r\n\t\t\t.replace(/^./, (char: string) => char.toUpperCase())\r\n\t);\r\n}\r\n/**\r\n * Given a number, will return a nice string, 1,024 will return 1KB, 100 will return 100 Bytes, and so on.\r\n */\r\nexport function bytesToSize(bytes: number) {\r\n\tif (bytes == 0) return \"0 Byte\";\r\n\r\n\t// Size powers, in English\r\n\tconst sizes = [\"Bytes\", \"KB\", \"MB\", \"GB\", \"TB\"];\r\n\r\n\t// Determine the size power for the number of bytes\r\n\tconst i = Math.floor(Math.log(bytes) / Math.log(1024));\r\n\r\n\t// Return the size, rounded\r\n\treturn `${Math.round(bytes / Math.pow(1024, i))} ${sizes[i]}`;\r\n}\r\n\r\n/**\r\n * Handler for Array.reduce. It takes the array of statistics and sums each value.\r\n * This outputs an object that has total CPU and memory consumption.\r\n */\r\nexport const statReducer = (prev: ProcessType, curr: ProcessType): ProcessType => {\r\n\tconst statistics: ProcessStatisticsType[\"statistics\"] = {};\r\n\tSIMPLE_MODE_STATISTICS.forEach((stat) => {\r\n\t\tif (typeof prev.statistics[stat.value] === \"undefined\" || typeof curr.statistics[stat.value] === \"undefined\") {\r\n\t\t\tstatistics[stat.value] = undefined;\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tstatistics[stat.value] = (prev.statistics[stat.value] ?? 0) + (curr.statistics[stat.value] ?? 0);\r\n\t});\r\n\r\n\tstatistics.name = \"Totals\";\r\n\tstatistics.uuid = \"Totals\";\r\n\r\n\treturn {\r\n\t\tvisible: curr.visible,\r\n\t\tstatistics,\r\n\t};\r\n};\r\n\r\n/**\r\n * Convenience function for rounding decimals to a given precision\r\n * Note that \"precision\" here means \"number of digits to the right of the decimal point\"\r\n */\r\nexport const roundDecimalToPrecision = (number: number, precision: number): number => {\r\n\t// Example: number = .12345, precision = 2\r\n\tconst shiftedNumber = number * Math.pow(10, precision); // example: 12.345\r\n\tconst roundedShiftedNumber = Math.round(shiftedNumber); // example: 12\r\n\treturn roundedShiftedNumber / Math.pow(10, precision); // example: .12\r\n};\r\n\r\ntype WindowViewItemType = {\r\n\twindowName: string;\r\n\tviewId: string;\r\n};\r\n/**\r\n * Gives a standard name for a view, given a window or view object\r\n * @returns string\r\n */\r\nexport const getViewName = (item: WindowViewItemType) => `${item.windowName}${VIEW_DELIMITER}${item.viewId}`;\r\n\r\ntype ViewObjectType = {\r\n\ttype: string;\r\n\tname: string;\r\n};\r\n/**\r\n * Returns the name of the parent window for the view by stripping the standard view identifier, or else return the supplied name if item is not a view\r\n */\r\nexport const getViewBaseName = (view: ViewObjectType): string => {\r\n\tif (view.type === \"view\") {\r\n\t\t// The `!` is TS's non-null assertion operator\r\n\t\treturn view.name.match(VIEW_NAME_REGEXP)![1];\r\n\t}\r\n\treturn view.name;\r\n};\r\n"]}

package/react/components/processMonitor/helpers.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/react/components/processMonitor/helpers.spec.js

@@ -0,0 +1,44 @@
+import { describe, it } from "mocha";
+import { expect } from "chai";
+import { bytesToSize, roundDecimalToPrecision } from "./helpers";
+describe("Process Monitor helpers", () => {
+    it("bytesToSize", () => {
+        [
+            [0, "0 Byte"],
+            [1, "1 Bytes"],
+            [1023, "1023 Bytes"],
+            [1024, "1 KB"],
+            [1025, "1 KB"],
+            [1024 * 1.4, "1 KB"],
+            [1024 * 1.5, "2 KB"],
+            [1024 * 2, "2 KB"],
+            [1024 * 1000, "1000 KB"],
+            [Math.pow(1024, 2), "1 MB"],
+            [Math.pow(1024, 3), "1 GB"],
+            [Math.pow(1024, 4), "1 TB"],
+        ].forEach(([input, output]) => {
+            expect(bytesToSize(input)).to.be.equal(output);
+        });
+    });
+    it("roundDecimalToPrecision", () => {
+        [
+            [1000, 2, 1000],
+            [1, 2, 1],
+            [0, 1, 0],
+            [1, 0, 1],
+            [0.5, 0, 1],
+            [0.5, 1, 0.5],
+            [0.5, 2, 0.5],
+            [0.12345, 1, 0.1],
+            [0.12345, 2, 0.12],
+            [0.12345, 3, 0.123],
+            [0.12345, 4, 0.1235],
+            [0.12345, 5, 0.12345],
+            [0.12345, 6, 0.12345],
+            [1000.12345, 2, 1000.12],
+        ].forEach(([inputNumber, inputPrecision, output]) => {
+            expect(roundDecimalToPrecision(inputNumber, inputPrecision)).to.be.equal(output);
+        });
+    });
+});
+//# sourceMappingURL=helpers.spec.js.map

package/react/components/processMonitor/helpers.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.spec.js","sourceRoot":"","sources":["../../../src/components/processMonitor/helpers.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,MAAM,CAAC;AAE9B,OAAO,EAAE,WAAW,EAAE,uBAAuB,EAAE,MAAM,WAAW,CAAC;AAEjE,QAAQ,CAAC,yBAAyB,EAAE,GAAG,EAAE;IACxC,EAAE,CAAC,aAAa,EAAE,GAAG,EAAE;QACtB;YACC,CAAC,CAAC,EAAE,QAAQ,CAAC;YACb,CAAC,CAAC,EAAE,SAAS,CAAC;YACd,CAAC,IAAI,EAAE,YAAY,CAAC;YACpB,CAAC,IAAI,EAAE,MAAM,CAAC;YACd,CAAC,IAAI,EAAE,MAAM,CAAC;YACd,CAAC,IAAI,GAAG,GAAG,EAAE,MAAM,CAAC;YACpB,CAAC,IAAI,GAAG,GAAG,EAAE,MAAM,CAAC;YACpB,CAAC,IAAI,GAAG,CAAC,EAAE,MAAM,CAAC;YAClB,CAAC,IAAI,GAAG,IAAI,EAAE,SAAS,CAAC;YACxB,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,CAAC;YAC3B,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,CAAC;YAC3B,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,CAAC;SAC3B,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,MAAM,CAAC,EAAE,EAAE;YAC7B,MAAM,CAAC,WAAW,CAAC,KAAe,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QAC1D,CAAC,CAAC,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yBAAyB,EAAE,GAAG,EAAE;QAClC;YACC,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,CAAC;YACf,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;YACT,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;YACT,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;YACT,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC;YACX,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;YACb,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;YACb,CAAC,OAAO,EAAE,CAAC,EAAE,GAAG,CAAC;YACjB,CAAC,OAAO,EAAE,CAAC,EAAE,IAAI,CAAC;YAClB,CAAC,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC;YACnB,CAAC,OAAO,EAAE,CAAC,EAAE,MAAM,CAAC;YACpB,CAAC,OAAO,EAAE,CAAC,EAAE,OAAO,CAAC;YACrB,CAAC,OAAO,EAAE,CAAC,EAAE,OAAO,CAAC;YACrB,CAAC,UAAU,EAAE,CAAC,EAAE,OAAO,CAAC;SACxB,CAAC,OAAO,CAAC,CAAC,CAAC,WAAW,EAAE,cAAc,EAAE,MAAM,CAAC,EAAE,EAAE;YACnD,MAAM,CAAC,uBAAuB,CAAC,WAAqB,EAAE,cAAwB,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACtG,CAAC,CAAC,CAAC;IACJ,CAAC,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import { describe, it } from \"mocha\";\r\nimport { expect } from \"chai\";\r\n\r\nimport { bytesToSize, roundDecimalToPrecision } from \"./helpers\";\r\n\r\ndescribe(\"Process Monitor helpers\", () => {\r\n\tit(\"bytesToSize\", () => {\r\n\t\t[\r\n\t\t\t[0, \"0 Byte\"],\r\n\t\t\t[1, \"1 Bytes\"],\r\n\t\t\t[1023, \"1023 Bytes\"],\r\n\t\t\t[1024, \"1 KB\"],\r\n\t\t\t[1025, \"1 KB\"],\r\n\t\t\t[1024 * 1.4, \"1 KB\"],\r\n\t\t\t[1024 * 1.5, \"2 KB\"],\r\n\t\t\t[1024 * 2, \"2 KB\"],\r\n\t\t\t[1024 * 1000, \"1000 KB\"],\r\n\t\t\t[Math.pow(1024, 2), \"1 MB\"],\r\n\t\t\t[Math.pow(1024, 3), \"1 GB\"],\r\n\t\t\t[Math.pow(1024, 4), \"1 TB\"],\r\n\t\t].forEach(([input, output]) => {\r\n\t\t\texpect(bytesToSize(input as number)).to.be.equal(output);\r\n\t\t});\r\n\t});\r\n\r\n\tit(\"roundDecimalToPrecision\", () => {\r\n\t\t[\r\n\t\t\t[1000, 2, 1000],\r\n\t\t\t[1, 2, 1],\r\n\t\t\t[0, 1, 0],\r\n\t\t\t[1, 0, 1],\r\n\t\t\t[0.5, 0, 1],\r\n\t\t\t[0.5, 1, 0.5],\r\n\t\t\t[0.5, 2, 0.5],\r\n\t\t\t[0.12345, 1, 0.1],\r\n\t\t\t[0.12345, 2, 0.12],\r\n\t\t\t[0.12345, 3, 0.123],\r\n\t\t\t[0.12345, 4, 0.1235],\r\n\t\t\t[0.12345, 5, 0.12345],\r\n\t\t\t[0.12345, 6, 0.12345],\r\n\t\t\t[1000.12345, 2, 1000.12],\r\n\t\t].forEach(([inputNumber, inputPrecision, output]) => {\r\n\t\t\texpect(roundDecimalToPrecision(inputNumber as number, inputPrecision as number)).to.be.equal(output);\r\n\t\t});\r\n\t});\r\n});\r\n"]}

package/react/components/processMonitor/stores/ProcessMonitorStore.d.ts

@@ -1,15 +1,31 @@
-declare let ProcessMonitorStore: any;
-export namespace Actions {
-    function initialize(cb: any): void;
-    function getInitialData(): void;
-    function setSort(field: any): void;
-    function extractData(processes: any): void;
-    function createDataModel(processes: any, cb: any): void;
-    function sortProcesses(procs: any): any;
-    function toggleViewMode(): void;
-    function identifyWindow(winID: any): void;
-    function terminateProcess(AppIdentifier: any, force?: boolean, prompt?: boolean): void;
-    function removeWindowLocally(winID: any): void;
-    function closeWindow(winID: any, force?: boolean): void;
-}
-export { ProcessMonitorStore as Store };
+import { ChildWindowType, ProcessType } from "../ProcessMonitorTypes";
+import StoreModel from "@finsemble/finsemble-core/types/clients/StoreModel";
+import { StandardCallback, StandardError } from "@finsemble/finsemble-core/types/types";
+import { ProcessInfo } from "@finsemble/finsemble-core/types/FEA";
+declare let ProcessMonitorStore: StoreModel | undefined;
+declare type VoidCallback = () => void;
+export declare let storeWrapper: StoreModel | null | undefined;
+declare const Actions: {
+    initialize: (cb: VoidCallback) => void;
+    getInitialData: () => void;
+    setSort: (field: string) => void;
+    extractData: (processes: ProcessInfo[]) => void;
+    createDataModel: (processes: ProcessInfo[], cb: (procs: ProcessType[]) => void) => void;
+    sortProcesses: (procs: ProcessType[]) => ProcessType[];
+    toggleViewMode: () => void;
+    getFlashingState: (cb?: StandardCallback<StandardError, any> | undefined) => void;
+    setFlashingState: (value: boolean, cb?: StandardCallback<StandardError, any> | undefined) => void;
+    identifyWindow: (winID: ChildWindowType) => void;
+    terminateProcess: (AppIdentifier: {
+        uuid: string;
+    }, force?: boolean) => void;
+    removeWindowLocally: (winID: {
+        uuid: string;
+        name: string;
+    }) => void;
+    closeWindow: (winID: {
+        uuid: string;
+        name: string;
+    }, force?: boolean) => void;
+};
+export { ProcessMonitorStore as Store, Actions };