@finsemble/finsemble-ui 6.5.2 → 6.6.0-beta.3

package/react/components/menu/MenuPortal.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuPortal.js","sourceRoot":"","sources":["../../../src/components/menu/MenuPortal.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport * as ReactDOM from \"react-dom\";\nimport { MenuContext } from \"./menuContext\";\nimport { calculateDimensions, injectCSS } from \"./menuHelpers\";\nimport { KeyboardNavigation } from \"./keyboardNavigation\";\nimport { MenuAutoResizer } from \"./MenuAutoResizer\";\nimport { useState, useEffect, useContext, useMemo } from \"react\";\nimport { useMenu } from \"../../hooks/useMenu\";\nimport { services, FEA } from \"@finsemble/finsemble-api\";\n\ntype SpawnParams = services.window.types.SpawnParams;\n\n/**\n * Proxy/fake events are needed because when `document.addEventListener` is used inside a component\n * that is rendered inside react portal, `document` will refer to the toolbar's document instead\n * of the childWindow's document. Clicking inside a portal will not therefore capture those events.\n *\n * This code intercepts these events inside the portal and then forwards them to the parent (toolbar).\n */\nconst setupEventForwarding = (newWindow: Window) => {\n\t[\"mouseDown\", \"click\", \"mouseUp\"].forEach((eventName) => {\n\t\tnewWindow.document.addEventListener(eventName, (event) => {\n\t\t\tdocument.dispatchEvent(\n\t\t\t\tnew CustomEvent(`portal:${eventName}`, {\n\t\t\t\t\tdetail: {\n\t\t\t\t\t\t// Devs may need access to the x and y of the cursor\n\t\t\t\t\t\tmouseEvent: new MouseEvent(eventName, event),\n\t\t\t\t\t\t// And possibly the target element\n\t\t\t\t\t\ttarget: event.target,\n\t\t\t\t\t},\n\t\t\t\t})\n\t\t\t);\n\t\t});\n\t});\n\n\t/**\n\t * Proxies keyboard events from the portal up into the parent window.\n\t * instead of e.key, you'll need to access e.detail.key.\n\t */\n\t[\"keyup\", \"keydown\", \"keypress\"].forEach((eventName) => {\n\t\tnewWindow?.document.addEventListener(eventName, (event) => {\n\t\t\tdocument.dispatchEvent(\n\t\t\t\tnew CustomEvent(`portal:${eventName}`, {\n\t\t\t\t\tdetail: new KeyboardEvent(event.type, event),\n\t\t\t\t})\n\t\t\t);\n\t\t});\n\t});\n};\n\n/**\n * The window (opened by window.open) is an empty html document.\n * This function creates a containerDiv for the parent to insert its\n * React DOM. That containerDiv is set through the `setElement()` method\n * which must be passed in.\n *\n * This function also does portal housekeeping such as transferring CSS and window\n * events.\n */\nconst insertWindowContent = ({\n\tnewWindow,\n\tisAutoResizable,\n\tclassName,\n\tsetElement,\n\tmenuHeight,\n}: {\n\tnewWindow: Window;\n\tisAutoResizable: boolean;\n\tclassName?: string;\n\tmenuHeight?: number;\n\tsetElement: React.Dispatch<React.SetStateAction<HTMLElement | undefined>>;\n}) => {\n\t// Set the child window's <html> tag to class \"menu-portal\" for scrollbar styling\n\tnewWindow.document.documentElement.className = \"menu-portal\";\n\tif (isAutoResizable) newWindow.document.body.setAttribute(\"resizing\", \"true\");\n\n\t// Create the element which will hold our react elements and then append it into the child window's body.\n\tconst containerDiv: HTMLElement = document.createElement(\"div\");\n\tnewWindow.document.body.appendChild(containerDiv);\n\n\t// The className that was passed to MenuShell is added to the child window's <body>\n\tclassName?.split(\" \").forEach((name: string) => newWindow!.document.body.classList.add(name));\n\n\t// This will update local state which will cause the parent React Functional Component\n\t// to return a react portal. See comments at the end of this file.\n\tsetElement(containerDiv);\n\n\t// Inject css into the child window's <head>\n\tinjectCSS(newWindow);\n\n\t// THE FOLLOWING IS LIKELY DEPRECATED BUT KEEPING JUST IN CASE\n\t// Place height on the portal.\n\t// inside of the portal, window.outerHeight === 39 (toolbar height).\n\t// Knowing the height of the window is important because some menus use that\n\t// information to force overflow on certain sections of the menu.\n\t(newWindow as any).portalHeight = menuHeight;\n};\n\n/**\n * React hook to create a drop down menu. This hook creates a new window using window.open\n * and assigns it as the childWindow to the MenuPortal. It then uses insertWindowContent()\n * to establish the React/DOM connection with the parent (e.g. Toolbar).\n */\nconst useCreateDropdown = ({\n\tkeyboardNavigation,\n\tsetElement,\n\tchildWindow,\n\tsetChildWindow,\n}: {\n\tkeyboardNavigation: KeyboardNavigation | null;\n\tsetElement: React.Dispatch<React.SetStateAction<HTMLElement | undefined>>;\n\tchildWindow: Window | null;\n\tsetChildWindow: React.Dispatch<React.SetStateAction<Window | null>>;\n}) => {\n\tconst { thisMenuId, menuWidth, menuHeight, className, maxHeight, minHeight } = useContext(MenuContext);\n\tconst { blurMenu } = useMenu();\n\tconst isAutoResizable = !menuHeight;\n\n\t/**\n\t * Initialize the window. This should only run once though it is possible\n\t * to run multiple times if MenuContext changes.\n\t */\n\tuseEffect(() => {\n\t\tlet menuAutoResizer: any = null;\n\n\t\t/**\n\t\t * Initial size and location of the menu is irrelevant because it is hidden.\n\t\t * The menu will be resized and positioned correctly when it is shown.\n\t\t */\n\t\tconst features = `height=1,width=${menuWidth},left=0,top=0,opacity=1`;\n\n\t\t/**\n\t\t * Opens the window which will contain the menu contents. This looks like a browser window open\n\t\t * but actually opens an Electron window which FEA intercepts. FEA uses the `childWindowOptions`\n\t\t * json configuration to determine how to display the window. `childWindowOptions.show` should\n\t\t * be set to `false` otherwise a white window will flash prior to the menu being rendered.\n\t\t *\n\t\t *\n\t\t * The \"/component/toolbar/menu.html\" is just an empty page. It's necessary to reference a real page\n\t\t * rather than about:blank in order that the \"origin\" is correct for the page. Many CSS ui-assets such\n\t\t * as fonts and images are set with relative paths that require a correct origin.\n\t\t *\n\t\t * Note, we append the menu ID for automated testing. This allows Selenium to\n\t\t * uniquely identify each menu.\n\t\t */\n\t\tconst newWindow = window.open(`./menu.html#${thisMenuId}`, undefined, features);\n\t\tsetChildWindow(newWindow);\n\n\t\tif (newWindow) {\n\t\t\tconst onLoad = () => {\n\t\t\t\tinsertWindowContent({ newWindow, isAutoResizable, className, setElement, menuHeight });\n\t\t\t\tsetupEventForwarding(newWindow);\n\t\t\t\t/* Close window when a user clicks away.\n\t\t\t\t\tAre you wondering why not just close the window without calling\n\t\t\t\t\ttoggle? because we want to update the state in the store first\n\t\t\t\t\twhich will cause openMenuId to no longer match the shell id\n\t\t\t\t\tand eventually destroy this component which will cause the window\n\t\t\t\t\tto close (see cleanup function).\n\t\t\t\t*/\n\t\t\t\tnewWindow.addEventListener(\"blur\", blurMenu);\n\n\t\t\t\t// Attach MenuAutoResizer only if the menu doesn't have a fixed height\n\t\t\t\tif (isAutoResizable)\n\t\t\t\t\tmenuAutoResizer = new MenuAutoResizer(newWindow, thisMenuId, menuWidth, maxHeight, minHeight);\n\t\t\t};\n\t\t\tnewWindow.addEventListener(\"load\", onLoad, true);\n\t\t} else {\n\t\t\tFSBL.Clients.Logger.system.error(`MenuPortal error: window.open returned null for \"./menu.html#${thisMenuId}\"`);\n\t\t}\n\n\t\treturn () => {\n\t\t\t// imesner 20210406 childwindow and keyboardNavigation were both null but hadn't closed the window or released global hotkeys\n\t\t\tconst win = childWindow || menuAutoResizer?.childWindow;\n\t\t\tconst keyboardNav = keyboardNavigation || (win as any)?.keyboardNavigation;\n\n\t\t\tkeyboardNav?.detach();\n\n\t\t\tmenuAutoResizer?.disconnect();\n\t\t\twin?.close();\n\t\t\tsetChildWindow(null);\n\t\t};\n\t}, [blurMenu, className, menuWidth, menuHeight, maxHeight, thisMenuId]);\n};\n\n/**\n * Sets visibility, size and location of the window. This can be called numerous times\n * during the lifetime of the MenuPortal.\n */\nconst showHideResizeWindow = async ({\n\tchildWindow,\n\tkeyboardNavigation,\n\tshow,\n\tthisMenuId,\n\tmenuHeight,\n\tmaxHeight,\n\tminHeight,\n}: {\n\tchildWindow: Window;\n\tkeyboardNavigation: KeyboardNavigation | null;\n\tshow: boolean;\n\tthisMenuId: string;\n\tmenuHeight?: number;\n\tmaxHeight: number;\n\tminHeight: number;\n}) => {\n\tconst finWindow: FEA.FEAWindow = childWindow.fin.desktop.Window.getCurrent();\n\tif (show) {\n\t\tconst { left, top, height } = await calculateDimensions(childWindow, thisMenuId, menuHeight, maxHeight, minHeight);\n\n\t\tconst params: SpawnParams = {\n\t\t\tposition: \"absolute\",\n\t\t\tleft: left,\n\t\t\ttop: top,\n\t\t\theight: height,\n\t\t\tforceOntoMonitor: \"monitorRect\",\n\t\t};\n\n\t\tconst { name } = childWindow;\n\n\t\t/**\n\t\t * Use Finsemble to show the window. We might be tempted simply to use childWindow.moveTo() or childWindow.resizeTo()\n\t\t * but those commands limit the child window to a single monitor. We want to position the window relative to the\n\t\t * monitor on which the toolbar currently resides. showWindow() is monitor aware, so by using monitor=\"mine\" we can\n\t\t * ensure that the menu will always open on the same monitor as the toolbar. Since our toolbar has built in logic\n\t\t * to avoid straddling, we can be sure that the menu will never have to guess whether it exists on the left or right\n\t\t * side of the toolbar. Finally, showWindow() forces windows to open entirely on a monitor, so it will slide the\n\t\t * menu to the left or right as necessary to prevent it from straddling.\n\t\t */\n\t\tFSBL.Clients.LauncherClient.showWindow({ windowName: name }, params);\n\n\t\t// Ensures that the menu has keyboard focus for accessibility\n\t\tfinWindow.focus();\n\n\t\t// Ensures that the menu is positioned above any other windows that have setAlwaysOnTop flagged\n\t\tFSBL.FinsembleWindow.getInstance({ name: name }, (e: any, fsblWindow: any) => {\n\t\t\tfsblWindow.setAlwaysOnTop({ alwaysOnTop: true });\n\t\t});\n\n\t\tif (keyboardNavigation) {\n\t\t\t// Why??\n\t\t\t(childWindow as any).keyboardNavigation = keyboardNavigation;\n\t\t\tkeyboardNavigation.attach();\n\t\t}\n\t} else {\n\t\tconst { name } = childWindow;\n\t\tFSBL.FinsembleWindow.getInstance({ name: name }, (e: any, fsblWindow: any) => {\n\t\t\tfsblWindow.setAlwaysOnTop({ alwaysOnTop: false });\n\t\t});\n\n\t\tfinWindow.hide();\n\t\tif (keyboardNavigation) keyboardNavigation.detach();\n\t}\n};\n\n/**\n * Closes the menu portal if the menu button is removed from the toolbar\n *\n * @param {Node} element - HTML element to observe\n *\n */\nconst closePortal = (element: Node) => {\n\tconst { closeMenu } = useMenu();\n\n\tconst options = {\n\t\tchildList: true,\n\t\tsubtree: true,\n\t};\n\n\t/**\n\t * MutationObserver interface provides the ability to watch for\n\t * changes to the DOM tree using the observe method\n\t */\n\tconst mutationObserver = new MutationObserver((mutations) => {\n\t\tmutations.forEach((mutation) => {\n\t\t\tif (mutation.removedNodes?.length) closeMenu();\n\n\t\t\t// stops the MutationObserver from receiving notification from observer\n\t\t\tmutationObserver.disconnect();\n\t\t});\n\t});\n\n\t// watches for DOM changes\n\tmutationObserver.observe(element, options);\n};\n\nexport const MenuPortal: React.FunctionComponent<{\n\tshow: boolean;\n}> = ({ show, children }) => {\n\tconst { thisMenuId, menuHeight, maxHeight, minHeight } = useContext(MenuContext);\n\n\t// Container div for React portal\n\tconst [element, setElement] = useState<HTMLElement>();\n\tconst [childWindow, setChildWindow] = useState<Window | null>(null);\n\n\t/**\n\t * KeyboardNavigation registers global hotkeys for navigating through a menu with cursor keys.\n\t * Those hotkeys are registered/unregistered based on visibility of the child window.\n\t * The KeyboardNavigation class is a singleton and so is memoized. It is created when the child window is available.\n\t */\n\tconst keyboardNavigation = useMemo(() => {\n\t\tif (childWindow) return new KeyboardNavigation(childWindow, \".menu-item\");\n\t\telse return null;\n\t}, [childWindow]);\n\n\t/**\n\t * Show and hide window. This effect will run whenever the `show` prop changes,\n\t * generally initiated by a click to <MenuToggle>.\n\t */\n\tuseEffect(() => {\n\t\t// If child window isn't yet initialized then no-op\n\t\tif (!childWindow) return;\n\n\t\tshowHideResizeWindow({ childWindow, keyboardNavigation, show, thisMenuId, menuHeight, maxHeight, minHeight });\n\t\treturn () => {};\n\t}, [show]);\n\n\t// Create the dropdown. (if MenuContext changes then the dropdown will be removed and recreated).\n\tuseCreateDropdown({ keyboardNavigation, childWindow, setElement, setChildWindow });\n\n\tconst toolbar = document.getElementById(\"Toolbar-tsx\");\n\n\tif (toolbar) closePortal(toolbar);\n\n\t// We should only return a react portal when window is ready\n\t// and container div appended to its body\n\t// See Dan abramov comment about this at:\n\t// https://github.com/facebook/react/issues/12355#issuecomment-410996235\n\treturn element ? ReactDOM.createPortal(children, element) : null;\n};\n"]}
+{"version":3,"file":"MenuPortal.js","sourceRoot":"","sources":["../../../src/components/menu/MenuPortal.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport * as ReactDOM from \"react-dom\";\nimport { MenuContext } from \"./menuContext\";\nimport { calculateDimensions, injectCSS } from \"./menuHelpers\";\nimport { KeyboardNavigation } from \"./keyboardNavigation\";\nimport { MenuAutoResizer } from \"./MenuAutoResizer\";\nimport { useState, useEffect, useContext, useMemo } from \"react\";\nimport { useMenu } from \"../../hooks/useMenu\";\nimport { services, FEA } from \"@finsemble/finsemble-api\";\n\ntype SpawnParams = services.window.types.SpawnParams;\n\n/**\n * Proxy/fake events are needed because when `document.addEventListener` is used inside a component\n * that is rendered inside react portal, `document` will refer to the toolbar's document instead\n * of the childWindow's document. Clicking inside a portal will not therefore capture those events.\n *\n * This code intercepts these events inside the portal and then forwards them to the parent (toolbar).\n */\nconst setupEventForwarding = (newWindow: Window) => {\n\t[\"mouseDown\", \"click\", \"mouseUp\"].forEach((eventName) => {\n\t\tnewWindow.document.addEventListener(eventName, (event) => {\n\t\t\tdocument.dispatchEvent(\n\t\t\t\tnew CustomEvent(`portal:${eventName}`, {\n\t\t\t\t\tdetail: {\n\t\t\t\t\t\t// Devs may need access to the x and y of the cursor\n\t\t\t\t\t\tmouseEvent: new MouseEvent(eventName, event),\n\t\t\t\t\t\t// And possibly the target element\n\t\t\t\t\t\ttarget: event.target,\n\t\t\t\t\t},\n\t\t\t\t})\n\t\t\t);\n\t\t});\n\t});\n\n\t/**\n\t * Proxies keyboard events from the portal up into the parent window.\n\t * instead of e.key, you'll need to access e.detail.key.\n\t */\n\t[\"keyup\", \"keydown\", \"keypress\"].forEach((eventName) => {\n\t\tnewWindow?.document.addEventListener(eventName, (event) => {\n\t\t\tdocument.dispatchEvent(\n\t\t\t\tnew CustomEvent(`portal:${eventName}`, {\n\t\t\t\t\tdetail: new KeyboardEvent(event.type, event),\n\t\t\t\t})\n\t\t\t);\n\t\t});\n\t});\n};\n\n/**\n * The window (opened by window.open) is an empty html document.\n * This function creates a containerDiv for the parent to insert its\n * React DOM. That containerDiv is set through the `setElement()` method\n * which must be passed in.\n *\n * This function also does portal housekeeping such as transferring CSS and window\n * events.\n */\nconst insertWindowContent = ({\n\tnewWindow,\n\tisAutoResizable,\n\tclassName,\n\tsetElement,\n\tmenuHeight,\n}: {\n\tnewWindow: Window;\n\tisAutoResizable: boolean;\n\tclassName?: string;\n\tmenuHeight?: number;\n\tsetElement: React.Dispatch<React.SetStateAction<HTMLElement | undefined>>;\n}) => {\n\t// Set the child window's <html> tag to class \"menu-portal\" for scrollbar styling\n\tnewWindow.document.documentElement.className = \"menu-portal\";\n\tif (isAutoResizable) newWindow.document.body.setAttribute(\"resizing\", \"true\");\n\n\t// Create the element which will hold our react elements and then append it into the child window's body.\n\tconst containerDiv: HTMLElement = document.createElement(\"div\");\n\tnewWindow.document.body.appendChild(containerDiv);\n\n\t// The className that was passed to MenuShell is added to the child window's <body>\n\tclassName?.split(\" \").forEach((name: string) => newWindow!.document.body.classList.add(name));\n\n\t// This will update local state which will cause the parent React Functional Component\n\t// to return a react portal. See comments at the end of this file.\n\tsetElement(containerDiv);\n\n\t// Inject css into the child window's <head>\n\tinjectCSS(newWindow);\n\n\t// THE FOLLOWING IS LIKELY DEPRECATED BUT KEEPING JUST IN CASE\n\t// Place height on the portal.\n\t// inside of the portal, window.outerHeight === 39 (toolbar height).\n\t// Knowing the height of the window is important because some menus use that\n\t// information to force overflow on certain sections of the menu.\n\t(newWindow as any).portalHeight = menuHeight;\n};\n\n/**\n * React hook to create a drop down menu. This hook creates a new window using window.open\n * and assigns it as the childWindow to the MenuPortal. It then uses insertWindowContent()\n * to establish the React/DOM connection with the parent (e.g. Toolbar).\n */\nconst useCreateDropdown = ({\n\tkeyboardNavigation,\n\tsetElement,\n\tchildWindow,\n\tsetChildWindow,\n}: {\n\tkeyboardNavigation: KeyboardNavigation | null;\n\tsetElement: React.Dispatch<React.SetStateAction<HTMLElement | undefined>>;\n\tchildWindow: Window | null;\n\tsetChildWindow: React.Dispatch<React.SetStateAction<Window | null>>;\n}) => {\n\tconst { thisMenuId, menuWidth, menuHeight, className, maxHeight, minHeight } = useContext(MenuContext);\n\tconst { blurMenu } = useMenu();\n\tconst isAutoResizable = !menuHeight;\n\n\t/**\n\t * Initialize the window. This should only run once though it is possible\n\t * to run multiple times if MenuContext changes.\n\t */\n\tuseEffect(() => {\n\t\tlet menuAutoResizer: any = null;\n\n\t\t/**\n\t\t * Initial size and location of the menu is irrelevant because it is hidden.\n\t\t * The menu will be resized and positioned correctly when it is shown.\n\t\t */\n\t\tconst features = `height=1,width=${menuWidth},left=0,top=0,opacity=1`;\n\n\t\t/**\n\t\t * Opens the window which will contain the menu contents. This looks like a browser window open\n\t\t * but actually opens an Electron window which FEA intercepts. FEA uses the `childWindowOptions`\n\t\t * json configuration to determine how to display the window. `childWindowOptions.show` should\n\t\t * be set to `false` otherwise a white window will flash prior to the menu being rendered.\n\t\t *\n\t\t *\n\t\t * The \"/component/toolbar/menu.html\" is just an empty page. It's necessary to reference a real page\n\t\t * rather than about:blank in order that the \"origin\" is correct for the page. Many CSS ui-assets such\n\t\t * as fonts and images are set with relative paths that require a correct origin.\n\t\t *\n\t\t * Note, we append the menu ID for automated testing. This allows Selenium to\n\t\t * uniquely identify each menu.\n\t\t */\n\t\tconst newWindow = window.open(`./menu.html#${thisMenuId}`, `(Menu) ${thisMenuId}`, features);\n\t\tsetChildWindow(newWindow);\n\n\t\tif (newWindow) {\n\t\t\tconst onLoad = () => {\n\t\t\t\tinsertWindowContent({ newWindow, isAutoResizable, className, setElement, menuHeight });\n\t\t\t\tsetupEventForwarding(newWindow);\n\t\t\t\t/* Close window when a user clicks away.\n\t\t\t\t\tAre you wondering why not just close the window without calling\n\t\t\t\t\ttoggle? because we want to update the state in the store first\n\t\t\t\t\twhich will cause openMenuId to no longer match the shell id\n\t\t\t\t\tand eventually destroy this component which will cause the window\n\t\t\t\t\tto close (see cleanup function).\n\t\t\t\t*/\n\t\t\t\tnewWindow.addEventListener(\"blur\", blurMenu);\n\n\t\t\t\t// Attach MenuAutoResizer only if the menu doesn't have a fixed height\n\t\t\t\tif (isAutoResizable)\n\t\t\t\t\tmenuAutoResizer = new MenuAutoResizer(newWindow, thisMenuId, menuWidth, maxHeight, minHeight);\n\t\t\t};\n\t\t\tnewWindow.addEventListener(\"load\", onLoad, true);\n\t\t} else {\n\t\t\tFSBL.Clients.Logger.system.error(`MenuPortal error: window.open returned null for \"./menu.html#${thisMenuId}\"`);\n\t\t}\n\n\t\treturn () => {\n\t\t\t// imesner 20210406 childwindow and keyboardNavigation were both null but hadn't closed the window or released global hotkeys\n\t\t\tconst win = childWindow || menuAutoResizer?.childWindow;\n\t\t\tconst keyboardNav = keyboardNavigation || (win as any)?.keyboardNavigation;\n\n\t\t\tkeyboardNav?.detach();\n\n\t\t\tmenuAutoResizer?.disconnect();\n\t\t\twin?.close();\n\t\t\tsetChildWindow(null);\n\t\t};\n\t}, [blurMenu, className, menuWidth, menuHeight, maxHeight, thisMenuId]);\n};\n\n/**\n * Sets visibility, size and location of the window. This can be called numerous times\n * during the lifetime of the MenuPortal.\n */\nconst showHideResizeWindow = async ({\n\tchildWindow,\n\tkeyboardNavigation,\n\tshow,\n\tthisMenuId,\n\tmenuHeight,\n\tmaxHeight,\n\tminHeight,\n}: {\n\tchildWindow: Window;\n\tkeyboardNavigation: KeyboardNavigation | null;\n\tshow: boolean;\n\tthisMenuId: string;\n\tmenuHeight?: number;\n\tmaxHeight: number;\n\tminHeight: number;\n}) => {\n\tconst finWindow: FEA.FEAWindow = childWindow.fin.desktop.Window.getCurrent();\n\tif (show) {\n\t\tconst { left, top, height } = await calculateDimensions(childWindow, thisMenuId, menuHeight, maxHeight, minHeight);\n\n\t\tconst params: SpawnParams = {\n\t\t\tposition: \"absolute\",\n\t\t\tleft: left,\n\t\t\ttop: top,\n\t\t\theight: height,\n\t\t\tforceOntoMonitor: \"monitorRect\",\n\t\t};\n\n\t\tconst { name } = childWindow;\n\n\t\t/**\n\t\t * Use Finsemble to show the window. We might be tempted simply to use childWindow.moveTo() or childWindow.resizeTo()\n\t\t * but those commands limit the child window to a single monitor. We want to position the window relative to the\n\t\t * monitor on which the toolbar currently resides. showWindow() is monitor aware, so by using monitor=\"mine\" we can\n\t\t * ensure that the menu will always open on the same monitor as the toolbar. Since our toolbar has built in logic\n\t\t * to avoid straddling, we can be sure that the menu will never have to guess whether it exists on the left or right\n\t\t * side of the toolbar. Finally, showWindow() forces windows to open entirely on a monitor, so it will slide the\n\t\t * menu to the left or right as necessary to prevent it from straddling.\n\t\t */\n\t\tFSBL.Clients.LauncherClient.showWindow({ windowName: name }, params);\n\n\t\t// Ensures that the menu has keyboard focus for accessibility\n\t\tfinWindow.focus();\n\n\t\t// Ensures that the menu is positioned above any other windows that have setAlwaysOnTop flagged\n\t\tFSBL.FinsembleWindow.getInstance({ name: name }, (e: any, fsblWindow: any) => {\n\t\t\tfsblWindow.setAlwaysOnTop({ alwaysOnTop: true });\n\t\t});\n\n\t\tif (keyboardNavigation) {\n\t\t\t// Why??\n\t\t\t(childWindow as any).keyboardNavigation = keyboardNavigation;\n\t\t\tkeyboardNavigation.attach();\n\t\t}\n\t} else {\n\t\tconst { name } = childWindow;\n\t\tFSBL.FinsembleWindow.getInstance({ name: name }, (e: any, fsblWindow: any) => {\n\t\t\tfsblWindow.setAlwaysOnTop({ alwaysOnTop: false });\n\t\t});\n\n\t\tfinWindow.hide();\n\t\tif (keyboardNavigation) keyboardNavigation.detach();\n\t}\n};\n\n/**\n * Closes the menu portal if the menu button is removed from the toolbar\n *\n * @param {Node} element - HTML element to observe\n *\n */\nconst closePortal = (element: Node) => {\n\tconst { closeMenu } = useMenu();\n\n\tconst options = {\n\t\tchildList: true,\n\t\tsubtree: true,\n\t};\n\n\t/**\n\t * MutationObserver interface provides the ability to watch for\n\t * changes to the DOM tree using the observe method\n\t */\n\tconst mutationObserver = new MutationObserver((mutations) => {\n\t\tmutations.forEach((mutation) => {\n\t\t\tif (mutation.removedNodes?.length) closeMenu();\n\n\t\t\t// stops the MutationObserver from receiving notification from observer\n\t\t\tmutationObserver.disconnect();\n\t\t});\n\t});\n\n\t// watches for DOM changes\n\tmutationObserver.observe(element, options);\n};\n\nexport const MenuPortal: React.FunctionComponent<{\n\tshow: boolean;\n}> = ({ show, children }) => {\n\tconst { thisMenuId, menuHeight, maxHeight, minHeight } = useContext(MenuContext);\n\n\t// Container div for React portal\n\tconst [element, setElement] = useState<HTMLElement>();\n\tconst [childWindow, setChildWindow] = useState<Window | null>(null);\n\n\t/**\n\t * KeyboardNavigation registers global hotkeys for navigating through a menu with cursor keys.\n\t * Those hotkeys are registered/unregistered based on visibility of the child window.\n\t * The KeyboardNavigation class is a singleton and so is memoized. It is created when the child window is available.\n\t */\n\tconst keyboardNavigation = useMemo(() => {\n\t\tif (childWindow) return new KeyboardNavigation(childWindow, \".menu-item\");\n\t\telse return null;\n\t}, [childWindow]);\n\n\t/**\n\t * Show and hide window. This effect will run whenever the `show` prop changes,\n\t * generally initiated by a click to <MenuToggle>.\n\t */\n\tuseEffect(() => {\n\t\t// If child window isn't yet initialized then no-op\n\t\tif (!childWindow) return;\n\n\t\tshowHideResizeWindow({ childWindow, keyboardNavigation, show, thisMenuId, menuHeight, maxHeight, minHeight });\n\t\treturn () => {};\n\t}, [show]);\n\n\t// Create the dropdown. (if MenuContext changes then the dropdown will be removed and recreated).\n\tuseCreateDropdown({ keyboardNavigation, childWindow, setElement, setChildWindow });\n\n\tconst toolbar = document.getElementById(\"Toolbar-tsx\");\n\n\tif (toolbar) closePortal(toolbar);\n\n\t// We should only return a react portal when window is ready\n\t// and container div appended to its body\n\t// See Dan abramov comment about this at:\n\t// https://github.com/facebook/react/issues/12355#issuecomment-410996235\n\treturn element ? ReactDOM.createPortal(children, element) : null;\n};\n"]}

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

