fix: do not change deposit address after depositing funds on current …

…channel order page
getAlby · Jul 26, 2024 · c6bc381 · c6bc381
1 parent 45600ee
commit c6bc381
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/frontend/src/hooks/useOnchainAddress.ts b/frontend/src/hooks/useOnchainAddress.ts
@@ -1,4 +1,4 @@
-import useSWR from "swr";
+import useSWRImmutable from "swr/immutable";
 
 import React from "react";
 import { useCSRF } from "src/hooks/useCSRF";
@@ -7,7 +7,10 @@ import { swrFetcher } from "src/utils/swr";
 
 export function useOnchainAddress() {
   const { data: csrf } = useCSRF();
-  const swr = useSWR<string>("/api/wallet/address", swrFetcher);
+  // Use useSWRImmutable to avoid address randomly changing after deposit (e.g. on page re-focus on the channel order page)
+  const swr = useSWRImmutable<string>("/api/wallet/address", swrFetcher, {
+    revalidateOnMount: true,
+  });
   const [isLoading, setLoading] = React.useState(false);
 
   const getNewAddress = React.useCallback(async () => {

diff --git a/frontend/src/screens/channels/CurrentChannelOrder.tsx b/frontend/src/screens/channels/CurrentChannelOrder.tsx
@@ -347,7 +347,9 @@ function PayBitcoinChannelOrderTopup({ order }: { order: NewChannelOrder }) {
             </CardDescription>
           </CardHeader>
           {unspentAmount > 0 && (
-            <CardContent>{unspentAmount} sats deposited</CardContent>
+            <CardContent>
+              {new Intl.NumberFormat().format(unspentAmount)} sats deposited
+            </CardContent>
           )}
         </Card>