From 2e701b3796cc8b0b2a476e0c8abcafedeb0eea7e Mon Sep 17 00:00:00 2001
From: Patrik Oldsberg <poldsberg@gmail.com>
Date: Thu, 8 Dec 2022 21:18:01 +0100
Subject: [PATCH] refactor react-router -> react-router-dom

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
---
 .changeset/long-eyes-confess.md               | 38 +++++++++++++++++++
 packages/app-defaults/package.json            |  1 -
 packages/app/package.json                     |  1 -
 packages/app/src/App.tsx                      |  2 +-
 packages/core-components/package.json         |  1 -
 .../src/components/Button/Button.test.tsx     |  2 +-
 .../src/components/Link/Link.test.tsx         |  2 +-
 .../ProgressBars/GaugeCard.stories.tsx        |  2 +-
 .../TabbedLayout/RoutedTabs.test.tsx          |  2 +-
 .../components/TabbedLayout/RoutedTabs.tsx    |  7 +++-
 .../TabbedLayout/TabbedLayout.stories.tsx     |  2 +-
 .../src/layout/ErrorPage/ErrorPage.tsx        |  2 +-
 .../src/layout/InfoCard/InfoCard.stories.tsx  |  2 +-
 .../src/layout/ItemCard/ItemCard.stories.tsx  |  2 +-
 .../src/layout/Sidebar/MobileSidebar.tsx      |  2 +-
 .../layout/TabbedCard/TabbedCard.stories.tsx  |  2 +-
 packages/dev-utils/package.json               |  1 -
 packages/dev-utils/src/devApp/render.tsx      |  2 +-
 .../techdocs-cli-embedded-app/package.json    |  1 -
 .../techdocs-cli-embedded-app/src/App.tsx     |  2 +-
 packages/test-utils/package.json              |  1 -
 .../src/testUtils/appWrappers.test.tsx        |  2 +-
 .../test-utils/src/testUtils/appWrappers.tsx  |  2 +-
 plugins/airbrake/package.json                 |  2 +-
 plugins/airbrake/src/extensions.test.tsx      |  2 +-
 plugins/api-docs/package.json                 |  1 -
 .../ApiExplorerPage/ApiExplorerPage.test.tsx  |  2 +-
 .../ApiExplorerPage/ApiExplorerPage.tsx       |  2 +-
 plugins/azure-devops/package.json             |  2 +-
 .../BuildTable/BuildTable.stories.tsx         |  2 +-
 .../PullRequestCard.stories.tsx               |  2 +-
 plugins/badges/package.json                   |  2 +-
 plugins/badges/src/api/BadgesClient.ts        |  2 +-
 plugins/catalog-graph/package.json            |  2 +-
 .../CatalogGraphCard/CatalogGraphCard.tsx     |  2 +-
 .../CatalogGraphPage/CatalogGraphPage.tsx     |  2 +-
 .../useCatalogGraphPage.test.ts               |  2 +-
 .../CatalogGraphPage/useCatalogGraphPage.ts   |  2 +-
 plugins/catalog-import/package.json           |  2 +-
 .../components/ImportPage/ImportPage.test.tsx |  2 +-
 .../src/components/ImportPage/ImportPage.tsx  |  2 +-
 plugins/catalog-react/package.json            |  2 +-
 .../components/AncestryPage.tsx               |  2 +-
 .../src/hooks/useEntityListProvider.test.tsx  |  2 +-
 .../src/hooks/useEntityListProvider.tsx       |  2 +-
 plugins/catalog/package.json                  |  2 +-
 .../CatalogEntityPage/CatalogEntityPage.tsx   |  2 +-
 .../CatalogEntityPage/useEntityFromUrl.ts     |  2 +-
 .../CatalogPage/CatalogPage.test.tsx          |  2 +-
 .../components/CatalogPage/CatalogPage.tsx    |  2 +-
 .../components/EntityLayout/EntityLayout.tsx  |  2 +-
 .../EntityOrphanWarning.tsx                   |  2 +-
 plugins/circleci/package.json                 |  1 -
 plugins/circleci/src/components/Router.tsx    |  2 +-
 plugins/cloudbuild/package.json               |  1 -
 plugins/cloudbuild/src/components/Router.tsx  |  2 +-
 plugins/code-climate/package.json             |  2 +-
 plugins/code-coverage/package.json            |  1 -
 plugins/explore/package.json                  |  1 -
 .../ExplorePage/ExplorePage.test.tsx          |  2 +-
 .../components/ExplorePage/ExplorePage.tsx    |  2 +-
 plugins/git-release-manager/package.json      |  2 +-
 .../src/features/RepoDetailsForm/Owner.tsx    |  2 +-
 .../src/features/RepoDetailsForm/Repo.tsx     |  2 +-
 .../RepoDetailsForm/VersioningStrategy.tsx    |  2 +-
 .../src/hooks/useQueryHandler.ts              |  2 +-
 plugins/github-actions/package.json           |  1 -
 .../github-actions/src/components/Router.tsx  |  2 +-
 plugins/home/package.json                     |  2 +-
 .../components/HomepageCompositionRoot.tsx    |  2 +-
 plugins/jenkins/package.json                  |  1 -
 plugins/jenkins/src/components/Router.tsx     |  2 +-
 plugins/kafka/package.json                    |  2 +-
 plugins/kafka/src/Router.tsx                  |  2 +-
 plugins/org/package.json                      |  1 -
 .../MembersList/MembersListCard.stories.tsx   |  2 +-
 plugins/permission-react/package.json         |  2 +-
 .../src/components/PermissionedRoute.tsx      |  2 +-
 plugins/playlist/package.json                 |  1 -
 .../playlist/src/components/Router/Router.tsx |  2 +-
 .../src/hooks/usePlaylistList.test.tsx        |  2 +-
 .../playlist/src/hooks/usePlaylistList.tsx    |  2 +-
 plugins/rollbar/package.json                  |  1 -
 plugins/rollbar/src/components/Router.tsx     |  2 +-
 plugins/scaffolder/package.json               |  1 -
 plugins/scaffolder/src/components/Router.tsx  |  2 +-
 .../ScaffolderPageContextMenu.tsx             |  2 +-
 .../src/components/TaskPage/TaskPage.tsx      |  2 +-
 .../TemplatePage/TemplatePage.test.tsx        |  2 +-
 .../components/TemplatePage/TemplatePage.tsx  |  2 +-
 plugins/scaffolder/src/next/Router/Router.tsx |  2 +-
 .../TemplateWizardPage/TemplateWizardPage.tsx |  2 +-
 plugins/search-react/package.json             |  2 +-
 .../DefaultResultListItem.stories.tsx         |  2 +-
 .../SearchResult/SearchResult.stories.tsx     |  2 +-
 plugins/search/package.json                   |  1 -
 .../components/SearchPage/SearchPage.test.tsx |  2 +-
 .../src/components/SearchPage/SearchPage.tsx  |  2 +-
 plugins/sentry/package.json                   |  2 +-
 plugins/sentry/src/components/Router.tsx      |  2 +-
 plugins/shortcuts/package.json                |  2 +-
 plugins/shortcuts/src/AddShortcut.tsx         |  2 +-
 plugins/techdocs/package.json                 |  2 +-
 .../components/TechDocsIndexPage.test.tsx     |  2 +-
 .../src/home/components/TechDocsIndexPage.tsx |  2 +-
 .../src/search/components/TechDocsSearch.tsx  |  2 +-
 plugins/todo/package.json                     |  2 +-
 plugins/todo/src/plugin.test.tsx              |  2 +-
 plugins/user-settings/package.json            |  2 +-
 .../DefaultSettingsPage.test.tsx              |  2 +-
 .../SettingsPage/SettingsPage.test.tsx        |  2 +-
 .../components/SettingsPage/SettingsPage.tsx  |  2 +-
 112 files changed, 136 insertions(+), 111 deletions(-)
 create mode 100644 .changeset/long-eyes-confess.md

