Skip to content

feat: implement wallet journey states and refactor MainWalletPage to MainWalletView#1228

Open
alibaba0010 wants to merge 2 commits into
joinmarket-webui:develfrom
alibaba0010:feat/wallet-journey-state
Open

feat: implement wallet journey states and refactor MainWalletPage to MainWalletView#1228
alibaba0010 wants to merge 2 commits into
joinmarket-webui:develfrom
alibaba0010:feat/wallet-journey-state

Conversation

@alibaba0010
Copy link
Copy Markdown

What does this PR do?

This PR implements the "Wallet Journey States" logic as part of the competency test requirements. It introduces a data-journey-state attribute to the main wallet view to reflect the current status of the wallet and its active services.

Key Changes:

  • Refactoring: Renamed MainWalletPage to MainWalletView to better align with the project's component naming conventions and updated all corresponding routes in App.tsx.
  • Journey State Logic: Implemented logic in MainWalletView to derive a data-journey-state attribute. Supported states:
    • idle: Default state for a funded wallet.
    • empty: Wallet has zero balance.
    • syncing: Wallet is currently rescanning the blockchain.
    • fee-config-missing: Required policy fee configurations are missing from joinmarket.cfg.
    • coinjoining: A collaborative send (CoinJoin) is in process.
    • making: The Yield Generator (Maker) service is running.
  • Testing: Added a comprehensive React Testing Library (RTL) suite in MainWalletView.test.tsx with mocks for zustand and joinmarket-api-ts to assert correct attribute values under all scenarios.
  • Documentation: Updated docs/developing.md with a new "Simulating Wallet Journey States" section to help other contributors manually verify these flows in regtest.

Visual Demo

This change adds an internal metadata attribute to the DOM to facilitate state-dependent UI logic and automated testing.

Verification (DOM Inspection):

You can verify the active state by inspecting the main container in the browser developer tools:

<div data-journey-state="coinjoining" data-testid="main-wallet-view" ...>

Automated Tests:

All tests in the new suite pass successfully:

|unit| src/components/MainWalletView.test.tsx (6 tests)
   ✓ MainWalletView (6)
     ✓ should have data-journey-state="syncing" when rescanning
     ✓ should have data-journey-state="empty" when balance is 0
     ...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant