[LWD] feat(desktop): add history button with cta support in topbar#15623
[LWD] feat(desktop): add history button with cta support in topbar#15623mcayuelas-ledger wants to merge 1 commit intofeat/wallet40-hide-operation-listfrom
Conversation
Web Tools Build Status
|
|
There was a problem hiding this comment.
Pull request overview
Adds a new “History” action to the Desktop MVVM TopBar, with optional CTA-style rendering (icon + text) gated behind the Wallet40 operations list feature flag.
Changes:
- Introduce a new
useHistoryhook and add a History slot to the TopBar slots list whenshouldDisplayOperationsListis enabled. - Extend TopBar action types/UI to support an optional
ctalabel, rendering aButtoninstead of anIconButton. - Add English i18n strings and add/update unit tests for the new History hook and CTA rendering.
Reviewed changes
Copilot reviewed 9 out of 9 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| apps/ledger-live-desktop/static/i18n/en/app.json | Adds topBar.history tooltip/CTA translation strings. |
| apps/ledger-live-desktop/src/mvvm/components/TopBar/types.ts | Extends TopBar action type with cta?: string and adds Clock icon typing support. |
| apps/ledger-live-desktop/src/mvvm/components/TopBar/hooks/useTopBarViewModel.ts | Adds History slot behind shouldDisplayOperationsList from useWalletFeaturesConfig("desktop"). |
| apps/ledger-live-desktop/src/mvvm/components/TopBar/hooks/useHistory.ts | New hook providing navigation + tooltip/CTA strings for the History action. |
| apps/ledger-live-desktop/src/mvvm/components/TopBar/hooks/tests/useTopBarViewModel.test.ts | Updates tests to validate slot ordering/properties including the History slot. |
| apps/ledger-live-desktop/src/mvvm/components/TopBar/hooks/tests/useHistory.test.ts | Adds unit tests for the new History hook behavior. |
| apps/ledger-live-desktop/src/mvvm/components/TopBar/components/tests/TopBarActionButton.test.tsx | Adds tests ensuring CTA renders a text Button variant and click/disabled behavior works. |
| apps/ledger-live-desktop/src/mvvm/components/TopBar/components/TopBarActionButton.tsx | Implements CTA support by switching between Button and IconButton. |
| .changeset/forty-bobcats-wonder.md | Declares a minor desktop change for the new TopBar History button. |
| return ( | ||
| <div className="flex items-center gap-12"> | ||
| <Tooltip onOpenChange={handleOpenChange}> |
There was a problem hiding this comment.
This MVVM component uses a raw <div> wrapper for layout. In src/mvvm/, UI code is expected to rely on the design system layout primitives (e.g., Lumen / shared layout components) rather than raw HTML containers so styling and accessibility stay consistent. Consider replacing this wrapper with an appropriate design-system layout component.
| const routeWrapper = route | ||
| ? ({ children }: { children: React.ReactNode }) => | ||
| createElement(MemoryRouter, { initialEntries: [route] }, children) | ||
| : undefined; |
There was a problem hiding this comment.
React.ReactNode is referenced in the routeWrapper type annotation, but React isn’t imported in this test file. This will fail TypeScript compilation; import type React / type ReactNode from react (or avoid the React. namespace) before using it.
90aa124 to
afe72a7
Compare
bf447f5 to
1fd7317
Compare
|



✅ Checklist
npx changesetwas attached.📝 Description
Introduce History button in Topbar of W4
❓ Context
🧐 Checklist for the PR Reviewers