boltzexchange / boltz-web-app Goto Github PK

Like this, boltz partners can earn referrals if they redirect users to us via a simple ref link. Payout monthly and trusted, referrals can be queried with a referral key via https://docs.boltz.exchange/en/latest/api/#querying-referral-fees

Reason: https://boltz.exchange/ does it this way since forever.

Bug collection:

• Send amount shows yellow even though amount is above max
  

We are moving to interval updates, so in most cases the button won't do anything

Plus right now I don't know if there just is no update or if the button doesn't work since it doesn't give any feedback.

Especially on mobile we want to start getting rid of not frequently used highly advanced features like these.

• in BTC denomination . counts as digit leading to input value having 11, second value having 12 digits
• it's a plain max digits enforcement no matter where the dot is and since second value is calculated down to 8 decimals:
  

Should say BETA @ https://beta.boltz.exchange/

User feedback:

a noob user could easily miss this file...

Currently web app changes amounts back to default when

• switching BTC/sats
• switching pairs
• switching pair directions

Saw these logs in the backend

Request /createswap {"type":"submarine","pairId":"L-BTC/BTC","orderSide":"sell","refundPublicKey":"023fde56004373be64fb19db721b21fc6a3c0ae417d6c044bfe19492e32cddae15","invoice":"lnbc110u1pj8pnfqpp569rs9ltd7h5dh2f9ql809vgwwy46enat6qpqxnth4kucfdtttassdqqcqzpgxqrrssrzjqvgptfurj3528snx6e3dtwepafxw5fpzdymw9pj20jj09sunnqmwqqqqqyqqqqqqqqqqqqlgqqqqqqgqjqnp4qgz6w7ean7qmwdnz9vduhqr80j7d2hpxlpmltgqnz784jjf6kd6nwsp55pv5le5ty60rms3rrxs9ptzxqunlmrn4s0cq5mezaj6mktlletgs9qyyssq9l5xv57nk88p7g22j4jrg2ps236mmzf2gr74c60purmpwsy0rmr38q59el8ghhcy595xpxat4ek3sy7ukx56mmdxa2rlmxry9rce98sqdkszh7 \n","referralId":"boltz_webapp"} failed: {"error":"Unknown character  "}

This is the relevant part:

rce98sqdkszh7 \n","referralId"

We should delete explorer button from this page. Lockup only happens AFTER invoice payment is set up so it's not useful/confusing here.

@dni and I debated back and forth a bit how to combine the use cases:

• "sth went wrong with a swap, I want to refund" with
• "I want a nice historical overview of all swaps, even the ones I started without sending money and also the ones still in progress"

and finally decided it's best to split these two up. Historically we had ""Check Status & Refund" combined which is probably hard to understand and not how the user's mental model works.

"Refund" @ boltz.exchange/refund- shows list of refundable swaps and refund file upload section, refund details page for a particular swap is boltz.exchange/refund/sWaPiD
"History" @ boltz.exchange/history - show all swaps from local storage. They link to different swap detail pages depending on their state

• refundable swaps go boltz.exchange/refund/sWaPiD
• failed (but non-refundable because e.g. no coins were sent) and successful swaps go to boltz.exchange/history/sWaPiD
• in-progress swaps go to boltz.exchange/swap/sWaPiD where user can resume the swap.

User report: https://discord.com/channels/547454030801272832/1105808433082548274/1117168936249725008

TBD since I am sure you thought about this @dni but noticed when I am in the refund overview @ boltz.exchange/refund and I click on a Swap I should have a refund overview page boltz.exchange/refund/vDTvI1 not boltz.exchange/swap/vDTvI1 also see PRD/wireframe

In order to stay trustless, web app has to

• make sure invoice has same SHA256 hash webapp previously generated and used to /createswap, before showing invoice to user
• make sure invoice amount is == with amount used to call /createswap, before showing invoice to user
• make sure amount in api response from /createswap are as expected, before showing invoice to user

Behavior right now: box goes to "00"

Leave it as long as you need it for debugging, but then we want to get rid of it.

• my only feedback would be: if possible, show additional info once the lightning invoice is paid but before the swap confirms. ie. ack the lightning payment then show detail like “lighting payment received, ”
• IMO "onchain address" might be more clear if it was "liquid address". not sure if anyone mentioned that yet.
• when going from liquid to lightning, the help for the address/invoice is very clear, but when going the other way, it only says on-chain address, I think the placeholder could have a bit more info, like the address prefix or something like that
• The UI does something "weird" with the numbers when changing focus, for instance, when first loading the page, it shows 10433/10000 and everything is stable. Once you just just click the up arrow, making it go to 10444, every time you move from one field to another, or even making alt/tab, the values change (even pressing and releasing shift does the same)
• not easy to select/delete everything so you can paste a predefined value, numbers keep changing as you type them. Works better selecting with the mouse, but I haven't found a way to do it with the keyboard

