Display transaction hash with XDR input

stellar · Oct 29, 2024 · 05f3b1f · 05f3b1f
1 parent 6e77686
commit 05f3b1f
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 0 deletions.
diff --git a/src/app/(sidebar)/transaction/submit/page.tsx b/src/app/(sidebar)/transaction/submit/page.tsx
@@ -35,6 +35,7 @@ import { ValidationResponseCard } from "@/components/ValidationResponseCard";
 import { TxResponse } from "@/components/TxResponse";
 import { SaveTransactionModal } from "@/components/SaveTransactionModal";
 import { SdsLink } from "@/components/SdsLink";
+import { TransactionHashReadOnlyField } from "@/components/TransactionHashReadOnlyField";
 
 import {
   HorizonErrorResponse,
@@ -482,6 +483,11 @@ export default function SubmitTransaction() {
             hasCopyButton
           />
 
+          <TransactionHashReadOnlyField
+            xdr={xdr.blob}
+            networkPassphrase={network.passphrase}
+          />
+
           <Box
             gap="lg"
             direction="row"

diff --git a/src/app/(sidebar)/xdr/view/page.tsx b/src/app/(sidebar)/xdr/view/page.tsx
@@ -23,6 +23,7 @@ import { SdsLink } from "@/components/SdsLink";
 import { XdrPicker } from "@/components/FormElements/XdrPicker";
 import { XdrTypeSelect } from "@/components/XdrTypeSelect";
 import { PrettyJsonTransaction } from "@/components/PrettyJsonTransaction";
+import { TransactionHashReadOnlyField } from "@/components/TransactionHashReadOnlyField";
 
 import { parseToLosslessJson } from "@/helpers/parseToLosslessJson";
 import { useIsXdrInit } from "@/hooks/useIsXdrInit";
@@ -136,6 +137,11 @@ export default function ViewXdr() {
             disabled={isFetchingLatestTxn}
           />
 
+          <TransactionHashReadOnlyField
+            xdr={xdr.blob}
+            networkPassphrase={network.passphrase}
+          />
+
           <XdrTypeSelect error={xdrJsonDecoded?.error} />
 
           <>

diff --git a/src/components/TransactionHashReadOnlyField.tsx b/src/components/TransactionHashReadOnlyField.tsx
@@ -0,0 +1,25 @@
+import { Input } from "@stellar/design-system";
+import { transactionHashFromXdr } from "@/helpers/transactionHashFromXdr";
+
+export const TransactionHashReadOnlyField = ({
+  xdr,
+  networkPassphrase,
+}: {
+  xdr: string;
+  networkPassphrase: string;
+}) => {
+  if (!xdr) {
+    return null;
+  }
+
+  return (
+    <Input
+      id="tx-hash"
+      fieldSize="md"
+      label="Transaction hash"
+      value={transactionHashFromXdr(xdr, networkPassphrase)}
+      copyButton={{ position: "right" }}
+      disabled
+    />
+  );
+};
diff --git a/src/helpers/transactionHashFromXdr.ts b/src/helpers/transactionHashFromXdr.ts
@@ -0,0 +1,6 @@
+import { TransactionBuilder } from "@stellar/stellar-sdk";
+
+export const transactionHashFromXdr = (
+  xdr: string,
+  networkPassphrase: string,
+) => TransactionBuilder.fromXDR(xdr, networkPassphrase).hash().toString("hex");