react-router v6 flip (2/3): route remaining imports through routerCompat

awx/ui/src/components/AdHocCommands/AdHocCommands.js

@@ -1,6 +1,6 @@
 import React, { useCallback, useEffect, useState, useContext } from 'react';
 import { useParams } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 
 import { useLingui } from '@lingui/react/macro';
 

awx/ui/src/components/AdHocCommands/AdHocCredentialStep.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useCallback } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import styled from 'styled-components';
 import { useField } from 'formik';

awx/ui/src/components/AdHocCommands/AdHocExecutionEnvironmentStep.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useCallback } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { useField } from 'formik';
 import { Form, FormGroup } from '@patternfly/react-core';

awx/ui/src/components/AddRole/AddResourceRole.js

@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useMemo } from 'react';
-import { useLocation, useNavigate } from 'react-router-dom-v5-compat';
+import { useLocation, useNavigate } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { TeamsAPI, UsersAPI } from 'api';
 import useSelected from 'hooks/useSelected';

awx/ui/src/components/AppContainer/NavExpandableGroup.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { matchPath, Link } from 'react-router-dom';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { NavExpandable, NavItem } from '@patternfly/react-core';
 
 function NavExpandableGroup(props) {

awx/ui/src/components/AssociateModal/AssociateModal.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useCallback } from 'react';
-import { useLocation, useNavigate } from 'react-router-dom-v5-compat';
+import { useLocation, useNavigate } from 'routerCompat';
 
 import { useLingui } from '@lingui/react/macro';
 

awx/ui/src/components/ContentError/ContentError.js

@@ -1,7 +1,7 @@
 
 import React from 'react';
 import { Link } from 'react-router-dom';
-import { Navigate } from 'react-router-dom-v5-compat';
+import { Navigate } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 
 import {

awx/ui/src/components/LaunchButton/LaunchButton.js

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from 'react';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import {
   AdHocCommandsAPI,

awx/ui/src/components/LaunchPrompt/steps/CredentialsStep.js

@@ -1,6 +1,6 @@
 import React, { useState, useCallback, useEffect } from 'react';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { useField } from 'formik';
 import styled from 'styled-components';

awx/ui/src/components/LaunchPrompt/steps/ExecutionEnvironmentStep.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { useField } from 'formik';
 import { ExecutionEnvironmentsAPI } from 'api';

awx/ui/src/components/LaunchPrompt/steps/InstanceGroupsStep.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { useField } from 'formik';
 import { InstanceGroupsAPI } from 'api';

awx/ui/src/components/LaunchPrompt/steps/InventoryStep.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { useField } from 'formik';
 import styled from 'styled-components';

awx/ui/src/components/ListHeader/ListHeader.js

@@ -1,7 +1,7 @@
 
 import React, { useState } from 'react';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import styled from 'styled-components';
 import { Toolbar, ToolbarContent } from '@patternfly/react-core';
 

awx/ui/src/components/Lookup/CredentialLookup.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 
 import { useLingui } from '@lingui/react/macro';
 import { FormGroup } from '@patternfly/react-core';

awx/ui/src/components/Lookup/HostFilterLookup.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useCallback } from 'react';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 
 import styled from 'styled-components';
 import { useLingui } from '@lingui/react/macro';

awx/ui/src/components/Lookup/InstanceGroupsLookup.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { Trans, useLingui } from '@lingui/react/macro';
 import { FormGroup } from '@patternfly/react-core';
 import { InstanceGroupsAPI } from 'api';

awx/ui/src/components/Lookup/InventoryLookup.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { InventoriesAPI } from 'api';
 import useRequest from 'hooks/useRequest';

awx/ui/src/components/Lookup/Lookup.js

@@ -1,5 +1,5 @@
 import React, { useReducer, useEffect, useState } from 'react';
-import { useLocation, useNavigate } from 'react-router-dom-v5-compat';
+import { useLocation, useNavigate } from 'routerCompat';
 import { useField } from 'formik';
 import { SearchIcon } from '@patternfly/react-icons';
 import {

awx/ui/src/components/Lookup/MultiCredentialsLookup.js

@@ -1,5 +1,5 @@
 import React, { useState, useCallback, useEffect } from 'react';
-import { useLocation, useNavigate } from 'react-router-dom-v5-compat';
+import { useLocation, useNavigate } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { ToolbarItem, Alert } from '@patternfly/react-core';
 import { CredentialsAPI, CredentialTypesAPI } from 'api';

awx/ui/src/components/Lookup/OrganizationLookup.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { FormGroup } from '@patternfly/react-core';
 import { OrganizationsAPI } from 'api';

awx/ui/src/components/Lookup/PeersLookup.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { FormGroup, Chip } from '@patternfly/react-core';
 import { InstancesAPI } from 'api';

awx/ui/src/components/Lookup/ProjectLookup.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect } from 'react';
-import { useLocation } from 'react-router-dom-v5-compat';
+import { useLocation } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import { FormGroup } from '@patternfly/react-core';
 import { ProjectsAPI } from 'api';

awx/ui/src/components/PaginatedTable/HeaderRow.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import { Thead, Tr, Th as PFTh } from '@patternfly/react-table';
 import styled from 'styled-components';
 import { parseQueryString, updateQueryString } from 'util/qs';

awx/ui/src/components/PaginatedTable/PaginatedTable.js

@@ -4,7 +4,7 @@
 import React, { useEffect } from 'react';
 import { TableComposable, Tbody } from '@patternfly/react-table';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 
 import { useLingui } from '@lingui/react/macro';
 

awx/ui/src/components/RoutedTabs/RoutedTabs.js

@@ -5,7 +5,7 @@ import {
   TabTitleText,
 } from '@patternfly/react-core';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import styled from 'styled-components';
 import { getPersistentFilters } from 'components/PersistentFilters';
 

awx/ui/src/components/RoutedTabs/RoutedTabs.test.js

@@ -2,7 +2,7 @@
 import React from 'react';
 import { screen, waitFor } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
-import { Routes, Route } from 'react-router-dom-v5-compat';
+import { Routes, Route } from 'routerCompat';
 import { renderWithContexts } from '../../../testUtils/rtlContexts';
 import RoutedTabs from './RoutedTabs';
 

awx/ui/src/components/Schedule/Schedule.js

@@ -8,7 +8,7 @@ import {
   Navigate,
   useLocation,
   useParams,
-} from 'react-router-dom-v5-compat';
+} from 'routerCompat';
 import { CaretLeftIcon } from '@patternfly/react-icons';
 import { SchedulesAPI } from 'api';
 import useRequest from 'hooks/useRequest';

awx/ui/src/components/Schedule/Schedule.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { screen } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
-import { Routes, Route } from 'react-router-dom-v5-compat';
+import { Routes, Route } from 'routerCompat';
 import { JobTemplatesAPI, SchedulesAPI } from 'api';
 import { renderWithContexts } from '../../../testUtils/rtlContexts';
 import Schedule from './Schedule';

awx/ui/src/components/Schedule/ScheduleAdd/ScheduleAdd.js

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import { Card } from '@patternfly/react-core';
 import yaml from 'js-yaml';
 import { parseVariableField } from 'util/yaml';

awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.js

@@ -1,6 +1,6 @@
 import React, { useCallback, useEffect } from 'react';
 import { Link, useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import styled from 'styled-components';
 import { useLingui } from '@lingui/react/macro';
 import { Chip, Divider, Title, Button } from '@patternfly/react-core';

awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { screen, waitFor } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
-import { Routes, Route } from 'react-router-dom-v5-compat';
+import { Routes, Route } from 'routerCompat';
 import { SchedulesAPI, JobTemplatesAPI } from 'api';
 import {
   renderWithContexts,

awx/ui/src/components/Schedule/ScheduleEdit/ScheduleEdit.js

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import { Card } from '@patternfly/react-core';
 import yaml from 'js-yaml';
 import { OrganizationsAPI, SchedulesAPI } from 'api';

awx/ui/src/components/Schedule/Schedules.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Routes, Route } from 'react-router-dom-v5-compat';
+import { Routes, Route } from 'routerCompat';
 
 import Schedule from './Schedule';
 import ScheduleAdd from './ScheduleAdd';

awx/ui/src/components/Schedule/Schedules.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { screen } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
-import { Routes, Route } from 'react-router-dom-v5-compat';
+import { Routes, Route } from 'routerCompat';
 import { renderWithContexts } from '../../../testUtils/rtlContexts';
 import Schedules from './Schedules';
 

awx/ui/src/contexts/Session.js

@@ -10,7 +10,7 @@ import {
   Navigate,
   useLocation,
   useNavigationType,
-} from 'react-router-dom-v5-compat';
+} from 'routerCompat';
 import { DateTime } from 'luxon';
 import { RootAPI, MeAPI } from 'api';
 import { isAuthenticated } from 'util/auth';

awx/ui/src/hooks/useRequest.js

@@ -1,6 +1,6 @@
 import { useEffect, useState, useCallback } from 'react';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import { parseQueryString, updateQueryString } from 'util/qs';
 import useIsMounted from './useIsMounted';
 

awx/ui/src/routerCompat.js