@@ -1,3 +1,4 @@
+import { ProcessInfo } from "@finsemble/finsemble-api/types/FEA";
 export declare enum ViewModeEnums {
     SIMPLE = "simple",
     ADVANCED = "advanced"
@@ -7,15 +8,7 @@ export declare type ModeStatsType = {
     value: "cpuUsage" | "workingSetSize" | "peakWorkingSetSize" | "processId";
 };
 export declare type ProcessStatisticsType = {
-    statistics: {
-        cpuUsage?: number;
-        workingSetSize?: number;
-        peakWorkingSetSize?: number;
-        processId?: number;
-        name?: string;
-        type?: string;
-        uuid?: string;
-    };
+    statistics: Partial<ProcessInfo>;
 };
 export declare type ProcessType = {
     visible: boolean;
@@ -24,8 +17,8 @@ export declare type ProcessType = {
 } & ProcessStatisticsType;
 export declare type ChildWindowType = {
     type: string;
-    name: string;
-    uuid?: string;
+    windowName: string;
+    webContentsName: string;
 };
 export declare type SortObjectType = {
     field: keyof ProcessStatisticsType["statistics"];

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

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

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

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

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

@@ -38,21 +38,19 @@ export default class ProcessStatistics extends React.Component {
         super(props);
     }
     render() {
+        const { processId, webContents } = this.props.stats;
+        const items = Object.values(webContents !== null && webContents !== void 0 ? webContents : {});
+        const simpleName = items.length === 1 ? items[0].webContentsName : this.props.stats.name;
+        const displayName = this.props.mode === ViewModeEnums.SIMPLE ? simpleName : this.props.stats.name;
         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-name" }, displayName),
             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 });
-                        }
+                React.createElement("div", { className: "statistic process-actions" }, this.props.stats.type === "Tab" && processId ? (React.createElement("div", { className: " terminate fsbl-button-negative process-action", onClick: () => {
+                        Actions.terminateProcess(webContents);
                     }, tabIndex: 0, role: "button", onKeyDown: (e) => {
                         if (e.key === "Enter" || e.key === " ") {
-                            const { uuid } = this.props.stats;
-                            if (uuid) {
-                                Actions.terminateProcess({ uuid });
-                            }
+                            Actions.terminateProcess(webContents);
                         }
                     } }, "Terminate")) : null))));
     }

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

