Added in the ability to click on the CPU usage widget

Adding in the ability to click on this widget I wanted
users to be able to use either 'top' or 'activity monitor'.

Because 'top' is run in a terminal I wanted users to
be able to specify their preferred Terminal.

I added two terminal options Terminal and iTerm2.

Hopefully the ability to open a terminal of the users
choosing and run an arbitrary command will be helpful
else where in the project.

lib/components/data/cpu.jsx

@@ -19,7 +19,7 @@ export const Widget = React.memo(() => {
   const { displayIndex, settings } = useSimpleBarContext();
   const { widgets, cpuWidgetOptions } = settings;
   const { cpuWidget } = widgets;
-  const { refreshFrequency, showOnDisplay, displayAsGraph } = cpuWidgetOptions;
+  const { refreshFrequency, showOnDisplay, displayAsGraph, cpuMonitorApp } = cpuWidgetOptions;
 
   const visible =
     Utils.isVisibleOnDisplay(displayIndex, showOnDisplay) && cpuWidget;
@@ -65,9 +65,14 @@ export const Widget = React.memo(() => {
 
   const { usage } = state;
 
+  const onClick = cpuMonitorApp === "None" ? undefined : (e) => {
+    Utils.clickEffect(e);
+    openCpuUsageApp(cpuMonitorApp);
+  };
+
   if (displayAsGraph) {
     return (
-      <DataWidget.Widget classes="cpu cpu--graph" disableSlider>
+      <DataWidget.Widget classes="cpu cpu--graph" onClick={onClick} disableSlider>
         <Graph
           className="cpu__graph"
           caption={{
@@ -86,10 +91,21 @@ export const Widget = React.memo(() => {
   }
 
   return (
-    <DataWidget.Widget classes="cpu" Icon={Icons.CPU}>
+    <DataWidget.Widget classes="cpu" Icon={Icons.CPU} onClick={onClick}>
       <span className="cpu__usage">{usage}%</span>
     </DataWidget.Widget>
   );
 });
 
 Widget.displayName = "Cpu";
+
+function openCpuUsageApp(cpuUsageApp) {
+  switch (cpuUsageApp) {
+    case "Activity Monitor":
+      Uebersicht.run(`open -a "Activity Monitor"`);
+      break;
+    case "Top": 
+      Utils.runInUserTerminal('top')
+      break;
+  }
+}

lib/scripts/run-command-in-iterm2.applescript

@@ -0,0 +1,9 @@
+on run argv
+    set commandToRun to item 1 of argv
+    tell application "iTerm"
+        set newWindow to (create window with default profile)
+        tell current session of newWindow
+            write text commandToRun
+        end tell
+    end tell
+end run

lib/scripts/run-command-in-terminal.applescript

@@ -0,0 +1,7 @@
+on run argv
+    set commandToRun to item 1 of argv
+    tell application "Terminal"
+        do script commandToRun
+        activate
+    end tell
+end run

lib/settings.js

@@ -75,6 +75,12 @@ export const data = {
     type: "radio",
     options: ["sh", "bash", "dash"],
   },
+  terminal: {
+    title: "Which terminal should user facing commands be run in?",
+    label: "",
+    type: "radio",
+    options: ["Terminal", "iTerm2"],
+  },
   slidingAnimationPace: {
     label: "Sliding animation speed",
     type: "number",
@@ -300,6 +306,13 @@ export const data = {
     fullWidth: true,
   },
 
+  cpuMonitorApp: {
+    title: "Cpu Monitor",
+    label: "",
+    type: "radio",
+    options: ["Top", "Activity Monitor", "None"],
+  },
+
   batteryWidgetOptions: {
     label: "Battery",
     documentation: "/battery/",
@@ -515,6 +528,7 @@ export const defaultSettings = {
     fontSize: "11px",
     yabaiPath: "/usr/local/bin/yabai",
     shell: "sh",
+    terminal: "Terminal",
     slidingAnimationPace: 4,
     externalConfigFile: false,
     enableServer: false,
@@ -589,6 +603,7 @@ export const defaultSettings = {
     refreshFrequency: 2000,
     showOnDisplay: "",
     displayAsGraph: false,
+    cpuMonitorApp: "Top"
   },
   batteryWidgetOptions: {
     refreshFrequency: 10000,

lib/utils.js

@@ -425,3 +425,24 @@ export function getRefreshFrequency(value, defaultValue) {
   const parsedValue = parseInt(value, 10);
   return isNaN(parsedValue) ? defaultValue : parsedValue;
 }
+
+export function runInUserTerminal(command) {
+  const settings = Settings.get();
+  const { terminal } = settings.global;
+  switch (terminal) {
+    case "Terminal": 
+      Uebersicht.run(
+        `osascript ./simple-bar/lib/scripts/run-command-in-terminal.applescript` +
+          ` "${command}"`
+      )
+      break;
+    case "iTerm2":
+      Uebersicht.run(
+        `osascript ./simple-bar/lib/scripts/run-command-in-iterm2.applescript` +
+          ` "${command}"`
+      ) 
+      break;
+    default:
+      break;
+  } 
+}