refactor: simplify blockexplorer link

src/components/BlockExplorer.tsx

@@ -2,7 +2,7 @@ import { chooseUrl, config } from "../config";
 import { useGlobalContext } from "../context/Global";
 
 const blockExplorerLink = (asset: string, isTxId: boolean, val: string) => {
-    const basePath = chooseUrl(config.assets[asset].blockExplorerUrl);
+    const basePath = chooseUrl(config.assets[asset]?.blockExplorerUrl);
     return `${basePath}/${isTxId ? "tx" : "address"}/${val}`;
 };
 

src/consts/Types.ts

@@ -1,4 +1,4 @@
 export type ButtonLabelParams = {
     key: string;
-    params?: Record<string, string>;
+    params?: Record;
 };

src/context/Global.tsx

@@ -37,8 +37,6 @@ export type GlobalContextType = {
     setWasmSupported: Setter<boolean>;
     refundAddress: Accessor<string | null>;
     setRefundAddress: Setter<string | null>;
-    transactionToRefund: Accessor<string | null>;
-    setTransactionToRefund: Setter<string | null>;
     i18n: Accessor<string | null>;
     setI18n: Setter<string | null>;
     notification: Accessor<string>;
@@ -107,10 +105,6 @@ const GlobalProvider = (props: { children: any }) => {
     const [wasmSupported, setWasmSupported] = createSignal<boolean>(true);
     const [refundAddress, setRefundAddress] = createSignal<string | null>(null);
 
-    const [transactionToRefund, setTransactionToRefund] = createSignal<
-        string | null
-    >(null);
-
     const [i18n, setI18n] = createSignal<string | null>(null);
 
     const [notification, setNotification] = createSignal<string>("");
@@ -326,8 +320,6 @@ const GlobalProvider = (props: { children: any }) => {
                 setWasmSupported,
                 refundAddress,
                 setRefundAddress,
-                transactionToRefund,
-                setTransactionToRefund,
                 i18n,
                 setI18n,
                 notification,

src/context/Pay.tsx

@@ -6,26 +6,22 @@
     useContext,
 } from "solid-js";
 
+import { SwapStatusTransaction } from "../utils/boltzClient";
 import { SomeSwap } from "../utils/swapCreator";
 
 export type PayContextType = {
-    failureReason: Accessor<string>;
-    setFailureReason: Setter<string>;
-    swap: Accessor<SomeSwap | null>;
-    setSwap: Setter<SomeSwap | null>;
-    swapStatus: Accessor<string>;
-    setSwapStatus: Setter<string>;
-    swapStatusTransaction: Accessor<SwapStatusTransaction>;
-    setSwapStatusTransaction: Setter<SwapStatusTransaction>;
+    failureReason: Accessor;
+    setFailureReason: Setter;
+    swap: Accessor;
+    setSwap: Setter;
+    swapStatus: Accessor;
+    setSwapStatus: Setter;
+    swapStatusTransaction: Accessor;
+    setSwapStatusTransaction: Setter;
 };
 
 const PayContext = createContext<PayContextType>();
 
-type SwapStatusTransaction = {
-    hex?: string;
-    id?: string;
-};
-
 const PayProvider = (props: { children: any }) => {
     const [failureReason, setFailureReason] = createSignal<string>("");
     const [swap, setSwap] = createSignal<SomeSwap | null>(null, {
@@ -34,7 +30,7 @@
     });
     const [swapStatus, setSwapStatus] = createSignal<string>("");
     const [swapStatusTransaction, setSwapStatusTransaction] =
-        createSignal<SwapStatusTransaction>({});
+        createSignal<SwapStatusTransaction | null>(null);
 
     return (
         <PayContext.Provider

src/pages/Pay.tsx

@@ -1,22 +1,11 @@
 import { useParams } from "@solidjs/router";
 import log from "loglevel";
-import {
-    Match,
-    Show,
-    Switch,
-    createEffect,
-    createSignal,
-    onCleanup,
-} from "solid-js";
+import { Match, Show, Switch, createEffect, onCleanup } from "solid-js";
 
-import BlockExplorerLink, {
-    TransactionType,
-} from "../components/BlockExplorerLink";
 import LoadingSpinner from "../components/LoadingSpinner";
 import { SwapIcons } from "../components/SwapIcons";
 import SettingsCog from "../components/settings/SettingsCog";
 import SettingsMenu from "../components/settings/SettingsMenu";
-import { RBTC } from "../consts/Assets";
 import { SwapType } from "../consts/Enums";
 import {
     swapStatusFailed,
@@ -42,11 +31,6 @@ import { getRelevantAssetForSwap } from "../utils/swapCreator";
 
 const Pay = () => {
     const params = useParams();
-    const [contractTransaction, setContractTransaction] =
-        createSignal<string>(undefined);
-    const [contractTransactionType, setContractTransactionType] = createSignal(
-        TransactionType.Lockup,
-    );
 
     const { getSwap, t } = useGlobalContext();
     const {
@@ -68,24 +52,6 @@ const Pay = () => {
             setSwapStatus(res.status);
             setSwapStatusTransaction(res.transaction);
             setFailureReason(res.failureReason);
-
-            // RSK
-            if (
-                asset === RBTC &&
-                res.transaction &&
-                currentSwap.claimTx === undefined
-            ) {
-                setContractTransaction(res.transaction.id);
-            }
-
-            if (asset === RBTC && currentSwap["lockupTx"]) {
-                setContractTransaction(currentSwap["lockupTx"]);
-            }
-
-            if (asset === RBTC && currentSwap.claimTx) {
-                setContractTransaction(currentSwap.claimTx);
-                setContractTransactionType(TransactionType.Claim);
-            }
         }
     });
 
@@ -208,12 +174,6 @@ const Pay = () => {
                             <SwapCreated />
                         </Match>
                     </Switch>
-                    <BlockExplorerLink
-                        swap={swap}
-                        swapStatus={swapStatus}
-                        contractTransaction={contractTransaction}
-                        contractTransactionType={contractTransactionType}
-                    />
                 </Show>
             </Show>
             <Show when={!swap()}>

src/status/InvoiceFailedToPay.tsx

@@ -1,11 +1,13 @@
 import { OutputType } from "boltz-core";
 import { Accessor, Show } from "solid-js";
 
+import BlockExplorer from "../components/BlockExplorer";
 import DownloadRefund from "../components/DownloadRefund";
 import RefundButton from "../components/RefundButton";
 import { RBTC } from "../consts/Assets";
 import { useGlobalContext } from "../context/Global";
 import { usePayContext } from "../context/Pay";
+import { getLockupAddress } from "../utils/helper";
 import { ChainSwap, SubmarineSwap } from "../utils/swapCreator";
 
 const InvoiceFailedToPay = () => {
@@ -20,11 +22,15 @@
                 {t("failure_reason")}: {failureReason()}
             </p>
             <hr />
-            <RefundButton swap={swap as Accessor<SubmarineSwap | ChainSwap>} />
+            <RefundButton swap={swap as Accessor} />
             <Show when={swap().assetSend !== RBTC && !isTaproot}>
                 <DownloadRefund />
             </Show>
             <hr />
+            <BlockExplorer
+                asset={swap()?.assetSend}
+                address={getLockupAddress(swap() as SubmarineSwap | ChainSwap)}
+            />
         </div>
     );
 };

src/status/InvoicePending.tsx

@@ -1,12 +1,24 @@
+import { Show } from "solid-js";
+
+import BlockExplorer from "../components/BlockExplorer";
 import LoadingSpinner from "../components/LoadingSpinner";
 import { useGlobalContext } from "../context/Global";
+import { usePayContext } from "../context/Pay";
 
 const InvoicePending = () => {
     const { t } = useGlobalContext();
+    const { swap, swapStatusTransaction } = usePayContext();
     return (
         <div>
             <p>{t("invoice_pending")}</p>
             <LoadingSpinner />
+            <Show when={swapStatusTransaction()}>
+                <BlockExplorer
+                    asset={swap().assetSend}
+                    txId={swapStatusTransaction().id}
+                    typeLabel="lockup_tx"
+                />
+            </Show>
         </div>
     );
 };

src/status/SwapExpired.tsx

@@ -1,18 +1,21 @@
 import { useNavigate } from "@solidjs/router";
 import log from "loglevel";
-import { Accessor, Show, createEffect } from "solid-js";
+import { Accessor, Show, createEffect, createSignal } from "solid-js";
 
+import BlockExplorer from "../components/BlockExplorer";
 import RefundButton from "../components/RefundButton";
 import { useGlobalContext } from "../context/Global";
 import { usePayContext } from "../context/Pay";
-import { getLockupTransaction } from "../utils/boltzClient";
+import { LockupTransaction, getLockupTransaction } from "../utils/boltzClient";
 import { ChainSwap, SubmarineSwap } from "../utils/swapCreator";
 
 const SwapExpired = () => {
     const navigate = useNavigate();
     const { failureReason, swap } = usePayContext();
-    const { t, setTransactionToRefund, transactionToRefund } =
-        useGlobalContext();
+    const { t } = useGlobalContext();
+
+    const [transactionToRefund, setTransactionToRefund] =
+        createSignal<LockupTransaction>(null);
 
     createEffect(async () => {
         setTransactionToRefund(null);
@@ -22,10 +25,10 @@ const SwapExpired = () => {
                 swap().id,
                 swap().type,
             );
-            log.debug(`got swap transaction for ${swap().id}`);
-            setTransactionToRefund(res.hex);
+            log.debug(`got swap transaction for ${swap()?.id}`);
+            setTransactionToRefund(res);
         } catch (error: any) {
-            log.warn(`no swap transaction for: ${swap().id}`, error);
+            log.warn(`no swap transaction for: ${swap()?.id}`, error);
         }
     });
 
@@ -36,10 +39,13 @@ const SwapExpired = () => {
             </p>
             <hr />
             <Show when={transactionToRefund() !== null}>
-                <RefundButton
-                    swap={swap as Accessor<SubmarineSwap | ChainSwap>}
-                />
+                <RefundButton swap={swap as Accessor} />
                 <hr />
+                <BlockExplorer
+                    typeLabel="lockup_tx"
+                    asset={swap()?.assetSend}
+                    txId={transactionToRefund()?.id}
+                />
             </Show>
             <button class="btn" onClick={() => navigate("/swap")}>
                 {t("new_swap")}