[Shared UX] Adoption of Shared UX Route component (#150357)

## Summary

This PR removes all imports of Route from react-router-dom and
'@kbn/kibana-react-plugin/public' and instead imports Route from
@kbn/shared-ux-router.

### Context
Based on
https://github.com/elastic/kibana/issues/132629#issue-1243243678 This PR
executes steps 2 - 4:

> 2. To make the transition easier, we want to re-export other
react-router-dom exports alongside the modified' Route'.
> 3. Solutions should start using that Route component in place of the
one from react-router-dom. I.e. replace all occurrences of import { ...
} from 'react-router-dom' with import { ... } from
'@kbn/shared-ux-router'.
> 4. All manual calls to useExecutionContext are not needed anymore and
should be removed.

### Future PR

Looks like this might be getting worked on in:
https://github.com/elastic/kibana/pull/145863 (thanks!)

> Introduce an ESlint rule that ensures that react-router-dom is not
used directly in Kibana and that imports go through the new
@kbn/shared-ux-router package.

This is tangentially accomplished through
https://github.com/elastic/kibana/pull/150340 but only addresses using
Route through @kbn/kibana-react-plugin/public'


### Checklist

Delete any items that are not applicable to this PR.

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Tiago Costa <tiagoffcc@hotmail.com>

.eslintrc.js

@@ -249,6 +249,16 @@ const RESTRICTED_IMPORTS = [
     name: 'react-use',
     message: 'Please use react-use/lib/{method} instead.',
   },
+  {
+    name: 'react-router-dom',
+    importNames: ['Route'],
+    message: 'Please use @kbn/shared-ux-router instead',
+  },
+  {
+    name: '@kbn/kibana-react-plugin/public',
+    importNames: ['Route'],
+    message: 'Please use @kbn/shared-ux-router instead',
+  },
 ];
 
 module.exports = {

examples/bfetch_explorer/public/containers/app/index.tsx

@@ -7,7 +7,8 @@
  */
 
 import React from 'react';
-import { BrowserRouter as Router, Route, Redirect, Switch } from 'react-router-dom';
+import { BrowserRouter as Router, Redirect, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { EuiPage } from '@elastic/eui';
 import { useDeps } from '../../hooks/use_deps';
 import { Sidebar } from './sidebar';

examples/bfetch_explorer/tsconfig.json

@@ -18,5 +18,6 @@
     "@kbn/developer-examples-plugin",
     "@kbn/bfetch-plugin",
     "@kbn/kibana-react-plugin",
+    "@kbn/shared-ux-router",
   ]
 }

examples/embeddable_explorer/public/app.tsx

@@ -8,8 +8,8 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { BrowserRouter as Router, Route, withRouter, RouteComponentProps } from 'react-router-dom';
-
+import { BrowserRouter as Router, withRouter, RouteComponentProps } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { EuiPage, EuiPageSideBar_Deprecated as EuiPageSideBar, EuiSideNav } from '@elastic/eui';
 
 import { EmbeddableStart } from '@kbn/embeddable-plugin/public';

examples/embeddable_explorer/tsconfig.json

@@ -20,5 +20,6 @@
     "@kbn/inspector-plugin",
     "@kbn/embeddable-examples-plugin",
     "@kbn/developer-examples-plugin",
+    "@kbn/shared-ux-router",
   ]
 }

examples/guided_onboarding_example/public/components/app.tsx

@@ -8,7 +8,8 @@
 
 import React from 'react';
 import { FormattedMessage, I18nProvider } from '@kbn/i18n-react';
-import { Router, Switch, Route } from 'react-router-dom';
+import { Router, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 
 import {
   EuiPage,

examples/guided_onboarding_example/tsconfig.json

@@ -16,6 +16,7 @@
     "@kbn/i18n-react",
     "@kbn/i18n",
     "@kbn/guided-onboarding",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

examples/locator_examples/public/app.tsx

@@ -12,7 +12,8 @@ import ReactDOM from 'react-dom';
 import { EuiPageBody } from '@elastic/eui';
 import { EuiPageContent_Deprecated as EuiPageContent } from '@elastic/eui';
 import { EuiPageContentBody_Deprecated as EuiPageContentBody } from '@elastic/eui';
-import { Route, Switch, Redirect, Router, useLocation } from 'react-router-dom';
+import { Switch, Redirect, Router, useLocation } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { createBrowserHistory } from 'history';
 import { EuiText } from '@elastic/eui';
 import { AppMountParameters } from '@kbn/core/public';

examples/locator_examples/tsconfig.json

@@ -18,5 +18,6 @@
     "@kbn/share-plugin",
     "@kbn/utility-types",
     "@kbn/kibana-utils-plugin",
+    "@kbn/shared-ux-router",
   ]
 }

examples/response_stream/public/containers/app/index.tsx

@@ -7,7 +7,8 @@
  */
 
 import React from 'react';
