feat: block explorer link in environment file

.env

@@ -6,3 +6,6 @@ REACT_APP_BOLTZ_API=http://localhost:9001
 # Network configurations
 REACT_APP_BITCOIN_NETWORK=bitcoinSimnet
 REACT_APP_LITECOIN_NETWORK=litecoinSimnet
+
+REACT_APP_BITCOIN_EXPLORER=https://blockstream.info/testnet/tx
+REACT_APP_LITECOIN_EXPLORER=https://chain.so/tx/LTCTEST

src/constants/index.js

@@ -4,3 +4,6 @@ export const boltzApi = process.env.REACT_APP_BOLTZ_API;
 
 export const bitcoinNetwork = Networks[process.env.REACT_APP_BITCOIN_NETWORK];
 export const litecoinNetwork = Networks[process.env.REACT_APP_LITECOIN_NETWORK];
+
+export const bitcoinExplorer = process.env.REACT_APP_BITCOIN_EXPLORER;
+export const litecoinExplorer = process.env.REACT_APP_LITECOIN_EXPLORER;

src/scripts/utils.js

@@ -1,4 +1,9 @@
-import { bitcoinNetwork, litecoinNetwork } from '../constants';
+import {
+  bitcoinNetwork,
+  litecoinNetwork,
+  bitcoinExplorer,
+  litecoinExplorer,
+} from '../constants';
 
 // Number satohis and litoshis in a whole coin
 const decimals = 100000000;
@@ -89,3 +94,10 @@ export const copyToClipBoard = () => {
 export const getNetwork = symbol => {
   return symbol === 'BTC' ? bitcoinNetwork : litecoinNetwork;
 };
+
+/**
+ * Get the block explorer URL for a currency
+ */
+export const getExplorer = symbol => {
+  return symbol === 'BTC' ? bitcoinExplorer : litecoinExplorer;
+};

src/views/refund/refund.js

@@ -28,7 +28,7 @@ const uploadRefundFileText = (refundFile, txHash) => {
   if (Object.keys(refundFile).length === 0) {
     return 'Upload refund file';
   } else if (txHash === '') {
-    return 'Input transaction hash';
+    return 'Paste transaction hash';
   }
 };
 
@@ -85,7 +85,10 @@ const Refund = ({
             <StepsWizard.Step
               num={3}
               render={() => (
-                <CompleteRefund refundTransactionHash={refundTransactionHash} />
+                <CompleteRefund
+                  currency={refundFile.currency}
+                  refundTransactionHash={refundTransactionHash}
+                />
               )}
             />
           </StepsWizard.Steps>

src/views/refund/steps/completeRefund.js

@@ -2,6 +2,7 @@ import React from 'react';
 import injectSheet from 'react-jss';
 import PropTypes from 'prop-types';
 import View from '../../../components/view';
+import { getExplorer } from '../../../scripts/utils';
 import { FaCheckCircle } from 'react-icons/fa';
 
 const CompleteRefundStyles = theme => ({
@@ -29,13 +30,13 @@ const CompleteRefundStyles = theme => ({
   },
 });
 
-const StyledCompleteRefund = ({ classes, refundTransactionHash }) => (
+const StyledCompleteRefund = ({ classes, currency, refundTransactionHash }) => (
   <View className={classes.wrapper}>
     <FaCheckCircle size={200} className={classes.icon} />
     <span className={classes.title}> Success! </span>
     <p className={classes.transaction}>
       <a
-        href={`https://blockstream.info/tx/${refundTransactionHash}`}
+        href={`${getExplorer(currency)}/${refundTransactionHash}`}
         target="_blank"
         rel="noopener noreferrer"
       >
@@ -48,6 +49,7 @@ const StyledCompleteRefund = ({ classes, refundTransactionHash }) => (
 
 StyledCompleteRefund.propTypes = {
   classes: PropTypes.object.isRequired,
+  currency: PropTypes.string.isRequired,
   refundTransactionHash: PropTypes.string.isRequired,
 };
 

src/views/swap/steps/sendTransaction.js

@@ -3,11 +3,7 @@ import PropTypes from 'prop-types';
 import injectSheet from 'react-jss';
 import View from '../../../components/view';
 import QrCode from '../../../components/qrcode';
-import {
-  getCurrencyName,
-  toWholeCoins,
-  copyToClipBoard,
-} from '../../../scripts/utils';
+import { toWholeCoins, copyToClipBoard } from '../../../scripts/utils';
 
 const SendTransactionStyles = () => ({
   wrapper: {
@@ -62,25 +58,25 @@ const StyledSendTransaction = ({ classes, swapInfo, swapResponse }) => (
           {' '}
           {toWholeCoins(swapResponse.expectedAmount)} {swapInfo.base}{' '}
         </b>{' '}
-        <br />
-        on <b>{getCurrencyName(swapInfo.base)}</b> <br />
-        blockchain address:
+        to this address:
       </p>
       <p className={classes.address} id="copy">
         {swapResponse.address}
       </p>
       <span className={classes.action} onClick={() => copyToClipBoard()}>
         Copy
       </span>
-      <p>
-        If the address does not work with your wallet: <br />
-        <a
-          target={'_blank'}
-          href="https://litecoin-project.github.io/p2sh-convert/"
-        >
-          use this tool
-        </a>
-      </p>
+      {swapInfo.base === 'LTC' ? (
+        <p>
+          If the address does not work with your wallet: <br />
+          <a
+            target={'_blank'}
+            href="https://litecoin-project.github.io/p2sh-convert/"
+          >
+            use this tool
+          </a>
+        </p>
+      ) : null}
     </View>
   </View>
 );