@@ -1 +1 @@
-{"version":3,"file":"ProcessStatistics.js","sourceRoot":"","sources":["../../../../src/components/processMonitor/components/ProcessStatistics.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\nimport { Actions } from \"../stores/ProcessMonitorStore\";\nimport { HIGH_CPU, HIGH_MEMORY_USAGE, MODERATE_CPU_USAGE, MODERATE_MEMORY_USAGE, TO_MB } from \"../constants\";\nimport { bytesToSize, roundDecimalToPrecision } from \"../helpers\";\nimport { ProcessType, ViewModeEnums, ModeStatsType } from \"../ProcessMonitorTypes\";\n//Not used right now. Currently using alerts. This is for the future.\n\ninterface IProps {\n\tmode: ViewModeEnums;\n\tfields: ModeStatsType[];\n\tstats: ProcessType[\"statistics\"];\n}\n\n/**\n * Given a number, will return modifier classes that change the background. High usage === red. Moderate === orange.\n */\nfunction getClassesForStat(number: number | undefined, statType: string) {\n\tlet classes = \"statistic\",\n\t\thigh_comparison = HIGH_MEMORY_USAGE * TO_MB,\n\t\tmoderate_comparison = MODERATE_MEMORY_USAGE * TO_MB;\n\n\tif (typeof number === \"undefined\") {\n\t\treturn classes;\n\t}\n\n\tif (statType === \"CPU\") {\n\t\t(high_comparison = HIGH_CPU), (moderate_comparison = MODERATE_CPU_USAGE);\n\t}\n\tif (number > high_comparison) {\n\t\tclasses = `${classes} high-usage`;\n\t} else if (number > moderate_comparison) {\n\t\tclasses = `${classes} moderate-usage`;\n\t}\n\treturn classes;\n}\n\n/**\n * Outputs something nice. 102423465243 outputs whatever that number is in KB/MB/GB.\n * 0.35123 will output 0.35% for CPU.\n */\nfunction prettyPrint(number: number | undefined, statType: string) {\n\tif (typeof number === \"undefined\") {\n\t\treturn \"\";\n\t}\n\n\tif (statType === \"CPU\") {\n\t\t//make it a percent.\n\t\treturn `${roundDecimalToPrecision(number, 2)}%`;\n\t} else if (statType !== \"PID\") {\n\t\treturn bytesToSize(number);\n\t} else {\n\t\treturn number;\n\t}\n}\n\nexport default class ProcessStatistics extends React.Component<IProps> {\n\tconstructor(props: IProps) {\n\t\tsuper(props);\n\t}\n\n\trender() {\n\t\t//simple mode: CPU, memory\n\t\t//Advanced mode: add Peak Memory.\n\t\treturn (\n\t\t\t<div className=\"process-row\">\n\t\t\t\t<div className=\"process-name\">\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.  */}\n\t\t\t\t\t{this.props.mode === ViewModeEnums.SIMPLE ? \"Process Group\" : this.props.stats.name}\n\t\t\t\t</div>\n\t\t\t\t<div className=\"process-statistics\">\n\t\t\t\t\t{this.props.fields.map((field, i) => (\n\t\t\t\t\t\t<div key={i} className={getClassesForStat(this.props.stats[field.value], field.label)}>\n\t\t\t\t\t\t\t{prettyPrint(this.props.stats[field.value], field.label)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t\t<div className=\"statistic process-actions\">\n\t\t\t\t\t\t{this.props.stats.type === \"Tab\" && typeof this.props.stats.uuid === \"string\" ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\" terminate fsbl-button-negative process-action\"\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tconst { uuid } = this.props.stats;\n\t\t\t\t\t\t\t\t\tif (uuid) {\n\t\t\t\t\t\t\t\t\t\tActions.terminateProcess({ uuid });\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\ttabIndex={0}\n\t\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t\tonKeyDown={(e: React.KeyboardEvent) => {\n\t\t\t\t\t\t\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\n\t\t\t\t\t\t\t\t\t\tconst { uuid } = this.props.stats;\n\t\t\t\t\t\t\t\t\t\tif (uuid) {\n\t\t\t\t\t\t\t\t\t\t\tActions.terminateProcess({ uuid });\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tTerminate\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\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\";\nimport { Actions } from \"../stores/ProcessMonitorStore\";\nimport { HIGH_CPU, HIGH_MEMORY_USAGE, MODERATE_CPU_USAGE, MODERATE_MEMORY_USAGE, TO_MB } from \"../constants\";\nimport { bytesToSize, roundDecimalToPrecision } from \"../helpers\";\nimport { ProcessType, ViewModeEnums, ModeStatsType } from \"../ProcessMonitorTypes\";\n//Not used right now. Currently using alerts. This is for the future.\n\ninterface IProps {\n\tmode: ViewModeEnums;\n\tfields: ModeStatsType[];\n\tstats: ProcessType[\"statistics\"];\n}\n\n/**\n * Given a number, will return modifier classes that change the background. High usage === red. Moderate === orange.\n */\nfunction getClassesForStat(number: number | undefined, statType: string) {\n\tlet classes = \"statistic\",\n\t\thigh_comparison = HIGH_MEMORY_USAGE * TO_MB,\n\t\tmoderate_comparison = MODERATE_MEMORY_USAGE * TO_MB;\n\n\tif (typeof number === \"undefined\") {\n\t\treturn classes;\n\t}\n\n\tif (statType === \"CPU\") {\n\t\t(high_comparison = HIGH_CPU), (moderate_comparison = MODERATE_CPU_USAGE);\n\t}\n\tif (number > high_comparison) {\n\t\tclasses = `${classes} high-usage`;\n\t} else if (number > moderate_comparison) {\n\t\tclasses = `${classes} moderate-usage`;\n\t}\n\treturn classes;\n}\n\n/**\n * Outputs something nice. 102423465243 outputs whatever that number is in KB/MB/GB.\n * 0.35123 will output 0.35% for CPU.\n */\nfunction prettyPrint(number: number | undefined, statType: string) {\n\tif (typeof number === \"undefined\") {\n\t\treturn \"\";\n\t}\n\n\tif (statType === \"CPU\") {\n\t\t//make it a percent.\n\t\treturn `${roundDecimalToPrecision(number, 2)}%`;\n\t} else if (statType !== \"PID\") {\n\t\treturn bytesToSize(number);\n\t} else {\n\t\treturn number;\n\t}\n}\n\nexport default class ProcessStatistics extends React.Component<IProps> {\n\tconstructor(props: IProps) {\n\t\tsuper(props);\n\t}\n\n\trender() {\n\t\tconst { processId, webContents } = this.props.stats;\n\t\tconst items = Object.values(webContents ?? {});\n\n\t\t// If there's only one item in the group then use the name of that item, otherwise we use its process name\n\t\t// because each of the windows or views will be listed underneath.\n\t\tconst simpleName = items.length === 1 ? items[0].webContentsName : this.props.stats.name;\n\t\t// In Advanced mode we always display the process name because it includes the pid\n\t\tconst displayName = this.props.mode === ViewModeEnums.SIMPLE ? simpleName : this.props.stats.name;\n\t\t//simple mode: CPU, memory\n\t\t//Advanced mode: add Peak Memory.\n\t\treturn (\n\t\t\t<div className=\"process-row\">\n\t\t\t\t<div className=\"process-name\">{displayName}</div>\n\t\t\t\t<div className=\"process-statistics\">\n\t\t\t\t\t{this.props.fields.map((field, i) => (\n\t\t\t\t\t\t<div key={i} className={getClassesForStat(this.props.stats[field.value], field.label)}>\n\t\t\t\t\t\t\t{prettyPrint(this.props.stats[field.value], field.label)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t\t<div className=\"statistic process-actions\">\n\t\t\t\t\t\t{this.props.stats.type === \"Tab\" && processId ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\" terminate fsbl-button-negative process-action\"\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tActions.terminateProcess(webContents);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\ttabIndex={0}\n\t\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t\tonKeyDown={(e: React.KeyboardEvent) => {\n\t\t\t\t\t\t\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\n\t\t\t\t\t\t\t\t\t\tActions.terminateProcess(webContents);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tTerminate\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}

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

@@ -7,5 +7,3 @@ 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

@@ -21,6 +21,4 @@ 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.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\";\n\n// Stats to be displayed in simple mode\nexport const SIMPLE_MODE_STATISTICS: ModeStatsType[] = [\n\t{ label: \"CPU\", value: \"cpuUsage\" },\n\t{ label: \"Memory\", value: \"workingSetSize\" },\n];\n\n// Stats to be diesplayed in advanced mode\nexport const ADVANCED_MODE_STATISTICS: ModeStatsType[] = [\n\t{ label: \"CPU\", value: \"cpuUsage\" },\n\t{ label: \"Memory\", value: \"workingSetSize\" },\n\t{ label: \"Peak Memory\", value: \"peakWorkingSetSize\" },\n\t{ label: \"PID\", value: \"processId\" },\n];\n\n// These are percentages\nexport const HIGH_CPU = 10;\nexport const MODERATE_CPU_USAGE = 5;\n\n// Usage in MB\nexport const MODERATE_MEMORY_USAGE = 250;\nexport const HIGH_MEMORY_USAGE = 400;\n\n// Constant to convert megabytes (250) to bytes (250,000,000). Conversion is approximate.\nexport const TO_MB = 1000000;\n\nconst emptyTotals: ProcessType = {\n\tvisible: false,\n\tstatistics: {},\n};\n// Just an object to hold the UI over until we get real information from the system.\nSIMPLE_MODE_STATISTICS.forEach((stat) => {\n\temptyTotals.statistics[stat.value] = 0;\n});\n\nexport const EMPTY_TOTALS = emptyTotals;\n\n/**\n * Delimiter between window name and view identifier. Can be used in constructing view names as well as matching view names\n */\nexport const VIEW_DELIMITER = \": view-\";\n\n/**\n * RegExp for matching on view names or capturing the window name portion of the view\n */\nexport const VIEW_NAME_REGEXP = new RegExp(`(.*)${VIEW_DELIMITER}\\\\d+$`);\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","sourcesContent":["import { ProcessType, ModeStatsType } from \"./ProcessMonitorTypes\";\n\n// Stats to be displayed in simple mode\nexport const SIMPLE_MODE_STATISTICS: ModeStatsType[] = [\n\t{ label: \"CPU\", value: \"cpuUsage\" },\n\t{ label: \"Memory\", value: \"workingSetSize\" },\n];\n\n// Stats to be diesplayed in advanced mode\nexport const ADVANCED_MODE_STATISTICS: ModeStatsType[] = [\n\t{ label: \"CPU\", value: \"cpuUsage\" },\n\t{ label: \"Memory\", value: \"workingSetSize\" },\n\t{ label: \"Peak Memory\", value: \"peakWorkingSetSize\" },\n\t{ label: \"PID\", value: \"processId\" },\n];\n\n// These are percentages\nexport const HIGH_CPU = 10;\nexport const MODERATE_CPU_USAGE = 5;\n\n// Usage in MB\nexport const MODERATE_MEMORY_USAGE = 250;\nexport const HIGH_MEMORY_USAGE = 400;\n\n// Constant to convert megabytes (250) to bytes (250,000,000). Conversion is approximate.\nexport const TO_MB = 1000000;\n\nconst emptyTotals: ProcessType = {\n\tvisible: false,\n\tstatistics: {},\n};\n// Just an object to hold the UI over until we get real information from the system.\nSIMPLE_MODE_STATISTICS.forEach((stat) => {\n\temptyTotals.statistics[stat.value] = 0;\n});\n\nexport const EMPTY_TOTALS = emptyTotals;\n"]}

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

@@ -3,14 +3,3 @@ 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;
-};
-export declare const getViewBaseName: (view: ViewObjectType) => string;
-export {};

