Feature: UI Updates Needed

[JeffWScott]

Scope

This update goes hand and hand with the API work described here #29

Homepage

www.lamdenlink.com needs a better landing page than what is there now.

• Needs to look more like a website, less like an app
• Needs a better description of what Lamden Link does, why you might be using it, etc
• Needs an overview of what lamden even is. Maybe a link to the lamden homepage.
• What tokens are available to be swapped
  • Lamden <-> ETH
  • Lamden <-> BSC

Restarting Swaps

The major consideration with resuming a swap has to do with moving tokens OFF lamden into BSC or ETH.

During this process a "burn" happens on Lamden. This burn creates a Proof which must be submitted to the Lamden Link ETH/BSC contract. That proof contains a nonce and if it's not redeemed before the next one then the funds are not recoverable.

This can cause an issue in the UI. If the user has gotten to the point of burning the tokens on lamden, and then gets to the next step of "withdraw" and the process fails (due to metamast or just some unforeseen error) then they cannot restart the process from the beginning. They must be able to restart the process from this point.

The current UI does do a resume but it's clunky. Currently in the UI just recognizes that there is saved swap data in the localstorage and sees that there is a burn hash that was saved. It then knows that this swap should not be easily restartable. There is a /restart route that will let a user restart the swap at the risk of losing funds. But it's all very clunky.

More Automatic

The steps are clear and defined but the process fees like a slog. Ideally the user should just have to start the swap, and click to approve the popups.
The a more automatic process then needs to be able to be resumable, for the reasons in the "Restarting Swaps" sections as well as well as allow the process to recover from transaction errors or any other error that might arise.

Refreshed look

The look is very utilitarian and "just works" but it needs to be more refined and professional.

Details

Overview of swap steps

This will provide some overview of what is required to complete each swap. ETH and BTC are basically the same from a technology perspective and both user the same Metamask/WEb3/Ethereum scripts. In the code these terms are used interchangeably but alway refer to one or the other depending on the context.

Lamden to ETH/BSC

1. Connect Lamden Wallet

• Get the amount of tokens to be swapped
  • Validate the user has the amount of tokens needed to swap in their wallet

2. Connect Metamast Wallet

• Get the user's metamask address
  • This address is signed in the proof by the operator
• Verify the wallet is on the correct network

3. Lamden Bridge Contract Approval

• The user sends an approval to the token they are swapping to approve the lamden bride to take the swap amount of their tokens
• The amount of approval the user has should be checked first before sending this transaction. if they already have enough approval then this isn't needed. This check also helps with resuming as the approval will already be there.

4. Lamden Bridge Contract Burn - The user sends a transaction to the bridge contract to burn the swap amount of tokens

• External to the lamden link website a piece of operator software will see this burn and sign it. posting this signature back into the bridge contract on the blockchain

5. Get Proof - The UI waits and gets the proof that the operator submits to the blockchain
6. ETH/BSC Withdraw - The user sends this proof to the BSC/ETH lamden link contract as proof of the burn and the contract will send them the tokens they burnt to the metamast address they selected.

Considerations for Resuming these swaps

a) After step 4 the tokens will be burned and the proof will be set to the blockchain. This proof consists of a Nonce, which the ETH/BSC contracts will use to prevent a replay attack. This means that if another swap is redeemed from the ETH/BSC contract by this users MEtamast address then the current swap will be invalid.

• The Nonce is incremented on each burn
• The ETH/BSC contract looks for nonce > current nonce and then sets current nonce to = that of the proof once it's processed.
• This means that if a subsequent swap is redeemed before the current one then the current one is invalid
  b) The metamask address in which was sent as part of the burn transaction must be the metamask address used to send the withdraw tx in step 6. So if the user resumes after Step 4 then consideration must be given to make sure the user connects their metamast to the same address (and network)
  c) if the burn already happened then it's actually not necessary to reconnect the Lamden Wallet as the lamden wallet unlike it does now.

ETH/BSC to Lamden

1. Connect Metamask wallet

• Get's the user's eth address
• Validate the user is on the proper network
• get token swap amount
  • validate the user has the amount of tokens in their wallet

2. Connect Lamden Wallet

• Whatever address is connected will get minted the tokens in step 4

3. ETH/BSC Token Approval transaction

• User sends a transaction to the token contract of the token to be swapped to give the Lamden ETH/BSC contract access to the amount of coins to be swapped
• The amount of token approval should be checked before attempting this. If there is enough approval available to cover the swap then we don't need to do this step.

3. Lamden Bridge Deposit transaction

• User sends a transaction to the Lamden Bridge ETH/BSC contract to have the bridge take the tokens.
• This creates a TokensWrapped event

4. Operator software sees TokensWrapped event, waits 20 confirmations and then Mints the token swap amount to the user on Lamden

Considerations for Resuming these swaps

a) This process can be restarted entirely until step 3 is complete. Once the Lamden Bridge Deposit transaction is complete the rest is upto the Operator to complete.
b) currently the UI stores the tx hash received from metamask when the user confirms the tx and then waits for that tx to succeed. This allows for the UI to resume this transaction (just check if this tx has been successful or not) but the process will break down if the user speeds up the transaction in metamask (there will be a newer tx hash we never know about).
c) If the BSC/ETH deposit tx in step 3 completes the swap is ASSUMED to be finished as the Lamden Operator tx is quick. It's possible that the Lamden Operator doesn't process the transaction.. the UI currently doesn't have a way to check at Lamden did it's job.