feat: add "ago" to tray runs menu

This should help in understanding the age of each run.

This PR also updates the "Run Summary" menu item to instead say "Open Grid View", and with a grid menu item icon.

Author: starpit

plugins/plugin-client-default/icons/png/gridTemplate.png

@@ -20,6 +20,7 @@ import profile from "@kui-shell/client/icons/png/profileTemplate.png"
 import bug from "@kui-shell/client/icons/png/bugTemplate.png"
 import powerOff from "@kui-shell/client/icons/png/powerOffTemplate.png"
 import play from "@kui-shell/client/icons/png/playTemplate.png"
+import grid from "@kui-shell/client/icons/png/gridTemplate.png"
 
 import { join } from "path"
 
@@ -35,3 +36,4 @@ export const bugIcon = iconFor(bug)
 export const powerOffIcon = iconFor(powerOff)
 export const bootIcon = iconFor(play)
 export const shutDownIcon = iconFor(powerOff)
+export const gridIcon = iconFor(grid)

plugins/plugin-client-default/icons/png/[email protected]

@@ -21,6 +21,7 @@ import { CreateWindowFunction } from "@kui-shell/core"
 
 import runs from "../runs"
 import section from "../../section"
+import { gridIcon } from "../../../icons"
 import windowOptions from "../../../window"
 import UpdateFunction from "../../../update"
 
@@ -42,7 +43,8 @@ export default async function codeflareDashboards(
 ): Promise<MenuItemConstructorOptions[]> {
   return [
     {
-      label: "Run Summary",
+      icon: gridIcon,
+      label: "Open Grid View",
       click: () =>
         createWindow(["codeflare", "get", "run", "--profile", profile], {
           title: "Codeflare Run Summary - " + profile,

plugins/plugin-codeflare/src/tray/icons.ts

@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import prettyMillis from "pretty-ms"
 import { MenuItemConstructorOptions } from "electron"
 
 import UpdateFunction from "../../update"
@@ -22,6 +23,10 @@ import ProfileRunWatcher, { RUNS_ERROR } from "../../watchers/profile/run"
 /** Handler for "opening" the selected `runId` in the given `profile` */
 type RunOpener = (profile: string, runId: string) => void
 
+function ago(timestamp: number) {
+  return prettyMillis(Date.now() - timestamp, { compact: true }) + " ago"
+}
+
 /**
  *
  * @return a menu for all runs of a profile
@@ -34,7 +39,10 @@ export function runMenuItems(
   return runs
     .slice(0, 10)
     .sort((a, b) => b.timestamp - a.timestamp)
-    .map((run) => ({ label: run.runId, click: () => open(profile, run.runId) }))
+    .map((run) => ({
+      label: `${ago(run.timestamp).padEnd(8)} \u2014 ${run.runId.slice(0, run.runId.indexOf("-"))}`,
+      click: () => open(profile, run.runId),
+    }))
 }
 
 /** Memo of `ProfileStatusWatcher`, keyed by profile name */