Skip to content

Convert .defaultProps to ES default parameters - #491

Merged
cigamit merged 1 commit into
ctrliq:mainfrom
blaipr:feature/defaultprops-to-params
Jun 19, 2026
Merged

Convert .defaultProps to ES default parameters#491
cigamit merged 1 commit into
ctrliq:mainfrom
blaipr:feature/defaultprops-to-params

Conversation

@blaipr

@blaipr blaipr commented Jun 19, 2026

Copy link
Copy Markdown
Contributor

SUMMARY

defaultProps on function components is deprecated in React 18.3 and removed in React 19, so this converts all 117 component files from Component.defaultProps = {...} to ES default parameters in the function signature. It's a behaviour-preserving refactor that de-risks the upcoming React 17→18 bump — without it, every defaultProps usage would emit a deprecation warning under 18.3 and (via the repo's strict console-error trap in setupTests.js) fail its test suite.

This is independent of the open #489 / #490 PRs (different files).

Beyond the mechanical conversion, four things needed care:

  1. ESLint rulereact/require-default-props is set to { functions: 'defaultArguments' } so it accepts signature default params instead of requiring a defaultProps declaration (the rule requires the default to live in the signature, not a body destructure — a couple of components were adjusted accordingly).
  2. CheckboxListItemisSelected had a default param but was marked .isRequired; a prop with a default is optional, so the .isRequired is dropped (the stricter rule surfaced this pre-existing inconsistency).
  3. CredentialLookup idOrKind validator — React applies defaultProps to the element's props before PropTypes runs; ES default params do not (they only apply inside the function). The credentialTypeKind: '' default made that prop always present, which had silently disabled the idOrKind validator. The validator now treats an omitted credentialTypeKind as that former '' default, preserving behaviour (the EC2/Azure/… inventory-source subforms legitimately pass credentialTypeNamespace instead of id/kind).
  4. Referential stabilitydefaultProps creates each default value once (stable reference); a param default creates a new one every render. For the seven defaults that feed a hook dependency array (PaginatedTable clearSelected, VariablesField validators, PeersLookup instance_details, ScheduleForm schedule, HostEventModal hostEvent, PlaybookSelect onChange, JobTemplateForm template), the literal is hoisted to a module-level constant so the dependent effect/memo doesn't re-run every render (this matters more under React 18 StrictMode/concurrency).

Two obsolete tests that asserted Component.defaultProps.onBlur directly were removed (that object no longer exists).

ISSUE TYPE

  • New or Enhanced Feature

COMPONENT NAME

  • UI

ASCENDER VERSION

awx: 25.4.1.dev108+ga6ee5e0c5b

ADDITIONAL INFORMATION

  • npm --prefix awx/ui run test: 552 suites / 2908 tests green (3 pre-existing documented skips). npm --prefix awx/ui run lint clean.
  • No runtime behaviour change: ES default params apply on undefined exactly as defaultProps did; the four special cases above keep validation/referential behaviour identical.

defaultProps on function components is deprecated in React 18.3 and removed in
React 19, so convert all 117 component files from `Component.defaultProps = {...}`
to ES default parameters in the function signature. De-risks the React 18 bump
(otherwise every defaultProps usage would warn and, via the strict console trap,
fail its test suite).

- eslint.config.mjs: set react/require-default-props to { functions:
  'defaultArguments' } so the rule accepts signature default params instead of
  requiring a defaultProps declaration.
- CheckboxListItem: isSelected had a default param but was marked isRequired; a
  prop with a default is optional, so drop .isRequired (the new rule surfaced
  this pre-existing inconsistency).
- CredentialLookup: its idOrKind validator relied on defaultProps being applied
  to the element BEFORE PropTypes ran (the '' default made credentialTypeKind
  always present, silently disabling the validator). Default params don't reach
  PropTypes, so treat an omitted credentialTypeKind as that former '' default to
  preserve behavior (callers like the EC2/Azure/... subforms pass
  credentialTypeNamespace instead of id/kind).
- Stabilize the seven defaults that feed a hook dependency array (PaginatedTable
  clearSelected, VariablesField validators, PeersLookup instance_details,
  ScheduleForm schedule, HostEventModal hostEvent, PlaybookSelect onChange,
  JobTemplateForm template) by hoisting the literal to a module-level constant —
  defaultProps created the value once (stable ref); a param default would create
  a new one each render, re-running the dependent effect/memo.
