web: Update dependencies (#1184)

Update web dependencies to their latest versions via `npm update` and `npm install package-name@latest` when needed. Additional notes * ESLint has not been updated to the latest v9 because there are few other dependencies that does not support it yet, as `@typescript-eslint` * This set of changes also includes auto fixes done by ESLint via `npm run eslint -- --fix`, see 6effbd2 --- Previous update: #985
agama-project · May 7, 2024 · ea08ac0 · ea08ac0
2 parents cbd3aa9 + 6effbd2
commit ea08ac0
Show file tree

Hide file tree

Showing 8 changed files with 2,753 additions and 2,752 deletions.
diff --git a/web/package-lock.json b/web/package-lock.json
diff --git a/web/package.json b/web/package.json
@@ -39,19 +39,19 @@
     "@svgr/plugin-jsx": "^8.1.0",
     "@svgr/webpack": "^8.1.0",
     "@testing-library/jest-dom": "^6.1.4",
-    "@testing-library/react": "^14.1.0",
+    "@testing-library/react": "^15.0.7",
     "@testing-library/user-event": "^14.5.1",
     "@types/jest": "^29.5.8",
-    "@typescript-eslint/eslint-plugin": "^6.11.0",
-    "@typescript-eslint/parser": "^6.11.0",
+    "@typescript-eslint/eslint-plugin": "^7.8.0",
+    "@typescript-eslint/parser": "^7.8.0",
     "ajv": "^8.12.0",
     "babel-jest": "^29.7.0",
     "babel-loader": "^9.1.3",
-    "compression-webpack-plugin": "^10.0.0",
-    "copy-webpack-plugin": "^11.0.0",
+    "compression-webpack-plugin": "^11.1.0",
+    "copy-webpack-plugin": "^12.0.2",
     "cspell": "^8.0.0",
-    "css-loader": "^6.5.0",
-    "css-minimizer-webpack-plugin": "^5.0.0",
+    "css-loader": "^7.1.1",
+    "css-minimizer-webpack-plugin": "^6.0.0",
     "eslint": "^8.53.0",
     "eslint-config-standard": "^17.1.0",
     "eslint-config-standard-jsx": "^11.0.0",
@@ -66,7 +66,7 @@
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-webpack-plugin": "^4.0.1",
-    "html-minimizer-webpack-plugin": "^4.4.0",
+    "html-minimizer-webpack-plugin": "^5.0.0",
     "htmlparser": "^1.7.7",
     "identity-obj-proxy": "^3.0.0",
     "jed": "^1.1.1",
@@ -79,12 +79,12 @@
     "qunit": "^2.20.0",
     "react-refresh": "^0.14.0",
     "sass": "^1.69.5",
-    "sass-loader": "^13.3.2",
+    "sass-loader": "^14.2.1",
     "string-replace-loader": "^3.0.0",
-    "stylelint": "^15.11.0",
-    "stylelint-config-standard": "^34.0.0",
-    "stylelint-config-standard-scss": "^11.1.0",
-    "stylelint-webpack-plugin": "^4.1.1",
+    "stylelint": "^16.5.0",
+    "stylelint-config-standard": "^36.0.0",
+    "stylelint-config-standard-scss": "^13.1.0",
+    "stylelint-webpack-plugin": "^5.0.0",
     "terser-webpack-plugin": "^5.3.9",
     "ts-jest": "^29.0.3",
     "tsconfig-paths-webpack-plugin": "^4.0.0",
@@ -95,11 +95,11 @@
     "typescript": "^5.3.3",
     "webpack": "^5.89.0",
     "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^4.15.1"
+    "webpack-dev-server": "^5.0.4"
   },
   "dependencies": {
     "@icons-pack/react-simple-icons": "^9.1.0",
-    "@material-symbols/svg-400": "^0.14.0",
+    "@material-symbols/svg-400": "^0.17.4",
     "@patternfly/patternfly": "^5.1.0",
     "@patternfly/react-core": "^5.1.1",
     "@patternfly/react-table": "^5.1.1",
@@ -112,7 +112,6 @@
     "xbytes": "^1.8.0"
   },
   "overrides": {
-    "jsdom": "^22.1.0",
-    "follow-redirects": "1.15.4"
+    "jsdom": "^22.1.0"
   }
 }