-import { BrowserRouter as Router, Route, Redirect, Switch } from 'react-router-dom';
+import { BrowserRouter as Router, Redirect, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { EuiPage } from '@elastic/eui';
 import { useDeps } from '../../hooks/use_deps';
 import { Sidebar } from './sidebar';

examples/response_stream/tsconfig.json

@@ -21,5 +21,6 @@
     "@kbn/kibana-react-plugin",
     "@kbn/aiops-utils",
     "@kbn/config-schema",
+    "@kbn/shared-ux-router",
   ]
 }

examples/search_examples/public/application.tsx

@@ -8,7 +8,8 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Route, Redirect } from 'react-router-dom';
+import { Router, Redirect } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { I18nProvider } from '@kbn/i18n-react';
 import { AppMountParameters, CoreStart } from '@kbn/core/public';
 import { RedirectAppLinks } from '@kbn/kibana-react-plugin/public';

examples/search_examples/tsconfig.json

@@ -31,5 +31,6 @@
     "@kbn/i18n",
     "@kbn/core-mount-utils-browser-internal",
     "@kbn/config-schema",
+    "@kbn/shared-ux-router",
   ]
 }

examples/state_containers_examples/public/todo/todo.tsx

@@ -7,7 +7,8 @@
  */
 
 import React, { useEffect, useMemo } from 'react';
-import { Link, Route, Router, Switch, useLocation } from 'react-router-dom';
+import { Link, Router, Switch, useLocation } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { History } from 'history';
 import {
   EuiButton,

examples/state_containers_examples/tsconfig.json

@@ -22,5 +22,6 @@
     "@kbn/data-views-plugin",
     "@kbn/developer-examples-plugin",
     "@kbn/es-query",
+    "@kbn/shared-ux-router",
   ]
 }

packages/core/application/core-application-browser-internal/src/ui/app_router.tsx

@@ -7,7 +7,8 @@
  */
 
 import React, { FunctionComponent, useMemo } from 'react';
-import { Route, RouteComponentProps, Router, Switch } from 'react-router-dom';
+// eslint-disable-next-line no-restricted-imports
+import { RouteComponentProps, Router, Route, Switch } from 'react-router-dom';
 import { History } from 'history';
 import { EMPTY, Observable } from 'rxjs';
 import useObservable from 'react-use/lib/useObservable';

packages/kbn-test-jest-helpers/src/router_helpers.tsx

@@ -7,7 +7,8 @@
  */
 
 import React, { Component, ComponentType } from 'react';
