feat: add from/to to confirmation (#563)

Author: aganglada

packages/snap/snap.manifest.json

@@ -1,13 +1,13 @@
 {
-  "version": "1.4.5",
+  "version": "1.5.0",
   "description": "Manage Bitcoin using MetaMask",
   "proposedName": "Bitcoin",
   "repository": {
     "type": "git",
     "url": "https://github.com/MetaMask/snap-bitcoin-wallet.git"
   },
   "source": {
-    "shasum": "nGyqPBVxGl7PFfJfi2eo+6zuj0ExrR55GPcK8mKy/lU=",
+    "shasum": "j9W3ulkpAGrL0lkkChX7wavGEY3qq6nCf4lQ0KmmF78=",
     "location": {
       "npm": {
         "filePath": "dist/bundle.js",

packages/snap/src/infra/jsx/unified-send-flow/UnifiedSendFormView.tsx

@@ -35,7 +35,8 @@ export const UnifiedSendFormView: SnapComponent<UnifiedSendFormViewProps> = ({
   messages,
 }) => {
   const t = translate(messages);
-  const { amount, exchangeRate, network, from, explorerUrl } = context;
+  const { amount, exchangeRate, network, from, recipient, explorerUrl } =
+    context;
 
   const psbt = Psbt.from_string(context.psbt);
   const fee = psbt.fee().to_sat();
@@ -87,7 +88,7 @@ export const UnifiedSendFormView: SnapComponent<UnifiedSendFormViewProps> = ({
           <Box>{null}</Box>
           <Box alignment="space-between" direction="horizontal">
             <SnapText fontWeight="medium" color="alternative">
-              {t('confirmation.account')}
+              {t('from')}
             </SnapText>
             {isValidSnapLinkProtocol(explorerUrl) ? (
               <Link href={displayExplorerUrl(explorerUrl, from)}>
@@ -98,6 +99,29 @@ export const UnifiedSendFormView: SnapComponent<UnifiedSendFormViewProps> = ({
             )}
           </Box>
           <Box>{null}</Box>
+          <Box alignment="space-between" direction="horizontal">
+            <SnapText fontWeight="medium" color="alternative">
+              {t('toAddress')}
+            </SnapText>
+            {isValidSnapLinkProtocol(explorerUrl) ? (
+              <Link href={displayExplorerUrl(explorerUrl, recipient)}>
+                <Address
+                  address={displayCaip10(network, recipient)}
+                  truncate
+                  displayName
+                  avatar
+                />
+              </Link>
+            ) : (
+              <Address
+                address={displayCaip10(network, recipient)}
+                truncate
+                displayName
+                avatar
+              />
+            )}
+          </Box>
+          <Box>{null}</Box>
           <Box alignment="space-between" direction="horizontal">
             <SnapText fontWeight="medium" color="alternative">
               {t('network')}