diff --git a/web/src/client/network.test.js b/web/src/client/network.test.js
@@ -25,48 +25,47 @@ import { HTTPClient } from "./http";
 import { NetworkClient } from "./network";
 const ADDRESS = "http://localhost";
 
-
 const mockWiredConnection = {
-  "id": "eth0",
-  "status": "up",
-  "interface": "eth0",
-  "method4": "manual",
-  "method6": "manual",
-  "addresses": ["192.168.122.100/24"],
-  "nameservers": ["192.168.122.1"],
-  "gateway4": "192.168.122.1"
-}
+  id: "eth0",
+  status: "up",
+  interface: "eth0",
+  method4: "manual",
+  method6: "manual",
+  addresses: ["192.168.122.100/24"],
+  nameservers: ["192.168.122.1"],
+  gateway4: "192.168.122.1"
+};
 
 const mockWirelessConnection = {
-  "id": "AgamaNetwork",
-  "method4": "auto",
-  "method6": "auto",
-  "wireless": {
-    "passworkd": "agama.test",
-    "security": "wpa-psk",
-    "ssid": "Agama",
-    "mode": "infrastructure"
+  id: "AgamaNetwork",
+  method4: "auto",
+  method6: "auto",
+  wireless: {
+    passworkd: "agama.test",
+    security: "wpa-psk",
+    ssid: "Agama",
+    mode: "infrastructure"
   },
-  "status": "down"
-}
+  status: "down"
+};
 
 const mockConnection = {
-  "id": "eth0",
-  "status": "up",
-  "interface": "eth0",
-  "method4": "manual",
-  "method6": "manual",
-  "addresses": [{ address: "192.168.122.100", prefix: 24 }],
-  "nameservers": ["192.168.122.1"],
-  "gateway4": "192.168.122.1"
-}
+  id: "eth0",
+  status: "up",
+  interface: "eth0",
+  method4: "manual",
+  method6: "manual",
+  addresses: [{ address: "192.168.122.100", prefix: 24 }],
+  nameservers: ["192.168.122.1"],
+  gateway4: "192.168.122.1"
+};
 
 const mockSettings = {
   hostname: "localhost.localdomain",
   connectivity: true,
   wireless_enabled: true,
   networking_enabled: true
-}
+};
 
 const mockJsonFn = jest.fn();
 
@@ -109,7 +108,6 @@ describe("NetworkClient", () => {
     });
   });
 
