Skip to content

Button migration batch 7: text + icon styled — all areas #95176

Description

@mountiny

Sub-issue of #83762.
Migration plan: Guccio163 comment.

Batch

Files

  • src/components/DistanceRequest/DistanceRequestFooter.tsx
  • src/components/EmptyStateComponent/index.tsx
  • src/components/FloatingGPSButton/index.native.tsx
  • src/components/MoneyReportHeaderActions/MoneyReportHeaderSecondaryActions.tsx
  • src/components/MoneyRequestConfirmationListFooter/ConfirmationFieldList.tsx
  • src/components/MoneyRequestReportView/MoneyRequestReportTransactionList.tsx (has link → LinkButton)
  • src/components/Navigation/QuickCreationActionsBar/index.tsx ×4
  • src/pages/DynamicReportParticipantDetailsPage.tsx
  • src/pages/DynamicReportParticipantsPage.tsx
  • src/pages/DynamicRoomMemberDetailsPage.tsx
  • src/pages/DynamicRoomMembersPage.tsx
  • src/pages/EnablePayments/Wallet/AddBankAccount/SetupMethod.tsx
  • src/pages/OnboardingWorkspaces/BaseOnboardingWorkspaces.tsx ×3 (has link → LinkButton)
  • src/pages/ReimbursementAccount/NonUSD/SignerInfo/HangTight.tsx
  • src/pages/domain/Admins/DomainAdminsPage.tsx ×2
  • src/pages/domain/Groups/DomainGroupsPage.tsx
  • src/pages/domain/Members/DomainMemberDetailsPage.tsx
  • src/pages/domain/Members/DomainMembersPage.tsx
  • src/pages/home/SpendOverTimeSection/SpendOverTimeSectionContent.tsx
  • src/pages/media/AttachmentModalScreen/routes/TransactionReceiptModalContent.tsx ×6
  • src/pages/settings/Profile/AgentAIPromptSection.tsx
  • src/pages/settings/Profile/ProfilePage.tsx
  • src/pages/settings/Rules/ExpenseRulesPage.tsx
  • src/pages/settings/Subscription/FreeTrial.tsx
  • src/pages/settings/Wallet/ExpensifyCardPage/ChangePINPage.tsx ×2
  • src/pages/settings/Wallet/ExpensifyCardPage/index.tsx ×7
  • src/pages/settings/Wallet/TravelCVVPage/TravelCVVPage.tsx ×2
  • src/pages/workspace/WorkspaceMembersPage.tsx
  • src/pages/workspace/WorkspaceOverviewPage.tsx ×2
  • src/pages/workspace/categories/WorkspaceCategoriesPage.tsx
  • src/pages/workspace/distanceRates/PolicyDistanceRatesPage.tsx
  • src/pages/workspace/expensifyCard/WorkspaceExpensifyCardListPage.tsx
  • src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
  • src/pages/workspace/reports/ReportFieldsListValuesPage.tsx
  • src/pages/workspace/rooms/WorkspaceRoomsPage.tsx ×2
  • src/pages/workspace/rules/PolicyRulesPageRevamp.tsx
  • src/pages/workspace/tags/WorkspaceTagsPage.tsx
  • src/pages/workspace/taxes/WorkspaceTaxesPage.tsx

Migration rules

Mechanical swap per prop-change rules:

  • Import: @components/Button@components/ButtonComposed
  • text / icon / related props → <Button.Text> / <Button.Icon> children
  • success / dangervariant="success" / variant="danger"
  • small / medium / largesize={CONST.BUTTON_SIZE.SMALL | MEDIUM | LARGE}
  • link<LinkButton> from @components/ButtonComposed/composed/LinkButton
  • Forwarded size props: update DROPDOWN_BUTTON_SIZEBUTTON_SIZE where applicable
// before
<Button success large text="Add members" icon={Plus} iconRight={ArrowRight} onPress={onAdd} />
// after
<Button variant="success" size={CONST.BUTTON_SIZE.LARGE} onPress={onAdd}>
    <Button.Icon src={Plus} />
    <Button.Text>Add members</Button.Text>
    <Button.Icon src={ArrowRight} />
</Button>

Out of scope

  • Renaming wrapper public APIs (ButtonWithDropdownMenu success/buttonSizevariant/size) — tracked separately
  • Keep each wrapper's public API as-is; map to composed Button internally only

Acceptance criteria

  • Every listed file fully migrated (no remaining @components/Button import)
  • <Button link> usages swapped to LinkButton
  • Wrapper components (FloatingGPSButton, etc.) use composed Button internally
  • eslint-seatbelt count reduced accordingly
  • PR author spot-checks 2–3 representative screens

Dependencies

  • Blocked by: #93789
  • Blocked by batch 1: deprecation guard must exist before merge
Issue OwnerCurrent Issue Owner: @mikolajpochec

Metadata

Metadata

Type

No type

Projects

Status
SUBISSUE

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions