fix: add --lines option to dashboard (plus code cleanup)

Author: starpit

plugins/plugin-codeflare-dashboard/src/controller/dashboard/index.ts

@@ -89,20 +89,18 @@ async function gridFor(
   profile: string,
   jobId: string,
   historyConfig: HistoryConfig,
-  opts: Pick<Options, "demo" | "theme">
+  opts: Pick<Options, "demo" | "theme" | "lines">
 ): Promise<GridSpec> {
   const tails = await tailf(kind, profile, jobId)
-  return kind === "status"
-    ? status(tails, historyConfig, { demo: opts.demo, theme: opts.theme })
-    : utilization(kind, tails, historyConfig, opts)
+  return kind === "status" ? status(tails, historyConfig, opts) : utilization(kind, tails, historyConfig, opts)
 }
 
 /** @return all relevant grid models for `jobId` in `profile` */
 async function allGridsFor(
   profile: string,
   jobId: string,
   historyConfig: HistoryConfig,
-  opts: Pick<Options, "demo" | "theme">
+  opts: Pick<Options, "demo" | "theme" | "lines">
 ) {
   const usesGpus = opts.demo || (await import("../env.js").then((_) => _.usesGpus(profile, jobId)))
 
@@ -126,9 +124,8 @@ async function allGridsFor(
 }
 
 export default async function dashboard(args: Arguments<Options>, cmd: "db" | "dashboard") {
-  const { theme } = args.parsedOptions
+  const { demo, theme, lines } = args.parsedOptions
 
-  const { demo } = args.parsedOptions
   const scale = args.parsedOptions.s || 1
 
   const jobIdOffset = args.argvNoOptions[args.argvNoOptions.indexOf(cmd) + 2] ? 2 : 1
@@ -147,9 +144,9 @@ export default async function dashboard(args: Arguments<Options>, cmd: "db" | "d
     historyConfig: HistoryConfig
   ): Promise<null | GridSpec | (null | GridSpec)[]> => {
     if (kind === "all") {
-      return allGridsFor(profile, jobId, historyConfig, { demo, theme })
+      return allGridsFor(profile, jobId, historyConfig, { demo, theme, lines })
     } else if (isSupportedGrid(kind)) {
-      return gridFor(kind, profile, jobId, historyConfig, { demo, theme })
+      return gridFor(kind, profile, jobId, historyConfig, { demo, theme, lines })
     } else {
       return null
     }

plugins/plugin-codeflare-dashboard/src/controller/dashboard/options.ts

@@ -15,14 +15,22 @@
  */
 
 type Options = {
+  /** Run in blinking lights mode */
   demo: boolean
+
+  /** Scale up the grid? */
   scale: number
+
+  /** Theme to use for worker status */
   theme: string
-  themeDefault: string
+
+  /** Number of lines of log messages to show [default: 8] */
+  lines: number
 }
 
 export default Options
 
 export const flags = {
   boolean: ["demo"],
+  alias: { lines: ["l"], theme: ["t"], demo: ["d"], scale: ["s"] },
 }

plugins/plugin-codeflare-dashboard/src/controller/dashboard/status/Live.ts

@@ -18,6 +18,7 @@ import Heap from "heap"
 import stripAnsi from "strip-ansi"
 import type { TextProps } from "ink"
 
+import type Options from "../options.js"
 import type { Tail } from "../tailf.js"
 import type HistoryConfig from "../history.js"
 import type { WorkerState } from "./states.js"
@@ -57,7 +58,8 @@ export default class Live {
     historyConfig: HistoryConfig,
     private readonly tails: Promise<Tail>[],
     cb: OnData,
-    styleOf: Record<WorkerState, TextProps>
+    styleOf: Record<WorkerState, TextProps>,
+    private readonly opts: Pick<Options, "lines">
   ) {
     tails.map((tailf) => {
       tailf.then(({ stream }) => {
@@ -158,10 +160,14 @@ export default class Live {
       }
     }
 
-    return this.lines
-      .toArray()
-      .slice(0, 6)
-      .sort((a, b) => a.timestamp - b.timestamp)
+    if (this.opts.lines === 0) {
+      return []
+    } else {
+      return this.lines
+        .toArray()
+        .slice(0, this.opts.lines || 8)
+        .sort((a, b) => a.timestamp - b.timestamp)
+    }
   }
 
   /** `pushLine` and then pass the updated model to `cb` */

plugins/plugin-codeflare-dashboard/src/controller/dashboard/status/index.ts

@@ -30,9 +30,9 @@ import { isValidStatusTheme, statusThemes } from "./theme.js"
 export default function statusDashboard(
   tails: Promise<Tail>[],
   historyConfig: HistoryConfig,
-  opts: Pick<Options, "demo" | "theme"> & Partial<Pick<Options, "themeDefault">>
+  opts: Pick<Options, "demo" | "theme" | "lines">
 ): GridSpec {
-  const { theme: themeS = opts.themeDefault || "colorbrewer6" } = opts
+  const { theme: themeS = "colorbrewer6" } = opts
   if (!isValidStatusTheme(themeS)) {
     throw new Error("Invalid theme: " + themeS)
   }
@@ -52,7 +52,7 @@ export default function statusDashboard(
     if (opts.demo) {
       return new Demo(historyConfig, cb, styleOf)
     } else {
-      return new Live(historyConfig, tails, cb, styleOf)
+      return new Live(historyConfig, tails, cb, styleOf, opts)
     }
   }
 

plugins/plugin-codeflare-dashboard/src/controller/dashboard/utilization/index.ts

@@ -44,9 +44,9 @@ export default function utilizationDashboard(
   kind: SupportedUtilizationGrid,
   tails: Promise<Tail>[],
   historyConfig: HistoryConfig,
-  opts: Pick<Options, "demo" | "theme"> & Partial<Pick<Options, "themeDefault">>
+  opts: Pick<Options, "demo">
 ): GridSpec {
-  const themeS = opts.themeDefault || defaultUtilizationThemes[kind]
+  const themeS = defaultUtilizationThemes[kind]
   if (!isValidTheme(themeS)) {
     throw new Error("Invalid theme: " + themeS)
   }