-import { MemoryRouter, Route, withRouter } from 'react-router-dom';
+import { MemoryRouter, withRouter } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { History, LocationDescriptor } from 'history';
 
 const stringifyPath = (path: LocationDescriptor): string => {

packages/kbn-test-jest-helpers/tsconfig.json

@@ -11,6 +11,7 @@
   "kbn_references": [
     "@kbn/i18n-react",
     "@kbn/axe-config",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

packages/shared-ux/router/impl/router.tsx

@@ -8,6 +8,7 @@
 
 import React, { useMemo } from 'react';
 import {
+  // eslint-disable-next-line no-restricted-imports
   Route as ReactRouterRoute,
   RouteComponentProps,
   RouteProps,

src/plugins/advanced_settings/public/management_app/mount_management_section.tsx

@@ -8,7 +8,8 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Switch, Route, Redirect, RouteChildrenProps } from 'react-router-dom';
+import { Router, Switch, Redirect, RouteChildrenProps } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 
 import { i18n } from '@kbn/i18n';
 import { I18nProvider } from '@kbn/i18n-react';

src/plugins/advanced_settings/tsconfig.json

@@ -20,6 +20,7 @@
     "@kbn/i18n-react",
     "@kbn/expect",
     "@kbn/monaco",
+    "@kbn/shared-ux-router",
     "@kbn/core-ui-settings-browser-mocks",
     "@kbn/core-application-browser",
     "@kbn/core-ui-settings-browser",

src/plugins/dashboard/public/dashboard_app/dashboard_router.tsx

@@ -12,7 +12,8 @@ import React from 'react';
 import { History } from 'history';
 import { parse, ParsedQuery } from 'query-string';
 import { render, unmountComponentAtNode } from 'react-dom';
-import { Switch, Route, RouteComponentProps, HashRouter, Redirect } from 'react-router-dom';
+import { Switch, RouteComponentProps, HashRouter, Redirect } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 
 import {
   TableListViewKibanaDependencies,

src/plugins/dashboard/tsconfig.json

@@ -52,6 +52,7 @@
     "@kbn/task-manager-plugin",
     "@kbn/core-execution-context-common",
     "@kbn/core-custom-branding-browser",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

src/plugins/data_view_management/public/management_app/mount_management_section.tsx

@@ -8,7 +8,8 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Switch, Route, Redirect } from 'react-router-dom';
+import { Router, Switch, Redirect } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 
 import { i18n } from '@kbn/i18n';
 import { I18nProvider } from '@kbn/i18n-react';

src/plugins/data_view_management/tsconfig.json

@@ -32,6 +32,7 @@
     "@kbn/shared-ux-link-redirect-app",
     "@kbn/utility-types-jest",
     "@kbn/config-schema",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

src/plugins/dev_tools/public/application.tsx

@@ -9,13 +9,8 @@
 import React, { useEffect, useRef } from 'react';
 import { Observable } from 'rxjs';
 import ReactDOM from 'react-dom';
-import {
-  HashRouter as Router,
-  Switch,
-  Route,
-  Redirect,
-  RouteComponentProps,
-} from 'react-router-dom';
+import { HashRouter as Router, Switch, Redirect, RouteComponentProps } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { EuiTab, EuiTabs, EuiToolTip, EuiBetaBadge } from '@elastic/eui';
 import { I18nProvider } from '@kbn/i18n-react';
 import { i18n } from '@kbn/i18n';
@@ -28,7 +23,7 @@ import type {
   CoreTheme,
   ExecutionContextStart,
 } from '@kbn/core/public';
-import { KibanaThemeProvider, useExecutionContext } from '@kbn/kibana-react-plugin/public';
+import { KibanaThemeProvider } from '@kbn/kibana-react-plugin/public';
 import type { DocTitleService, BreadcrumbService } from './services';
 
 import { DevToolApp } from './dev_tool';
@@ -79,11 +74,6 @@ function DevToolsWrapper({
     breadcrumbService.setBreadcrumbs(activeDevTool.title);
   }, [activeDevTool, docTitleService, breadcrumbService]);
 
-  useExecutionContext(appServices.executionContext, {
-    type: 'application',
-    page: activeDevTool.id,
-  });
-
   return (
     <main className="devApp">
       <EuiTabs style={{ paddingLeft: euiThemeVars.euiSizeS }} size="l">

src/plugins/dev_tools/tsconfig.json

@@ -12,6 +12,7 @@
     "@kbn/i18n",
     "@kbn/ui-theme",
     "@kbn/kibana-react-plugin",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

src/plugins/discover/public/application/discover_router.test.tsx

@@ -7,7 +7,8 @@
  */
 import React from 'react';
 import { shallow } from 'enzyme';
-import { Route, RouteProps } from 'react-router-dom';
+import { RouteProps } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { createSearchSessionMock } from '../__mocks__/search_session';
 import { discoverServiceMock as mockDiscoverServices } from '../__mocks__/services';
 import { discoverRouter } from './discover_router';

src/plugins/discover/public/application/discover_router.tsx

@@ -6,7 +6,8 @@
  * Side Public License, v 1.
  */
 
-import { Redirect, Route, Router, Switch } from 'react-router-dom';
+import { Redirect, Router, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import React from 'react';
 import { History } from 'history';
 import { EuiErrorBoundary } from '@elastic/eui';

src/plugins/discover/tsconfig.json

@@ -52,6 +52,7 @@
     "@kbn/rison",
     "@kbn/config-schema",
     "@kbn/storybook",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

src/plugins/files_management/public/mount_management_section.tsx

@@ -8,7 +8,8 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Route } from 'react-router-dom';
+import { Router } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { toMountPoint } from '@kbn/kibana-react-plugin/public';
 import { I18nProvider, FormattedRelative } from '@kbn/i18n-react';
 import type { CoreStart } from '@kbn/core/public';

src/plugins/files_management/tsconfig.json

@@ -13,6 +13,7 @@
     "@kbn/kibana-react-plugin",
     "@kbn/i18n-react",
     "@kbn/shared-ux-file-image",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

src/plugins/home/public/application/components/home_app.js

@@ -12,6 +12,7 @@ import PropTypes from 'prop-types';
 import { Home } from './home';
 import { TutorialDirectory } from './tutorial_directory';
 import { Tutorial } from './tutorial/tutorial';
+// eslint-disable-next-line no-restricted-imports
 import { HashRouter as Router, Switch, Route, Redirect } from 'react-router-dom';
 import { getTutorial } from '../load_tutorials';
 import { replaceTemplateStrings } from './tutorial/replace_template_strings';

src/plugins/kibana_overview/public/components/app.tsx

@@ -9,7 +9,8 @@
 import React, { useEffect, useState } from 'react';
 import { Observable } from 'rxjs';
 import { I18nProvider } from '@kbn/i18n-react';
-import { HashRouter as Router, Switch, Route } from 'react-router-dom';
+import { HashRouter as Router, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { CoreStart } from '@kbn/core/public';
 import { NavigationPublicPluginStart } from '@kbn/navigation-plugin/public';
 import { FetchResult } from '@kbn/newsfeed-plugin/public';

src/plugins/kibana_overview/tsconfig.json

@@ -25,6 +25,7 @@
     "@kbn/shared-ux-page-analytics-no-data",
     "@kbn/shared-ux-avatar-solution",
     "@kbn/shared-ux-link-redirect-app",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

src/plugins/kibana_react/public/router/router.tsx

@@ -8,6 +8,7 @@
 
 import React, { useMemo } from 'react';
 import {
+  // eslint-disable-next-line no-restricted-imports
   Route as ReactRouterRoute,
   RouteComponentProps,
   RouteProps,

src/plugins/management/public/components/management_app/management_router.tsx

@@ -7,7 +7,8 @@
  */
 
 import React, { memo } from 'react';
-import { Route, Router, Switch, Redirect } from 'react-router-dom';
+import { Router, Switch, Redirect } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { AppMountParameters, ChromeBreadcrumb, ScopedHistory } from '@kbn/core/public';
 import { ManagementAppWrapper } from '../management_app_wrapper';
 import { ManagementLandingPage } from '../landing';

src/plugins/management/tsconfig.json

@@ -19,6 +19,7 @@
     "@kbn/i18n",
     "@kbn/i18n-react",
     "@kbn/shared-ux-page-kibana-template",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

src/plugins/saved_objects_management/public/management_section/mount_section.tsx

@@ -8,7 +8,8 @@
 
 import React, { lazy, Suspense } from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Switch, Route } from 'react-router-dom';
+import { Router, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { I18nProvider } from '@kbn/i18n-react';
 import { i18n } from '@kbn/i18n';
 import { EuiLoadingSpinner } from '@elastic/eui';

src/plugins/saved_objects_management/tsconfig.json

@@ -26,6 +26,7 @@
     "@kbn/config-schema",
     "@kbn/core-custom-branding-browser-mocks",
     "@kbn/core-custom-branding-browser",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

src/plugins/visualizations/public/visualize_app/app.tsx

@@ -8,7 +8,8 @@
 
 import './app.scss';
 import React, { useEffect, useCallback, useState } from 'react';
-import { Route, Switch, useLocation } from 'react-router-dom';
+import { Switch, useLocation } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { EuiLoadingSpinner } from '@elastic/eui';
 import { AppMountParameters, CoreStart } from '@kbn/core/public';
 import type { DataViewEditorStart } from '@kbn/data-view-editor-plugin/public';

src/plugins/visualizations/tsconfig.json

@@ -50,6 +50,7 @@
     "@kbn/core-overlays-browser",
     "@kbn/config-schema",
     "@kbn/usage-collection-plugin",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

test/common/fixtures/plugins/coverage/kibana.json

@@ -0,0 +1,8 @@
+{
+  "id": "coverageFixtures",
+  "owner": { "name": "Kibana Operations", "githubTeam": "kibana-operations" },
+  "version": "kibana",
+  "server": false,
+  "ui": true
+}
+

test/common/fixtures/plugins/coverage/public/index.ts

@@ -0,0 +1,13 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { CodeCoverageReportingPlugin } from './plugin';
+
+export function plugin() {
+  return new CodeCoverageReportingPlugin();
+}

test/common/fixtures/plugins/coverage/public/plugin.ts

@@ -0,0 +1,32 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { Plugin } from '@kbn/core/server';
+
+declare global {
+  interface Window {
+    __coverage__: any;
+    flushCoverageToLog: any;
+  }
+}
+
+export class CodeCoverageReportingPlugin implements Plugin {
+  constructor() {}
+
+  public start() {}
+
+  public setup() {
+    window.flushCoverageToLog = function () {
+      if (window.__coverage__) {
+        // eslint-disable-next-line no-console
+        console.log('coveragejson:' + btoa(JSON.stringify(window.__coverage__)));
+      }
+    };
+    window.addEventListener('beforeunload', window.flushCoverageToLog);
+  }
+}

test/plugin_functional/plugins/core_history_block/public/app.tsx

@@ -8,6 +8,7 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom';
+// eslint-disable-next-line no-restricted-imports
 import { Router, Switch, Route, Prompt } from 'react-router-dom';
 import type { AppMountParameters, IBasePath, ApplicationStart } from '@kbn/core/public';
 import { RedirectAppLinks } from '@kbn/kibana-react-plugin/public';

test/plugin_functional/plugins/core_plugin_a/public/application.tsx

@@ -9,7 +9,8 @@
 import { History } from 'history';
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Route, withRouter, RouteComponentProps, Redirect } from 'react-router-dom';
+import { Router, withRouter, RouteComponentProps, Redirect } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 
 import {
   EuiPage,

test/plugin_functional/plugins/core_plugin_a/tsconfig.json

@@ -14,6 +14,7 @@
     "target/**/*",
   ],
   "kbn_references": [
-    "@kbn/core"
+    "@kbn/core",
+    "@kbn/shared-ux-router"
   ]
 }

test/plugin_functional/plugins/core_plugin_b/public/application.tsx

@@ -9,7 +9,8 @@
 import { History } from 'history';
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Route, withRouter, RouteComponentProps } from 'react-router-dom';
+import { Router, withRouter, RouteComponentProps } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 
 import {
   EuiPage,

test/plugin_functional/plugins/core_plugin_b/tsconfig.json

@@ -17,5 +17,6 @@
     "@kbn/core",
     "@kbn/core-plugin-a-plugin",
     "@kbn/config-schema",
+    "@kbn/shared-ux-router",
   ]
 }

test/plugin_functional/plugins/core_plugin_chromeless/public/application.tsx

@@ -8,7 +8,8 @@
 
 import React from 'react';
 import { render, unmountComponentAtNode } from 'react-dom';
-import { BrowserRouter as Router, Route } from 'react-router-dom';
+import { BrowserRouter as Router } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import {
   EuiPage,
   EuiPageBody,

test/plugin_functional/plugins/core_plugin_chromeless/tsconfig.json

@@ -14,5 +14,6 @@
   ],
   "kbn_references": [
     "@kbn/core",
+    "@kbn/shared-ux-router",
   ]
 }

