feat: add receive via bitcoin address button

[pavanjoshi914]

Describe the changes you have made in this PR

add receive via bitcoin address button
styling button
adding translations
add ReceiveOnChain component
resolve missing key prop for translations
show button only when its an alby account

Type of change

• feat: New feature (non-breaking change which adds functionality)

Screenshots of the changes [optional]

Checklist

• My code follows the style guidelines of this project and performed a self-review of my own code
• New and existing tests pass locally with my changes
• checked if I need to make corresponding changes to the documentation (and made those changes if needed)

[github-actions]

🚀 Thanks for the pull request!

Here are the current build files for testing:

• chrome.zip.zip
• firefox.xpi.zip
• opera.crx.zip

Download and unzip the file for your browser. Refer to the readme for detailed install instructions.

Don't forget: keep earning sats!

[rolznz]

@stackingsaunter do you have a figma file @pavanjoshi914 can review to ensure he gets the styles right?

For example, I think the action button normally should be at the bottom of the popup (to be confirmed)

[stackingsaunter]

Let's put the button at the bottom and maybe center the text on the screen (so it's in the middle not on the top). Not super elegant but I think this is temporary solution anyway, as soon we can have swaps within the extension, so let's just merge it!

[pavanjoshi914]

Let's put the button at the bottom and maybe center the text on the screen (so it's in the middle not on the top). Not super elegant but I think this is temporary solution anyway, as soon we can have swaps within the extension, so let's just merge it!

do this looks good? cc @rolznz @stackingsaunter

[rolznz]

@pavanjoshi914 I found one minor spacing issue. I think the OR + buttons should be aligned at the bottom. @stackingsaunter could you confirm?

Otherwise looks good to me!

[reneaaron]

Let's do another feedback loop and review the copy of this PR, other than that:

tACK

[stackingsaunter]

Regarding layout, not sure which feels better. @reneaaron @pavanjoshi914 @rolznz thoughts?

Besides that small suggested small changes, otherwise tACK

• Change "or" to small caps
• Change screen title to "Receive via bitcoin address"
• Change first part of copy to "To receive Bitcoin via standard address, log-in to Alby Account on getalby.com"

[pavanjoshi914]

thanks for the changes. shall we replacd the "or" in lnd screen as "or" is placed in common set of strings now

[rolznz]

@pavanjoshi914 I think it is fine to change to "or". It might be nice to have a Divider component, and then we could also use it in the LND connect screen. What do you guys think? (Maybe this could be done as a follow up PR?)

[pavanjoshi914]

@pavanjoshi914 I think it is fine to change to "or". It might be nice to have a Divider component, and then we could also use it in the LND connect screen. What do you guys think? (Maybe this could be done as a follow up PR?)

let's do this in follow up pr in think

[pavanjoshi914]

@reneaaron can we merge this?