Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update screens for deposit and withdrawal flows #821

Merged
merged 18 commits into from
Nov 7, 2024
Merged

Conversation

kkosiorowska
Copy link
Contributor

@kkosiorowska kkosiorowska commented Oct 30, 2024

Ref #811
Ref #277
Closes #814
Closes #813

This PR updates screens for deposit and withdrawal flows. The "Skeleton" loading screen from both Deposit and Withdraw flows is no longer needed. The new flow adds two steps:

  • "Opening your wallet for signature" Screen
  • "Awaiting Transaction" Screen

Flow:

  1. User initiates deposit: After pressing the Deposit/Withdraw CTAs, the user first sees the “Opening your wallet for signature” screen
  2. Display wallet modal
  3. Transition to ‘Awaiting Transaction’: Once the wallet modal is prompted, switch to the “Awaiting Transaction” screen while the user completes the signature.
  4. Return to dapp: After signing with the wallet, the user returns to your dapp, where the “Awaiting Transaction” screen remains visible as needed.
  5. Confirm deposit/withdraw: Once transaction is complete, display the “Deposit received” or "Withdrawal inititated" screens to confirm completion.
Screen.Recording.2024-10-31.at.13.12.28.mov

@kkosiorowska kkosiorowska self-assigned this Oct 30, 2024
Copy link

netlify bot commented Oct 30, 2024

Deploy Preview for acre-dapp ready!

Name Link
🔨 Latest commit d20300f
🔍 Latest deploy log https://app.netlify.com/sites/acre-dapp/deploys/672c98e70e56b70008a1c466
😎 Deploy Preview https://deploy-preview-821--acre-dapp.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

netlify bot commented Oct 30, 2024

Deploy Preview for acre-dapp-testnet ready!

Name Link
🔨 Latest commit d20300f
🔍 Latest deploy log https://app.netlify.com/sites/acre-dapp-testnet/deploys/672c98e700d6c00008070fcc
😎 Deploy Preview https://deploy-preview-821--acre-dapp-testnet.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

The status will tell us when the wallet window opens and when the transaction is completed.
The "Skeleton" loading screen from both Deposit and Withdraw flows is no longer needed. The new flow adds two steps:

- "Opening your wallet for signature" Screen
- "Awaiting Transaction" Screen
We want to know when the transaction data are built. We add callback that is triggered after building data.
@kkosiorowska kkosiorowska marked this pull request as ready for review October 31, 2024 12:46
dapp/src/hooks/useDepositBTCTransaction.ts Outdated Show resolved Hide resolved
sdk/src/lib/redeemer-proxy.ts Outdated Show resolved Hide resolved
sdk/src/lib/redeemer-proxy.ts Outdated Show resolved Hide resolved
sdk/src/lib/redeemer-proxy.ts Outdated Show resolved Hide resolved
Since we use the `@tanstack/react-query` library we no longer need the `useExecuteFunction` hook. Let's stay consistent use `useMutation` instead of `useExecuteFunction` in the rest of the code.
@nkuba nkuba added this to the Ledger Live Launch milestone Nov 6, 2024
r-czajkowski
r-czajkowski previously approved these changes Nov 7, 2024
@r-czajkowski r-czajkowski merged commit 36b0fe8 into main Nov 7, 2024
28 checks passed
@r-czajkowski r-czajkowski deleted the awaiting-modals branch November 7, 2024 10:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
3 participants