LNURL invoice can be received by pasting in to send. Needs UX improvement

[dvoroneca]

trafficstars

We must have an option for the user to paste the LNURL invoice when users want to receive payment from other wallets. I suggest we add a switch component.

• [ ] We have a switch component in the transactions screen. We reuse it with 1. Create an invoice and 2. Paste an invoice.

• [ ] Paste an invoice page that will consist of an input field and a Next button

• [ ] Add a success screen from https://github.com/getAlby/lightning-browser-extension/pull/1446#issuecomment-1259384465

Figma File

As a bonus point: Can we please move our buttons to the bottom of the screen? Thanks.

[dvoroneca]

We can work on the component to make it nicer for the coming sprint.

1. We can have a simple text switch:

2. Or we can make a component with some style:

Check out the Figma file here

[bitcoinuser]

For me make much more sense use the text "redeem funds" instead of "paste an invoice"

[bitcoinuser]

And instead of "Lnurl invoice" I would use "Redeem code".

[reneaaron]

I generally agree to write copy from the user perspective, but as protocols are currently being established I feel like it is important to let the user know what is being used here.

I wouldn't know what I am supposed to paste if an extension wants a "redeem code" from me, probably I'd assume that would be a proprietary thing.

But maybe there are other ways to improve the overall flow, I just summarized an idea we had here:

https://github.com/getAlby/lightning-browser-extension/issues/1564

[escapedcat]

Thanks everyone! Moving the technical implementation to milestone 1.18

Regarding adjusting tab-style I suggest to first go with the current tabs and push this fix out.
@dvoroneca I move the UI update into a new issue, which can also be a "good first issue".

[stackingsaunter]

Issue solved