build(package): upgrade to yarn v4 (reanahub#420)

Closes reanahub#346

hey

Author: Alputer

.github/workflows/ci.yml

@@ -1,5 +1,5 @@
 # This file is part of REANA.
-# Copyright (C) 2020, 2022, 2024 CERN.
+# Copyright (C) 2020, 2022, 2024, 2025 CERN.
 #
 # REANA is free software; you can redistribute it and/or modify it
 # under the terms of the MIT License; see LICENSE file for more details.
@@ -79,8 +79,11 @@ jobs:
         with:
           node-version: "18"
 
-      - name: Install project dependencies
-        run: yarn global add prettier
+      - name: Enable corepack and set yarn version
+        run: corepack enable && yarn set version 4.6.0
+
+      - name: Install prettier
+        run: yarn add prettier
 
       - name: Run prettier code formatter
         run: ./run-tests.sh --check-prettier
@@ -96,8 +99,11 @@ jobs:
         with:
           node-version: "18"
 
-      - name: Install project dependencies
-        run: yarn global add eslint
+      - name: Enable corepack and set yarn version
+        run: corepack enable && yarn set version 4.6.0
+
+      - name: Install eslint
+        run: cd reana-ui && yarn add --dev && cd ..
 
       - name: Run prettier code formatter
         run: ./run-tests.sh --check-lint
@@ -113,8 +119,8 @@ jobs:
         with:
           node-version: "18"
 
-      - name: Install project dependencies
-        run: yarn
+      - name: Enable corepack and set yarn version
+        run: corepack enable && yarn set version 4.6.0
 
       - name: Run JavaScript tests
         run: ./run-tests.sh --check-js-tests

Dockerfile

@@ -9,6 +9,8 @@ ENV DEBIAN_FRONTEND=noninteractive
 WORKDIR /code
 COPY . /code
 
+RUN yarn set version 4.6.0
+
 # Build frontend application
 # hadolint ignore=DL3003,DL3008
 RUN apt-get update -y && \

reana-ui/.eslintrc.json

@@ -0,0 +1 @@
+nodeLinker: node-modules

reana-ui/.yarnrc.yml

@@ -31,4 +31,7 @@ module.exports = {
       },
     ],
   },
+  eslint: {
+    enable: false,
+  },
 };

reana-ui/craco.config.js

@@ -0,0 +1,47 @@
+// Most of this file is created via running `yarn dlx @eslint/migrate-config .eslintrc.json` on top of our old `.eslintrc.json` file
+import { fixupConfigRules, fixupPluginRules } from "@eslint/compat";
+import prettier from "eslint-plugin-prettier";
+import babelParser from "@babel/eslint-parser";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import js from "@eslint/js";
+import { FlatCompat } from "@eslint/eslintrc";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+});
+
+export default [
+  ...fixupConfigRules(
+    compat.extends("plugin:prettier/recommended", "react-app", "prettier"),
+  ),
+  {
+    plugins: {
+      prettier: fixupPluginRules(prettier),
+    },
+
+    languageOptions: {
+      parser: babelParser,
+      ecmaVersion: 5,
+      sourceType: "script",
+
+      parserOptions: {
+        requireConfigFile: false,
+        sourceType: "module",
+        ecmaVersion: 2022,
+
+        babelOptions: {
+          presets: ["@babel/preset-react"],
+        },
+      },
+    },
+
+    rules: {
+      "prettier/prettier": "error",
+      "react/jsx-uses-react": "off",
+      "react/react-in-jsx-scope": "off",
+    },
+  },
+];

reana-ui/eslint.config.mjs

@@ -25,9 +25,6 @@
     "redux-thunk": "^2.3.0",
     "semantic-ui-react": "^2.0.0"
   },
-  "resolutions": {
-    "jsroot/gl/node-gyp": "<9.4.0"
-  },
   "scripts": {
     "analyze": "source-map-explorer 'build/static/js/*.js'",
     "start": "craco start",
@@ -55,26 +52,35 @@
   },
   "devDependencies": {
     "@babel/core": "^7.23.2",
-    "@babel/eslint-parser": "^7.16.5",
+    "@babel/eslint-parser": "^7.26.5",
     "@babel/plugin-proposal-private-property-in-object": "^7.16.7",
     "@craco/craco": "^7.1.0",
+    "@eslint/compat": "^1.2.6",
+    "@eslint/eslintrc": "^3.2.0",
+    "@eslint/js": "^9.19.0",
     "@semantic-ui-react/craco-less": "^3.0.0",
     "@semantic-ui-react/css-patch": "^1.0.0",
     "@testing-library/jest-dom": "^6.1.4",
     "@testing-library/react": "^14.0.0",
+    "@typescript-eslint/eslint-plugin": "^8.23.0",
+    "@typescript-eslint/parser": "^8.23.0",
     "craco-alias": "^3.0.1",
+    "eslint": "^9.19.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-config-react-app": "^7.0.1",
-    "eslint-plugin-prettier": "^5.0.1",
+    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-prettier": "^5.2.3",
     "eslint-plugin-react": "^7.23.2",
     "npm-run-all": "^4.1.5",
     "prettier": "^3.0.3",
     "semantic-ui-less": "^2.4.1",
-    "source-map-explorer": "^2.5.0"
+    "source-map-explorer": "^2.5.0",
+    "typescript": "^5.7.3"
   },
   "jest": {
     "transformIgnorePatterns": [
       "node_modules/(?!axios)/"
     ]
-  }
+  },
+  "packageManager": "[email protected]"
 }