convert payment addr to hex & make payment hash copyable

decred · Aug 17, 2021 · ed97e24 · ed97e24
1 parent 10788f5
commit ed97e24
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 3 deletions.
diff --git a/app/components/views/LNPage/SendTab/DecodedPayRequest/DecodedPayRequest.jsx b/app/components/views/LNPage/SendTab/DecodedPayRequest/DecodedPayRequest.jsx
@@ -92,7 +92,13 @@ const DecodedPayRequest = ({
       <label>
         <T id="ln.paymentsTab.paymentHashLabel" m="Payment Hash" />:
       </label>
-      {decoded.paymentHash}
+      <div className={styles.paymentHashContainer}>
+        <span className={styles.paymentHash}>{decoded.paymentHash}</span>
+        <CopyToClipboard
+          textToCopy={decoded.paymentHash}
+          ButtonComponent={SmallButton}
+        />
+      </div>
     </div>
 
     <DetailsTable

diff --git a/app/components/views/LNPage/SendTab/DecodedPayRequest/DecodedPayRequest.module.css b/app/components/views/LNPage/SendTab/DecodedPayRequest/DecodedPayRequest.module.css
@@ -70,12 +70,24 @@
   grid-row-gap: 5px;
   margin-top: 15px;
   line-height: 16px;
+  align-items: center;
 }
 
 .dataGrid label {
   padding-right: 10px;
+  margin: 0;
 }
 
 .details {
   margin-top: 30px;
 }
+
+.paymentHashContainer {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+
+.paymentHash {
+  padding-right: 10px;
+}
diff --git a/app/components/views/LNPage/SendTab/DecodedPayRequest/helpers.js b/app/components/views/LNPage/SendTab/DecodedPayRequest/helpers.js
@@ -20,7 +20,7 @@ export const getDecodedPayRequestDetails = (decoded) => {
       label: (
         <T id="ln.decodedPayRequestDetails.paymentAddr" m="Payment Address" />
       ),
-      value: decoded.paymentAddr,
+      value: decoded.paymentAddrHex,
       truncate: 40
     }
   ];

diff --git a/app/components/views/LNPage/SendTab/hooks.js b/app/components/views/LNPage/SendTab/hooks.js
@@ -126,6 +126,9 @@ export function useSendTab(setTimeout) {
         if (!expired) {
           setTimeout(checkExpired, timeToExpire + 1000);
         }
+        resp.paymentAddrHex = Buffer.from(resp.paymentHash, "base64").toString(
+          "hex"
+        );
         setDecodedPayRequest(resp);
         setDecodingError(null);
         setExpired(expired);

diff --git a/test/unit/components/views/LNPage/SendTab.spec.js b/test/unit/components/views/LNPage/SendTab.spec.js
@@ -174,6 +174,7 @@ const mockValidDecodedPayRequest = {
   cltvExpiry: 80,
   routeHintsList: [],
   paymentAddr: "mock-payment-address",
+  paymentAddrHex: "9a8724fa96b299e9edfa16ac",
   numMAtoms: 1000000000,
   featuresMap: [
     [
@@ -271,7 +272,7 @@ test("test send form with valid lightning request", async () => {
     `Fallback Address:${mockValidDecodedPayRequest.fallbackAddr}`
   );
   expect(screen.getByText("Payment Address:").parentNode.textContent).toMatch(
-    `Payment Address:${mockValidDecodedPayRequest.paymentAddr}`
+    `Payment Address:${mockValidDecodedPayRequest.paymentAddrHex}`
   );
 
   // close details