package/react/components/processMonitor/helpers.js

@@ -1,4 +1,4 @@
-import { SIMPLE_MODE_STATISTICS, VIEW_NAME_REGEXP, VIEW_DELIMITER } from "./constants";
+import { SIMPLE_MODE_STATISTICS } from "./constants";
 export function toProperCase(str) {
     return (str
         .replace(/([A-Z])/g, " $1")
@@ -22,7 +22,6 @@ export const statReducer = (prev, curr) => {
         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,
@@ -33,11 +32,4 @@ export const roundDecimalToPrecision = (number, 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.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\";\nimport { ProcessStatisticsType, ProcessType } from \"./ProcessMonitorTypes\";\n\n// This Is Proper Case\nexport function toProperCase(str: string) {\n\treturn (\n\t\tstr\n\t\t\t.replace(/([A-Z])/g, \" $1\")\n\t\t\t// uppercase the first character\n\t\t\t.replace(/^./, (char: string) => char.toUpperCase())\n\t);\n}\n/**\n * Given a number, will return a nice string, 1,024 will return 1KB, 100 will return 100 Bytes, and so on.\n */\nexport function bytesToSize(bytes: number) {\n\tif (bytes == 0) return \"0 Byte\";\n\n\t// Size powers, in English\n\tconst sizes = [\"Bytes\", \"KB\", \"MB\", \"GB\", \"TB\"];\n\n\t// Determine the size power for the number of bytes\n\tconst i = Math.floor(Math.log(bytes) / Math.log(1024));\n\n\t// Return the size, rounded\n\treturn `${Math.round(bytes / Math.pow(1024, i))} ${sizes[i]}`;\n}\n\n/**\n * Handler for Array.reduce. It takes the array of statistics and sums each value.\n * This outputs an object that has total CPU and memory consumption.\n */\nexport const statReducer = (prev: ProcessType, curr: ProcessType): ProcessType => {\n\tconst statistics: ProcessStatisticsType[\"statistics\"] = {};\n\tSIMPLE_MODE_STATISTICS.forEach((stat) => {\n\t\tif (typeof prev.statistics[stat.value] === \"undefined\" || typeof curr.statistics[stat.value] === \"undefined\") {\n\t\t\tstatistics[stat.value] = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\tstatistics[stat.value] = (prev.statistics[stat.value] ?? 0) + (curr.statistics[stat.value] ?? 0);\n\t});\n\n\tstatistics.name = \"Totals\";\n\tstatistics.uuid = \"Totals\";\n\n\treturn {\n\t\tvisible: curr.visible,\n\t\tstatistics,\n\t};\n};\n\n/**\n * Convenience function for rounding decimals to a given precision\n * Note that \"precision\" here means \"number of digits to the right of the decimal point\"\n */\nexport const roundDecimalToPrecision = (number: number, precision: number): number => {\n\t// Example: number = .12345, precision = 2\n\tconst shiftedNumber = number * Math.pow(10, precision); // example: 12.345\n\tconst roundedShiftedNumber = Math.round(shiftedNumber); // example: 12\n\treturn roundedShiftedNumber / Math.pow(10, precision); // example: .12\n};\n\ntype WindowViewItemType = {\n\twindowName: string;\n\tviewId: string;\n};\n/**\n * Gives a standard name for a view, given a window or view object\n * @returns string\n */\nexport const getViewName = (item: WindowViewItemType) => `${item.windowName}${VIEW_DELIMITER}${item.viewId}`;\n\ntype ViewObjectType = {\n\ttype: string;\n\tname: string;\n};\n/**\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\n */\nexport const getViewBaseName = (view: ViewObjectType): string => {\n\tif (view.type === \"view\") {\n\t\t// The `!` is TS's non-null assertion operator\n\t\treturn view.name.match(VIEW_NAME_REGEXP)![1];\n\t}\n\treturn view.name;\n};\n"]}
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/components/processMonitor/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAIrD,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;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","sourcesContent":["import { SIMPLE_MODE_STATISTICS } from \"./constants\";\nimport { ProcessStatisticsType, ProcessType } from \"./ProcessMonitorTypes\";\n\n// This Is Proper Case\nexport function toProperCase(str: string) {\n\treturn (\n\t\tstr\n\t\t\t.replace(/([A-Z])/g, \" $1\")\n\t\t\t// uppercase the first character\n\t\t\t.replace(/^./, (char: string) => char.toUpperCase())\n\t);\n}\n/**\n * Given a number, will return a nice string, 1,024 will return 1KB, 100 will return 100 Bytes, and so on.\n */\nexport function bytesToSize(bytes: number) {\n\tif (bytes == 0) return \"0 Byte\";\n\n\t// Size powers, in English\n\tconst sizes = [\"Bytes\", \"KB\", \"MB\", \"GB\", \"TB\"];\n\n\t// Determine the size power for the number of bytes\n\tconst i = Math.floor(Math.log(bytes) / Math.log(1024));\n\n\t// Return the size, rounded\n\treturn `${Math.round(bytes / Math.pow(1024, i))} ${sizes[i]}`;\n}\n\n/**\n * Handler for Array.reduce. It takes the array of statistics and sums each value.\n * This outputs an object that has total CPU and memory consumption.\n */\nexport const statReducer = (prev: ProcessType, curr: ProcessType): ProcessType => {\n\tconst statistics: ProcessStatisticsType[\"statistics\"] = {};\n\tSIMPLE_MODE_STATISTICS.forEach((stat) => {\n\t\tif (typeof prev.statistics[stat.value] === \"undefined\" || typeof curr.statistics[stat.value] === \"undefined\") {\n\t\t\tstatistics[stat.value] = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\tstatistics[stat.value] = (prev.statistics[stat.value] ?? 0) + (curr.statistics[stat.value] ?? 0);\n\t});\n\n\tstatistics.name = \"Totals\";\n\n\treturn {\n\t\tvisible: curr.visible,\n\t\tstatistics,\n\t};\n};\n\n/**\n * Convenience function for rounding decimals to a given precision\n * Note that \"precision\" here means \"number of digits to the right of the decimal point\"\n */\nexport const roundDecimalToPrecision = (number: number, precision: number): number => {\n\t// Example: number = .12345, precision = 2\n\tconst shiftedNumber = number * Math.pow(10, precision); // example: 12.345\n\tconst roundedShiftedNumber = Math.round(shiftedNumber); // example: 12\n\treturn roundedShiftedNumber / Math.pow(10, precision); // example: .12\n};\n"]}

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