test/plugin_functional/plugins/core_plugin_deep_links/public/application.tsx

@@ -9,7 +9,8 @@
 import { History } from 'history';
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Route, withRouter, RouteComponentProps, Redirect } from 'react-router-dom';
+import { Router, withRouter, RouteComponentProps, Redirect } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 
 import {
   EuiPage,

test/plugin_functional/plugins/core_plugin_deep_links/tsconfig.json

@@ -13,6 +13,7 @@
     "target/**/*",
   ],
   "kbn_references": [
-    "@kbn/core"
+    "@kbn/core",
+    "@kbn/shared-ux-router"
   ]
 }

test/plugin_functional/plugins/management_test_plugin/public/plugin.tsx

@@ -8,7 +8,9 @@
 
 import * as React from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Switch, Route, Link } from 'react-router-dom';
+import { Router, Switch, Link } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
+
 import { CoreSetup, Plugin } from '@kbn/core/public';
 import { ManagementSetup } from '@kbn/management-plugin/public';
 

test/plugin_functional/plugins/management_test_plugin/tsconfig.json

@@ -15,5 +15,6 @@
   "kbn_references": [
     "@kbn/core",
     "@kbn/management-plugin",
+    "@kbn/shared-ux-router",
   ]
 }

x-pack/examples/alerting_example/public/application.tsx