@@ -0,0 +1,20 @@
+// Single indirection point for react-router so the v5-compat -> v6 migration can
+// flip the whole app from one place. While the migration is in flight this
+// re-exports the v6 API from react-router-dom-v5-compat (which bridges the
+// still-installed react-router-dom v5 Router via <CompatRouter>). The final
+// migration step repoints these re-exports at `react-router-dom` once the
+// package is on v6 -- every consumer imports from here, so nothing else changes.
+//
+// CompatRouter is intentionally not re-exported: it has no v6 equivalent and is
+// used only by App.js, which keeps importing it directly until the final flip.
+export {
+  Link,
+  Navigate,
+  Route,
+  Router,
+  Routes,
+  useLocation,
+  useNavigate,
+  useNavigationType,
+  useParams,
+} from 'react-router-dom-v5-compat';

awx/ui/src/screens/ActivityStream/ActivityStream.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useCallback } from 'react';
 import { useLocation } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import styled from 'styled-components';
 import { useLingui } from '@lingui/react/macro';
 import {

awx/ui/src/screens/Application/Application/Application.js

@@ -6,7 +6,7 @@ import {
   Navigate,
   useParams,
   useLocation,
-} from 'react-router-dom-v5-compat';
+} from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 
 import { CaretLeftIcon } from '@patternfly/react-icons';

awx/ui/src/screens/Application/Application/Application.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { screen, waitFor } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
-import { Routes, Route } from 'react-router-dom-v5-compat';
+import { Routes, Route } from 'routerCompat';
 import { ApplicationsAPI } from 'api';
 import { renderWithContexts } from '../../../../testUtils/rtlContexts';
 import Application from './Application';

awx/ui/src/screens/Application/ApplicationAdd/ApplicationAdd.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useState } from 'react';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 
 import { Card, PageSection } from '@patternfly/react-core';
 import useRequest from 'hooks/useRequest';

awx/ui/src/screens/Application/ApplicationDetails/ApplicationDetails.js

@@ -1,7 +1,7 @@
 import React, { useCallback } from 'react';
 import { useLingui } from '@lingui/react/macro';
 import { Link } from 'react-router-dom';
-import { useNavigate } from 'react-router-dom-v5-compat';
+import { useNavigate } from 'routerCompat';
 import { Button } from '@patternfly/react-core';
 
 import useRequest, { useDismissableError } from 'hooks/useRequest';

awx/ui/src/screens/Application/ApplicationEdit/ApplicationEdit.js

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { useNavigate, useParams } from 'react-router-dom-v5-compat';
+import { useNavigate, useParams } from 'routerCompat';
 
 import { Card } from '@patternfly/react-core';
 import { ApplicationsAPI } from 'api';

awx/ui/src/screens/Application/ApplicationTokens/ApplicationTokenList.js

@@ -1,6 +1,6 @@
 import React, { useCallback, useEffect } from 'react';
 import { useLingui } from '@lingui/react/macro';
-import { useParams, useLocation } from 'react-router-dom-v5-compat';
+import { useParams, useLocation } from 'routerCompat';
 import PaginatedTable, { getSearchableKeys } from 'components/PaginatedTable';
 import { getQSConfig, parseQueryString } from 'util/qs';
 import { TokensAPI, ApplicationsAPI } from 'api';

awx/ui/src/screens/Application/ApplicationTokens/ApplicationTokenList.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { screen, waitFor, within } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
-import { Routes, Route } from 'react-router-dom-v5-compat';
+import { Routes, Route } from 'routerCompat';
 
 import { ApplicationsAPI, TokensAPI } from 'api';
 import { renderWithContexts } from '../../../../testUtils/rtlContexts';

awx/ui/src/screens/Application/Applications.js

@@ -1,6 +1,6 @@
 import React, { useState, useCallback } from 'react';
 import styled from 'styled-components';
-import { Routes, Route } from 'react-router-dom-v5-compat';
+import { Routes, Route } from 'routerCompat';
 import { useLingui } from '@lingui/react/macro';
 import {
   Alert,

awx/ui/src/screens/Application/Applications.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { screen, within } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
-import { Routes, Route } from 'react-router-dom-v5-compat';
+import { Routes, Route } from 'routerCompat';
 import { renderWithContexts } from '../../../testUtils/rtlContexts';
 
 import Applications from './Applications';

awx/ui/src/screens/Credential/Credential.js

@@ -10,7 +10,7 @@ import {
   Navigate,
   useParams,
   useLocation,
-} from 'react-router-dom-v5-compat';
+} from 'routerCompat';
 import useRequest from 'hooks/useRequest';
 import { ResourceAccessList } from 'components/ResourceAccessList';
 import ContentError from 'components/ContentError';