@@ -16,16 +16,8 @@ declare const Actions: {
     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;
+    terminateProcess: (webContents: ProcessType["statistics"]["webContents"]) => void;
+    removeWindowLocally: (windowName: string) => void;
+    closeWindow: (windowName: string, force?: boolean) => void;
 };
 export { ProcessMonitorStore as Store, Actions };

package/react/components/processMonitor/stores/ProcessMonitorStore.js

@@ -1,4 +1,3 @@
-import { getViewName, getViewBaseName } from "../helpers";
 import async from "async";
 let ProcessMonitorStore;
 const DEFAULT_SORT_DIRECTION = "ascending";
@@ -66,26 +65,21 @@ const Actions = {
     createDataModel: (processes, cb) => {
         const mode = ProcessMonitorStore === null || ProcessMonitorStore === void 0 ? void 0 : ProcessMonitorStore.getValue({ field: "viewMode" });
         const sortWindow = (a, b) => {
-            if (a.name < b.name)
+            if (a.webContentsName < b.webContentsName)
                 return -1;
-            if (a.name > b.name)
+            if (a.webContentsName > b.webContentsName)
                 return 1;
             return 0;
         };
         const viewOrWindowToProc = (item) => {
-            const name = "name" in item
-                ? item.name
-                : getViewName({
-                    windowName: item.windowName,
-                    viewId: String(item.id),
-                });
             return {
-                name,
-                type: "name" in item ? "window" : "view",
+                webContentsName: item.webContentsName,
+                windowName: item.windowName,
+                type: item.type,
             };
         };
         const allowAdvanced = (item) => {
-            const windowName = "name" in item ? item.name.toLowerCase() : item.windowName.toLowerCase();
+            const windowName = item.webContentsName.toLowerCase();
             const windowIsService = windowName.includes("service");
             const windowIsSystem = windowName.includes("system");
             const windowIsUnnamed = windowName.includes("unnamed");
@@ -104,7 +98,7 @@ const Actions = {
                     visible: false,
                 };
             }
-            const childWindows = [...proc.windows, ...proc.views]
+            const childWindows = [...Object.values(proc.webContents)]
                 .filter(allowAdvanced)
                 .map(viewOrWindowToProc)
                 .sort(sortWindow);
@@ -160,12 +154,11 @@ const Actions = {
         ProcessMonitorStore === null || ProcessMonitorStore === void 0 ? void 0 : ProcessMonitorStore.setValue({ field: "flashing", value }, cb);
     },
     identifyWindow: function (winID) {
-        if (winID.name.includes("Service"))
+        if (winID.windowName.includes("Service"))
             return;
-        const baseName = getViewBaseName(winID);
         this.setFlashingState(true);
         const OPACITY_ANIMATION_DURATION = 200;
-        FSBL.FinsembleWindow.getInstance({ name: baseName }, (err, win) => {
+        FSBL.FinsembleWindow.getInstance({ name: winID.windowName }, (err, win) => {
             let windowState = "hidden";
             function flash(n, done) {
                 setTimeout(() => {
@@ -193,39 +186,15 @@ const Actions = {
             });
         });
     },
-    terminateProcess: (AppIdentifier, force = false) => {
-        const app = FSBL.System.Application.wrap(AppIdentifier.uuid);
-        const onCloseFailure = () => {
-            if (force) {
-                terminateProcess();
-            }
-            else {
-                Actions.terminateProcess(AppIdentifier, true);
-            }
-        };
+    terminateProcess: (webContents) => {
         const forceCloseProcess = () => {
-            const closeTimeout = setTimeout(() => {
-                onCloseFailure();
-            }, MAGIC_NUMBER_TERMINATION_TIMEOUT);
-            const onCloseSuccess = () => {
-                clearTimeout(closeTimeout);
-            };
-            app.close(force, onCloseSuccess, onCloseFailure);
-        };
-        const terminateProcess = () => {
-            app.terminate(() => { }, () => {
-                FSBL.Clients.DialogManager.open("yesNo", {
-                    title: "Error",
-                    question: "The process that you are attempting to close is unresponsive. Please contact support.",
-                    affirmativeButtonLabel: "Okay",
-                    showCancelButton: false,
-                    showNegativeButton: false,
-                }, () => { });
+            if (!webContents)
+                return;
+            const windowNames = new Set(Object.values(webContents).map((item) => item.windowName));
+            windowNames.forEach((windowName) => {
+                Actions.closeWindow(windowName, true);
             });
         };
-        if (force) {
-            return forceCloseProcess();
-        }
         FSBL.Clients.DialogManager.open("yesNo", {
             title: "Terminate Process?",
             question: "Terminating the process may close other apps. Are you sure you want to continue?",
@@ -237,41 +206,32 @@ const Actions = {
             }
         });
     },
-    removeWindowLocally: function (winID) {
+    removeWindowLocally: function (windowName) {
         let procs = ProcessMonitorStore === null || ProcessMonitorStore === void 0 ? void 0 : ProcessMonitorStore.getValue({ field: "processList" });
         procs = procs.map((proc) => {
             if (proc.childWindows) {
-                const cwIndex = proc.childWindows.findIndex((cw) => cw.name === winID.name);
+                const cwIndex = proc.childWindows.findIndex((cw) => cw.windowName === windowName);
                 proc.childWindows.splice(cwIndex, 1);
             }
             return proc;
         });
         ProcessMonitorStore === null || ProcessMonitorStore === void 0 ? void 0 : ProcessMonitorStore.setValue({ field: "processList", value: procs });
     },
-    closeWindow: function (winID, force = false) {
-        const win = FSBL.System.Window.wrap(winID.uuid, winID.name);
-        Actions.removeWindowLocally(winID);
+    closeWindow: function (windowName, force = false) {
+        const win = FSBL.System.Window.wrap(windowName);
         const onCloseFailure = () => {
             if (force) {
-                FSBL.Clients.DialogManager.open("yesNo", {
-                    title: "Terminate Process?",
-                    question: "The app that you are attempting to close is unresponsive. Would you like to terminate the process? Terminating the process may close other apps.",
-                    affirmativeResponseLabel: "Terminate",
-                    showNegativeButton: false,
-                }, (err, response) => {
-                    if (err || response.choice === "affirmative") {
-                        return Actions.terminateProcess({ uuid: winID.uuid }, true);
-                    }
-                });
+                alert("Cannot close window");
             }
             else {
-                Actions.closeWindow(winID, true);
+                Actions.closeWindow(windowName, true);
             }
         };
         const closeTimeout = setTimeout(() => {
             onCloseFailure();
         }, MAGIC_NUMBER_TERMINATION_TIMEOUT);
         const onCloseSuccess = () => {
+            Actions.removeWindowLocally(windowName);
             clearTimeout(closeTimeout);
         };
         win.close(force, onCloseSuccess, onCloseFailure);