fix: receiver component

getAlby · Sep 24, 2024 · 31e59f9 · 31e59f9
1 parent 4ef17b3
commit 31e59f9
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 44 deletions.
diff --git a/components/Receiver.tsx b/components/Receiver.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+import { View } from "react-native";
+import { Text } from "~/components/ui/text";
+
+interface ReceiverProps {
+    originalText: string;
+    invoice?: string;
+}
+
+export function Receiver({ originalText, invoice }: ReceiverProps) {
+    const shouldShowReceiver =
+        originalText !== invoice &&
+        originalText.toLowerCase().replace("lightning:", "").includes("@");
+
+    if (!shouldShowReceiver) {
+        return null;
+    }
+
+    return (
+        <View className="flex flex-col gap-2">
+            <Text className="text-muted-foreground text-center font-semibold2">
+                To
+            </Text>
+            <Text className="text-center text-foreground text-2xl font-medium2">
+                {originalText.toLowerCase().replace("lightning:", "")}
+            </Text>
+        </View>
+    );
+}
diff --git a/pages/send/ConfirmPayment.tsx b/pages/send/ConfirmPayment.tsx
@@ -5,6 +5,7 @@ import React from "react";
 import { View } from "react-native";
 import { ZapIcon } from "~/components/Icons";
 import Loading from "~/components/Loading";
+import { Receiver } from "~/components/Receiver";
 import Screen from "~/components/Screen";
 import { Button } from "~/components/ui/button";
 import { Text } from "~/components/ui/text";
@@ -94,23 +95,7 @@ export function ConfirmPayment() {
             </View>
           )
         )}
-        {
-          /* only show "To" for lightning addresses */ originalText !==
-          invoice &&
-          originalText
-            .toLowerCase()
-            .replace("lightning:", "")
-            .includes("@") && (
-            <View className="flex flex-col gap-2">
-              <Text className="text-muted-foreground text-center font-semibold2">
-                To
-              </Text>
-              <Text className="text-center text-foreground text-2xl font-medium2">
-                {originalText.toLowerCase().replace("lightning:", "")}
-              </Text>
-            </View>
-          )
-        }
+        <Receiver originalText={originalText} invoice={invoice} />
       </View>
       <View className="p-6">
         <Button

diff --git a/pages/send/LNURLPay.tsx b/pages/send/LNURLPay.tsx
@@ -10,13 +10,13 @@ import { errorToast } from "~/lib/errorToast";
 import Loading from "~/components/Loading";
 import { DualCurrencyInput } from "~/components/DualCurrencyInput";
 import DismissableKeyboardView from "~/components/DismissableKeyboardView";
+import { Receiver } from "~/components/Receiver";
 
 export function LNURLPay() {
-  const { lnurlDetailsJSON, originalText, humanReadablePaymentInfo } =
+  const { lnurlDetailsJSON, originalText } =
     useLocalSearchParams() as unknown as {
       lnurlDetailsJSON: string;
       originalText: string;
-      humanReadablePaymentInfo: string;
     };
   const lnurlDetails: LNURLPayServiceResponse = JSON.parse(lnurlDetailsJSON);
   const [isLoading, setLoading] = React.useState(false);
@@ -68,14 +68,7 @@ export function LNURLPay() {
                 returnKeyType="done"
               />
             </View>
-            <View>
-              <Text className="text-muted-foreground text-center font-semibold2">
-                To
-              </Text>
-              <Text className="text-center text-foreground text-2xl font-medium2">
-                {humanReadablePaymentInfo}
-              </Text>
-            </View>
+            <Receiver originalText={originalText} />
           </View>
           <View className="p-6">
             <Button

diff --git a/pages/send/PaymentSuccess.tsx b/pages/send/PaymentSuccess.tsx
@@ -5,6 +5,7 @@ import { Button } from "~/components/ui/button";
 import { Text } from "~/components/ui/text";
 import Screen from "~/components/Screen";
 import { useGetFiatAmount } from "~/hooks/useGetFiatAmount";
+import { Receiver } from "~/components/Receiver";
 
 export function PaymentSuccess() {
   const getFiatAmount = useGetFiatAmount();
@@ -30,16 +31,7 @@ export function PaymentSuccess() {
             <Text className="text-2xl text-muted-foreground font-semibold2">{getFiatAmount(+amount)}</Text>
           }
         </View>
-        {originalText !== invoice &&
-          <View>
-            <Text className="text-muted-foreground text-center font-semibold2">
-              Sent to
-            </Text>
-            <Text className="text-foreground text-center text-2xl font-medium2">
-              {originalText.toLowerCase().replace("lightning:", "")}
-            </Text>
-          </View>
-        }
+        <Receiver originalText={originalText} invoice={invoice} />
       </View>
       <View className="p-6">
         <Button

diff --git a/pages/send/Send.tsx b/pages/send/Send.tsx
@@ -74,7 +74,6 @@ export function Send() {
     }
     console.log("loading payment", text);
     const originalText = text;
-    let humanReadablePaymentInfo = text;
     setLoading(true);
     try {
       if (text.startsWith("bitcoin:")) {
@@ -99,29 +98,24 @@ export function Send() {
           throw new Error("LNURL tag " + lnurlDetails.tag + " not supported");
         }
 
-        humanReadablePaymentInfo = lnurlValue;
-
         router.replace({
           pathname: "/send/lnurl-pay",
           params: {
             lnurlDetailsJSON: JSON.stringify(lnurlDetails),
             originalText,
-            humanReadablePaymentInfo
           },
         });
 
         return true;
       } else {
-        humanReadablePaymentInfo = text;
-
         // Check if this is a valid invoice
         new Invoice({
           pr: text,
         });
 
         router.replace({
           pathname: "/send/confirm",
-          params: { invoice: text, originalText, humanReadablePaymentInfo },
+          params: { invoice: text, originalText },
         });
 
         return true;