chore(deps): update all dependencies (major)

.github/workflows/actions.yml

@@ -14,9 +14,9 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
           cache: "yarn"
@@ -35,9 +35,9 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
           cache: "yarn"
@@ -51,9 +51,9 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
           cache: "yarn"
@@ -67,9 +67,9 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
           cache: "yarn"
@@ -83,24 +83,24 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
           cache: "yarn"
       - name: Validate Renovate Configuration with renovate-config-validator
-        uses: suzuki-shunsuke/github-action-renovate-config-validator@v0.1.3
+        uses: suzuki-shunsuke/github-action-renovate-config-validator@v1.0.0
   types:
     name: Check types
     runs-on: ubuntu-latest
     strategy:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
           cache: "yarn"
@@ -114,9 +114,9 @@ jobs:
       matrix:
         node-version: [18.x]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
           cache: "yarn"
@@ -126,7 +126,7 @@ jobs:
   dotrun:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Install dotrun
         uses: canonical/install-dotrun@main
       - name: Install dependencies

.yarnrc.yml

@@ -1,3 +1,3 @@
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-3.6.0.cjs
+yarnPath: .yarn/releases/yarn-4.0.2.cjs

package.json

@@ -52,17 +52,17 @@
     "@canonical/jujulib": "4.1.0",
     "@canonical/macaroon-bakery": "1.3.2",
     "@canonical/react-components": "0.47.1",
-    "@reduxjs/toolkit": "1.9.5",
+    "@reduxjs/toolkit": "2.0.1",
     "@sentry/browser": "7.55.0",
     "async-limiter": "2.0.0",
     "classnames": "2.3.2",
     "clone-deep": "4.0.1",
     "d3": "7.8.5",
-    "date-fns": "2.30.0",
+    "date-fns": "3.2.0",
     "dompurify": "3.0.5",
     "formik": "2.4.1",
     "framer-motion": "10.16.4",
-    "fuse.js": "6.6.2",
+    "fuse.js": "7.0.0",
     "lodash.isequal": "4.5.0",
     "lodash.mergewith": "4.6.2",
     "prism-react-renderer": "2.0.6",
@@ -73,16 +73,16 @@
     "react-ga": "3.3.1",
     "react-hot-toast": "2.4.1",
     "react-json-tree": "0.18.0",
-    "react-redux": "8.1.0",
+    "react-redux": "9.0.4",
     "react-router-dom": "6.12.1",
     "react-scripts": "5.0.1",
     "react-useportal": "1.0.18",
-    "redux": "4.2.1",
+    "redux": "5.0.1",
     "vanilla-framework": "4.5.1"
   },
   "devDependencies": {
     "@babel/plugin-proposal-private-property-in-object": "7.21.11",
-    "@testing-library/jest-dom": "5.16.5",
+    "@testing-library/jest-dom": "6.2.0",
     "@testing-library/react": "14.0.0",
     "@testing-library/user-event": "14.4.3",
     "@types/classnames": "2.3.1",
@@ -98,28 +98,28 @@
     "@types/react-dom": "18.2.0",
     "@types/react-table": "7.7.14",
     "@types/redux-mock-store": "1.0.3",
-    "@typescript-eslint/eslint-plugin": "5.59.11",
-    "@typescript-eslint/parser": "5.59.11",
+    "@typescript-eslint/eslint-plugin": "6.18.1",
+    "@typescript-eslint/parser": "6.18.1",
     "eslint": "8.42.0",
-    "eslint-config-prettier": "8.8.0",
+    "eslint-config-prettier": "9.1.0",
     "eslint-plugin-import": "2.27.5",
     "eslint-plugin-jest": "27.2.1",
     "eslint-plugin-jsx-a11y": "6.7.1",
-    "eslint-plugin-prettier": "4.2.1",
+    "eslint-plugin-prettier": "5.1.3",
     "eslint-plugin-promise": "6.1.1",
     "eslint-plugin-react": "7.32.2",
     "fishery": "2.2.2",
     "jest-websocket-mock": "2.4.0",
-    "npm-package-json-lint": "6.4.0",
+    "npm-package-json-lint": "7.1.0",
     "postcss": "8.4.31",
-    "prettier": "2.8.8",
-    "react-anchorme": "3.0.0",
+    "prettier": "3.1.1",
+    "react-anchorme": "4.0.1",
     "redux-devtools": "3.7.0",
     "redux-devtools-extension": "2.13.9",
     "redux-mock-store": "1.5.4",
     "sass": "1.63.3",
-    "stylelint": "15.10.1",
-    "stylelint-config-standard-scss": "9.0.0",
+    "stylelint": "16.1.0",
+    "stylelint-config-standard-scss": "13.0.0",
     "stylelint-order": "6.0.3",
     "ts-jest": "29.1.0",
     "typescript": "5.1.3"
@@ -132,5 +132,5 @@
       "prefer-alphabetical-devDependencies": "error"
     }
   },
