feat: major bump to kui and madwizard dependencies

BREAKING CHANGE: this pulls in react 18, which has some breaking changes on react components that this PR addresses

BREAKING CHANGE: this pulls in a few breaking changes to the madwizard API

bump to store 1.9.3

Author: starpit

deploy/log-aggregator/Dockerfile

@@ -5,6 +5,7 @@ LABEL org.opencontainers.image.source https://github.com/project-codeflare/codef
 ENV DEBIAN_FRONTEND=noninteractive
 ENV KUI_HEADLESS=true
 ENV KUI_HEADLESS_WEBPACK=true
+ENV NODE=node
 ENV CODEFLARE_HEADLESS_HOME=/usr/local/CodeFlare
 
 # TODO hard-coded arch

deploy/self-test/Dockerfile

@@ -4,14 +4,15 @@ LABEL org.opencontainers.image.source https://github.com/project-codeflare/codef
 
 ENV DEBIAN_FRONTEND=noninteractive
 
-RUN apt update && apt -y install sudo curl python3 python3-pip git \
+RUN apt update && apt -y install sudo curl python3 python3-pip python3-venv git \
         && pip3 install --no-cache-dir  -U pip && pip3 install --no-cache-dir -U setuptools \
         && apt -y clean && rm -rf /var/lib/apt/lists/*
 
 ENV KUI_HEADLESS=true
 ENV KUI_HEADLESS_WEBPACK=true
 ENV NO_KIND=true
 ENV ROOT=/usr/local
+ENV NODE=node
 ENV CODEFLARE_HEADLESS_HOME=/usr/local/CodeFlare
 
 ADD dist/headless /usr/local/CodeFlare

package-lock.json

@@ -131,25 +131,25 @@
     }
   },
   "devDependencies": {
-    "@kui-shell/builder": "12.2.0-dev-20221127-170013",
-    "@kui-shell/proxy": "12.2.0-dev-20221127-170013",
-    "@kui-shell/react": "12.2.0-dev-20221127-170013",
-    "@kui-shell/webpack": "12.2.0-dev-20221127-170013",
+    "@kui-shell/builder": "13.0.0-dev-20221216-1545",
+    "@kui-shell/proxy": "13.0.0-dev-20221216-1545",
+    "@kui-shell/react": "13.0.0-dev-20221216-1545",
+    "@kui-shell/webpack": "13.0.0-dev-20221216-1545",
     "@playwright/test": "^1.28.1",
     "@types/debug": "^4.1.7",
     "@types/json-diff": "^0.9.1",
-    "@types/needle": "^2.5.3",
-    "@types/node": "18.11.9",
-    "@types/react": "17.0.39",
-    "@types/react-dom": "17.0.11",
+    "@types/needle": "^3.2.0",
+    "@types/node": "18.11.16",
+    "@types/react": "18.0.26",
+    "@types/react-dom": "18.0.9",
     "@types/split2": "^3.2.1",
     "@types/tmp": "^0.2.3",
     "@types/uuid": "^8.3.4",
     "@typescript-eslint/eslint-plugin": "^5.44.0",
     "@typescript-eslint/parser": "^5.44.0",
     "concurrently": "7.6.0",
     "cross-env": "^7.0.3",
-    "electron": "20.3.6",
+    "electron": "20.3.8",
     "eslint": "^8.28.0",
     "husky": "^8.0.2",
     "lint-staged": "^13.0.4",
@@ -159,16 +159,17 @@
     "typescript": "4.8.4"
   },
   "dependencies": {
+    "node-pty": "0.11.0-beta21",
     "@kui-shell/client": "file:./plugins/plugin-client-default",
-    "@kui-shell/core": "12.2.0-dev-20221127-170013",
-    "@kui-shell/plugin-bash-like": "12.2.0-dev-20221127-170013",
-    "@kui-shell/plugin-client-common": "12.2.0-dev-20221127-170013",
+    "@kui-shell/core": "13.0.0-dev-20221216-1545",
+    "@kui-shell/plugin-bash-like": "13.0.0-dev-20221216-1545",
+    "@kui-shell/plugin-client-common": "13.0.0-dev-20221216-1545",
     "@kui-shell/plugin-codeflare": "file:./plugins/plugin-codeflare",
-    "@kui-shell/plugin-core-support": "12.2.0-dev-20221127-170013",
-    "@kui-shell/plugin-electron-components": "12.2.0-dev-20221127-170013",
-    "@kui-shell/plugin-kubectl": "12.2.0-dev-20221127-170013",
+    "@kui-shell/plugin-core-support": "13.0.0-dev-20221216-1545",
+    "@kui-shell/plugin-electron-components": "13.0.0-dev-20221216-1545",
+    "@kui-shell/plugin-kubectl": "13.0.0-dev-20221216-1545",
     "@kui-shell/plugin-madwizard": "file:./plugins/plugin-madwizard",
-    "@kui-shell/plugin-patternfly4-themes": "12.2.0-dev-20221127-170013",
-    "@kui-shell/plugin-proxy-support": "12.2.0-dev-20221127-170013"
+    "@kui-shell/plugin-patternfly4-themes": "13.0.0-dev-20221216-1545",
+    "@kui-shell/plugin-proxy-support": "13.0.0-dev-20221216-1545"
   }
 }

package.json

@@ -34,7 +34,7 @@
     "needle": "^3.1.0",
     "open": "^8.4.0",
     "pretty-bytes": "^6.0.0",
-    "pretty-ms": "8.0.0",
+    "pretty-ms": "^7.0.1",
     "split2": "^4.1.0",
     "strip-ansi": "6.0.0",
     "tmp": "^0.2.1",

plugins/plugin-codeflare/package.json

@@ -17,7 +17,9 @@
 import React from "react"
 import { Allotment } from "allotment"
 
-export default class AllotmentFillPane extends React.PureComponent<{ minSize?: number }> {
+type Props = React.PropsWithChildren<{ minSize?: number }>
+
+export default class AllotmentFillPane extends React.PureComponent<Props> {
   public render() {
     return (
       <Allotment.Pane className="flex-fill flex-layout flex-align-stretch" minSize={this.props.minSize}>

plugins/plugin-codeflare/src/components/AllotmentFillPane.tsx

@@ -82,6 +82,9 @@ type TreeViewDataItemWithChildren = TreeViewDataItem & Required<Pick<TreeViewDat
 export default class ProfileExplorer extends React.PureComponent<Props, State> {
   public constructor(props: Props) {
     super(props)
+  }
+
+  public componentDidMount() {
     this.init()
   }
 
@@ -638,7 +641,7 @@ class ProfileCard extends React.PureComponent<ProfileCardProps, ProfileCardState
  * A visual indicator that a tree node just changed. 1) Icon; 2)
  * scroll it into view.
  */
