Skip to content

Migrate react-router usage to v6 compat APIs (bridge + all non-route-tree files) - #392

Merged
cigamit merged 6 commits into
ctrliq:mainfrom
blaipr:feature/react-router-migration
Jun 13, 2026
Merged

cigamit merged 6 commits into
ctrliq:mainfrom
blaipr:feature/react-router-migration

Conversation

@blaipr

@blaipr blaipr commented Jun 11, 2026

Copy link
Copy Markdown
Contributor

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 which react-router-dom flips to v6 and the compat package is removed.

The bridge

react-router-dom-v5-compat (router v6 alongside v5, React 17 compatible) with CompatRouter inside the app's HashRouter; testUtils/enzymeHelpers renders a controlled nested v6 Router (location from the v5 context, navigator = the shared history) — no second subscription, no act() warnings, shallow rendering intact; licenses/ui entry for the new dependency.

The migration (shared components, contexts, hooks and every screen directory)

useHistoryuseNavigatehistory.locationuseLocation() • params-only useRouteMatchuseParams() • conditional RedirectNavigatewithRouter → hooks (or dropped where the injected props were never read) • Session's history.listen POP detection → useNavigationType with v5-faithful semantics • UIEdit's custom hardReload location field → navigation statehistory.go()navigate(0).

Two correctness findings baked in:

  1. compat 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).
  2. A test.only had 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/Route definitions, <Redirect from> inside Switch, match.path/match.url route building, argument-form useRouteMatch prefix checks. After that phase, react-router-dom flips to v6 and the compat package is deleted.

Fully independent of every other open PR — verified by pairwise git merge-tree.

ISSUE TYPE

  • New or Enhanced Feature

COMPONENT NAME

  • UI

ASCENDER VERSION

awx: 25.4.1.dev5+gcda0899.d20260610

ADDITIONAL INFORMATION

npm --prefix awx/ui run lint     # clean
npm --prefix awx/ui run test     # 544 suites passed (1 skipped), 2869 tests passed (5 skipped)
npm --prefix awx/ui run build    # succeeds
py.test awx/main/tests/functional/test_licenses.py   # 1 passed

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>).

…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.

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 with CompatRouter to 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 thread awx/ui/src/screens/Template/JobTemplateAdd/JobTemplateAdd.js
Comment thread awx/ui/src/components/PaginatedTable/PaginatedTable.js Outdated
- JobTemplateAdd: location.search.includes('resource_id' && 'resource_name')
  only ever tested for resource_name ('a' && 'b' evaluates to 'b'); now
  requires both params before building resource defaults
- PaginatedTable: single useLocation() call instead of two
@blaipr

blaipr commented Jun 12, 2026

Copy link
Copy Markdown
Contributor Author

Both comments addressed: JobTemplateAdd now checks includes('resource_id') && includes('resource_name') (the old expression only ever tested for resource_name — good catch, this also matched the pre-migration behavior so it's a genuine bug fix), and PaginatedTable uses a single useLocation() call. Affected suites pass (29 tests).

@blaipr

blaipr commented Jun 12, 2026

Copy link
Copy Markdown
Contributor Author

Both fixed. The resource param check now requires both values before building the defaults, and the duplicate useLocation call is gone.

The explanation for omitting navigate from effect deps was wrapped onto
comment lines after the eslint-disable-next-line directive, which makes
the directive target the comment instead of the dependency array. Move
the explanation above the directive and keep the directive as a single
bare line directly before the code it suppresses.

Comment-only change, no runtime impact.
blaipr added 3 commits June 13, 2026 02:43
renderWithContexts mounted only the v5 Router, so components migrated to
the react-router-dom-v5-compat APIs threw 'useNavigate() may be used only
in the context of a <Router>' under the RTL suites that ctrliq#385 introduced
(rtlContexts.js did not exist when this branch was cut). Nest the same
controlled v6 Router used by enzymeHelpers — location from the v5
context, navigator = the shared history — and add a regression test
exercising useNavigate/useLocation from the compat package.

Also drops the dead Lingui v5 make-plural guard and fixes the stale
import/* eslint rule names, matching the identical cleanup already on
the rtl-batch-user branch so the hunks merge cleanly.
The suite lives in enzymeHelpers.test.js; the .jsx twin snapshot is
obsolete and fails the run under jest's ci mode.
@blaipr

blaipr commented Jun 13, 2026

Copy link
Copy Markdown
Contributor Author

Branch refreshed against current main (it was 14 merges behind and predated the RTL infrastructure from #385). Two substantive additions beyond the merge:

  • Wired the compat bridge into the RTL test harness. renderWithContexts (testUtils/rtlContexts.js, added by Add React Testing Library migration infrastructure and first conversions #385) mounted only the v5 Router, so any RTL suite rendering a component this PR migrates would have thrown useNavigate() may be used only in the context of a <Router> after merge — zero textual conflicts, but a guaranteed runtime break against the User suites converted in Convert the User screen test suites from Enzyme to React Testing Library #398. It now nests the same controlled v6 Router as enzymeHelpers (location from the v5 context, navigator = the shared history), with a regression test exercising the compat hooks through the harness.
  • Removed the orphaned enzymeHelpers.test.jsx.snap that fails the run under jest's ci mode.

Full suite against current main: 546 suites passed (1 skipped), 2,893 tests passed (5 skipped), lint clean. Re-verified conflict-free against main and every other open PR (#396, #397, #398) — the shared rtlContexts.js edits here and in #398 use identical hunks, so they merge cleanly in either order.

@cigamit
cigamit merged commit 6a962c2 into ctrliq:main Jun 13, 2026
@cigamit cigamit self-assigned this Jun 18, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

3 participants