-  "packageManager": "yarn@3.6.0"
+  "packageManager": "yarn@4.0.2"
 }

src/components/ActionBar/ActionBar.test.tsx

@@ -9,7 +9,7 @@ describe("ActionBar", () => {
     renderComponent(
       <ActionBar>
         <button>Action</button>
-      </ActionBar>
+      </ActionBar>,
     );
     expect(screen.getByRole("button", { name: "Action" })).toBeInTheDocument();
   });

src/components/App/App.test.tsx

@@ -44,7 +44,7 @@ describe("App", () => {
     render(
       <Provider store={store}>
         <App />
-      </Provider>
+      </Provider>,
     );
     expect(BrowserRouterSpy.mock.calls[0][0].basename).toBe("/");
     BrowserRouterSpy.mockRestore();
@@ -58,7 +58,7 @@ describe("App", () => {
     render(
       <Provider store={store}>
         <App />
-      </Provider>
+      </Provider>,
     );
     expect(screen.getByText("This is a thrown error")).toBeInTheDocument();
   });
@@ -71,7 +71,7 @@ describe("App", () => {
     render(
       <Provider store={store}>
         <App />
-      </Provider>
+      </Provider>,
     );
     expect(screen.getByText(/Can't connect/)).toBeInTheDocument();
   });
@@ -87,7 +87,7 @@ describe("App", () => {
     render(
       <Provider store={store}>
         <App />
-      </Provider>
+      </Provider>,
     );
     expect(initializeSpy).toHaveBeenCalled();
     expect(pageviewSpy).toHaveBeenCalledWith("/models");
@@ -113,7 +113,7 @@ describe("App", () => {
     render(
       <Provider store={store}>
         <App />
-      </Provider>
+      </Provider>,
     );
     expect(initializeSpy).not.toHaveBeenCalled();
     expect(pageviewSpy).not.toHaveBeenCalled();

src/components/AppLink/AppLink.test.tsx

@@ -31,15 +31,15 @@ describe("AppLink", () => {
       <AppLink uuid="abc123" appName="mockApp">
         abc123
       </AppLink>,
-      { state }
+      { state },
     );
     expect(screen.queryByRole("link", { name: "abc123" })).toHaveAttribute(
       "href",
       urls.model.app.index({
         userName: "eggman@external",
         modelName: "test-model",
         appName: "mockApp",
-      })
+      }),
     );
   });
 
@@ -48,7 +48,7 @@ describe("AppLink", () => {
       <AppLink uuid="abc123" appName="mockApp" view="units">
         abc123
       </AppLink>,
-      { state }
+      { state },
     );
     expect(screen.queryByRole("link", { name: "abc123" })).toHaveAttribute(
       "href",
@@ -57,7 +57,7 @@ describe("AppLink", () => {
         modelName: "test-model",
         appName: "mockApp",
         tab: "units",
-      })
+      }),
     );
   });
 
@@ -66,7 +66,7 @@ describe("AppLink", () => {
       <AppLink uuid="invalidUUID" appName="mockApp">
         No app link due to invalid UUID
       </AppLink>,
-      { state }
+      { state },
     );
     expect(screen.queryByRole("link")).not.toBeInTheDocument();
     expect(screen.getByText("No app link due to invalid UUID")).toBeVisible();
@@ -80,7 +80,7 @@ describe("AppLink", () => {
           abc123
         </AppLink>
       </button>,
-      { state }
+      { state },
     );
     await userEvent.click(screen.getByRole("link", { name: "abc123" }));
     expect(onClick).not.toHaveBeenCalled();

src/components/Aside/Aside.test.tsx

@@ -7,7 +7,7 @@ describe("Aside", () => {
     render(
       <Aside>
         <p data-testid="aside-content">Aside content</p>
-      </Aside>
+      </Aside>,
     );
     expect(screen.getByTestId("aside-content")).toBeInTheDocument();
   });
@@ -16,7 +16,7 @@ describe("Aside", () => {
     render(
       <Aside data-testid="aside">
         <p>Aside content</p>
-      </Aside>
+      </Aside>,
     );
     const aside = screen.getByTestId("aside");
     expect(aside).toHaveClass("l-aside");
@@ -29,7 +29,7 @@ describe("Aside", () => {
     render(
       <Aside data-testid="aside" width="narrow">
         <p>Aside content</p>
-      </Aside>
+      </Aside>,
     );
     const aside = screen.getByTestId("aside");
     expect(aside).toHaveClass("is-narrow");
@@ -39,7 +39,7 @@ describe("Aside", () => {
     render(
       <Aside data-testid="aside" width="wide">
         <p>Aside content</p>
-      </Aside>
+      </Aside>,
     );
     const aside = screen.getByTestId("aside");
     expect(aside).toHaveClass("is-wide");
@@ -49,7 +49,7 @@ describe("Aside", () => {
     render(
       <Aside data-testid="aside" pinned={true}>
         <p>Aside content</p>
-      </Aside>
+      </Aside>,
     );
     const aside = screen.getByTestId("aside");
     expect(aside).toHaveClass("is-pinned");

src/components/AuditLogsTable/AuditLogsTable.test.tsx

@@ -56,7 +56,7 @@ describe("AuditLogsTable", () => {
       state,
     });
     expect((await screen.findAllByRole("columnheader"))[1]).toHaveTextContent(
-      "model"
+      "model",
     );
   });
 
@@ -96,7 +96,7 @@ describe("AuditLogsTable", () => {
       offset: 0,
     });
     expect(
-      store.getActions().find((dispatch) => dispatch.type === action.type)
+      store.getActions().find((dispatch) => dispatch.type === action.type),
     ).toMatchObject(action);
   });
 
@@ -129,7 +129,7 @@ describe("AuditLogsTable", () => {
       url: "/?user=eggman",
     });
     expect(document.querySelector(".p-chip__value")).toHaveTextContent(
-      "eggman"
+      "eggman",
     );
   });
 
@@ -139,7 +139,7 @@ describe("AuditLogsTable", () => {
       state,
     });
     expect(
-      screen.queryByRole("navigation", { name: "Pagination" })
+      screen.queryByRole("navigation", { name: "Pagination" }),
     ).not.toBeInTheDocument();
   });
 
@@ -149,7 +149,7 @@ describe("AuditLogsTable", () => {
       state,
     });
     expect(
-      screen.getByRole("navigation", { name: "Pagination" })
+      screen.getByRole("navigation", { name: "Pagination" }),
     ).toBeInTheDocument();
   });
 
@@ -160,7 +160,7 @@ describe("AuditLogsTable", () => {
       url: "/?page=2",
     });
     expect(
-      screen.getByRole("navigation", { name: "Pagination" })
+      screen.getByRole("navigation", { name: "Pagination" }),
     ).toBeInTheDocument();
   });
 });