Skip to content

Add stream deposit (top-up) UI for existing streams #14

@pragmaticAweds

Description

@pragmaticAweds

Context

The PaymentStreamClient.deposit() method exists in the SDK (line ~42-44) allowing stream senders to add more tokens to an existing stream. However, there is no UI for this action. If a sender creates a stream and later wants to extend the payment by depositing more tokens, they have no way to do it through the frontend.

What Success Looks Like

  • Active streams show a "Deposit" or "Top Up" action in the stream actions menu (visible only to the sender)
  • Clicking it opens a modal/form with an amount input and the current stream balance displayed
  • Submitting the deposit calls the SDK's deposit() method and shows transaction feedback via notify
  • The stream's total amount updates after a successful deposit

Implementation Guidance

  • packages/sdk/src/PaymentStreamClient.ts — the deposit() method
  • apps/web/src/components/modules/payment-stream/StreamActionsCell.tsx — where to add the new action
  • Follow the pattern of existing stream actions (cancel, withdraw) for the transaction flow
  • The modal should show: current stream balance, remaining amount, and an input for the top-up amount
  • Validate that the deposit amount doesn't exceed the user's token balance
  • Use apps/web/src/utils/amount-validation.ts for amount input validation

Metadata

Metadata

Assignees

Labels

Stellar WaveIssues in the Stellar wave programdifficulty: mediumStandard features across multiple codebase sections

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions