-
Notifications
You must be signed in to change notification settings - Fork 5
Description
Summary
Implement the “Pay with Wallet” flow in the Ping Checkout UI, using the linked Figma design. Focus only on completing the "Pay with Wallet" path and handling the associated error/unhappy flows.
-
Base Widget design for payment flow selection:
https://www.figma.com/design/ZtcGChCY1FaNoiYlDKvoPh/Pingpay-Widget?node-id=2-799&t=eECA94gaJBWL1hqi-4 -
Implement the Pay with Wallet flow as per the Figma designs:
https://www.figma.com/design/ZtcGChCY1FaNoiYlDKvoPh/Pingpay-Widget?node-id=3-978&t=eECA94gaJBWL1hqi-4 -
Handle unhappy/edge flows:
Fetching Quote: https://www.figma.com/design/ZtcGChCY1FaNoiYlDKvoPh/Pingpay-Widget?node-id=14-6137&t=eECA94gaJBWL1hqi-4
No Quote Found: https://www.figma.com/design/ZtcGChCY1FaNoiYlDKvoPh/Pingpay-Widget?node-id=14-6209&t=eECA94gaJBWL1hqi-4
Payment Failed: https://www.figma.com/design/ZtcGChCY1FaNoiYlDKvoPh/Pingpay-Widget?node-id=6-2525&t=eECA94gaJBWL1hqi-4 -
Responsive layout for mobile and desktop
Notes
- Figma design file link: https://www.figma.com/design/ZtcGChCY1FaNoiYlDKvoPh/Pingpay-Widget?node-id=0-1&t=eECA94gaJBWL1hqi-1
- Comments available in Figma provide additional context for certain screens.
- This task does not include the pay with card or pay with deposit address flows shown within the same figma file.