[release-4.20] CONSOLE-5011: migrate to yarn berry

.gitignore

@@ -1,6 +1,15 @@
 .env
 .idea
 .vscode
+
+# Yarn v4 (Berry)
+.yarn/*
+install-state.gz
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
 !/vendor/**
 !.vscode/settings.json
 .DS_Store

Dockerfile

@@ -17,16 +17,21 @@ ADD . .
 
 USER 0
 
-ARG YARN_VERSION=v1.22.22
+ARG COREPACK_VERSION=0.34.6
 
-# bootstrap yarn so we can install and run the other tools.
-RUN CACHED_YARN=./artifacts/yarn-${YARN_VERSION}.tar.gz; \
-    if [ -f ${CACHED_YARN} ]; then \
-      npm install ${CACHED_YARN}; \
+# bootstrap corepack so we can install and run the other tools.
+RUN CACHED_COREPACK=./artifacts/corepack-${COREPACK_VERSION}.tar.gz; \
+    if [ -f ${CACHED_COREPACK} ]; then \
+      npm install --global ${CACHED_COREPACK}; \
     else \
-      npm install https://github.com/yarnpkg/yarn/releases/download/${YARN_VERSION}/yarn-${YARN_VERSION}.tar.gz; \
+      npm install --global https://github.com/nodejs/corepack/releases/download/v${COREPACK_VERSION}/corepack.tgz; \
     fi
 
+RUN npx corepack enable
+
+# assume our package manager is safe to download
+ENV COREPACK_ENABLE_DOWNLOAD_PROMPT=0
+
 # The REMOTE_SOURCES value is set by the build system to indicate the location of the cachito-backed artifacts cache.
 # As cachito might not be available in all environments, we need to make sure the value is set before trying to use it and
 # that the COPY layer below doesn't fail. Setting it to be the Dockerfile itself is fairly safe, as it will always be
@@ -39,7 +44,7 @@ COPY $REMOTE_SOURCES $REMOTE_SOURCES_DIR
 # use dependencies provided by Cachito
 RUN test -d ${REMOTE_SOURCES}/cachito-gomod-with-deps || exit 0; \
     cp -f $REMOTE_SOURCES_DIR/cachito-gomod-with-deps/app/registry-ca.pem . \
- && cp -f $REMOTE_SOURCES_DIR/cachito-gomod-with-deps/app/frontend/{.npmrc,.yarnrc,yarn.lock} frontend/
+ && cp -f $REMOTE_SOURCES_DIR/cachito-gomod-with-deps/app/frontend/{.npmrc,.yarnrc.yml,yarn.lock} frontend/
 
 # prevent download of cypress binary as part of module installs
 ENV CYPRESS_INSTALL_BINARY=0

Dockerfile.builder

@@ -10,9 +10,12 @@
 
 FROM golang:1.22-bullseye
 
-### Install NodeJS and yarn
+### Install NodeJS and corepack
 ENV NODE_VERSION="v22.14.0"
-ENV YARN_VERSION="v1.22.22"
+ENV COREPACK_VERSION="0.34.6"
+
+# assume our package manager is safe to download
+ENV COREPACK_ENABLE_DOWNLOAD_PROMPT=0
 
 # yarn needs a home writable by any user running the container
 ENV HOME=/opt/home
@@ -43,9 +46,6 @@ RUN chmod 777 /usr/local/lib/node_modules
 # cleanup
 RUN rm -rf /tmp/node-v*
 
-RUN cd /tmp && \
-    wget --quiet -O /tmp/yarn.tar.gz https://github.com/yarnpkg/yarn/releases/download/${YARN_VERSION}/yarn-${YARN_VERSION}.tar.gz && \
-    tar xf yarn.tar.gz && \
-    rm -f /tmp/yarn.tar.gz && \
-    mv /tmp/yarn-${YARN_VERSION} /usr/local/yarn && \
-    ln -s /usr/local/yarn/bin/yarn /usr/local/bin/yarn
+# Install corepack
+RUN npm install -g corepack@${COREPACK_VERSION} && \
+    corepack enable

Dockerfile.plugins.demo

@@ -9,7 +9,7 @@ RUN mkdir -p /src/console
 COPY . /src/console
 
 WORKDIR /src/console/frontend
-RUN yarn install
+RUN yarn install && yarn generate
 
 WORKDIR /src/console/dynamic-demo-plugin
 RUN yarn install && \

README.md

@@ -15,7 +15,7 @@ The console is a more friendly `kubectl` in the form of a single page webapp. It
 
 ### Dependencies:
 
-1. [node.js](https://nodejs.org/) >= 22 & [yarn classic](https://classic.yarnpkg.com/en/docs/install) >= 1.20
+1. [node.js](https://nodejs.org/) >= 22 with [corepack](https://npmjs.com/package/corepack) enabled for [yarn berry](https://yarnpkg.com/)
 2. [go](https://golang.org/) >= 1.22+
 3. [oc](https://mirror.openshift.com/pub/openshift-v4/clients/oc/latest/) or [kubectl](https://kubernetes.io/docs/tasks/tools/install-kubectl/) and an OpenShift or Kubernetes cluster
 4. [jq](https://stedolan.github.io/jq/download/) (for `contrib/environment.sh`)
@@ -398,20 +398,19 @@ yarn add <package@version>
 Update existing frontend dependencies:
 
 ```
-yarn upgrade <package@version>
+yarn up <package@version>
 ```
 
-To upgrade yarn itself, download a new yarn release from
-<https://github.com/yarnpkg/yarn/releases>, replace the release in
-`frontend/.yarn/releases` with the new version, and update `yarn-path` in
-`frontend/.yarnrc`.
+To upgrade yarn itself, run `yarn set version <version>` in `frontend` directory. This will update the yarn
+release file in `frontend/.yarn/releases` and the `yarnPath` in `frontend/.yarnrc.yml`, as well as the
+`packageManager` field in `frontend/package.json`.
 
 ##### @patternfly
 
 Note that when upgrading @patternfly packages, we've seen in the past that it can cause the JavaScript heap to run out of memory, or the bundle being too large if multiple versions of the same @patternfly package is pulled in. To increase efficiency, run the following after updating packages:
 
 ```
-npx yarn-deduplicate --scopes @patternfly
+yarn dedupe --strategy highest
 ```
 
 #### Supported Browsers

dynamic-demo-plugin/.yarn/releases

@@ -0,0 +1 @@
+../../frontend/.yarn/releases

dynamic-demo-plugin/.yarnrc.yml

@@ -0,0 +1 @@
+../frontend/.yarnrc.yml

dynamic-demo-plugin/package.json

@@ -7,20 +7,20 @@
     "build": "yarn clean && NODE_ENV=production yarn ts-node node_modules/.bin/webpack",
     "build-dev": "yarn clean && yarn ts-node node_modules/.bin/webpack",
     "build-plugin-sdk": "yarn --cwd ../frontend build-plugin-sdk && yarn install-plugin-sdk",
-    "install-plugin-sdk": "rm -rf node_modules/@openshift-console && yarn install --check-files",
+    "install-plugin-sdk": "rm -rf node_modules/@openshift-console && yarn install",
     "start-console": "./start-console.sh",
     "http-server": "./http-server.sh dist",
-    "i18n": "i18next \"src/**/*.{js,jsx,ts,tsx}\" [-oc] -c i18next-parser.config.js",
-    "ts-node": "ts-node -O '{\"module\":\"commonjs\"}'"
+    "i18n": "i18next \"src/**/*.{js,jsx,ts,tsx}\" -c i18next-parser.config.js",
+    "ts-node": "NODE_OPTIONS='--preserve-symlinks' ts-node -O '{\"module\":\"commonjs\"}'"
   },
   "devDependencies": {
-    "@openshift-console/dynamic-plugin-sdk": "file:../frontend/packages/console-dynamic-plugin-sdk/dist/core",
-    "@openshift-console/dynamic-plugin-sdk-webpack": "file:../frontend/packages/console-dynamic-plugin-sdk/dist/webpack",
-    "@openshift-console/plugin-shared": "file:../frontend/packages/console-plugin-shared/dist",
+    "@openshift-console/dynamic-plugin-sdk": "portal:../frontend/packages/console-dynamic-plugin-sdk/dist/core",
+    "@openshift-console/dynamic-plugin-sdk-webpack": "portal:../frontend/packages/console-dynamic-plugin-sdk/dist/webpack",
+    "@openshift-console/plugin-shared": "portal:../frontend/packages/console-plugin-shared/dist",
     "@patternfly/react-core": "^6.2.2",
     "@patternfly/react-icons": "^6.2.2",
     "@patternfly/react-table": "^6.2.2",
-    "@types/react": "16.8.13",
+    "@types/react": "17.x",
     "@types/react-router": "^5.1.20",
     "@types/react-router-dom": "5.3.x",
     "copy-webpack-plugin": "^6.4.1",
@@ -29,8 +29,8 @@
     "http-server": "0.12.x",
     "i18next-parser": "^3.3.0",
     "js-yaml": "^4.1.0",
-    "react": "17.0.1",
-    "react-dom": "17.0.1",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
     "react-i18next": "^11.7.3",
     "react-router": "5.3.x",
     "react-router-dom": "5.3.x",
@@ -76,5 +76,6 @@
     "disableStaticPlugins": [
       "@console/demo-plugin"
     ]
-  }
+  },
+  "packageManager": "yarn@4.12.0"
 }

dynamic-demo-plugin/src/components/ProjectOverview/Inventory.tsx

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import {
   K8sResourceCommon,
   useK8sWatchResource,