From 0a4ff0c13f4fe40641ebc0dcdec078f177a49900 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?dni=20=E2=9A=A1?= <office@dnilabs.com>
Date: Wed, 24 Jul 2024 12:00:10 +0200
Subject: [PATCH] fix michael1011 review

---
 src/status/InvoiceFailedToPay.tsx   |  2 +-
 src/status/InvoicePending.tsx       | 12 ++++++++++++
 src/status/SwapExpired.tsx          |  8 ++++----
 src/status/TransactionConfirmed.tsx | 12 +++++++++++-
 src/status/TransactionMempool.tsx   | 14 +++++++++-----
 src/utils/boltzClient.ts            | 14 ++++++++------
 6 files changed, 45 insertions(+), 17 deletions(-)

diff --git a/src/status/InvoiceFailedToPay.tsx b/src/status/InvoiceFailedToPay.tsx
index 87601c1d..5f342eb8 100644
--- a/src/status/InvoiceFailedToPay.tsx
+++ b/src/status/InvoiceFailedToPay.tsx
@@ -29,7 +29,7 @@ const InvoiceFailedToPay = () => {
             <hr />
             <BlockExplorer
                 asset={swap().assetSend}
-                address={getLockupAddress(swap() as SubmarineSwap | ChainSwap)}
+                address={getLockupAddress(swap() as SubmarineSwap)}
             />
         </div>
     );
diff --git a/src/status/InvoicePending.tsx b/src/status/InvoicePending.tsx
index 378ddd4b..ddcfc4d6 100644
--- a/src/status/InvoicePending.tsx
+++ b/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() !== null}>
+                <BlockExplorer
+                    asset={swap().assetSend}
+                    txId={swapStatusTransaction().id}
+                    typeLabel="lockup_tx"
+                />
+            </Show>
         </div>
     );
 };
diff --git a/src/status/SwapExpired.tsx b/src/status/SwapExpired.tsx
index 3c6188be..42c25b4e 100644
--- a/src/status/SwapExpired.tsx
+++ b/src/status/SwapExpired.tsx
@@ -6,7 +6,7 @@ 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 = () => {
@@ -15,7 +15,7 @@ const SwapExpired = () => {
     const { t } = useGlobalContext();
 
     const [transactionToRefund, setTransactionToRefund] =
-        createSignal<string>("");
+        createSignal<LockupTransaction>(null);
 
     createEffect(async () => {
         setTransactionToRefund(null);
@@ -26,7 +26,7 @@ const SwapExpired = () => {
                 swap().type,
             );
             log.debug(`got swap transaction for ${swap().id}`);
-            setTransactionToRefund(res.hex);
+            setTransactionToRefund(res);
         } catch (error: any) {
             log.warn(`no swap transaction for: ${swap().id}`, error);
         }
@@ -45,7 +45,7 @@ const SwapExpired = () => {
                 <hr />
                 <BlockExplorer
                     asset={swap().assetSend}
-                    txId={transactionToRefund()}
+                    txId={transactionToRefund().id}
                 />
             </Show>
             <button class="btn" onClick={() => navigate("/swap")}>
diff --git a/src/status/TransactionConfirmed.tsx b/src/status/TransactionConfirmed.tsx
index fd0de28b..b9b3a618 100644
--- a/src/status/TransactionConfirmed.tsx
+++ b/src/status/TransactionConfirmed.tsx
@@ -1,3 +1,6 @@
+import { Show } from "solid-js";
+
+import BlockExplorer from "../components/BlockExplorer";
 import ContractTransaction from "../components/ContractTransaction";
 import LoadingSpinner from "../components/LoadingSpinner";
 import { RBTC } from "../consts/Assets";
@@ -53,7 +56,7 @@ const ClaimRsk = ({
 
 const TransactionConfirmed = () => {
     const { t } = useGlobalContext();
-    const { swap } = usePayContext();
+    const { swapStatusTransaction, swap } = usePayContext();
 
     if (swap().assetReceive === RBTC) {
         if (swap().type === SwapType.Chain) {
@@ -88,6 +91,13 @@ const TransactionConfirmed = () => {
             <h2>{t("tx_confirmed")}</h2>
             <p>{t("tx_ready_to_claim")}</p>
             <LoadingSpinner />
+            <Show when={swapStatusTransaction() !== null}>
+                <BlockExplorer
+                    asset={swap().assetSend}
+                    txId={swapStatusTransaction().id}
+                    typeLabel="lockup_tx"
+                />
+            </Show>
         </div>
     );
 };
diff --git a/src/status/TransactionMempool.tsx b/src/status/TransactionMempool.tsx
index 33c370e9..194ce831 100644
--- a/src/status/TransactionMempool.tsx
+++ b/src/status/TransactionMempool.tsx
@@ -1,3 +1,5 @@
+import { Show } from "solid-js";
+
 import BlockExplorer from "../components/BlockExplorer";
 import LoadingSpinner from "../components/LoadingSpinner";
 import { useGlobalContext } from "../context/Global";
@@ -11,11 +13,13 @@ const TransactionMempool = () => {
             <h2>{t("tx_in_mempool")}</h2>
             <p>{t("tx_in_mempool_subline")}</p>
             <LoadingSpinner />
-            <BlockExplorer
-                asset={swap().assetSend}
-                txId={swapStatusTransaction()?.id}
-                typeLabel="lockup_tx"
-            />
+            <Show when={swapStatusTransaction() !== null}>
+                <BlockExplorer
+                    asset={swap().assetSend}
+                    txId={swapStatusTransaction().id}
+                    typeLabel="lockup_tx"
+                />
+            </Show>
         </div>
     );
 };
diff --git a/src/utils/boltzClient.ts b/src/utils/boltzClient.ts
index 60e6a060..b294145c 100644
--- a/src/utils/boltzClient.ts
+++ b/src/utils/boltzClient.ts
@@ -155,6 +155,13 @@ type ChainSwapCreatedResponse = {
     lockupDetails: ChainSwapDetails;
 };
 
+export type LockupTransaction = {
+    id: string;
+    hex: string;
+    timeoutBlockHeight: number;
+    timeoutEta?: number;
+};
+
 type ChainSwapTransaction = {
     transaction: {
         id: string;
@@ -366,12 +373,7 @@ export const getLockupTransaction = async (
     asset: string,
     id: string,
     type: SwapType,
-): Promise<{
-    id: string;
-    hex: string;
-    timeoutBlockHeight: number;
-    timeoutEta?: number;
-}> => {
+): Promise<LockupTransaction> => {
     switch (type) {
         case SwapType.Submarine:
             return fetcher<{