Migrate react-router usage to v6 compat APIs (bridge + all non-route-tree files)#392
Open
blaipr wants to merge 1 commit into
Open
Migrate react-router usage to v6 compat APIs (bridge + all non-route-tree files)#392blaipr wants to merge 1 commit into
blaipr wants to merge 1 commit into
Conversation
…tree files)
Combines the v5-compat bridge and the three migration batches into one
change covering ~180 of the 237 files that used the router APIs removed
in react-router 6/7 (Switch, useHistory, useRouteMatch, Redirect,
withRouter).
The bridge:
- react-router-dom-v5-compat added (router v6 running alongside v5,
React 17 compatible) with CompatRouter mounted inside the app's
HashRouter, so components migrate file by file
- testUtils/enzymeHelpers renders a controlled nested v6 Router
(location from the v5 context, navigator = the shared history) inside
the v5 Router: no second history subscription, so no act() warnings,
and enzyme shallow rendering keeps working
- licenses/ui entry for the new dependency (test_licenses enforces it)
The migration (components, contexts, hooks and all screen directories):
- useHistory() -> useNavigate(); history.push/replace/goBack ->
navigate(...) with { replace: true } where applicable;
history.go() -> navigate(0)
- history.location reads -> useLocation()
- zero-argument useRouteMatch used only for .params -> useParams()
- conditional Redirect -> Navigate (only in files without a Switch)
- withRouter wrappers replaced with hooks, or dropped where the
component never read the injected props (AppContainer, Templates,
Organizations, Projects)
- contexts/Session's history.listen POP detection rewritten with
useLocation/useNavigationType, skipping the initial render to keep
v5's fire-on-change-only semantics
- UIEdit's custom hardReload flag moves to navigation state (v6 drops
custom location fields); TopologyView's redirectToDetailsPage helper
takes navigate instead of a history object
Two correctness findings baked in:
- navigate() from the compat package is not referentially stable (its
identity changes with the location), so redirect-on-result effects
that previously listed the stable v5 history in their deps drop
navigate with an explanatory eslint-disable - including it refires
the redirect after unrelated navigations (caught by an existing
cancel-flow test)
- screens/Login migrated as the first slice surfaced a test.only that
had silenced 14 Login tests since the initial import; it is removed,
two assertions that rotted while dark are fixed, and the suite now
runs 2869 tests (14 more than before)
Deliberately left on v5 for the final route-tree phase: Switch/Route
definitions, Redirect from= entries inside Switch, match.path/match.url
route building, and argument-form useRouteMatch prefix checks. After
that phase, react-router-dom flips to v6 and the compat package is
removed.
This was referenced Jun 11, 2026
Contributor
There was a problem hiding this comment.
Pull request overview
This PR introduces the react-router-dom-v5-compat bridge to incrementally migrate Ascender’s React UI away from react-router v5-only APIs (e.g., useHistory, Redirect, withRouter) while leaving the route-tree definitions on v5 for a later phase. It updates both runtime components and test utilities so migrated components can run under a controlled v6 router layer without breaking existing v5 routing or Enzyme-based tests.
Changes:
- Added
react-router-dom-v5-compat(and license entry) and wrapped the app withCompatRouterto enable v6-compat APIs alongside v5. - Replaced v5-only navigation/redirect patterns across many UI screens/components with
useNavigate/Navigate(compat) and related hooks (useNavigationType, location state). - Updated test helpers and several test suites to provide the compat router context needed by migrated components.
Reviewed changes
Copilot reviewed 166 out of 167 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| licenses/ui/react-router-dom-v5-compat.txt | Adds license text for new dependency |
| awx/ui/testUtils/enzymeHelpers.js | Adds controlled nested v6 router layer for Enzyme helpers |
| awx/ui/src/screens/WorkflowApproval/WorkflowApprovalDetail/WorkflowApprovalDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/User/UserTokenDetail/UserTokenDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/User/UserTokenAdd/UserTokenAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/User/UserEdit/UserEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/User/UserDetail/UserDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/User/UserAdd/UserAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/TopologyView/utils/helpers.js | Updates helper to accept navigate instead of history |
| awx/ui/src/screens/TopologyView/TopologyView__RTL.test.js | Wraps test render with CompatRouter |
| awx/ui/src/screens/TopologyView/MeshGraph.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/TopologyView/MeshGraph__RTL.test.js | Wraps test render with CompatRouter |
| awx/ui/src/screens/Template/WorkflowJobTemplateVisualizer/Visualizer.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeModal.js | Replaces history usage with compat useLocation/useNavigate |
| awx/ui/src/screens/Template/WorkflowJobTemplateEdit/WorkflowJobTemplateEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Template/WorkflowJobTemplateDetail/WorkflowJobTemplateDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Template/WorkflowJobTemplateAdd/WorkflowJobTemplateAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Template/Templates.js | Removes withRouter HOC usage |
| awx/ui/src/screens/Template/Survey/SurveyQuestionEdit.js | Replaces Redirect/useHistory with compat Navigate/useNavigate |
| awx/ui/src/screens/Template/Survey/SurveyQuestionAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Template/JobTemplateEdit/JobTemplateEdit.js | Replaces Redirect/useHistory with compat Navigate/useNavigate |
| awx/ui/src/screens/Template/JobTemplateDetail/JobTemplateDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Template/JobTemplateAdd/JobTemplateAdd.js | Switches from useHistory to compat useLocation/useNavigate |
| awx/ui/src/screens/Team/TeamEdit/TeamEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Team/TeamDetail/TeamDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Team/TeamAdd/TeamAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/UI/UIEdit/UIEdit.test.js | Updates expectations for navigation state-based reload flag |
| awx/ui/src/screens/Setting/UI/UIEdit/UIEdit.js | Uses navigate(..., { state }) instead of custom history location field |
| awx/ui/src/screens/Setting/UI/UIDetail/UIDetail.js | Uses location state + navigate(0) for reload behavior |
| awx/ui/src/screens/Setting/Troubleshooting/TroubleshootingEdit/TroubleshootingEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/TACACS/TACACSEdit/TACACSEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/Subscription/SubscriptionEdit/SubscriptionEdit.js | Switches to compat navigation + hook-deps handling for unstable navigate |
| awx/ui/src/screens/Setting/SAML/SAMLEdit/SAMLEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/RADIUS/RADIUSEdit/RADIUSEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/OIDC/OIDCEdit/OIDCEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/MiscSystem/MiscSystemEdit/MiscSystemEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/MiscAuthentication/MiscAuthenticationEdit/MiscAuthenticationEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/Logging/LoggingEdit/LoggingEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/LDAP/LDAPEdit/LDAPEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/Jobs/JobsEdit/JobsEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/GoogleOAuth2/GoogleOAuth2Edit/GoogleOAuth2Edit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/GitHub/GitHubTeamEdit/GitHubTeamEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/GitHub/GitHubOrgEdit/GitHubOrgEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/GitHub/GitHubEnterpriseTeamEdit/GitHubEnterpriseTeamEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/GitHub/GitHubEnterpriseOrgEdit/GitHubEnterpriseOrgEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/GitHub/GitHubEnterpriseEdit/GitHubEnterpriseEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/GitHub/GitHubEdit/GitHubEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/AzureAD/AzureADTenantEdit/AzureADTenantEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Setting/AzureAD/AzureADEdit/AzureADEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Project/Projects.js | Removes withRouter HOC usage |
| awx/ui/src/screens/Project/ProjectEdit/ProjectEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Project/ProjectDetail/ProjectDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Project/ProjectAdd/ProjectAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Organization/Organizations.js | Removes withRouter HOC usage |
| awx/ui/src/screens/Organization/OrganizationEdit/OrganizationEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Organization/OrganizationDetail/OrganizationDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Organization/OrganizationAdd/OrganizationAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/NotificationTemplate/NotificationTemplateEdit/NotificationTemplateEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/NotificationTemplate/NotificationTemplateDetail/NotificationTemplateDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/NotificationTemplate/NotificationTemplateAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/ManagementJob/ManagementJobList/ManagementJobListItem.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Login/Login.test.js | Re-enables skipped tests and updates redirect assertions to Navigate |
| awx/ui/src/screens/Login/Login.js | Replaces Redirect/withRouter with compat Navigate |
| awx/ui/src/screens/Job/WorkflowOutput/WorkflowOutputToolbar.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Job/WorkflowOutput/WorkflowOutputNode.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Job/JobOutput/JobOutputSearch.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Job/JobOutput/JobOutput.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Job/JobDetail/JobDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/SmartInventoryEdit/SmartInventoryEdit.js | Switches from useHistory to compat useNavigate + effect deps handling |
| awx/ui/src/screens/Inventory/SmartInventoryDetail/SmartInventoryDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/SmartInventoryAdd/SmartInventoryAdd.js | Switches from useHistory to compat useNavigate + effect deps handling |
| awx/ui/src/screens/Inventory/SmartInventory.js | Formatting-only import consolidation (router v5) |
| awx/ui/src/screens/Inventory/InventorySourceEdit/InventorySourceEdit.js | Switches from useHistory to compat useNavigate + effect deps handling |
| awx/ui/src/screens/Inventory/InventorySourceDetail/InventorySourceDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventorySourceAdd/InventorySourceAdd.js | Switches from useHistory to compat useNavigate + effect deps handling |
| awx/ui/src/screens/Inventory/InventorySource/InventorySource.js | Formatting-only import consolidation (router v5) |
| awx/ui/src/screens/Inventory/InventoryRelatedGroupAdd/InventoryRelatedGroupAdd.js | Switches from useHistory to compat useNavigate (with state) |
| awx/ui/src/screens/Inventory/InventoryList/useWsInventories.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventoryHostEdit/InventoryHostEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventoryHostDetail/InventoryHostDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventoryHostAdd/InventoryHostAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventoryHost/InventoryHost.js | Formatting-only import consolidation (router v5) |
| awx/ui/src/screens/Inventory/InventoryGroupHostAdd/InventoryGroupHostAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventoryGroupEdit/InventoryGroupEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventoryGroupDetail/InventoryGroupDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventoryGroupAdd/InventoryGroupAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventoryGroup/InventoryGroup.js | Formatting-only import consolidation (router v5) |
| awx/ui/src/screens/Inventory/InventoryEdit/InventoryEdit.js | Switches from useHistory to compat useLocation/useNavigate |
| awx/ui/src/screens/Inventory/InventoryDetail/InventoryDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/InventoryAdd/InventoryAdd.js | Switches from useHistory to compat useLocation/useNavigate |
| awx/ui/src/screens/Inventory/Inventory.js | Formatting-only import consolidation (router v5) |
| awx/ui/src/screens/Inventory/FederatedInventoryEdit/FederatedInventoryEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/FederatedInventoryDetail/FederatedInventoryDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/FederatedInventoryAdd/FederatedInventoryAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/FederatedInventory.js | Formatting-only import consolidation (router v5) |
| awx/ui/src/screens/Inventory/ConstructedInventoryEdit/ConstructedInventoryEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/ConstructedInventoryDetail/ConstructedInventoryDetail.test.js | Adds nested v6 router layer in RTL test setup |
| awx/ui/src/screens/Inventory/ConstructedInventoryDetail/ConstructedInventoryDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/ConstructedInventoryAdd/ConstructedInventoryAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Inventory/ConstructedInventory.js | Formatting-only import consolidation (router v5) |
| awx/ui/src/screens/Instances/InstanceList/InstanceList.test.js | Adds nested v6 router layer in RTL test setup |
| awx/ui/src/screens/Instances/InstanceEdit/InstanceEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Instances/InstanceDetail/InstanceDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Instances/InstanceAdd/InstanceAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/InstanceGroup/InstanceGroupEdit/InstanceGroupEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/InstanceGroup/InstanceGroupDetails/InstanceGroupDetails.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/InstanceGroup/InstanceGroupAdd/InstanceGroupAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/InstanceGroup/InstanceDetails/InstanceDetails.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/InstanceGroup/ContainerGroupEdit/ContainerGroupEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/InstanceGroup/ContainerGroupDetails/ContainerGroupDetails.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/InstanceGroup/ContainerGroupAdd/ContainerGroupAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Host/HostList/HostList.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Host/HostEdit/HostEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Host/HostDetail/HostDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Host/HostAdd/HostAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/ExecutionEnvironment/ExecutionEnvironmentEdit/ExecutionEnvironmentEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/ExecutionEnvironment/ExecutionEnvironmentDetails/ExecutionEnvironmentDetails.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/ExecutionEnvironment/ExecutionEnvironmentAdd/ExecutionEnvironmentAdd.js | Switches from useHistory to compat useLocation/useNavigate |
| awx/ui/src/screens/CredentialType/CredentialTypeEdit/CredentialTypeEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/CredentialType/CredentialTypeDetails/CredentialTypeDetails.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/CredentialType/CredentialTypeAdd/CredentialTypeAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Credential/shared/CredentialPlugins/CredentialPluginPrompt/CredentialsStep.js | Uses compat useLocation for querystring instead of history |
| awx/ui/src/screens/Credential/shared/CredentialPlugins/CredentialPluginField.js | Switches close behavior to compat useNavigate |
| awx/ui/src/screens/Credential/CredentialEdit/CredentialEdit.js | Switches from useHistory to compat useNavigate + effect deps handling |
| awx/ui/src/screens/Credential/CredentialDetail/CredentialDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Credential/CredentialAdd/CredentialAdd.js | Switches from useHistory to compat useNavigate + effect deps handling |
| awx/ui/src/screens/Application/ApplicationEdit/ApplicationEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Application/ApplicationDetails/ApplicationDetails.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/Application/ApplicationAdd/ApplicationAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/screens/ActivityStream/ActivityStream.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/hooks/useRequest.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/contexts/Session.js | Replaces v5 history listener logic with compat v6 navigation-type handling |
| awx/ui/src/components/Schedule/ScheduleEdit/ScheduleEdit.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/Schedule/ScheduleAdd/ScheduleAdd.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/RoutedTabs/RoutedTabs.test.js | Uses mountWithContexts instead of manual Router mount |
| awx/ui/src/components/RoutedTabs/RoutedTabs.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/PaginatedTable/PaginatedTable.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/PaginatedTable/HeaderRow.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/Lookup/ProjectLookup.js | Removes withRouter; uses compat useLocation |
| awx/ui/src/components/Lookup/PeersLookup.js | Removes withRouter; uses compat useLocation |
| awx/ui/src/components/Lookup/OrganizationLookup.js | Removes withRouter; uses compat useLocation |
| awx/ui/src/components/Lookup/MultiCredentialsLookup.js | Removes withRouter; uses compat useLocation/useNavigate |
| awx/ui/src/components/Lookup/Lookup.js | Removes withRouter; uses compat useLocation/useNavigate |
| awx/ui/src/components/Lookup/InventoryLookup.js | Removes withRouter; uses compat useLocation |
| awx/ui/src/components/Lookup/InstanceGroupsLookup.js | Removes withRouter; uses compat useLocation |
| awx/ui/src/components/Lookup/HostFilterLookup.js | Switches from history replace to compat navigate(..., { replace }) |
| awx/ui/src/components/Lookup/CredentialLookup.js | Uses compat useLocation for querystring instead of history |
| awx/ui/src/components/ListHeader/ListHeader.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/LaunchPrompt/steps/InventoryStep.js | Uses compat useLocation for querystring instead of history |
| awx/ui/src/components/LaunchPrompt/steps/InstanceGroupsStep.js | Uses compat useLocation for querystring instead of history |
| awx/ui/src/components/LaunchPrompt/steps/ExecutionEnvironmentStep.js | Uses compat useLocation for querystring instead of history |
| awx/ui/src/components/LaunchPrompt/steps/CredentialsStep.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/LaunchButton/LaunchButton.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/ContentError/ContentError.js | Replaces Redirect with compat Navigate |
| awx/ui/src/components/AssociateModal/AssociateModal.js | Switches from history replace to compat navigate(..., { replace }) |
| awx/ui/src/components/AppContainer/NavExpandableGroup.test.js | Switches to mountWithContexts using memory history |
| awx/ui/src/components/AppContainer/NavExpandableGroup.js | Replaces useHistory with compat useLocation |
| awx/ui/src/components/AppContainer/AppContainer.js | Removes withRouter HOC usage |
| awx/ui/src/components/AdHocCommands/AdHocExecutionEnvironmentStep.js | Uses compat useLocation for querystring instead of history |
| awx/ui/src/components/AdHocCommands/AdHocCredentialStep.js | Uses compat useLocation for querystring instead of history |
| awx/ui/src/components/AdHocCommands/AdHocCommands.js | Switches from useHistory to compat useNavigate |
| awx/ui/src/components/AddRole/AddResourceRole.test.js | Adjusts initialEntries to absolute path + uses new router context |
| awx/ui/src/components/AddRole/AddResourceRole.js | Switches from useHistory to compat useLocation/useNavigate + deps handling |
| awx/ui/src/App.js | Wraps the app in CompatRouter inside HashRouter |
| awx/ui/package.json | Adds react-router-dom-v5-compat dependency |
| awx/ui/package-lock.json | Locks new dependency and transitive packages |
Files not reviewed (1)
- awx/ui/package-lock.json: Generated file
Comment on lines
30
to
33
| let resourceValues = null; | ||
|
|
||
| if (history.location.search.includes('resource_id' && 'resource_name')) { | ||
| if (location.search.includes('resource_id' && 'resource_name')) { | ||
| resourceValues = { |
Comment on lines
43
to
46
| const { search, pathname } = useLocation(); | ||
| const history = useHistory(); | ||
| const navigate = useNavigate(); | ||
| const location = useLocation(); | ||
| if (!pluralizedItemName) { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
SUMMARY
Migrates the UI to the react-router v6 compat APIs: installs the official incremental-migration bridge and converts ~180 of the 237 files that used router APIs removed in react-router 6/7 (
Switch,useHistory,useRouteMatch,Redirect,withRouter). Route-tree definitions stay on v5 for a final follow-up phase, after whichreact-router-domflips to v6 and the compat package is removed.The bridge
react-router-dom-v5-compat(router v6 alongside v5, React 17 compatible) withCompatRouterinside the app'sHashRouter;testUtils/enzymeHelpersrenders a controlled nested v6 Router (location from the v5 context, navigator = the shared history) — no second subscription, noact()warnings, shallow rendering intact;licenses/uientry for the new dependency.The migration (shared components, contexts, hooks and every screen directory)
useHistory→useNavigate•history.location→useLocation()• params-onlyuseRouteMatch→useParams()• conditionalRedirect→Navigate•withRouter→ hooks (or dropped where the injected props were never read) •Session'shistory.listenPOP detection →useNavigationTypewith v5-faithful semantics • UIEdit's customhardReloadlocation field → navigationstate•history.go()→navigate(0).Two correctness findings baked in:
navigate()is not referentially stable (identity changes with location) — redirect-on-result effects drop it from deps with explanatory eslint-disables; mechanically converting[result, history]deps refires redirects after unrelated navigations (caught by an existing cancel-flow test).test.onlyhad silenced 14 Login tests since the fork's initial import; removed, with two while-dark-rotted assertions fixed. The suite now runs 2,869 tests.Deliberately left on v5 for the final route-tree phase:
Switch/Routedefinitions,<Redirect from>inside Switch,match.path/match.urlroute building, argument-formuseRouteMatchprefix checks. After that phase,react-router-domflips to v6 and the compat package is deleted.Fully independent of every other open PR — verified by pairwise
git merge-tree.ISSUE TYPE
COMPONENT NAME
ASCENDER VERSION
ADDITIONAL INFORMATION
The v6-context requirement is self-enforcing in tests: a migrated component rendered without the bridge fails loudly (
useNavigate() may be used only in the context of a <Router>).