chore: remove react-router-dom-v5-compat imports (#5372)

src/app/Routes.tsx

@@ -1,7 +1,6 @@
 import { lazy } from "react";
 
-import { Redirect } from "react-router-dom";
-import { Route, Routes as ReactRouterRoutes } from "react-router-dom-v5-compat";
+import { Redirect, Route, Routes as ReactRouterRoutes } from "react-router-dom";
 
 import ErrorBoundary from "@/app/base/components/ErrorBoundary";
 import urls from "@/app/base/urls";

src/app/base/components/AppSideNavigation/AppSideNavItem/AppSideNavItem.tsx

@@ -2,7 +2,7 @@ import type { MouseEvent, ReactNode } from "react";
 
 import { Navigation } from "@canonical/maas-react-components";
 import classNames from "classnames";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import type { SideNavigationProps } from "../AppSideNavigation";
 import type { NavItem } from "../types";

src/app/base/components/AppSideNavigation/AppSideNavigation.test.tsx

@@ -1,7 +1,12 @@
 import { createMemoryHistory } from "history";
 import { Provider } from "react-redux";
-import { BrowserRouter, Router } from "react-router-dom";
-import { CompatRouter, Route, Routes } from "react-router-dom-v5-compat";
+import {
+  BrowserRouter,
+  Router,
+  CompatRouter,
+  Route,
+  Routes,
+} from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import AppSideNavigation from "./AppSideNavigation";
@@ -21,8 +26,8 @@ import {
 } from "@/testing/utils";
 
 const mockUseNavigate = vi.fn();
-vi.mock("react-router-dom-v5-compat", async () => {
-  const actual: object = await vi.importActual("react-router-dom-v5-compat");
+vi.mock("react-router-dom", async () => {
+  const actual: object = await vi.importActual("react-router-dom");
   return {
     ...actual,
     useNavigate: () => mockUseNavigate,

src/app/base/components/AppSideNavigation/AppSideNavigation.tsx

@@ -2,7 +2,7 @@ import { useEffect, useMemo } from "react";
 
 import { Navigation, NavigationBar } from "@canonical/maas-react-components";
 import { useDispatch, useSelector } from "react-redux";
-import { useNavigate, useLocation, useMatch } from "react-router-dom-v5-compat";
+import { useNavigate, useLocation, useMatch } from "react-router-dom";
 import { useStorageState } from "react-storage-hooks";
 
 import AppSideNavItems from "./AppSideNavItems";

src/app/base/components/AppSideNavigation/NavigationBanner/NavigationBanner.tsx

@@ -1,5 +1,5 @@
 import { Navigation } from "@canonical/maas-react-components";
-import { Link, useLocation } from "react-router-dom-v5-compat";
+import { Link, useLocation } from "react-router-dom";
 
 import { isSelected } from "../utils";
 

src/app/base/components/AppSideNavigation/utils.ts

@@ -1,4 +1,4 @@
-import { matchPath } from "react-router-dom-v5-compat";
+import { matchPath } from "react-router-dom";
 
 import type { NavItem } from "./types";
 

src/app/base/components/ControllerLink/ControllerLink.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import ControllerLink, { Labels } from "./ControllerLink";

src/app/base/components/ControllerLink/ControllerLink.tsx

@@ -1,6 +1,6 @@
 import { Spinner } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import { useFetchActions } from "@/app/base/hooks";
 import urls from "@/app/base/urls";

src/app/base/components/DHCPTable/DHCPTable.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import DHCPTable, { TestIds } from "./DHCPTable";

src/app/base/components/DHCPTable/DHCPTable.tsx

@@ -3,7 +3,7 @@ import { useState } from "react";
 import { ExternalLink } from "@canonical/maas-react-components";
 import { List, MainTable } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import TitledSection from "../TitledSection";
 

src/app/base/components/DeviceLink/DeviceLink.test.tsx

@@ -1,6 +1,5 @@
 import { Provider } from "react-redux";
-import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { MemoryRouter, CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import DeviceLink, { Labels } from "./DeviceLink";

src/app/base/components/DeviceLink/DeviceLink.tsx

@@ -1,6 +1,6 @@
 import { Spinner } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import { useFetchActions } from "@/app/base/hooks";
 import urls from "@/app/base/urls";

src/app/base/components/DhcpForm/DhcpForm.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import { Labels as FieldLabels } from "../DhcpFormFields";

src/app/base/components/DhcpFormFields/DhcpFormFields.test.tsx

@@ -1,7 +1,7 @@
 import * as reduxToolkit from "@reduxjs/toolkit";
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import { Labels } from "./DhcpFormFields";

src/app/base/components/FabricLink/FabricLink.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import FabricLink, { Labels } from "./FabricLink";

src/app/base/components/FabricLink/FabricLink.tsx

@@ -1,6 +1,6 @@
 import { Spinner } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import { useFetchActions } from "@/app/base/hooks";
 import urls from "@/app/base/urls";

src/app/base/components/FormikForm/FormikForm.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import FormikForm from "./FormikForm";

src/app/base/components/FormikFormContent/FormikFormContent.test.tsx

@@ -1,7 +1,6 @@
 import { Field, Formik } from "formik";
 import { Provider } from "react-redux";
-import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { MemoryRouter, CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 import * as Yup from "yup";
 
@@ -22,8 +21,8 @@ import {
 
 const mockStore = configureStore<RootState>();
 const mockUseNavigate = vi.fn();
-vi.mock("react-router-dom-v5-compat", async () => {
-  const actual: object = await vi.importActual("react-router-dom-v5-compat");
+vi.mock("react-router-dom", async () => {
+  const actual: object = await vi.importActual("react-router-dom");
   return {
     ...actual,
     useNavigate: () => mockUseNavigate,

src/app/base/components/FormikFormContent/FormikFormContent.tsx

@@ -7,7 +7,7 @@ import type { FormikContextType } from "formik";
 import { useFormikContext } from "formik";
 import { withFormikDevtools } from "formik-devtools-extension";
 import { useDispatch } from "react-redux";
-import { useNavigate } from "react-router-dom-v5-compat";
+import { useNavigate } from "react-router-dom";
 import type { AnyAction } from "redux";
 
 import type { FormikFormButtonsProps } from "@/app/base/components/FormikFormButtons";

src/app/base/components/MachineLink/MachineLink.test.tsx

@@ -1,7 +1,7 @@
 import * as reduxToolkit from "@reduxjs/toolkit";
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import MachineLink, { Labels } from "./MachineLink";

src/app/base/components/MachineLink/MachineLink.tsx

@@ -1,5 +1,5 @@
 import { Spinner } from "@canonical/react-components";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import urls from "@/app/base/urls";
 import type { Machine, MachineMeta } from "@/app/store/machine/types";

src/app/base/components/ModelNotFound/ModelNotFound.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import ModelNotFound from "./ModelNotFound";

src/app/base/components/ModelNotFound/ModelNotFound.tsx

@@ -1,4 +1,4 @@
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import PageContent from "../PageContent";
 

src/app/base/components/NodeConfigurationFields/NodeConfigurationFields.test.tsx

@@ -1,7 +1,7 @@
 import { Formik } from "formik";
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import NodeConfigurationFields, { Label } from "./NodeConfigurationFields";

src/app/base/components/NodeSummaryNetworkCard/NodeSummaryNetworkCard.tsx

@@ -3,7 +3,7 @@ import { Fragment } from "react";
 
 import { Card, Spinner } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import NetworkCardTable from "./NetworkCardTable";
 

src/app/base/components/NotificationGroup/Notification/Notification.tsx

@@ -1,7 +1,7 @@
 import { Notification } from "@canonical/react-components";
 import type { NotificationProps } from "@canonical/react-components";
 import { useDispatch, useSelector } from "react-redux";
-import { useNavigate } from "react-router-dom-v5-compat";
+import { useNavigate } from "react-router-dom";
 
 import settingsURLs from "@/app/settings/urls";
 import authSelectors from "@/app/store/auth/selectors";

src/app/base/components/PageContent/PageContent.tsx

@@ -2,7 +2,7 @@ import type { HTMLProps, ReactNode } from "react";
 
 import classNames from "classnames";
 import { useSelector } from "react-redux";
-import { matchPath, useLocation } from "react-router-dom-v5-compat";
+import { matchPath, useLocation } from "react-router-dom";
 
 import AppSidePanel from "../AppSidePanel";
 import ErrorBoundary from "../ErrorBoundary/ErrorBoundary";

src/app/base/components/SSHKeyList/SSHKeyList.tsx

@@ -2,8 +2,8 @@ import type { ReactNode } from "react";
 
 import { Button, Notification } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import type { NavigateFunction } from "react-router-dom-v5-compat";
-import { useNavigate } from "react-router-dom-v5-compat";
+import type { NavigateFunction } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 
 import { useFetchActions } from "@/app/base/hooks";
 import urls from "@/app/preferences/urls";

src/app/base/components/SecondaryNavigation/SecondaryNavigation.tsx

@@ -1,6 +1,6 @@
 import classNames from "classnames";
-import type { Location } from "react-router-dom-v5-compat";
-import { Link, matchPath, useLocation } from "react-router-dom-v5-compat";
+import type { Location } from "react-router-dom";
+import { Link, matchPath, useLocation } from "react-router-dom";
 
 import { useThemeContext } from "@/app/base/theme-context";
 

src/app/base/components/SpaceLink/SpaceLink.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import SpaceLink from "./SpaceLink";

src/app/base/components/SpaceLink/SpaceLink.tsx

@@ -1,6 +1,6 @@
 import { Spinner } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import { useFetchActions } from "@/app/base/hooks";
 import urls from "@/app/base/urls";

src/app/base/components/SubnetLink/SubnetLink.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import SubnetLink from "./SubnetLink";

src/app/base/components/SubnetLink/SubnetLink.tsx

@@ -1,6 +1,6 @@
 import { Spinner } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import { useFetchActions } from "@/app/base/hooks";
 import urls from "@/app/base/urls";

src/app/base/components/TableActions/TableActions.tsx

@@ -1,5 +1,5 @@
 import { Button, Tooltip } from "@canonical/react-components";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import CopyButton from "@/app/base/components/CopyButton";
 

src/app/base/components/TagLinks/TagLinks.test.tsx

@@ -1,5 +1,5 @@
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 
 import TagLinks from "./TagLinks";
 

src/app/base/components/TagLinks/TagLinks.tsx

@@ -1,4 +1,4 @@
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import type { Tag } from "@/app/store/tag/types";
 

src/app/base/components/VLANLink/VLANLink.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import VLANLink from "./VLANLink";

src/app/base/components/VLANLink/VLANLink.tsx

@@ -1,6 +1,6 @@
 import { Spinner } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import { useFetchActions } from "@/app/base/hooks";
 import urls from "@/app/base/urls";

src/app/base/components/VaultNotification/VaultNotification.tsx

@@ -1,6 +1,6 @@
 import { Notification } from "@canonical/react-components";
 import { useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import controllerSelectors from "@/app/store/controller/selectors";
 import { vaultEnabled as vaultEnabledSelectors } from "@/app/store/general/selectors";

src/app/base/components/node/MachinesHeader/MachinesHeader.test.tsx

@@ -1,7 +1,7 @@
 import { render, screen } from "@testing-library/react";
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import MachinesHeader from "./MachinesHeader";

src/app/base/components/node/NodeDevices/NodeDevices.tsx

@@ -4,7 +4,7 @@ import { useEffect } from "react";
 import classNames from "classnames";
 import pluralize from "pluralize";
 import { useDispatch, useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import NodeDevicesWarning from "./NodeDevicesWarning";
 

src/app/base/components/node/NodeLink/NodeLink.test.tsx

@@ -1,6 +1,6 @@
 import { Provider } from "react-redux";
 import { MemoryRouter } from "react-router-dom";
-import { CompatRouter } from "react-router-dom-v5-compat";
+import { CompatRouter } from "react-router-dom";
 import configureStore from "redux-mock-store";
 
 import NodeLink from "./NodeLink";

src/app/base/components/node/NodeLogs/NodeLogs.tsx

@@ -1,6 +1,6 @@
 import { Tabs } from "@canonical/react-components";
 import { Route, useLocation } from "react-router-dom";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import DownloadMenu from "./DownloadMenu";
 import EventLogs from "./EventLogs";

src/app/base/components/node/NodeTestDetails/NodeTestDetails.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 
 import { Col, Row, Spinner, Tooltip } from "@canonical/react-components";
 import { useDispatch, useSelector } from "react-redux";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import NodeTestDetailsLogs from "./NodeTestDetailsLogs";
 

src/app/base/components/node/NodeTestsTable/TestActions/TestActions.tsx

@@ -1,6 +1,6 @@
 import type { ContextualMenuProps } from "@canonical/react-components";
 import type { LinkProps } from "react-router-dom";
-import { Link } from "react-router-dom-v5-compat";
+import { Link } from "react-router-dom";
 
 import type { SetExpanded } from "../NodeTestsTable";
 import { ScriptResultAction } from "../NodeTestsTable";