Distinguish between receiver and initiator of a payment

[reneaaron]

Describe the bug See https://github.com/getAlby/lightning-browser-extension/pull/762#discussion_r839345174

The only situation where we know something about the receiver is when we pay to a lightning address in directly.

Use-Case	Initiator	Receiver
Pay to Lightning Adress	Alby	✅
Pay an invoice in Alby	Alby	❌
Pay via WebLN (Invoice)	Website	❌

The UI of Alby should reflect what we know about the payment being made.

Affected areas

• Payment dialogs
• Payment notifications

To Reproduce

Pay an invoice in Alby

1. Open Alby
2. Paste an invoice

The UI currently indicates that one is paying to Alby, while Alby is only the initiator of the payment.

Pay via WebLN

1. Pay an invoice via WebLN

The UI currently indicates that one is paying to the website, while the website ist only the initiator of the payment.

Are you working on this issue? No

[escapedcat]

Looking into this.

Filling this would be helpful:

Expected behavior

A clear and concise description of what you expected to happen

[bumi]

maybe let's pair on this?

And I think this should be tackled when we do @dvoroneca new designs. One major topic here is that we don't show the Alby publisher card as seen in the screenshot above. (we currently do that because we reused a component that expects origin data that typically comes from the website that initiates the payment. )

so we must check which components are used in these flows and what we can reuse and what we need to adjust.

[escapedcat]

• src/app/screens/ConfirmPayment/index.tsx should not be used for sending sats manually via the ext-popup.
  ext-popup should use it's own "confirmPayment"-component.
• notification: should leave out the origin and not display "...to >Alby<"