-
   describe("#settings", () => {
     it("returns network general settings", async () => {
       const http = new HTTPClient(new URL(ADDRESS));

diff --git a/web/src/components/network/NetworkPage.test.jsx b/web/src/components/network/NetworkPage.test.jsx
@@ -30,31 +30,31 @@ jest.mock("~/client");
 jest.mock("~/components/core/Sidebar", () => () => <div>Agama sidebar</div>);
 
 const wiredConnection = {
-  "id": "eth0",
-  "status": "up",
-  "iface": "eth0",
-  "method4": "manual",
-  "method6": "manual",
-  "addresses": [{ address: "192.168.122.20", prefix: 24 }],
-  "nameservers": ["192.168.122.1"],
-  "gateway4": "192.168.122.1"
-}
+  id: "eth0",
+  status: "up",
+  iface: "eth0",
+  method4: "manual",
+  method6: "manual",
+  addresses: [{ address: "192.168.122.20", prefix: 24 }],
+  nameservers: ["192.168.122.1"],
+  gateway4: "192.168.122.1"
+};
 
 const wiFiConnection = {
-  "id": "AgamaNetwork",
-  "iface": "wlan0",
-  "method4": "auto",
-  "method6": "auto",
-  "wireless": {
-    "passworkd": "agama.test",
-    "security": "wpa-psk",
-    "ssid": "Agama",
-    "mode": "infrastructure"
+  id: "AgamaNetwork",
+  iface: "wlan0",
+  method4: "auto",
+  method6: "auto",
+  wireless: {
+    passworkd: "agama.test",
+    security: "wpa-psk",
+    ssid: "Agama",
+    mode: "infrastructure"
   },
-  "addresses": [{ address: "192.168.69.200", prefix: 24 }],
-  "nameservers": [],
-  "status": "up"
-}
+  addresses: [{ address: "192.168.69.200", prefix: 24 }],
+  nameservers: [],
+  status: "up"
+};
 
 const ethernetDevice = {
   name: "eth0",

diff --git a/web/src/components/network/WifiNetworkListItem.test.jsx b/web/src/components/network/WifiNetworkListItem.test.jsx
@@ -25,10 +25,10 @@ import { screen } from "@testing-library/react";
 import { installerRender } from "~/test-utils";
 
 import { WifiNetworkListItem } from "~/components/network";
+import { createClient } from "~/client";
 
 jest.mock("~/components/network/WifiConnectionForm", () => () => <div>WifiConnectionForm mock</div>);
 jest.mock("~/components/network/WifiNetworkMenu", () => () => <div>WifiNetworkMenu mock</div>);
-import { createClient } from "~/client";
 
 jest.mock("~/client");
 const onSelectCallback = jest.fn();

diff --git a/web/src/components/overview/NetworkSection.test.jsx b/web/src/components/overview/NetworkSection.test.jsx
@@ -59,7 +59,7 @@ beforeEach(() => {
         onNetworkChange: onNetworkChangeEventFn,
         fromApiDevice: fromApiDeviceFn
       }
-    }
+    };
   });
 });
 

diff --git a/web/src/components/overview/SoftwareSection.test.jsx b/web/src/components/overview/SoftwareSection.test.jsx
@@ -30,12 +30,12 @@ import { SoftwareSection } from "~/components/overview";
 jest.mock("~/client");
 
 const kdePattern = {
-  "name": "kde",
-  "category": "Graphical Environments",
-  "icon": "./pattern-kde",
-  "description": "Packages providing the Plasma desktop environment and applications from KDE.",
-  "summary": "KDE Applications and Plasma Desktop",
-  "order": "1110",
+  name: "kde",
+  category: "Graphical Environments",
+  icon: "./pattern-kde",
+  description: "Packages providing the Plasma desktop environment and applications from KDE.",
+  summary: "KDE Applications and Plasma Desktop",
+  order: "1110",
 };
 
 let getStatusFn = jest.fn().mockResolvedValue(IDLE);

diff --git a/web/webpack.config.js b/web/webpack.config.js
@@ -96,7 +96,7 @@ module.exports = {
     hot: true,
     // additionally watch these files for changes
     watchFiles: ["./src/manifest.json", "./po/*.po"],
-    proxy: {
+    proxy: [
       // TODO: modify it to not depend on cockpit
       // forward the manifests.js request and patch the response with the
       // current Agama manifest from the ./src/manifest.json file
@@ -108,16 +108,18 @@ module.exports = {
       //   selfHandleResponse : true,
       //   onProxyRes: manifests_handler,
       // },
-      "/api/ws": {
+      {
+        context: ["/api/ws"],
         target: agamaServer.replace(/^http/, "ws"),
         ws: true,
         secure: false,
       },
-      "/api": {
+      {
+        context: ["/api"],
         target: agamaServer,
         secure: false,
-      },
-    },
+      }
+    ],
     server: "http",
     // hot replacement does not support wss:// transport when running over https://,
     // as a workaround use sockjs (which uses standard https:// protocol)