Transaction flow

apps/coordinator/src/actions/transactionActions.js

@@ -52,6 +52,7 @@ export const SET_CHANGE_ADDRESS = "SET_CHANGE_ADDRESS";
 export const SET_SIGNING_KEY = "SET_SIGNING_KEY";
 export const SET_SPEND_STEP = "SET_SPEND_STEP";
 export const SET_BALANCE_ERROR = "SET_BALANCE_ERROR";
+export const SET_BROADCASTING = "SET_BROADCASTING";
 export const SPEND_STEP_CREATE = 0;
 export const SPEND_STEP_PREVIEW = 1;
 export const SPEND_STEP_SIGN = 2;
@@ -238,6 +239,13 @@ export function setTXID(txid) {
   };
 }
 
+export function setBroadcasting(value) {
+  return {
+    type: SET_BROADCASTING,
+    value,
+  };
+}
+
 export function setIsWallet() {
   return {
     type: SET_IS_WALLET,

apps/coordinator/src/components/ScriptExplorer/Transaction.jsx

@@ -20,7 +20,7 @@ import { OpenInNew } from "@mui/icons-material";
 import { updateBlockchainClient } from "../../actions/clientActions";
 import Copyable from "../Copyable";
 import { externalLink } from "utils/ExternalLink";
-import { setTXID } from "../../actions/transactionActions";
+import { setTXID, setBroadcasting } from "../../actions/transactionActions";
 import {
   convertLegacyInput,
   convertLegacyOutput,
@@ -76,12 +76,13 @@ class Transaction extends React.Component {
   };
 
   handleBroadcast = async () => {
-    const { getBlockchainClient, setTxid } = this.props;
+    const { getBlockchainClient, setTxid, setBroadcastingFlag } = this.props;
     const client = await getBlockchainClient();
     const signedTransaction = this.buildSignedTransaction();
     let error = "";
     let txid = "";
     this.setState({ broadcasting: true });
+    setBroadcastingFlag(true);
     try {
       txid = await client.broadcastTransaction(signedTransaction);
     } catch (e) {
@@ -91,6 +92,7 @@ class Transaction extends React.Component {
     } finally {
       this.setState({ txid, error, broadcasting: false });
       setTxid(txid);
+      setBroadcastingFlag(false);
     }
   };
 
@@ -154,6 +156,7 @@ Transaction.propTypes = {
   inputs: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
   outputs: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
   setTxid: PropTypes.func.isRequired,
+  setBroadcastingFlag: PropTypes.func.isRequired,
   signatureImporters: PropTypes.shape({}).isRequired,
   getBlockchainClient: PropTypes.func.isRequired,
   enableRBF: PropTypes.bool.isRequired,
@@ -174,6 +177,7 @@ function mapStateToProps(state) {
 const mapDispatchToProps = {
   setTxid: setTXID,
   getBlockchainClient: updateBlockchainClient,
+  setBroadcastingFlag: setBroadcasting,
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(Transaction);