diff --git a/.changeset/long-eyes-confess.md b/.changeset/long-eyes-confess.md
new file mode 100644
index 0000000000..f35504f8d7
--- /dev/null
+++ b/.changeset/long-eyes-confess.md
@@ -0,0 +1,38 @@
+---
+'@backstage/app-defaults': patch
+'@backstage/core-components': patch
+'@backstage/dev-utils': patch
+'@backstage/test-utils': patch
+'@backstage/plugin-airbrake': patch
+'@backstage/plugin-api-docs': patch
+'@backstage/plugin-azure-devops': patch
+'@backstage/plugin-badges': patch
+'@backstage/plugin-catalog': patch
+'@backstage/plugin-catalog-graph': patch
+'@backstage/plugin-catalog-import': patch
+'@backstage/plugin-catalog-react': patch
+'@backstage/plugin-circleci': patch
+'@backstage/plugin-cloudbuild': patch
+'@backstage/plugin-code-climate': patch
+'@backstage/plugin-code-coverage': patch
+'@backstage/plugin-explore': patch
+'@backstage/plugin-git-release-manager': patch
+'@backstage/plugin-github-actions': patch
+'@backstage/plugin-home': patch
+'@backstage/plugin-jenkins': patch
+'@backstage/plugin-kafka': patch
+'@backstage/plugin-org': patch
+'@backstage/plugin-permission-react': patch
+'@backstage/plugin-playlist': patch
+'@backstage/plugin-rollbar': patch
+'@backstage/plugin-scaffolder': patch
+'@backstage/plugin-search': patch
+'@backstage/plugin-search-react': patch
+'@backstage/plugin-sentry': patch
+'@backstage/plugin-shortcuts': patch
+'@backstage/plugin-techdocs': patch
+'@backstage/plugin-todo': patch
+'@backstage/plugin-user-settings': patch
+---
+
+Internal refactor to use `react-router-dom` rather than `react-router`.
diff --git a/packages/app-defaults/package.json b/packages/app-defaults/package.json
index 5b8e4da681..61eac23cc6 100644
--- a/packages/app-defaults/package.json
+++ b/packages/app-defaults/package.json
@@ -43,7 +43,6 @@
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
     "react-dom": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/packages/app/package.json b/packages/app/package.json
index e953838a2f..b7b75f83c2 100644
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -77,7 +77,6 @@
     "prop-types": "^15.7.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-router": "^6.3.0",
     "react-router-dom": "^6.3.0",
     "react-use": "^17.2.4",
     "zen-observable": "^0.10.0"
diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx
index 05ef61c11a..23bacfceec 100644
--- a/packages/app/src/App.tsx
+++ b/packages/app/src/App.tsx
@@ -86,7 +86,7 @@ import {
 import { AdvancedSettings } from './components/advancedSettings';
 import AlarmIcon from '@material-ui/icons/Alarm';
 import React from 'react';
-import { Navigate, Route } from 'react-router';
+import { Navigate, Route } from 'react-router-dom';
 import { apis } from './apis';
 import { entityPage } from './components/catalog/EntityPage';
 import { homePage } from './components/home/HomePage';
diff --git a/packages/core-components/package.json b/packages/core-components/package.json
index dc2bc08093..4a028e9dc3 100644
--- a/packages/core-components/package.json
+++ b/packages/core-components/package.json
@@ -74,7 +74,6 @@
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
     "react-dom": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/packages/core-components/src/components/Button/Button.test.tsx b/packages/core-components/src/components/Button/Button.test.tsx
index 805b3b3f10..c5942e3d78 100644
--- a/packages/core-components/src/components/Button/Button.test.tsx
+++ b/packages/core-components/src/components/Button/Button.test.tsx
@@ -18,7 +18,7 @@ import React from 'react';
 import { render, fireEvent, act } from '@testing-library/react';
 import { wrapInTestApp } from '@backstage/test-utils';
 import { Button } from './Button';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 
 describe('<Button />', () => {
   it('navigates using react-router', async () => {
diff --git a/packages/core-components/src/components/Link/Link.test.tsx b/packages/core-components/src/components/Link/Link.test.tsx
index d65351d840..3538b79052 100644
--- a/packages/core-components/src/components/Link/Link.test.tsx
+++ b/packages/core-components/src/components/Link/Link.test.tsx
@@ -23,7 +23,7 @@ import {
 } from '@backstage/test-utils';
 import { analyticsApiRef, configApiRef } from '@backstage/core-plugin-api';
 import { isExternalUri, Link, useResolvedPath } from './Link';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { renderHook, WrapperComponent } from '@testing-library/react-hooks';
 import { ConfigReader } from '@backstage/config';
 
diff --git a/packages/core-components/src/components/ProgressBars/GaugeCard.stories.tsx b/packages/core-components/src/components/ProgressBars/GaugeCard.stories.tsx
index 08c7813643..a0b6faea60 100644
--- a/packages/core-components/src/components/ProgressBars/GaugeCard.stories.tsx
+++ b/packages/core-components/src/components/ProgressBars/GaugeCard.stories.tsx
@@ -17,7 +17,7 @@
 import React, { PropsWithChildren } from 'react';
 import { GaugeCard } from './GaugeCard';
 import Grid from '@material-ui/core/Grid';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import Tooltip from '@material-ui/core/Tooltip';
 import Info from '@material-ui/icons/Info';
 
diff --git a/packages/core-components/src/components/TabbedLayout/RoutedTabs.test.tsx b/packages/core-components/src/components/TabbedLayout/RoutedTabs.test.tsx
index bbdb901f33..ec91208eee 100644
--- a/packages/core-components/src/components/TabbedLayout/RoutedTabs.test.tsx
+++ b/packages/core-components/src/components/TabbedLayout/RoutedTabs.test.tsx
@@ -17,7 +17,7 @@
 import { renderInTestApp } from '@backstage/test-utils';
 import { act, fireEvent } from '@testing-library/react';
 import React from 'react';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { RoutedTabs } from './RoutedTabs';
 
 const testRoute1 = {
diff --git a/packages/core-components/src/components/TabbedLayout/RoutedTabs.tsx b/packages/core-components/src/components/TabbedLayout/RoutedTabs.tsx
index 197cdb2239..2a0b0eae28 100644
--- a/packages/core-components/src/components/TabbedLayout/RoutedTabs.tsx
+++ b/packages/core-components/src/components/TabbedLayout/RoutedTabs.tsx
@@ -15,7 +15,12 @@
  */
 import React, { useMemo } from 'react';
 import { Helmet } from 'react-helmet';
-import { matchRoutes, useNavigate, useParams, useRoutes } from 'react-router';
+import {
+  matchRoutes,
+  useNavigate,
+  useParams,
+  useRoutes,
+} from 'react-router-dom';
 import { Content } from '../../layout/Content';
 import { HeaderTabs } from '../../layout/HeaderTabs';
 import { SubRoute } from './types';
diff --git a/packages/core-components/src/components/TabbedLayout/TabbedLayout.stories.tsx b/packages/core-components/src/components/TabbedLayout/TabbedLayout.stories.tsx
index 9686409c43..3047c6f226 100644
--- a/packages/core-components/src/components/TabbedLayout/TabbedLayout.stories.tsx
+++ b/packages/core-components/src/components/TabbedLayout/TabbedLayout.stories.tsx
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import React, { PropsWithChildren } from 'react';
-import { MemoryRouter, Route, Routes } from 'react-router';
+import { MemoryRouter, Route, Routes } from 'react-router-dom';
 import { TabbedLayout } from './TabbedLayout';
 
 export default {
diff --git a/packages/core-components/src/layout/ErrorPage/ErrorPage.tsx b/packages/core-components/src/layout/ErrorPage/ErrorPage.tsx
index 98a65673e3..9cfaac363e 100644
--- a/packages/core-components/src/layout/ErrorPage/ErrorPage.tsx
+++ b/packages/core-components/src/layout/ErrorPage/ErrorPage.tsx
@@ -19,7 +19,7 @@ import Grid from '@material-ui/core/Grid';
 import { makeStyles } from '@material-ui/core/styles';
 import Typography from '@material-ui/core/Typography';
 import React from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import { Link } from '../../components/Link';
 import { useSupportConfig } from '../../hooks';
 import { MicDrop } from './MicDrop';
diff --git a/packages/core-components/src/layout/InfoCard/InfoCard.stories.tsx b/packages/core-components/src/layout/InfoCard/InfoCard.stories.tsx
index a6509caaaf..0e136800ca 100644
--- a/packages/core-components/src/layout/InfoCard/InfoCard.stories.tsx
+++ b/packages/core-components/src/layout/InfoCard/InfoCard.stories.tsx
@@ -17,7 +17,7 @@
 import Grid from '@material-ui/core/Grid';
 import Typography from '@material-ui/core/Typography';
 import React, { PropsWithChildren } from 'react';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import { InfoCard, Props } from './InfoCard';
 
 export default {
diff --git a/packages/core-components/src/layout/ItemCard/ItemCard.stories.tsx b/packages/core-components/src/layout/ItemCard/ItemCard.stories.tsx
index 1d336fc5f5..f7df3d43cc 100644
--- a/packages/core-components/src/layout/ItemCard/ItemCard.stories.tsx
+++ b/packages/core-components/src/layout/ItemCard/ItemCard.stories.tsx
@@ -21,7 +21,7 @@ import CardContent from '@material-ui/core/CardContent';
 import CardMedia from '@material-ui/core/CardMedia';
 import Typography from '@material-ui/core/Typography';
 import React from 'react';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import { Button } from '../../components';
 import { ItemCardGrid } from './ItemCardGrid';
 import { ItemCardHeader } from './ItemCardHeader';
diff --git a/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx b/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx
index bfa841690d..9000c2f10b 100644
--- a/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx
+++ b/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx
@@ -26,7 +26,7 @@ import CloseIcon from '@material-ui/icons/Close';
 import MenuIcon from '@material-ui/icons/Menu';
 import { orderBy } from 'lodash';
 import React, { createContext, useEffect, useState, useContext } from 'react';
-import { useLocation } from 'react-router';
+import { useLocation } from 'react-router-dom';
 import { SidebarOpenStateProvider } from './SidebarOpenStateContext';
 import { SidebarGroup } from './SidebarGroup';
 import { SidebarConfigContext, SidebarConfig } from './config';
diff --git a/packages/core-components/src/layout/TabbedCard/TabbedCard.stories.tsx b/packages/core-components/src/layout/TabbedCard/TabbedCard.stories.tsx
index 77fff64fb5..6703fe25ce 100644
--- a/packages/core-components/src/layout/TabbedCard/TabbedCard.stories.tsx
+++ b/packages/core-components/src/layout/TabbedCard/TabbedCard.stories.tsx
@@ -16,7 +16,7 @@
 
 import Grid from '@material-ui/core/Grid';
 import React, { PropsWithChildren, useState } from 'react';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import { CardTab, TabbedCard } from './TabbedCard';
 
 const cardContentStyle = { height: 200, width: 500 };
diff --git a/packages/dev-utils/package.json b/packages/dev-utils/package.json
index cf1aec058e..1583b17f57 100644
--- a/packages/dev-utils/package.json
+++ b/packages/dev-utils/package.json
@@ -53,7 +53,6 @@
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
     "react-dom": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/packages/dev-utils/src/devApp/render.tsx b/packages/dev-utils/src/devApp/render.tsx
index 6fa73ba860..d2c91c9394 100644
--- a/packages/dev-utils/src/devApp/render.tsx
+++ b/packages/dev-utils/src/devApp/render.tsx
@@ -46,7 +46,7 @@ import { Box } from '@material-ui/core';
 import BookmarkIcon from '@material-ui/icons/Bookmark';
 import React, { ComponentType, ReactNode } from 'react';
 import ReactDOM from 'react-dom';
-import { createRoutesFromChildren, Route } from 'react-router';
+import { createRoutesFromChildren, Route } from 'react-router-dom';
 import { SidebarThemeSwitcher } from './SidebarThemeSwitcher';
 
 export function isReactRouterBeta(): boolean {
diff --git a/packages/techdocs-cli-embedded-app/package.json b/packages/techdocs-cli-embedded-app/package.json
index c37057523b..80e289b362 100644
--- a/packages/techdocs-cli-embedded-app/package.json
+++ b/packages/techdocs-cli-embedded-app/package.json
@@ -25,7 +25,6 @@
     "history": "^5.0.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-router": "^6.3.0",
     "react-router-dom": "^6.3.0",
     "react-use": "^17.2.4"
   },
diff --git a/packages/techdocs-cli-embedded-app/src/App.tsx b/packages/techdocs-cli-embedded-app/src/App.tsx
index 194d26943d..95675954e1 100644
--- a/packages/techdocs-cli-embedded-app/src/App.tsx
+++ b/packages/techdocs-cli-embedded-app/src/App.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { Navigate, Route } from 'react-router';
+import { Navigate, Route } from 'react-router-dom';
 
 import {
   DefaultTechDocsHome,
diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json
index 4a74b30975..acfc23c58c 100644
--- a/packages/test-utils/package.json
+++ b/packages/test-utils/package.json
@@ -52,7 +52,6 @@
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
     "react-dom": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/packages/test-utils/src/testUtils/appWrappers.test.tsx b/packages/test-utils/src/testUtils/appWrappers.test.tsx
index a116c8c781..19bdc15a48 100644
--- a/packages/test-utils/src/testUtils/appWrappers.test.tsx
+++ b/packages/test-utils/src/testUtils/appWrappers.test.tsx
@@ -26,7 +26,7 @@ import {
 import { withLogCollector } from './logCollector';
 import { render } from '@testing-library/react';
 import React, { useEffect } from 'react';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { MockErrorApi } from './apis';
 import { renderInTestApp, wrapInTestApp } from './appWrappers';
 import { TestApiProvider } from './TestApiProvider';
diff --git a/packages/test-utils/src/testUtils/appWrappers.tsx b/packages/test-utils/src/testUtils/appWrappers.tsx
index a19fe53301..6543f8b698 100644
--- a/packages/test-utils/src/testUtils/appWrappers.tsx
+++ b/packages/test-utils/src/testUtils/appWrappers.tsx
@@ -15,7 +15,7 @@
  */
 
 import React, { ComponentType, ReactNode, ReactElement } from 'react';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import { Route } from 'react-router-dom';
 import { lightTheme } from '@backstage/theme';
 import { ThemeProvider } from '@material-ui/core/styles';
diff --git a/plugins/airbrake/package.json b/plugins/airbrake/package.json
index a21a528790..7c6941d4c8 100644
--- a/plugins/airbrake/package.json
+++ b/plugins/airbrake/package.json
@@ -36,7 +36,7 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/app-defaults": "workspace:^",
diff --git a/plugins/airbrake/src/extensions.test.tsx b/plugins/airbrake/src/extensions.test.tsx
index fd41f36930..b24b7febf8 100644
--- a/plugins/airbrake/src/extensions.test.tsx
+++ b/plugins/airbrake/src/extensions.test.tsx
@@ -15,7 +15,7 @@
  */
 import React from 'react';
 import { EntityAirbrakeContent } from './extensions';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { renderInTestApp, TestApiProvider } from '@backstage/test-utils';
 import { airbrakeApiRef, MockAirbrakeApi } from './api';
 import { createEntity } from './api';
diff --git a/plugins/api-docs/package.json b/plugins/api-docs/package.json
index b8e336a058..1024dbe86b 100644
--- a/plugins/api-docs/package.json
+++ b/plugins/api-docs/package.json
@@ -52,7 +52,6 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/api-docs/src/components/ApiExplorerPage/ApiExplorerPage.test.tsx b/plugins/api-docs/src/components/ApiExplorerPage/ApiExplorerPage.test.tsx
index 760d1ab59d..99bcd308d2 100644
--- a/plugins/api-docs/src/components/ApiExplorerPage/ApiExplorerPage.test.tsx
+++ b/plugins/api-docs/src/components/ApiExplorerPage/ApiExplorerPage.test.tsx
@@ -16,7 +16,7 @@
 
 import React from 'react';
 import { renderInTestApp } from '@backstage/test-utils';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { ApiExplorerPage } from './ApiExplorerPage';
 
 jest.mock('react-router', () => ({
diff --git a/plugins/api-docs/src/components/ApiExplorerPage/ApiExplorerPage.tsx b/plugins/api-docs/src/components/ApiExplorerPage/ApiExplorerPage.tsx
index 68ab0a1647..1d5d3b359e 100644
--- a/plugins/api-docs/src/components/ApiExplorerPage/ApiExplorerPage.tsx
+++ b/plugins/api-docs/src/components/ApiExplorerPage/ApiExplorerPage.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import {
   DefaultApiExplorerPage,
   DefaultApiExplorerPageProps,
diff --git a/plugins/azure-devops/package.json b/plugins/azure-devops/package.json
index 876778a7fb..c4f82a7deb 100644
--- a/plugins/azure-devops/package.json
+++ b/plugins/azure-devops/package.json
@@ -44,7 +44,7 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/azure-devops/src/components/BuildTable/BuildTable.stories.tsx b/plugins/azure-devops/src/components/BuildTable/BuildTable.stories.tsx
index 63d646b06a..b4ce0b1664 100644
--- a/plugins/azure-devops/src/components/BuildTable/BuildTable.stories.tsx
+++ b/plugins/azure-devops/src/components/BuildTable/BuildTable.stories.tsx
@@ -21,7 +21,7 @@ import {
 } from '@backstage/plugin-azure-devops-common';
 
 import { BuildTable } from './BuildTable';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import React from 'react';
 
 export default {
diff --git a/plugins/azure-devops/src/components/PullRequestsPage/lib/PullRequestCard/PullRequestCard.stories.tsx b/plugins/azure-devops/src/components/PullRequestsPage/lib/PullRequestCard/PullRequestCard.stories.tsx
index b948b616bd..6e6630c943 100644
--- a/plugins/azure-devops/src/components/PullRequestsPage/lib/PullRequestCard/PullRequestCard.stories.tsx
+++ b/plugins/azure-devops/src/components/PullRequestsPage/lib/PullRequestCard/PullRequestCard.stories.tsx
@@ -22,7 +22,7 @@ import {
   PullRequestVoteStatus,
 } from '@backstage/plugin-azure-devops-common';
 
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import { PullRequestCard } from './PullRequestCard';
 import React from 'react';
 
diff --git a/plugins/badges/package.json b/plugins/badges/package.json
index e2da4e4081..7801227f43 100644
--- a/plugins/badges/package.json
+++ b/plugins/badges/package.json
@@ -42,7 +42,7 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/badges/src/api/BadgesClient.ts b/plugins/badges/src/api/BadgesClient.ts
index f63003dc90..9a89806d56 100644
--- a/plugins/badges/src/api/BadgesClient.ts
+++ b/plugins/badges/src/api/BadgesClient.ts
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { generatePath } from 'react-router';
+import { generatePath } from 'react-router-dom';
 import { ResponseError } from '@backstage/errors';
 import { Entity, DEFAULT_NAMESPACE } from '@backstage/catalog-model';
 import { BadgesApi, BadgeSpec } from './types';
diff --git a/plugins/catalog-graph/package.json b/plugins/catalog-graph/package.json
index 0ff298bf20..2a609f2eec 100644
--- a/plugins/catalog-graph/package.json
+++ b/plugins/catalog-graph/package.json
@@ -40,7 +40,7 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/catalog-graph/src/components/CatalogGraphCard/CatalogGraphCard.tsx b/plugins/catalog-graph/src/components/CatalogGraphCard/CatalogGraphCard.tsx
index 40ee90d784..34d3174cb3 100644
--- a/plugins/catalog-graph/src/components/CatalogGraphCard/CatalogGraphCard.tsx
+++ b/plugins/catalog-graph/src/components/CatalogGraphCard/CatalogGraphCard.tsx
@@ -29,7 +29,7 @@ import {
 import { makeStyles, Theme } from '@material-ui/core';
 import qs from 'qs';
 import React, { MouseEvent, useCallback } from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import { catalogGraphRouteRef } from '../../routes';
 import {
   ALL_RELATION_PAIRS,
diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/CatalogGraphPage.tsx b/plugins/catalog-graph/src/components/CatalogGraphPage/CatalogGraphPage.tsx
index 4a36d516e2..0e766c2887 100644
--- a/plugins/catalog-graph/src/components/CatalogGraphPage/CatalogGraphPage.tsx
+++ b/plugins/catalog-graph/src/components/CatalogGraphPage/CatalogGraphPage.tsx
@@ -32,7 +32,7 @@ import FilterListIcon from '@material-ui/icons/FilterList';
 import ZoomOutMap from '@material-ui/icons/ZoomOutMap';
 import { ToggleButton } from '@material-ui/lab';
 import React, { MouseEvent, useCallback } from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import {
   ALL_RELATION_PAIRS,
   Direction,
diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.test.ts b/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.test.ts
index d78a5b768c..c693a7788c 100644
--- a/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.test.ts
+++ b/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.test.ts
@@ -15,7 +15,7 @@
  */
 import { RELATION_MEMBER_OF } from '@backstage/catalog-model';
 import { act, renderHook } from '@testing-library/react-hooks';
-import { useLocation as useLocationMocked } from 'react-router';
+import { useLocation as useLocationMocked } from 'react-router-dom';
 import { Direction } from '../EntityRelationsGraph';
 import { useCatalogGraphPage } from './useCatalogGraphPage';
 
diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.ts b/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.ts
index 43da53c44a..aa6da6824d 100644
--- a/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.ts
+++ b/plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.ts
@@ -27,7 +27,7 @@ import {
   useMemo,
   useState,
 } from 'react';
-import { useLocation } from 'react-router';
+import { useLocation } from 'react-router-dom';
 import usePrevious from 'react-use/lib/usePrevious';
 import { Direction } from '../EntityRelationsGraph';
 
diff --git a/plugins/catalog-import/package.json b/plugins/catalog-import/package.json
index 47dcac4499..b2d2ce1b25 100644
--- a/plugins/catalog-import/package.json
+++ b/plugins/catalog-import/package.json
@@ -56,7 +56,7 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/catalog-import/src/components/ImportPage/ImportPage.test.tsx b/plugins/catalog-import/src/components/ImportPage/ImportPage.test.tsx
index a38b801607..8ec4a79bd5 100644
--- a/plugins/catalog-import/src/components/ImportPage/ImportPage.test.tsx
+++ b/plugins/catalog-import/src/components/ImportPage/ImportPage.test.tsx
@@ -21,7 +21,7 @@ import { catalogApiRef } from '@backstage/plugin-catalog-react';
 import { renderInTestApp, TestApiRegistry } from '@backstage/test-utils';
 import { screen } from '@testing-library/react';
 import React from 'react';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { catalogImportApiRef, CatalogImportClient } from '../../api';
 import { ImportPage } from './ImportPage';
 
diff --git a/plugins/catalog-import/src/components/ImportPage/ImportPage.tsx b/plugins/catalog-import/src/components/ImportPage/ImportPage.tsx
index 129e714952..0fc3b70b6c 100644
--- a/plugins/catalog-import/src/components/ImportPage/ImportPage.tsx
+++ b/plugins/catalog-import/src/components/ImportPage/ImportPage.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { DefaultImportPage } from '../DefaultImportPage';
 
 /**
diff --git a/plugins/catalog-react/package.json b/plugins/catalog-react/package.json
index e97f23c666..46bf3f7ddd 100644
--- a/plugins/catalog-react/package.json
+++ b/plugins/catalog-react/package.json
@@ -59,7 +59,7 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/catalog-react/src/components/InspectEntityDialog/components/AncestryPage.tsx b/plugins/catalog-react/src/components/InspectEntityDialog/components/AncestryPage.tsx
index 0423c0da44..90df738922 100644
--- a/plugins/catalog-react/src/components/InspectEntityDialog/components/AncestryPage.tsx
+++ b/plugins/catalog-react/src/components/InspectEntityDialog/components/AncestryPage.tsx
@@ -30,7 +30,7 @@ import { useApi, useRouteRef } from '@backstage/core-plugin-api';
 import { Box, DialogContentText, makeStyles } from '@material-ui/core';
 import classNames from 'classnames';
 import React, { useLayoutEffect, useRef, useState } from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import useAsync from 'react-use/lib/useAsync';
 import { catalogApiRef } from '../../../api';
 import { humanizeEntityRef } from '../../EntityRefLink';
diff --git a/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx b/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx
index b77c7f5619..da27c61dcb 100644
--- a/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx
+++ b/plugins/catalog-react/src/hooks/useEntityListProvider.test.tsx
@@ -28,7 +28,7 @@ import { MockStorageApi, TestApiProvider } from '@backstage/test-utils';
 import { act, renderHook } from '@testing-library/react-hooks';
 import qs from 'qs';
 import React, { PropsWithChildren } from 'react';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import { catalogApiRef } from '../api';
 import { starredEntitiesApiRef, MockStarredEntitiesApi } from '../apis';
 import { EntityKindPicker, UserListPicker } from '../components';
diff --git a/plugins/catalog-react/src/hooks/useEntityListProvider.tsx b/plugins/catalog-react/src/hooks/useEntityListProvider.tsx
index 089701d8b4..b5dfb4d8f7 100644
--- a/plugins/catalog-react/src/hooks/useEntityListProvider.tsx
+++ b/plugins/catalog-react/src/hooks/useEntityListProvider.tsx
@@ -25,7 +25,7 @@ import React, {
   useMemo,
   useState,
 } from 'react';
-import { useLocation } from 'react-router';
+import { useLocation } from 'react-router-dom';
 import useAsyncFn from 'react-use/lib/useAsyncFn';
 import useDebounce from 'react-use/lib/useDebounce';
 import useMountedState from 'react-use/lib/useMountedState';
diff --git a/plugins/catalog/package.json b/plugins/catalog/package.json
index f9df6df956..8164eecd76 100644
--- a/plugins/catalog/package.json
+++ b/plugins/catalog/package.json
@@ -57,7 +57,7 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/catalog/src/components/CatalogEntityPage/CatalogEntityPage.tsx b/plugins/catalog/src/components/CatalogEntityPage/CatalogEntityPage.tsx
index fe32e78959..57e407e185 100644
--- a/plugins/catalog/src/components/CatalogEntityPage/CatalogEntityPage.tsx
+++ b/plugins/catalog/src/components/CatalogEntityPage/CatalogEntityPage.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { Outlet } from 'react-router';
+import { Outlet } from 'react-router-dom';
 import { AsyncEntityProvider } from '@backstage/plugin-catalog-react';
 import { useEntityFromUrl } from './useEntityFromUrl';
 
diff --git a/plugins/catalog/src/components/CatalogEntityPage/useEntityFromUrl.ts b/plugins/catalog/src/components/CatalogEntityPage/useEntityFromUrl.ts
index f4d06b0bb2..c014f4c815 100644
--- a/plugins/catalog/src/components/CatalogEntityPage/useEntityFromUrl.ts
+++ b/plugins/catalog/src/components/CatalogEntityPage/useEntityFromUrl.ts
@@ -25,7 +25,7 @@ import {
   entityRouteRef,
 } from '@backstage/plugin-catalog-react';
 import { useEffect } from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 
 export const useEntityFromUrl = (): EntityLoadingStatus => {
diff --git a/plugins/catalog/src/components/CatalogPage/CatalogPage.test.tsx b/plugins/catalog/src/components/CatalogPage/CatalogPage.test.tsx
index 5b80f5976c..7c14bd22a9 100644
--- a/plugins/catalog/src/components/CatalogPage/CatalogPage.test.tsx
+++ b/plugins/catalog/src/components/CatalogPage/CatalogPage.test.tsx
@@ -17,7 +17,7 @@
 import React from 'react';
 import { renderInTestApp } from '@backstage/test-utils';
 import { screen } from '@testing-library/react';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { CatalogPage } from './CatalogPage';
 
 jest.mock('react-router', () => ({
diff --git a/plugins/catalog/src/components/CatalogPage/CatalogPage.tsx b/plugins/catalog/src/components/CatalogPage/CatalogPage.tsx
index 155bcc05df..c9caf009b2 100644
--- a/plugins/catalog/src/components/CatalogPage/CatalogPage.tsx
+++ b/plugins/catalog/src/components/CatalogPage/CatalogPage.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import {
   DefaultCatalogPage,
   DefaultCatalogPageProps,
diff --git a/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx b/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx
index 2295034905..a190984ffe 100644
--- a/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx
+++ b/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx
@@ -47,7 +47,7 @@ import {
 import { Box, TabProps } from '@material-ui/core';
 import { Alert } from '@material-ui/lab';
 import React, { useEffect, useState } from 'react';
-import { useLocation, useNavigate } from 'react-router';
+import { useLocation, useNavigate } from 'react-router-dom';
 import { EntityContextMenu } from '../EntityContextMenu/EntityContextMenu';
 
 /** @public */
diff --git a/plugins/catalog/src/components/EntityOrphanWarning/EntityOrphanWarning.tsx b/plugins/catalog/src/components/EntityOrphanWarning/EntityOrphanWarning.tsx
index 26b0e5de45..253cfb23fe 100644
--- a/plugins/catalog/src/components/EntityOrphanWarning/EntityOrphanWarning.tsx
+++ b/plugins/catalog/src/components/EntityOrphanWarning/EntityOrphanWarning.tsx
@@ -18,7 +18,7 @@ import { Entity } from '@backstage/catalog-model';
 import { useEntity } from '@backstage/plugin-catalog-react';
 import { Alert } from '@material-ui/lab';
 import React, { useState } from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import { DeleteEntityDialog } from './DeleteEntityDialog';
 import { useRouteRef } from '@backstage/core-plugin-api';
 import { rootRouteRef } from '../../routes';
diff --git a/plugins/circleci/package.json b/plugins/circleci/package.json
index 67e55c7258..c873d7dae9 100644
--- a/plugins/circleci/package.json
+++ b/plugins/circleci/package.json
@@ -49,7 +49,6 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/circleci/src/components/Router.tsx b/plugins/circleci/src/components/Router.tsx
index 09c74dbbe8..33e7d43dee 100644
--- a/plugins/circleci/src/components/Router.tsx
+++ b/plugins/circleci/src/components/Router.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { Routes, Route } from 'react-router';
+import { Routes, Route } from 'react-router-dom';
 import { circleCIBuildRouteRef } from '../route-refs';
 import { BuildWithStepsPage } from './BuildWithStepsPage/';
 import { BuildsPage } from './BuildsPage';
diff --git a/plugins/cloudbuild/package.json b/plugins/cloudbuild/package.json
index f4d5acb2f5..7c585a989d 100644
--- a/plugins/cloudbuild/package.json
+++ b/plugins/cloudbuild/package.json
@@ -47,7 +47,6 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/cloudbuild/src/components/Router.tsx b/plugins/cloudbuild/src/components/Router.tsx
index 6ac025fef1..2041416cfc 100644
--- a/plugins/cloudbuild/src/components/Router.tsx
+++ b/plugins/cloudbuild/src/components/Router.tsx
@@ -16,7 +16,7 @@
 import React from 'react';
 import { Entity } from '@backstage/catalog-model';
 import { useEntity } from '@backstage/plugin-catalog-react';
-import { Routes, Route } from 'react-router';
+import { Routes, Route } from 'react-router-dom';
 import { buildRouteRef } from '../routes';
 import { WorkflowRunDetails } from './WorkflowRunDetails';
 import { WorkflowRunsTable } from './WorkflowRunsTable';
diff --git a/plugins/code-climate/package.json b/plugins/code-climate/package.json
index ec5181f430..edb3253a18 100644
--- a/plugins/code-climate/package.json
+++ b/plugins/code-climate/package.json
@@ -36,7 +36,7 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/code-coverage/package.json b/plugins/code-coverage/package.json
index 9544ab9074..8eeb595f04 100644
--- a/plugins/code-coverage/package.json
+++ b/plugins/code-coverage/package.json
@@ -41,7 +41,6 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/explore/package.json b/plugins/explore/package.json
index e73e2d9c4d..7e8ad56447 100644
--- a/plugins/explore/package.json
+++ b/plugins/explore/package.json
@@ -51,7 +51,6 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/explore/src/components/ExplorePage/ExplorePage.test.tsx b/plugins/explore/src/components/ExplorePage/ExplorePage.test.tsx
index 561d09a873..ed3c54e370 100644
--- a/plugins/explore/src/components/ExplorePage/ExplorePage.test.tsx
+++ b/plugins/explore/src/components/ExplorePage/ExplorePage.test.tsx
@@ -16,7 +16,7 @@
 
 import { renderInTestApp } from '@backstage/test-utils';
 import React from 'react';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { ExplorePage } from './ExplorePage';
 
 jest.mock('react-router', () => ({
diff --git a/plugins/explore/src/components/ExplorePage/ExplorePage.tsx b/plugins/explore/src/components/ExplorePage/ExplorePage.tsx
index 80fe3febec..728f95cd8b 100644
--- a/plugins/explore/src/components/ExplorePage/ExplorePage.tsx
+++ b/plugins/explore/src/components/ExplorePage/ExplorePage.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { DefaultExplorePage } from '../DefaultExplorePage';
 
 export const ExplorePage = () => {
diff --git a/plugins/git-release-manager/package.json b/plugins/git-release-manager/package.json
index a65f027810..812e24e01a 100644
--- a/plugins/git-release-manager/package.json
+++ b/plugins/git-release-manager/package.json
@@ -39,7 +39,7 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/git-release-manager/src/features/RepoDetailsForm/Owner.tsx b/plugins/git-release-manager/src/features/RepoDetailsForm/Owner.tsx
index 08f8ddeadb..fc48dbb43c 100644
--- a/plugins/git-release-manager/src/features/RepoDetailsForm/Owner.tsx
+++ b/plugins/git-release-manager/src/features/RepoDetailsForm/Owner.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import useAsync from 'react-use/lib/useAsync';
 import {
   FormControl,
diff --git a/plugins/git-release-manager/src/features/RepoDetailsForm/Repo.tsx b/plugins/git-release-manager/src/features/RepoDetailsForm/Repo.tsx
index c4a338bdf2..a2c01ee717 100644
--- a/plugins/git-release-manager/src/features/RepoDetailsForm/Repo.tsx
+++ b/plugins/git-release-manager/src/features/RepoDetailsForm/Repo.tsx
@@ -16,7 +16,7 @@
 
 import React from 'react';
 import useAsync from 'react-use/lib/useAsync';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import {
   FormControl,
   FormHelperText,
diff --git a/plugins/git-release-manager/src/features/RepoDetailsForm/VersioningStrategy.tsx b/plugins/git-release-manager/src/features/RepoDetailsForm/VersioningStrategy.tsx
index 11b7fc2f8e..605d461b1d 100644
--- a/plugins/git-release-manager/src/features/RepoDetailsForm/VersioningStrategy.tsx
+++ b/plugins/git-release-manager/src/features/RepoDetailsForm/VersioningStrategy.tsx
@@ -15,7 +15,7 @@
  */
 
 import React, { useEffect } from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import {
   FormControl,
   FormControlLabel,
diff --git a/plugins/git-release-manager/src/hooks/useQueryHandler.ts b/plugins/git-release-manager/src/hooks/useQueryHandler.ts
index 408136c0e7..d62b0b6220 100644
--- a/plugins/git-release-manager/src/hooks/useQueryHandler.ts
+++ b/plugins/git-release-manager/src/hooks/useQueryHandler.ts
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useLocation } from 'react-router';
+import { useLocation } from 'react-router-dom';
 import qs from 'qs';
 
 import { Project } from '../contexts/ProjectContext';
diff --git a/plugins/github-actions/package.json b/plugins/github-actions/package.json
index c3b0d023e4..7b25a18999 100644
--- a/plugins/github-actions/package.json
+++ b/plugins/github-actions/package.json
@@ -49,7 +49,6 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/github-actions/src/components/Router.tsx b/plugins/github-actions/src/components/Router.tsx
index d8b8a87d38..14c36a93fd 100644
--- a/plugins/github-actions/src/components/Router.tsx
+++ b/plugins/github-actions/src/components/Router.tsx
@@ -17,7 +17,7 @@
 import React from 'react';
 import { Entity } from '@backstage/catalog-model';
 import { useEntity } from '@backstage/plugin-catalog-react';
-import { Routes, Route } from 'react-router';
+import { Routes, Route } from 'react-router-dom';
 import { buildRouteRef } from '../routes';
 import { WorkflowRunDetails } from './WorkflowRunDetails';
 import { WorkflowRunsTable } from './WorkflowRunsTable';
diff --git a/plugins/home/package.json b/plugins/home/package.json
index d6d20ebf49..762ca2c2c9 100644
--- a/plugins/home/package.json
+++ b/plugins/home/package.json
@@ -49,7 +49,7 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/home/src/components/HomepageCompositionRoot.tsx b/plugins/home/src/components/HomepageCompositionRoot.tsx
index f2c5ad0e8b..4d7678b8e5 100644
--- a/plugins/home/src/components/HomepageCompositionRoot.tsx
+++ b/plugins/home/src/components/HomepageCompositionRoot.tsx
@@ -15,7 +15,7 @@
  */
 
 import React, { ReactNode } from 'react';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 
 export const HomepageCompositionRoot = (props: {
   title?: string;
diff --git a/plugins/jenkins/package.json b/plugins/jenkins/package.json
index 16f1a3a1b9..23542a778c 100644
--- a/plugins/jenkins/package.json
+++ b/plugins/jenkins/package.json
@@ -48,7 +48,6 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/jenkins/src/components/Router.tsx b/plugins/jenkins/src/components/Router.tsx
index ef86203e9e..af13575c62 100644
--- a/plugins/jenkins/src/components/Router.tsx
+++ b/plugins/jenkins/src/components/Router.tsx
@@ -18,7 +18,7 @@ import { Entity } from '@backstage/catalog-model';
 import { MissingAnnotationEmptyState } from '@backstage/core-components';
 import { useEntity } from '@backstage/plugin-catalog-react';
 import React from 'react';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { JENKINS_ANNOTATION, LEGACY_JENKINS_ANNOTATION } from '../constants';
 import { buildRouteRef } from '../plugin';
 import { CITable } from './BuildsPage/lib/CITable';
diff --git a/plugins/kafka/package.json b/plugins/kafka/package.json
index 83be1238b3..92b99342d1 100644
--- a/plugins/kafka/package.json
+++ b/plugins/kafka/package.json
@@ -37,7 +37,7 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/kafka/src/Router.tsx b/plugins/kafka/src/Router.tsx
index af6d2d7ef8..d367c55991 100644
--- a/plugins/kafka/src/Router.tsx
+++ b/plugins/kafka/src/Router.tsx
@@ -16,7 +16,7 @@
 
 import { Entity } from '@backstage/catalog-model';
 import React from 'react';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { useEntity } from '@backstage/plugin-catalog-react';
 import { KAFKA_CONSUMER_GROUP_ANNOTATION } from './constants';
 import { KafkaTopicsForConsumer } from './components/ConsumerGroupOffsets/ConsumerGroupOffsets';
diff --git a/plugins/org/package.json b/plugins/org/package.json
index f6a846d201..f5951c7926 100644
--- a/plugins/org/package.json
+++ b/plugins/org/package.json
@@ -43,7 +43,6 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/org/src/components/Cards/Group/MembersList/MembersListCard.stories.tsx b/plugins/org/src/components/Cards/Group/MembersList/MembersListCard.stories.tsx
index 32fcb0e0d3..073f892302 100644
--- a/plugins/org/src/components/Cards/Group/MembersList/MembersListCard.stories.tsx
+++ b/plugins/org/src/components/Cards/Group/MembersList/MembersListCard.stories.tsx
@@ -19,7 +19,7 @@ import { catalogApiRef, EntityProvider } from '@backstage/plugin-catalog-react';
 import { TestApiProvider } from '@backstage/test-utils';
 import { Grid } from '@material-ui/core';
 import React from 'react';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import { MembersListCard } from './MembersListCard';
 
 export default {
diff --git a/plugins/permission-react/package.json b/plugins/permission-react/package.json
index 933ae51cf9..7b14f3154d 100644
--- a/plugins/permission-react/package.json
+++ b/plugins/permission-react/package.json
@@ -41,7 +41,7 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/permission-react/src/components/PermissionedRoute.tsx b/plugins/permission-react/src/components/PermissionedRoute.tsx
index 004a623031..793c25ecc0 100644
--- a/plugins/permission-react/src/components/PermissionedRoute.tsx
+++ b/plugins/permission-react/src/components/PermissionedRoute.tsx
@@ -15,7 +15,7 @@
  */
 
 import React, { ReactElement, ReactNode } from 'react';
-import { Route } from 'react-router';
+import { Route } from 'react-router-dom';
 import { useApp } from '@backstage/core-plugin-api';
 import { usePermission } from '../hooks';
 import {
diff --git a/plugins/playlist/package.json b/plugins/playlist/package.json
index 0f5e28fdc7..7bcc9f22e8 100644
--- a/plugins/playlist/package.json
+++ b/plugins/playlist/package.json
@@ -48,7 +48,6 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/playlist/src/components/Router/Router.tsx b/plugins/playlist/src/components/Router/Router.tsx
index 5791a0817c..e153c83416 100644
--- a/plugins/playlist/src/components/Router/Router.tsx
+++ b/plugins/playlist/src/components/Router/Router.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { Routes, Route } from 'react-router';
+import { Routes, Route } from 'react-router-dom';
 
 import { playlistRouteRef } from '../../routes';
 import { PlaylistIndexPage } from '../PlaylistIndexPage';
diff --git a/plugins/playlist/src/hooks/usePlaylistList.test.tsx b/plugins/playlist/src/hooks/usePlaylistList.test.tsx
index d04996513e..9b4b0ca0fc 100644
--- a/plugins/playlist/src/hooks/usePlaylistList.test.tsx
+++ b/plugins/playlist/src/hooks/usePlaylistList.test.tsx
@@ -25,7 +25,7 @@ import { TestApiProvider } from '@backstage/test-utils';
 import { act, renderHook } from '@testing-library/react-hooks';
 import qs from 'qs';
 import React, { PropsWithChildren } from 'react';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import { PlaylistApi, playlistApiRef } from '../api';
 import {
   DefaultSortCompareFunctions,
diff --git a/plugins/playlist/src/hooks/usePlaylistList.tsx b/plugins/playlist/src/hooks/usePlaylistList.tsx
index 93c0becbfd..69f712413b 100644
--- a/plugins/playlist/src/hooks/usePlaylistList.tsx
+++ b/plugins/playlist/src/hooks/usePlaylistList.tsx
@@ -26,7 +26,7 @@ import React, {
   useMemo,
   useState,
 } from 'react';
-import { useLocation } from 'react-router';
+import { useLocation } from 'react-router-dom';
 import useAsyncFn from 'react-use/lib/useAsyncFn';
 import useDebounce from 'react-use/lib/useDebounce';
 import useMountedState from 'react-use/lib/useMountedState';
diff --git a/plugins/rollbar/package.json b/plugins/rollbar/package.json
index eb296b61ef..b981c8c0a9 100644
--- a/plugins/rollbar/package.json
+++ b/plugins/rollbar/package.json
@@ -47,7 +47,6 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/rollbar/src/components/Router.tsx b/plugins/rollbar/src/components/Router.tsx
index 9cd63e74aa..aa86904248 100644
--- a/plugins/rollbar/src/components/Router.tsx
+++ b/plugins/rollbar/src/components/Router.tsx
@@ -17,7 +17,7 @@
 import { Entity } from '@backstage/catalog-model';
 import { useEntity } from '@backstage/plugin-catalog-react';
 import React from 'react';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { ROLLBAR_ANNOTATION } from '../constants';
 import { EntityPageRollbar } from './EntityPageRollbar/EntityPageRollbar';
 import { MissingAnnotationEmptyState } from '@backstage/core-components';
diff --git a/plugins/scaffolder/package.json b/plugins/scaffolder/package.json
index 8f477df6dd..81578ede65 100644
--- a/plugins/scaffolder/package.json
+++ b/plugins/scaffolder/package.json
@@ -81,7 +81,6 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/scaffolder/src/components/Router.tsx b/plugins/scaffolder/src/components/Router.tsx
index d35bcbc67a..644b26eeb8 100644
--- a/plugins/scaffolder/src/components/Router.tsx
+++ b/plugins/scaffolder/src/components/Router.tsx
@@ -15,7 +15,7 @@
  */
 
 import React, { ComponentType, useEffect } from 'react';
-import { Navigate, Route, Routes, useOutlet } from 'react-router';
+import { Navigate, Route, Routes, useOutlet } from 'react-router-dom';
 import { Entity } from '@backstage/catalog-model';
 import { TemplateEntityV1beta3 } from '@backstage/plugin-scaffolder-common';
 import { ScaffolderPage } from './ScaffolderPage';
diff --git a/plugins/scaffolder/src/components/ScaffolderPage/ScaffolderPageContextMenu.tsx b/plugins/scaffolder/src/components/ScaffolderPage/ScaffolderPageContextMenu.tsx
index 74366753f7..9e69fae68d 100644
--- a/plugins/scaffolder/src/components/ScaffolderPage/ScaffolderPageContextMenu.tsx
+++ b/plugins/scaffolder/src/components/ScaffolderPage/ScaffolderPageContextMenu.tsx
@@ -27,7 +27,7 @@ import Edit from '@material-ui/icons/Edit';
 import List from '@material-ui/icons/List';
 import MoreVert from '@material-ui/icons/MoreVert';
 import React, { useState } from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import {
   actionsRouteRef,
   editRouteRef,
diff --git a/plugins/scaffolder/src/components/TaskPage/TaskPage.tsx b/plugins/scaffolder/src/components/TaskPage/TaskPage.tsx
index 0267c58fe1..699ce119fb 100644
--- a/plugins/scaffolder/src/components/TaskPage/TaskPage.tsx
+++ b/plugins/scaffolder/src/components/TaskPage/TaskPage.tsx
@@ -45,7 +45,7 @@ import classNames from 'classnames';
 import { DateTime, Interval } from 'luxon';
 import qs from 'qs';
 import React, { memo, useEffect, useMemo, useState } from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import useInterval from 'react-use/lib/useInterval';
 import {
   rootRouteRef,
diff --git a/plugins/scaffolder/src/components/TemplatePage/TemplatePage.test.tsx b/plugins/scaffolder/src/components/TemplatePage/TemplatePage.test.tsx
index 5b16c21364..0535df5ef4 100644
--- a/plugins/scaffolder/src/components/TemplatePage/TemplatePage.test.tsx
+++ b/plugins/scaffolder/src/components/TemplatePage/TemplatePage.test.tsx
@@ -21,7 +21,7 @@ import {
 } from '@backstage/test-utils';
 import { act, fireEvent, screen, within } from '@testing-library/react';
 import React from 'react';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { scaffolderApiRef } from '../../api';
 import { ScaffolderApi } from '../../types';
 import { rootRouteRef } from '../../routes';
diff --git a/plugins/scaffolder/src/components/TemplatePage/TemplatePage.tsx b/plugins/scaffolder/src/components/TemplatePage/TemplatePage.tsx
index cfe7992ab1..e5dcc5d9bf 100644
--- a/plugins/scaffolder/src/components/TemplatePage/TemplatePage.tsx
+++ b/plugins/scaffolder/src/components/TemplatePage/TemplatePage.tsx
@@ -17,7 +17,7 @@ import { LinearProgress } from '@material-ui/core';
 import { IChangeEvent } from '@rjsf/core';
 import qs from 'qs';
 import React, { ComponentType, useCallback, useContext, useState } from 'react';
-import { Navigate, useNavigate } from 'react-router';
+import { Navigate, useNavigate } from 'react-router-dom';
 import useAsync from 'react-use/lib/useAsync';
 import { scaffolderApiRef } from '../../api';
 import { FieldExtensionOptions } from '../../extensions';
diff --git a/plugins/scaffolder/src/next/Router/Router.tsx b/plugins/scaffolder/src/next/Router/Router.tsx
index 0fc1c9eceb..9ca1e39681 100644
--- a/plugins/scaffolder/src/next/Router/Router.tsx
+++ b/plugins/scaffolder/src/next/Router/Router.tsx
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import React, { PropsWithChildren } from 'react';
-import { Routes, Route, useOutlet } from 'react-router';
+import { Routes, Route, useOutlet } from 'react-router-dom';
 import { TemplateListPage } from '../TemplateListPage';
 import { TemplateWizardPage } from '../TemplateWizardPage';
 import {
diff --git a/plugins/scaffolder/src/next/TemplateWizardPage/TemplateWizardPage.tsx b/plugins/scaffolder/src/next/TemplateWizardPage/TemplateWizardPage.tsx
index 79ba9d33c9..31a5808233 100644
--- a/plugins/scaffolder/src/next/TemplateWizardPage/TemplateWizardPage.tsx
+++ b/plugins/scaffolder/src/next/TemplateWizardPage/TemplateWizardPage.tsx
@@ -23,7 +23,7 @@ import {
   MarkdownContent,
 } from '@backstage/core-components';
 import { NextFieldExtensionOptions } from '../../extensions';
-import { Navigate, useNavigate } from 'react-router';
+import { Navigate, useNavigate } from 'react-router-dom';
 import { stringifyEntityRef } from '@backstage/catalog-model';
 import {
   AnalyticsContext,
diff --git a/plugins/search-react/package.json b/plugins/search-react/package.json
index 4b785425e6..8696be8d67 100644
--- a/plugins/search-react/package.json
+++ b/plugins/search-react/package.json
@@ -47,7 +47,7 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.stories.tsx b/plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.stories.tsx
index 3b54e69a19..a790c12a8a 100644
--- a/plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.stories.tsx
+++ b/plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.stories.tsx
@@ -22,7 +22,7 @@ import { ThemeProvider } from '@material-ui/core/styles';
 import FindInPageIcon from '@material-ui/icons/FindInPage';
 import GroupIcon from '@material-ui/icons/Group';
 import React from 'react';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 import { DefaultResultListItem } from './DefaultResultListItem';
 
 export default {
diff --git a/plugins/search-react/src/components/SearchResult/SearchResult.stories.tsx b/plugins/search-react/src/components/SearchResult/SearchResult.stories.tsx
index 4b8d9bbdd4..6f536510e8 100644
--- a/plugins/search-react/src/components/SearchResult/SearchResult.stories.tsx
+++ b/plugins/search-react/src/components/SearchResult/SearchResult.stories.tsx
@@ -15,7 +15,7 @@
  */
 
 import React, { ComponentType } from 'react';
-import { MemoryRouter } from 'react-router';
+import { MemoryRouter } from 'react-router-dom';
 
 import { List, ListItem } from '@material-ui/core';
 import DefaultIcon from '@material-ui/icons/InsertDriveFile';
diff --git a/plugins/search/package.json b/plugins/search/package.json
index 22816502db..90cd463d43 100644
--- a/plugins/search/package.json
+++ b/plugins/search/package.json
@@ -52,7 +52,6 @@
   "peerDependencies": {
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/search/src/components/SearchPage/SearchPage.test.tsx b/plugins/search/src/components/SearchPage/SearchPage.test.tsx
index 459a541cbd..2237233fe3 100644
--- a/plugins/search/src/components/SearchPage/SearchPage.test.tsx
+++ b/plugins/search/src/components/SearchPage/SearchPage.test.tsx
@@ -16,7 +16,7 @@
 
 import { renderInTestApp } from '@backstage/test-utils';
 import React from 'react';
-import { useLocation } from 'react-router';
+import { useLocation } from 'react-router-dom';
 import { useSearch } from '@backstage/plugin-search-react';
 import { SearchPage } from './SearchPage';
 
diff --git a/plugins/search/src/components/SearchPage/SearchPage.tsx b/plugins/search/src/components/SearchPage/SearchPage.tsx
index f267918e12..3ee444bd32 100644
--- a/plugins/search/src/components/SearchPage/SearchPage.tsx
+++ b/plugins/search/src/components/SearchPage/SearchPage.tsx
@@ -17,7 +17,7 @@
 import React, { useEffect } from 'react';
 import usePrevious from 'react-use/lib/usePrevious';
 import qs from 'qs';
-import { useLocation, useOutlet } from 'react-router';
+import { useLocation, useOutlet } from 'react-router-dom';
 import {
   SearchContextProvider,
   useSearch,
diff --git a/plugins/sentry/package.json b/plugins/sentry/package.json
index 10dea70837..6dd3129e8c 100644
--- a/plugins/sentry/package.json
+++ b/plugins/sentry/package.json
@@ -48,7 +48,7 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/sentry/src/components/Router.tsx b/plugins/sentry/src/components/Router.tsx
index e683a6c7fa..766a3eaa14 100644
--- a/plugins/sentry/src/components/Router.tsx
+++ b/plugins/sentry/src/components/Router.tsx
@@ -16,7 +16,7 @@
 
 import React from 'react';
 import { Entity } from '@backstage/catalog-model';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { SentryIssuesWidget } from './SentryIssuesWidget';
 
 /** @public */
diff --git a/plugins/shortcuts/package.json b/plugins/shortcuts/package.json
index 2dc07cc170..003f15f2b8 100644
--- a/plugins/shortcuts/package.json
+++ b/plugins/shortcuts/package.json
@@ -38,7 +38,7 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/shortcuts/src/AddShortcut.tsx b/plugins/shortcuts/src/AddShortcut.tsx
index 7c1c5ca118..e4b1ba84ce 100644
--- a/plugins/shortcuts/src/AddShortcut.tsx
+++ b/plugins/shortcuts/src/AddShortcut.tsx
@@ -15,7 +15,7 @@
  */
 
 import React, { useState } from 'react';
-import { useLocation } from 'react-router';
+import { useLocation } from 'react-router-dom';
 import { SubmitHandler } from 'react-hook-form';
 import {
   Button,
diff --git a/plugins/techdocs/package.json b/plugins/techdocs/package.json
index 30dd181c02..e88356137e 100644
--- a/plugins/techdocs/package.json
+++ b/plugins/techdocs/package.json
@@ -61,7 +61,7 @@
     "@types/react": "^16.13.1 || ^17.0.0",
     "react": "^16.13.1 || ^17.0.0",
     "react-dom": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0",
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0",
     "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
diff --git a/plugins/techdocs/src/home/components/TechDocsIndexPage.test.tsx b/plugins/techdocs/src/home/components/TechDocsIndexPage.test.tsx
index 1d018eec70..70ea4dfed7 100644
--- a/plugins/techdocs/src/home/components/TechDocsIndexPage.test.tsx
+++ b/plugins/techdocs/src/home/components/TechDocsIndexPage.test.tsx
@@ -16,7 +16,7 @@
 
 import React from 'react';
 import { renderInTestApp } from '@backstage/test-utils';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { TechDocsIndexPage } from './TechDocsIndexPage';
 
 jest.mock('react-router', () => ({
diff --git a/plugins/techdocs/src/home/components/TechDocsIndexPage.tsx b/plugins/techdocs/src/home/components/TechDocsIndexPage.tsx
index 743f3e05d6..b5c568cd76 100644
--- a/plugins/techdocs/src/home/components/TechDocsIndexPage.tsx
+++ b/plugins/techdocs/src/home/components/TechDocsIndexPage.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { TableColumn, TableProps } from '@backstage/core-components';
 import { UserListFilterKind } from '@backstage/plugin-catalog-react';
 import { DefaultTechDocsHome } from './DefaultTechDocsHome';
diff --git a/plugins/techdocs/src/search/components/TechDocsSearch.tsx b/plugins/techdocs/src/search/components/TechDocsSearch.tsx
index aa56229d74..56b51af795 100644
--- a/plugins/techdocs/src/search/components/TechDocsSearch.tsx
+++ b/plugins/techdocs/src/search/components/TechDocsSearch.tsx
@@ -23,7 +23,7 @@ import {
 } from '@backstage/plugin-search-react';
 import { makeStyles, Paper } from '@material-ui/core';
 import React, { useEffect, useState } from 'react';
-import { useNavigate } from 'react-router';
+import { useNavigate } from 'react-router-dom';
 import { TechDocsSearchResultListItem } from './TechDocsSearchResultListItem';
 
 const useStyles = makeStyles(theme => ({
diff --git a/plugins/todo/package.json b/plugins/todo/package.json
index 9d2720b5b4..0ca4ae6b2a 100644
--- a/plugins/todo/package.json
+++ b/plugins/todo/package.json
@@ -42,7 +42,7 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/todo/src/plugin.test.tsx b/plugins/todo/src/plugin.test.tsx
index 40dfdfbff2..571a41e657 100644
--- a/plugins/todo/src/plugin.test.tsx
+++ b/plugins/todo/src/plugin.test.tsx
@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { Route, Routes } from 'react-router';
+import { Route, Routes } from 'react-router-dom';
 import { renderInTestApp, TestApiProvider } from '@backstage/test-utils';
 import { todoPlugin, EntityTodoContent } from './plugin';
 import { todoApiRef } from './api';
diff --git a/plugins/user-settings/package.json b/plugins/user-settings/package.json
index c19d3725cc..04fa53848a 100644
--- a/plugins/user-settings/package.json
+++ b/plugins/user-settings/package.json
@@ -47,7 +47,7 @@
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0",
-    "react-router": "6.0.0-beta.0 || ^6.3.0"
+    "react-router-dom": "6.0.0-beta.0 || ^6.3.0"
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
diff --git a/plugins/user-settings/src/components/DefaultSettingsPage/DefaultSettingsPage.test.tsx b/plugins/user-settings/src/components/DefaultSettingsPage/DefaultSettingsPage.test.tsx
index d4560bdd06..9001d22451 100644
--- a/plugins/user-settings/src/components/DefaultSettingsPage/DefaultSettingsPage.test.tsx
+++ b/plugins/user-settings/src/components/DefaultSettingsPage/DefaultSettingsPage.test.tsx
@@ -18,7 +18,7 @@ import React from 'react';
 import { renderWithEffects, wrapInTestApp } from '@backstage/test-utils';
 import { DefaultSettingsPage } from './DefaultSettingsPage';
 import { UserSettingsTab } from '../UserSettingsTab';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { SettingsLayout } from '../SettingsLayout';
 
 jest.mock('react-router', () => ({
diff --git a/plugins/user-settings/src/components/SettingsPage/SettingsPage.test.tsx b/plugins/user-settings/src/components/SettingsPage/SettingsPage.test.tsx
index b6277f0b59..27d368bdbe 100644
--- a/plugins/user-settings/src/components/SettingsPage/SettingsPage.test.tsx
+++ b/plugins/user-settings/src/components/SettingsPage/SettingsPage.test.tsx
@@ -18,7 +18,7 @@ import React from 'react';
 import { renderWithEffects, wrapInTestApp } from '@backstage/test-utils';
 import { SettingsPage } from './SettingsPage';
 import { UserSettingsTab } from '../UserSettingsTab';
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import { SettingsLayout } from '../SettingsLayout';
 import { screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
diff --git a/plugins/user-settings/src/components/SettingsPage/SettingsPage.tsx b/plugins/user-settings/src/components/SettingsPage/SettingsPage.tsx
index eec386d60e..db21f6068d 100644
--- a/plugins/user-settings/src/components/SettingsPage/SettingsPage.tsx
+++ b/plugins/user-settings/src/components/SettingsPage/SettingsPage.tsx
@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { useOutlet } from 'react-router';
+import { useOutlet } from 'react-router-dom';
 import React from 'react';
 import { DefaultSettingsPage } from '../DefaultSettingsPage';
 import { useElementFilter } from '@backstage/core-plugin-api';