- Remove two obsolete tests that asserted Component.defaultProps.onBlur directly
  (that object no longer exists; the param-default noop is self-evidently safe).

Full Jest suite green (552 suites / 2908 tests), lint clean.

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 updates the AWX UI React codebase to be React 18.3/19-ready by replacing deprecated function-component defaultProps usage with ES default parameters, while preserving existing runtime behavior (including PropTypes interactions and referential stability where it matters).

Changes:

  • Converted function-component Component.defaultProps = ... patterns to ES default parameters across the UI.
  • Updated ESLint to accept default parameters as satisfying react/require-default-props.
  • Addressed a PropTypes timing edge case (CredentialLookup) and hoisted a few defaults to keep stable identities where hook deps depend on them.

Reviewed changes

Copilot reviewed 121 out of 121 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
awx/ui/src/screens/WorkflowApproval/WorkflowApprovalList/WorkflowApprovalListDenyButton.js defaultProps → default params
awx/ui/src/screens/WorkflowApproval/WorkflowApprovalList/WorkflowApprovalListApproveButton.js defaultProps → default params
awx/ui/src/screens/WorkflowApproval/WorkflowApprovalDetail/WorkflowApprovalDetail.js Remove deprecated defaultProps usage
awx/ui/src/screens/User/shared/UserForm.js defaultProps → default params
awx/ui/src/screens/Template/WorkflowJobTemplateVisualizer/VisualizerNode.js defaultProps → default params
awx/ui/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeTypeStep/WorkflowJobTemplatesList.js defaultProps → default params
awx/ui/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeTypeStep/SystemJobTemplatesList.js defaultProps → default params
awx/ui/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeTypeStep/ProjectsList.js defaultProps → default params
awx/ui/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeTypeStep/JobTemplatesList.js defaultProps → default params
awx/ui/src/screens/Template/WorkflowJobTemplateVisualizer/Modals/NodeModals/NodeTypeStep/InventorySourcesList.js defaultProps → default params
awx/ui/src/screens/Template/Survey/SurveyQuestionForm.js defaultProps → default params
awx/ui/src/screens/Template/shared/WorkflowJobTemplateForm.js defaultProps → default params
awx/ui/src/screens/Template/shared/PlaybookSelect.js defaultProps → default params (+ stable noop)
awx/ui/src/screens/Template/shared/JobTemplateForm.js defaultProps → default params (+ hoisted stable template)
awx/ui/src/screens/Team/shared/TeamForm.js defaultProps → default params
awx/ui/src/screens/Setting/shared/SharedFields.js defaultProps → default params
awx/ui/src/screens/Project/shared/ProjectForm.js defaultProps → default params
awx/ui/src/screens/Organization/shared/OrganizationForm.js defaultProps → default params
awx/ui/src/screens/NotificationTemplate/shared/TypeInputsSubForm.js defaultProps → default params
awx/ui/src/screens/NotificationTemplate/shared/NotificationTemplateForm.js defaultProps → default params
awx/ui/src/screens/Job/WorkflowOutput/WorkflowOutputToolbar.js defaultProps → default params
awx/ui/src/screens/Job/JobTypeRedirect.js defaultProps → default params
awx/ui/src/screens/Job/JobOutput/shared/OutputToolbar.js defaultProps → default params
awx/ui/src/screens/Job/JobOutput/HostEventModal.js defaultProps → default params (+ stable default object)
awx/ui/src/screens/Inventory/shared/SmartInventoryForm.js defaultProps → default params
awx/ui/src/screens/Inventory/shared/InventorySourceSyncButton.js defaultProps → default params
awx/ui/src/screens/Inventory/shared/InventorySourceForm.js Remove deprecated defaultProps usage
awx/ui/src/screens/Inventory/shared/InventoryGroupsDeleteModal.js defaultProps → default params
awx/ui/src/screens/Inventory/shared/InventoryForm.js defaultProps → default params
awx/ui/src/screens/Inventory/shared/FederatedInventoryForm.js defaultProps → default params
awx/ui/src/screens/Inventory/shared/ConstructedInventoryForm.js defaultProps → default params
awx/ui/src/screens/InstanceGroup/shared/InstanceGroupForm.js defaultProps → default params
awx/ui/src/screens/InstanceGroup/shared/ContainerGroupForm.js defaultProps → default params
awx/ui/src/screens/HostMetrics/HostMetricsDeleteButton.js defaultProps → default params
awx/ui/src/screens/Host/HostList/SmartInventoryButton.js defaultProps → default params
awx/ui/src/screens/ExecutionEnvironment/shared/ExecutionEnvironmentForm.js defaultProps → default params
awx/ui/src/screens/CredentialType/shared/CredentialTypeForm.js defaultProps → default params
awx/ui/src/screens/Credential/shared/TypeInputsSubForm.js Remove empty defaultProps
awx/ui/src/screens/Credential/shared/ExternalTestModal.js defaultProps → default params
awx/ui/src/screens/Credential/shared/CredentialPlugins/CredentialPluginTestAlert.js defaultProps → default params
awx/ui/src/screens/Credential/shared/CredentialPlugins/CredentialPluginSelected.js defaultProps → default params
awx/ui/src/screens/Credential/shared/CredentialPlugins/CredentialPluginPrompt/CredentialPluginPrompt.js defaultProps → default params
awx/ui/src/screens/Credential/shared/CredentialPlugins/CredentialPluginField.js defaultProps → default params (refactor props handling)
awx/ui/src/screens/Credential/shared/CredentialFormFields/CredentialField.js defaultProps → default params / remove empty defaultProps
awx/ui/src/screens/Credential/shared/CredentialFormFields/BecomeMethodField.js defaultProps → default params
awx/ui/src/screens/Credential/shared/CredentialForm.js defaultProps → default params
awx/ui/src/components/Workflow/WorkflowStartNode.js defaultProps → default params
awx/ui/src/components/Workflow/WorkflowActionTooltipItem.js defaultProps → default params
awx/ui/src/components/Sparkline/Sparkline.js defaultProps → default params
awx/ui/src/components/Sort/Sort.js defaultProps → default params
awx/ui/src/components/SelectedList/SelectedList.js defaultProps → default params
awx/ui/src/components/SelectedList/DraggableSelectedList.js defaultProps → default params
awx/ui/src/components/SelectableCard/SelectableCard.js defaultProps → default params
awx/ui/src/components/Search/Search.js defaultProps → default params
awx/ui/src/components/Search/LookupTypeInput.js defaultProps → default params
awx/ui/src/components/Search/AdvancedSearch.js defaultProps → default params
awx/ui/src/components/Schedule/shared/ScheduleForm.js defaultProps → default params (+ stable default object)
awx/ui/src/components/Schedule/ScheduleOccurrences/ScheduleOccurrences.js defaultProps → default params
awx/ui/src/components/Schedule/ScheduleList/ScheduleList.js defaultProps → default params
awx/ui/src/components/Schedule/ScheduleEdit/ScheduleEdit.js Remove empty defaultProps
awx/ui/src/components/Schedule/ScheduleAdd/ScheduleAdd.js Remove empty defaultProps
awx/ui/src/components/ResourceAccessList/DeleteRoleConfirmationModal.js defaultProps → default params
awx/ui/src/components/PromptDetail/PromptDetail.js defaultProps → default params
awx/ui/src/components/Popover/Popover.js defaultProps → default params
awx/ui/src/components/PaginatedTable/ToolbarSyncSourceButton.js defaultProps → default params
awx/ui/src/components/PaginatedTable/ToolbarDeleteButton.js defaultProps → default params
awx/ui/src/components/PaginatedTable/ToolbarAddButton.js defaultProps → default params
awx/ui/src/components/PaginatedTable/PaginatedTable.js defaultProps → default params (+ stable noop)
awx/ui/src/components/PaginatedTable/HeaderRow.js defaultProps → default params
awx/ui/src/components/OptionsList/OptionsList.js defaultProps → default params
awx/ui/src/components/NotificationList/NotificationListItem.js defaultProps → default params
awx/ui/src/components/NotificationList/NotificationList.js defaultProps → default params
awx/ui/src/components/Lookup/ProjectLookup.js defaultProps → default params
awx/ui/src/components/Lookup/PeersLookup.js defaultProps → default params (+ stable default object)
awx/ui/src/components/Lookup/OrganizationLookup.test.js Remove tests asserting defaultProps object
awx/ui/src/components/Lookup/OrganizationLookup.js defaultProps → default params
awx/ui/src/components/Lookup/MultiCredentialsLookup.js defaultProps → default params
awx/ui/src/components/Lookup/Lookup.js defaultProps → default params
awx/ui/src/components/Lookup/InventoryLookup.js defaultProps → default params
awx/ui/src/components/Lookup/InstanceGroupsLookup.js defaultProps → default params
awx/ui/src/components/Lookup/HostFilterLookup.js defaultProps → default params
awx/ui/src/components/Lookup/ExecutionEnvironmentLookup.js defaultProps → default params
awx/ui/src/components/Lookup/CredentialLookup.test.js Remove tests asserting defaultProps object
awx/ui/src/components/Lookup/CredentialLookup.js defaultProps → default params + PropTypes validator adjustment
awx/ui/src/components/Lookup/ApplicationLookup.js defaultProps → default params
awx/ui/src/components/ListHeader/ListHeader.js defaultProps → default params
awx/ui/src/components/LabelSelect/LabelSelect.js defaultProps → default params
awx/ui/src/components/JobList/JobListCancelButton.js defaultProps → default params
awx/ui/src/components/InstanceGroupLabels/InstanceGroupLabels.js defaultProps → default params
awx/ui/src/components/HostForm/HostForm.js defaultProps → default params
awx/ui/src/components/FormField/PasswordInput.js defaultProps → default params
awx/ui/src/components/FormField/PasswordField.js defaultProps → default params (prop plumb refactor)
awx/ui/src/components/FormField/FormField.js defaultProps → default params
awx/ui/src/components/FormField/CheckboxField.js defaultProps → default params
awx/ui/src/components/FormField/ArrayTextField.js defaultProps → default params
awx/ui/src/components/FormActionGroup/FormActionGroup.js defaultProps → default params
awx/ui/src/components/FieldWithPrompt/FieldWithPrompt.js defaultProps → default params
awx/ui/src/components/ExpandCollapse/ExpandCollapse.js defaultProps → default params
awx/ui/src/components/ExecutionEnvironmentDetail/ExecutionEnvironmentDetail.js defaultProps → default params
awx/ui/src/components/ErrorDetail/ErrorDetail.js defaultProps → default params
awx/ui/src/components/DisassociateButton/DisassociateButton.js Remove deprecated defaultProps usage (already default params)
awx/ui/src/components/DetailList/UserDateDetail.js defaultProps → default params
awx/ui/src/components/DetailList/Detail.js defaultProps → default params
awx/ui/src/components/DetailList/CodeDetail.js defaultProps → default params
awx/ui/src/components/DeleteButton/DeleteButton.js defaultProps → default params
awx/ui/src/components/DataListToolbar/DataListToolbar.js defaultProps → default params
awx/ui/src/components/CopyButton/CopyButton.js defaultProps → default params
awx/ui/src/components/ContentError/ContentError.js defaultProps → default params
awx/ui/src/components/CodeEditor/VariablesField.js defaultProps → default params (+ stable default object)
awx/ui/src/components/CodeEditor/VariablesDetail.js defaultProps → default params
awx/ui/src/components/CodeEditor/CodeEditorField.js defaultProps → default params
awx/ui/src/components/CodeEditor/CodeEditor.js defaultProps → default params
awx/ui/src/components/CheckboxListItem/CheckboxListItem.js PropTypes adjust to match default-param optionality
awx/ui/src/components/AppContainer/PageHeaderToolbar.js defaultProps → default params
awx/ui/src/components/AnsibleSelect/AnsibleSelect.js defaultProps → default params
awx/ui/src/components/AddRole/SelectRoleStep.js defaultProps → default params
awx/ui/src/components/AddRole/SelectResourceStep.js defaultProps → default params
awx/ui/src/components/AddRole/CheckboxCard.js defaultProps → default params
awx/ui/src/components/AddRole/AddResourceRole.js defaultProps → default params
awx/ui/src/components/About/About.js defaultProps → default params
awx/ui/eslint.config.mjs Configure react/require-default-props to accept default params

Comment on lines +25 to +28
function ScheduleOccurrences({
preview = { local: [], utc: [] },
tz = Intl.DateTimeFormat().resolvedOptions().timeZone,
}) {

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.

Going ahead and merging this, we can fix this suggestion in an a new PR

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