@@ -7,7 +7,8 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { BrowserRouter as Router, Route, RouteComponentProps } from 'react-router-dom';
+import { BrowserRouter as Router, RouteComponentProps } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { EuiPage } from '@elastic/eui';
 import { AppMountParameters, CoreStart } from '@kbn/core/public';
 

x-pack/examples/alerting_example/tsconfig.json

@@ -25,6 +25,7 @@
     "@kbn/developer-examples-plugin",
     "@kbn/i18n",
     "@kbn/core-application-common",
+    "@kbn/shared-ux-router",
     "@kbn/config-schema",
   ]
 }

x-pack/examples/reporting_example/public/application.tsx

@@ -7,7 +7,8 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Router, Route, Switch } from 'react-router-dom';
+import { Router, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { AppMountParameters, CoreStart } from '@kbn/core/public';
 import { KibanaThemeProvider } from '@kbn/kibana-react-plugin/public';
 import { CaptureTest } from './containers/capture_test';

x-pack/examples/reporting_example/tsconfig.json

@@ -24,5 +24,6 @@
     "@kbn/share-plugin",
     "@kbn/i18n-react",
     "@kbn/utility-types",
+    "@kbn/shared-ux-router",
   ]
 }

x-pack/examples/triggers_actions_ui_example/public/application.tsx

@@ -7,7 +7,8 @@
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { BrowserRouter as Router, Route } from 'react-router-dom';
+import { BrowserRouter as Router } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { EuiPage, EuiTitle, EuiText, EuiSpacer } from '@elastic/eui';
 import { AppMountParameters, CoreStart } from '@kbn/core/public';
 import { TriggersAndActionsUIPublicPluginStart } from '@kbn/triggers-actions-ui-plugin/public';

x-pack/examples/triggers_actions_ui_example/tsconfig.json

@@ -22,5 +22,6 @@
     "@kbn/rule-data-utils",
     "@kbn/data-plugin",
     "@kbn/i18n-react",
+    "@kbn/shared-ux-router",
   ]
 }

x-pack/plugins/apm/public/components/routing/app_root.tsx