Here I simply typed "4". Couldn't reproduce this behavior with any other value so far (not 0.01,0.02, 0.04, 0.05 or others)

It doesn't let me type when the number is max digits

Have to trim spaces from the clipboard because input validation determines spaces illegal when pasting which is correct

QR PNG on mobile
JSON on desktop

Based on User feedback "my only feedback would be: if possible, show additional info once the lightning invoice is paid but before the swap confirms. ie. ack the lightning payment then show detail like “lighting payment received”

This is not helpful for most users

• pressing "delete" from 0.0005 or 0.005 or 0.00003 etc all goes to 0.0
• CTRL+A any number in btc denomination and typing 0 creates "0.0" (instead of plain "0") whereas typing any other number like 8 correctly creates "8"
• don't paste from clipboard if it contains not-allowed chars
  

We want to show JSON responses of our API in the browser just like https://swaps.electrum.org/api/version does.

In a second step BoltzExchange/boltz-backend#346 let's /api return sth meaningful.

This is the state we want when page load is done, send amount input field ready to take input, ideally also with a 0 as place holder like UniSwap does:

Reason?

• we have virtually no chance of correctly guessing the amount the user wants to swap, we want to save the user trouble having to delete the prefilled amount as first step
• it seeems to be industry standard, see above

Substitutes BoltzExchange/boltz-backend#319

Part of BoltzExchange/boltz-backend#347. Webapp implements a simple browser notification Network fee was updated based on network situation, please confirm new amounts and continue with swap

Recent user feedback made it crystal clear that users don't get that they need to keep the browser tab open on mobile for it to be able to claim locked coins. Or rather go back to the browser after lightning invoice in another app. This problem arises when waiting for 1 confirmation, especially mainchain.

Options are to warn better OR imo better instead of trying to get users to understand this (many still won't) move the webapp to use 0-conf instant swaps only. Like this browser will claim seconds after lightning invoice was paid. And it almost never should be an issue.

Depends on BoltzExchange/boltz-backend#198

Quick opinion which way to go please! @dni @michael1011

All I did was CTRL+A to mark and copy receive amount, it recalculated send amount
Screencast from 04-11-2023 03:33:25 PM.webm

So that the field only goes yellow and enables the "Create Atomic Swap" Button when a valid liquid address is present. It is red otherwise.

Right now it only gives me the "invalid address" error after I pressed the Button (pay attention to the bottom part of the video):

Discussion issue if we want that. Theoretically we could leave out asking for an invoice or showing the invoice alby provided if alby is connected to the boltz.exchange site. My counterargument would be that if a user connected alby to boltz.exchange but then wants to swap to his lightning mobile wallet which is not added to his alby he would first have to understand that the only way to do this is to disconnect alby.

So I would actually keep the flow exactly as is and the only difference between alby connected or not connected to boltz.exchange is that it doesn't bring up this permission window when I press the "WebLN" button to submit an invoice.

Follow-up of #82. This issue is about webapp verifying make sure on-chain amount is the one used /createswap before claiming. Not trivial because webapp would need to query the mempool (0-conf swaps), ideally also double check that RBF is not enabled or query the chain to do so. Needs to be via 3rd party mempool api.

• add to backend docs

Footer should always stick to bottom of the page

Sometimes I still run into these weird, seemingly, conversion bugs that I don't really know how to reproduce.

Wrong refund ETA - Looks like Edge mobile with translation enabled:

This is what I swapped:

And actually received 62386 sats, but success page shows 63245 sats:

Since webapp let's you specify receive amount we want to make sure the user receives exact amount down to Satoshi, not the current "this or more" logic.

User had

Error loading address data.
(base58 error: base58ck checksum 0x42e6f03c does not match expected 0x5a8ec4a7)

on mempool.space

when clicking on the exlorer link which seems it was https://liquid.network/address/undefined

It's not an easy feat for even experienced webdevs to integrate boltz swaps into a website. Cryptography and Bitcoin need to be understood. This issue is the start of how a swap widget could look like.

It should allow for basic customization:

• color, fonts etc
• set referral id

Invoice missing:

Make this grey (#ffffff4d) -> #d0d0d0 because #ffffff4d is the same color we use for clickable text, e.g. in the header menu