-class JustChanged extends React.PureComponent {
+class JustChanged extends React.PureComponent<React.PropsWithChildren<unknown>> {
   private readonly ref = React.createRef<HTMLSpanElement>()
 
   public componentDidMount() {

plugins/plugin-codeflare/src/components/ProfileExplorer.tsx

@@ -56,6 +56,9 @@ export default class WorkloadDesigner extends React.PureComponent<Props, State>
       initCount: 0,
       guidebook: props.defaultGuidebook === null ? null : props.defaultGuidebook || defaultGuidebookFromClient,
     }
+  }
+
+  public componentDidMount() {
     this.init()
   }
 

plugins/plugin-codeflare/src/components/WorkloadDesigner.tsx

@@ -66,15 +66,15 @@ export async function attach(
     opts
   )
 
-  const { cli } = await import("madwizard/dist/fe/cli")
+  const { guide } = await import("madwizard/dist/fe/cli")
 
   // *deploy* the aggregator pod, then *start* an aggregator instance
   // for the given jobId
   try {
     const deployOptions = Object.assign({}, options, { name: "log-aggregator-deploy" })
     debug("Deploying log aggregator", deployGuidebook, deployOptions)
     stderr("Deploying log aggregator...\n")
-    await cli(["codeflare", "guide", deployGuidebook], undefined, deployOptions)
+    await guide(["codeflare", "guide", deployGuidebook], undefined, deployOptions)
     debug("deploying log aggregator: done")
   } catch (err) {
     console.error("Error attaching", err)
@@ -83,7 +83,7 @@ export async function attach(
 
   debug("attaching to", jobId)
   stderr("Attaching to job...\n")
-  const resp = await cli(
+  const resp = await guide(
     ["codeflare", "guide", startGuidebook],
     undefined,
     Object.assign({}, options, { name: "log-aggregator-start", clean: false })

plugins/plugin-codeflare/src/controller/attach.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { cli } from "madwizard/dist/fe/cli"
+import { guide } from "madwizard/dist/fe/cli"
 import { CreateWindowFunction } from "@kui-shell/core"
 
 import windowOptions from "../../../window"
@@ -47,7 +47,7 @@ export default async function openDashboard(
   profile: string,
   createWindow: CreateWindowFunction
 ) {
-  const resp = await cli(["madwizard", "guide", guidebook], undefined, {
+  const resp = await guide(["madwizard", "guide", guidebook], undefined, {
     profile,
     clean: false /* don't kill the port-forward subprocess! we'll manage that */,
     verbose: !!process.env.DEBUG,

plugins/plugin-codeflare/src/tray/menus/profiles/dashboards/open.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { cli } from "madwizard/dist/fe/cli"
+import { guide } from "madwizard/dist/fe/cli"
 
 import { onRun } from "./run"
 import UpdateFunction from "../../update"
@@ -58,7 +58,7 @@ export default class ProfileActiveRunWatcher {
         app.on("before-quit", onExit)
       }
 
-      const resp = await cli(["madwizard", "guide", guidebook], undefined, {
+      const resp = await guide(["madwizard", "guide", guidebook], undefined, {
         profile,
         bump: false, // don't bump the lastUsedTime of the profile
         clean: false, // don't kill the port-forward subprocess! we'll manage that

plugins/plugin-codeflare/src/tray/watchers/profile/active-runs.ts

@@ -23,7 +23,7 @@
     "access": "public"
   },
   "dependencies": {
-    "madwizard": "^1.10.2",
-    "@guidebooks/store": "^1.7.1"
+    "madwizard": "^2.4.9",
+    "@guidebooks/store": "^1.9.3"
   }
 }

plugins/plugin-madwizard/package.json

@@ -123,7 +123,7 @@ export function doMadwizard({ readonlyUI = true, task, withFilepath = true, cb,
 
     if (!parsedOptions.u) {
       // CLI path
-      const { cli } = await import("madwizard/dist/fe/cli/index.js")
+      const { guide: cli } = await import("madwizard/dist/fe/cli/index.js")
 
       if (parsedOptions.q) {
         // TODO add this to madwizard?

plugins/plugin-madwizard/src/plugin.ts

@@ -7,8 +7,8 @@ SCRIPTDIR=$(cd $(dirname "$0") && pwd)
 
 # this forces bin/codeflare to run in headless mode using a platform
 # nodejs runtime (rather than using electron via ELECTRON_RUN_AS_NODE)
-NODE=node
-CODEFLARE_HEADLESS_HOME=$SCRIPTDIR/../../dist/headless
+export NODE=node
+export CODEFLARE_HEADLESS_HOME=$SCRIPTDIR/../../dist/headless
 
 for i in "$SCRIPTDIR"/inputs/*; do
     OUT=$(mktemp)

tests/cli/run.sh

@@ -79,6 +79,11 @@ function run {
     local guidebook=${2-$GUIDEBOOK}
     local yes=$([ -z "$FORCE_ALL" ] && [ "$FORCE" != "$profileFull" ] && [ -f "$MWPROFILES_PATH/$profile" ] && echo "--yes" || echo "")
 
+    # this forces bin/codeflare to run in headless mode using a platform
+    # nodejs runtime (rather than using electron via ELECTRON_RUN_AS_NODE)
+    export NODE=node
+    export CODEFLARE_HEADLESS_HOME=${CODEFLARE_HEADLESS_HOME-$ROOT/dist/headless}
+    
     local PRE="$MWPROFILES_PATH_BASE"/../profiles.d/$profile/pre
     if [ -f "$PRE" ]; then
         echo "[Test] Running pre guidebooks for profile=$profile"