bitcoin manual withdraw when exchange has btc currency

2 files changed, 93 insertions, 13 deletions

diff --git a/packages/taler-wallet-webextension/src/wallet/ReserveCreated.stories.tsx b/packages/taler-wallet-webextension/src/wallet/ReserveCreated.stories.tsx
index 8d7b65b3c..16ce6120a 100644
--- a/packages/taler-wallet-webextension/src/wallet/ReserveCreated.stories.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ReserveCreated.stories.tsx
@@ -51,3 +51,15 @@ export const IBAN = createExample(TestedComponent, {
   },
   exchangeBaseUrl: "https://exchange.demo.taler.net",
 });
+
+export const Bitcoin = createExample(TestedComponent, {
+  reservePub: "0ZSX8SH0M30KHX8K3Y1DAMVGDQV82XEF9DG1HC4QMQ3QWYT4AF00",
+  payto:
+    "payto://bitcoin/bc1qw508d6qejxtdg4y5r3zarvary0c5xw7kv8f3t4?amount=BTC:0.1&subject=0ZSX8SH0M30KHX8K3Y1DAMVGDQV82XEF9DG1HC4QMQ3QWYT4AF00",
+  amount: {
+    currency: "BTC",
+    value: 0,
+    fraction: 14000000,
+  },
+  exchangeBaseUrl: "https://exchange.demo.taler.net",
+});
diff --git a/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx b/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx
index 2c0e2fd31..08326f828 100644
--- a/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx
+++ b/packages/taler-wallet-webextension/src/wallet/ReserveCreated.tsx
@@ -1,4 +1,11 @@
-import { AmountJson, parsePaytoUri, i18n } from "@gnu-taler/taler-util";
+import {
+  AmountJson,
+  parsePaytoUri,
+  i18n,
+  generateSegwitAddress,
+  Amounts,
+  segwitMinAmount,
+} from "@gnu-taler/taler-util";
 import { Fragment, h, VNode } from "preact";
 import { BankDetailsByPaytoType } from "../components/BankDetailsByPaytoType";
 import { QR } from "../components/QR";
@@ -30,18 +37,62 @@ export function ReserveCreated({
       </div>
     );
   }
-  return (
-    <Fragment>
+  function TransferDetails(): VNode {
+    if (!paytoURI) return <Fragment />;
+    if (paytoURI.targetType === "bitcoin") {
+      const { segwitAddr1, segwitAddr2 } = generateSegwitAddress(reservePub);
+      const min = segwitMinAmount();
+      return (
+        <section>
+          <p>
+            <i18n.Translate>
+              Bitcoin exchange need a transaction with 3 output, one output is
+              the exchange account and the other two are segwit fake address for
+              metadata with an minimum amount. Reserve pub : {reservePub}
+            </i18n.Translate>
+          </p>
+          <p>
+            <i18n.Translate>
+              In bitcoincore wallet use 'Add Recipient' button to add two
+              additional recipient and copy adresses and amounts
+            </i18n.Translate>
+            <ul>
+              <li>
+                {paytoURI.targetPath} {Amounts.stringifyValue(amount)} BTC
+              </li>
+              <li>
+                {segwitAddr1} {Amounts.stringifyValue(min)} BTC
+              </li>
+              <li>
+                {segwitAddr2} {Amounts.stringifyValue(min)} BTC
+              </li>
+            </ul>
+            <i18n.Translate>
+              In Electrum wallet paste the following three lines in 'Pay to'
+              field :
+            </i18n.Translate>
+            <ul>
+              <li>
+                {paytoURI.targetPath},{Amounts.stringifyValue(amount)}
+              </li>
+              <li>
+                {segwitAddr1},{Amounts.stringifyValue(min)}
+              </li>
+              <li>
+                {segwitAddr2},{Amounts.stringifyValue(min)}
+              </li>
+            </ul>
+            <i18n.Translate>
+              Make sure the amount show{" "}
+              {Amounts.stringifyValue(Amounts.sum([amount, min, min]).amount)}{" "}
+              BTC, else you have to change the base unit to BTC
+            </i18n.Translate>
+          </p>
+        </section>
+      );
+    }
+    return (
       <section>
-        <h1>
-          <i18n.Translate>Exchange is ready for withdrawal</i18n.Translate>
-        </h1>
-        <p>
-          <i18n.Translate>
-            To complete the process you need to wire
-            <b>{amountToString(amount)}</b> to the exchange bank account
-          </i18n.Translate>
-        </p>
         <BankDetailsByPaytoType
           amount={amountToString(amount)}
           exchangeBaseUrl={exchangeBaseUrl}
@@ -57,10 +108,27 @@ export function ReserveCreated({
           </WarningBox>
         </p>
       </section>
+    );
+  }
+
+  return (
+    <Fragment>
+      <section>
+        <h1>
+          <i18n.Translate>Exchange is ready for withdrawal</i18n.Translate>
+        </h1>
+        <p>
+          <i18n.Translate>
+            To complete the process you need to wire{` `}
+            <b>{amountToString(amount)}</b> to the exchange bank account
+          </i18n.Translate>
+        </p>
+      </section>
+      <TransferDetails />
       <section>
         <p>
           <i18n.Translate>
-            Alternative, you can also scan this QR code or open
+            Alternative, you can also scan this QR code or open{" "}
             <a href={payto}>this link</a> if you have a banking app installed
             that supports RFC 8905
           </i18n.Translate>