Make offramp flow continuable

[TorstenStueber]

If the user closes their browser tab, then instead of losing access to their ephemeral accounts and losing tokens that are currently stored in them or being bridged to them, they should be able to recover and continue the offramping flow.

TODO

Use the local storage to store:

• the seed of the ephemeral account on Pendulum
• the seed of the ephemeral account on Stellar
• all completely signed transactions for the ephemeral accounts
• the current state of the flow (see below)

The state should uniquely identify where the flow currently is, identified by what transactions have been successfully executed:

• 1 state per transaction of the Axelar squid router flow (to be done)
• 1 state per transaction of phase 6A (to be done)
• 1 state for each transaction on Stellar

Behavior

• Once the offramping flow is completed (the merge account transaction on Stellar has been executed), completely remove the state in the local storage
• Whenever the app starts, first check whether the local storage contains state about some ongoing offramping flow
  • In this case don't show the usual UI but switch to the screen that shows the current state of the offramping flow, continuing at the current state
• Log the ephemeral secrets to the console whenever
  • when a new offramping flow starts and new ephemeral secrets have been created
  • the app starts and the local storage is not empty

Extra Considerations

• We don't need to store the transactions that are executed on Polygon, instead we can just recreate and them and let the user re-sign them using their Polygon wallet
  • However, we need to store the current state in order not to re-execute transactions
• This issue requires that we can create and sign all transactions right at the beginning before we even start the offramping flow

Architecture

To make this code clean, I recommend that we

• clearly separate the React code from the logic
• ideally the logic is divided into functions, one per state, each of which:
  • takes all values stored in the local storage
  • submit a single transaction (that is associated with the current state)
  • wait for it to be
  • successful
  • or not successful due to the nonce being incorrect (we assume that this transaction has already been submitted but the browser closed before it was confirmed to be successful)
  • return the new state
• then the "event loop" consists of:
  • picking the proper function, depending on the current state
  • calling it, providing the local storage as an argument
  • update the state in the local storage with the return result or finish and delete the local storage if there is no subsequent state

[TorstenStueber]

Hey team! Please add your planning poker estimate with Zenhub @b-yap @bogdanS98 @ebma @gianfra-t

[gianfra-t]

How much of a refactor do we want to do here? I like the architecture idea, but should replace the current logic we have right now at polygon-offramp-staging? Or, is this relevant for when we integrate the new UI?

[prayagd]

Moved this to review as it is been currently reviewed

[ebma]

Closing this now that https://github.com/pendulum-chain/vortex/pull/70 is merged.