@@ -19,7 +19,7 @@ import {
 import { RouteRenderer, RouterProvider } from '@kbn/typed-react-router-config';
 import { euiDarkVars, euiLightVars } from '@kbn/ui-theme';
 import React from 'react';
-import { Route } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { DefaultTheme, ThemeProvider } from 'styled-components';
 import { AnomalyDetectionJobsContextProvider } from '../../context/anomaly_detection_jobs/anomaly_detection_jobs_context';
 import {

x-pack/plugins/apm/tsconfig.json

@@ -78,6 +78,7 @@
     "@kbn/core-elasticsearch-server",
     "@kbn/shared-ux-prompt-not-found",
     "@kbn/core-saved-objects-api-server",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

x-pack/plugins/canvas/public/routes/home/home_route.tsx

@@ -5,7 +5,8 @@
  * 2.0.
  */
 import React from 'react';
-import { Route } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
+
 import { HomeApp } from '../../components/home_app';
 
 export const HomeRoute = () => (

x-pack/plugins/canvas/public/routes/index.tsx

@@ -6,7 +6,8 @@
  */
 
 import React, { FC } from 'react';
-import { Router, Switch, Route, RouteComponentProps, Redirect } from 'react-router-dom';
+import { Router, Switch, RouteComponentProps, Redirect } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { History } from 'history';
 import { parse, stringify } from 'query-string';
 import { HomeRoute } from './home';

x-pack/plugins/canvas/public/routes/workpad/workpad_route.tsx

@@ -6,7 +6,8 @@
  */
 
 import React, { FC, useEffect, useCallback } from 'react';
-import { Route, Switch, Redirect, useParams } from 'react-router-dom';
+import { Switch, Redirect, useParams } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { useDispatch } from 'react-redux';
 import { WorkpadApp } from '../../components/workpad_app';
 import { ExportApp } from '../../components/export_app';

x-pack/plugins/canvas/tsconfig.json

@@ -76,6 +76,7 @@
     "@kbn/storybook",
     "@kbn/core-apps-server-internal",
     "@kbn/flot-charts",
+    "@kbn/shared-ux-router",
     "@kbn/babel-register",
   ],
   "exclude": [

x-pack/plugins/cases/public/application.tsx

@@ -8,6 +8,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { Router } from 'react-router-dom';
+
 import { I18nProvider } from '@kbn/i18n-react';
 import { EuiErrorBoundary } from '@elastic/eui';
 

x-pack/plugins/cases/public/components/app/routes.tsx

@@ -7,7 +7,8 @@
 
 import React, { lazy, Suspense, useCallback } from 'react';
 import { Redirect, Switch } from 'react-router-dom';
-import { Route } from '@kbn/kibana-react-plugin/public';
+import { Route } from '@kbn/shared-ux-router';
+
 import { QueryClientProvider } from '@tanstack/react-query';
 import { EuiLoadingSpinner } from '@elastic/eui';
 import { AllCases } from '../all_cases';

x-pack/plugins/cases/tsconfig.json

@@ -55,6 +55,7 @@
     "@kbn/core-saved-objects-api-server",
     "@kbn/core-saved-objects-base-server-mocks",
     "@kbn/core-saved-objects-utils-server",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

x-pack/plugins/cloud_defend/public/test/test_provider.tsx

@@ -8,7 +8,8 @@
 import type { AppMountParameters, CoreStart } from '@kbn/core/public';
 import React, { useMemo } from 'react';
 import { I18nProvider } from '@kbn/i18n-react';
-import { Router, Switch, Route } from 'react-router-dom';
+import { Router, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { coreMock } from '@kbn/core/public/mocks';
 import { dataPluginMock } from '@kbn/data-plugin/public/mocks';

x-pack/plugins/cloud_defend/tsconfig.json

@@ -17,7 +17,8 @@
     "@kbn/data-plugin",
     "@kbn/kibana-react-plugin",
     "@kbn/monaco",
-    "@kbn/i18n"
+    "@kbn/i18n",
+    "@kbn/shared-ux-router"
   ],
   "exclude": [
     "target/**/*",

x-pack/plugins/cloud_security_posture/public/application/csp_route.tsx

@@ -6,7 +6,8 @@
  */
 
 import React from 'react';
-import { Route, type RouteProps } from 'react-router-dom';
+import { type RouteProps } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { TrackApplicationView } from '@kbn/usage-collection-plugin/public';
 import { cloudPosturePages } from '../common/navigation/constants';
 import { useSecuritySolutionContext } from './security_solution_context';

x-pack/plugins/cloud_security_posture/public/application/csp_router.tsx

@@ -7,7 +7,8 @@
 
 import React from 'react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { Redirect, Route, Switch } from 'react-router-dom';
+import { Redirect, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { benchmarksNavigation, cloudPosturePages } from '../common/navigation/constants';
 import type { CspSecuritySolutionContext } from '..';
 import { SecuritySolutionContext } from './security_solution_context';

x-pack/plugins/cloud_security_posture/public/pages/findings/findings.tsx

@@ -5,7 +5,8 @@
  * 2.0.
  */
 import React from 'react';
-import { Redirect, Switch, Route, useLocation } from 'react-router-dom';
+import { Redirect, Switch, useLocation } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { TrackApplicationView } from '@kbn/usage-collection-plugin/public';
 import { useCspSetupStatusApi } from '../../common/api/use_setup_status_api';
 import { NoFindingsStates } from '../../components/no_findings_states';

x-pack/plugins/cloud_security_posture/public/pages/findings/latest_findings_by_resource/findings_by_resource_container.tsx

@@ -5,7 +5,8 @@
  * 2.0.
  */
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
 import { EuiFlexGroup, EuiFlexItem, EuiSpacer } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { TrackApplicationView } from '@kbn/usage-collection-plugin/public';

x-pack/plugins/cloud_security_posture/public/test/test_provider.tsx

@@ -8,7 +8,9 @@
 import type { AppMountParameters, CoreStart } from '@kbn/core/public';
 import React, { useMemo } from 'react';
 import { I18nProvider } from '@kbn/i18n-react';
-import { Router, Switch, Route } from 'react-router-dom';
+import { Router, Switch } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
+
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { coreMock } from '@kbn/core/public/mocks';
 import { dataPluginMock } from '@kbn/data-plugin/public/mocks';

x-pack/plugins/cloud_security_posture/tsconfig.json

@@ -46,6 +46,7 @@
     "@kbn/core-elasticsearch-server",
     "@kbn/ecs",
     "@kbn/core-saved-objects-api-server",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

x-pack/plugins/cross_cluster_replication/public/app/app.tsx

@@ -6,7 +6,9 @@
  */
 
 import React, { Component } from 'react';
-import { Route, Switch, Router, Redirect } from 'react-router-dom';
+import { Switch, Router, Redirect } from 'react-router-dom';
+import { Route } from '@kbn/shared-ux-router';
+
 import { ScopedHistory, ApplicationStart } from '@kbn/core/public';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';

x-pack/plugins/cross_cluster_replication/public/app/sections/home/home.js

@@ -6,6 +6,7 @@
  */
 
 import React, { PureComponent } from 'react';
+// eslint-disable-next-line no-restricted-imports
 import { Route, Switch } from 'react-router-dom';
 import { FormattedMessage } from '@kbn/i18n-react';
 

x-pack/plugins/cross_cluster_replication/tsconfig.json

@@ -28,6 +28,7 @@
     "@kbn/analytics",
     "@kbn/test-jest-helpers",
     "@kbn/config-schema",
+    "@kbn/shared-ux-router",
   ],
   "exclude": [
     "target/**/*",

x-pack/plugins/enterprise_search/public/applications/analytics/index.tsx

@@ -6,7 +6,9 @@
  */
 
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
+
+import { Route } from '@kbn/shared-ux-router';
 
 import { isVersionMismatch } from '../../../common/is_version_mismatch';
 import { InitialAppData } from '../../../common/types';

x-pack/plugins/enterprise_search/public/applications/app_search/components/analytics/analytics_router.test.tsx

@@ -9,10 +9,12 @@ import '../../__mocks__/engine_logic.mock';
 
 import React from 'react';
 
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
 
 import { shallow } from 'enzyme';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { AnalyticsRouter } from '.';
 
 describe('AnalyticsRouter', () => {

x-pack/plugins/enterprise_search/public/applications/app_search/components/analytics/analytics_router.tsx

@@ -6,7 +6,9 @@
  */
 
 import React from 'react';
-import { Route, Switch, Redirect } from 'react-router-dom';
+import { Switch, Redirect } from 'react-router-dom';
+
+import { Route } from '@kbn/shared-ux-router';
 
 import {
   ENGINE_ANALYTICS_PATH,

x-pack/plugins/enterprise_search/public/applications/app_search/components/crawler/crawler_router.tsx

@@ -6,10 +6,12 @@
  */
 
 import React, { useEffect } from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
 
 import { useActions } from 'kea';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { ENGINE_CRAWLER_DOMAIN_PATH, ENGINE_CRAWLER_PATH } from '../../routes';
 
 import { CrawlerLogic } from './crawler_logic';

x-pack/plugins/enterprise_search/public/applications/app_search/components/curations/curations_router.test.tsx

@@ -8,10 +8,12 @@
 import '../../__mocks__/engine_logic.mock';
 
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
 
 import { shallow } from 'enzyme';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { CurationsRouter } from '.';
 
 describe('CurationsRouter', () => {

x-pack/plugins/enterprise_search/public/applications/app_search/components/curations/curations_router.tsx

@@ -6,7 +6,9 @@
  */
 
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
+
+import { Route } from '@kbn/shared-ux-router';
 
 import {
   ENGINE_CURATIONS_PATH,

x-pack/plugins/enterprise_search/public/applications/app_search/components/engine/engine_router.tsx

@@ -6,11 +6,12 @@
  */
 
 import React, { useEffect } from 'react';
-import { Route, Switch, Redirect, useParams } from 'react-router-dom';
+import { Switch, Redirect, useParams } from 'react-router-dom';
 
 import { useValues, useActions } from 'kea';
 
 import { i18n } from '@kbn/i18n';
+import { Route } from '@kbn/shared-ux-router';
 
 import { setQueuedErrorMessage } from '../../../shared/flash_messages';
 import { AppLogic } from '../../app_logic';

x-pack/plugins/enterprise_search/public/applications/app_search/components/schema/schema_router.test.tsx

@@ -9,10 +9,12 @@ import { setMockValues } from '../../../__mocks__/kea_logic';
 import '../../__mocks__/engine_logic.mock';
 
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
 
 import { shallow } from 'enzyme';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { rerender } from '../../../test_helpers';
 
 import { ReindexJob } from './reindex_job';

x-pack/plugins/enterprise_search/public/applications/app_search/components/schema/schema_router.tsx

@@ -6,10 +6,12 @@
  */
 
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
 
 import { useValues } from 'kea';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { ENGINE_REINDEX_JOB_PATH } from '../../routes';
 import { EngineLogic } from '../engine';
 

x-pack/plugins/enterprise_search/public/applications/app_search/index.tsx

@@ -6,10 +6,12 @@
  */
 
 import React, { useEffect } from 'react';
-import { Route, Redirect, Switch } from 'react-router-dom';
+import { Redirect, Switch } from 'react-router-dom';
 
 import { useValues } from 'kea';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { isVersionMismatch } from '../../../common/is_version_mismatch';
 import { InitialAppData } from '../../../common/types';
 import { HttpLogic } from '../shared/http';

x-pack/plugins/enterprise_search/public/applications/elasticsearch/index.tsx

@@ -6,7 +6,9 @@
  */
 
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
+
+import { Route } from '@kbn/shared-ux-router';
 
 import { isVersionMismatch } from '../../../common/is_version_mismatch';
 import { InitialAppData } from '../../../common/types';

x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/engine/engine_router.tsx

@@ -6,10 +6,12 @@
  */
 
 import React, { useEffect } from 'react';
-import { Redirect, Route, Switch, useParams } from 'react-router-dom';
+import { Redirect, Switch, useParams } from 'react-router-dom';
 
 import { useActions } from 'kea';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { generateEncodedPath } from '../../../shared/encode_path_params';
 import { ENGINE_PATH, ENGINE_TAB_PATH, EngineViewTabs } from '../../routes';
 

x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/engine/engine_view.tsx

@@ -6,10 +6,12 @@
  */
 
 import React, { useEffect } from 'react';
-import { useParams, Route, Switch } from 'react-router-dom';
+import { useParams, Switch } from 'react-router-dom';
 
 import { useValues, useActions } from 'kea';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { Status } from '../../../../../common/types/api';
 
 import { KibanaLogic } from '../../../shared/kibana';

x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/engines/engines_router.tsx

@@ -6,10 +6,12 @@
  */
 
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
 
 import { useValues } from 'kea';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { KibanaLogic } from '../../../shared/kibana';
 import { ENGINES_PATH, ENGINE_PATH } from '../../routes';
 

x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/search_index/search_index_router.tsx

@@ -6,10 +6,12 @@
  */
 
 import React, { useEffect } from 'react';
-import { Redirect, Route, Switch, useParams } from 'react-router-dom';
+import { Redirect, Switch, useParams } from 'react-router-dom';
 
 import { useActions } from 'kea';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import {
   OLD_SEARCH_INDEX_CRAWLER_DOMAIN_DETAIL_PATH,
   SEARCH_INDEX_PATH,

x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/search_indices/search_indices_router.tsx

@@ -6,7 +6,9 @@
  */
 
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
+
+import { Route } from '@kbn/shared-ux-router';
 
 import { SEARCH_INDICES_PATH, SEARCH_INDEX_PATH, NEW_INDEX_PATH } from '../../routes';
 

x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/index.tsx

@@ -6,10 +6,12 @@
  */
 
 import React from 'react';
-import { Route, Redirect, Switch } from 'react-router-dom';
+import { Redirect, Switch } from 'react-router-dom';
 
 import { useValues } from 'kea';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { isVersionMismatch } from '../../../common/is_version_mismatch';
 import { InitialAppData } from '../../../common/types';
 import { SetupGuide } from '../enterprise_search_overview/components/setup_guide';

x-pack/plugins/enterprise_search/public/applications/enterprise_search_overview/index.tsx

@@ -6,10 +6,12 @@
  */
 
 import React from 'react';
-import { Route, Switch } from 'react-router-dom';
+import { Switch } from 'react-router-dom';
 
 import { useValues } from 'kea';
 
+import { Route } from '@kbn/shared-ux-router';
+
 import { isVersionMismatch } from '../../../common/is_version_mismatch';
 import { InitialAppData } from '../../../common/types';
 import { HttpLogic } from '../shared/http';