Merge branch 'master' into task-popicons

app.json

@@ -3,7 +3,7 @@
     "name": "Alby Go",
     "slug": "alby-mobile",
     "version": "1.7.2",
-    "scheme": ["lightning", "bitcoin", "alby"],
+    "scheme": ["lightning", "bitcoin", "alby", "nostr+walletconnect"],
     "orientation": "portrait",
     "icon": "./assets/icon.png",
     "userInterfaceStyle": "automatic",

app/_layout.tsx

@@ -10,7 +10,7 @@ import { Slot, SplashScreen } from "expo-router";
 import { StatusBar } from "expo-status-bar";
 import { swrConfiguration } from "lib/swr";
 import * as React from "react";
-import { SafeAreaView } from "react-native";
+import { SafeAreaView } from "react-native-safe-area-context";
 import Toast from "react-native-toast-message";
 import { SWRConfig } from "swr";
 import { toastConfig } from "~/components/ToastConfig";

components/Alert.tsx

@@ -0,0 +1,50 @@
+import { View } from "react-native";
+import { SvgProps } from "react-native-svg";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardTitle,
+} from "~/components/ui/card";
+import { cn } from "~/lib/utils";
+
+type Props = {
+  type: "error" | "warn" | "info";
+  icon: React.FunctionComponent<SvgProps>;
+  title: string;
+  description: string;
+  className?: string;
+};
+
+function Alert({ title, description, type, icon: Icon, className }: Props) {
+  const textColor =
+    type === "error"
+      ? "text-red-700 dark:text-red-300"
+      : type === "warn"
+        ? "text-orange-700 dark:text-orange-300"
+        : "text-blue-700 dark:text-blue-300";
+  return (
+    <Card
+      className={cn(
+        "w-full mb-4",
+        type === "error" &&
+          "bg-red-50 dark:bg-red-900 border-red-100 dark:border-red-900",
+        type === "warn" &&
+          "bg-orange-50 dark:bg-orange-900 border-orange-100 dark:border-orange-900",
+        type === "info" &&
+          "bg-blue-50 dark:bg-blue-900 border-blue-100 dark:border-blue-900",
+        className,
+      )}
+    >
+      <CardContent className="flex flex-row items-center gap-4">
+        <Icon className={textColor} />
+        <View className="flex flex-1 flex-col">
+          <CardTitle className={textColor}>{title}</CardTitle>
+          <CardDescription className={textColor}>{description}</CardDescription>
+        </View>
+      </CardContent>
+    </Card>
+  );
+}
+
+export default Alert;

components/DualCurrencyInput.tsx

@@ -9,6 +9,7 @@ import {
   SATS_REGEX,
 } from "~/lib/constants";
 import { useAppStore } from "~/lib/state/appStore";
+import { cn } from "~/lib/utils";
 import { Input } from "./ui/input";
 import { Text } from "./ui/text";
 
@@ -17,13 +18,17 @@ type DualCurrencyInputProps = {
   setAmount(amount: string): void;
   autoFocus?: boolean;
   readOnly?: boolean;
+  max?: number;
+  min?: number;
 };
 
 export function DualCurrencyInput({
   amount,
   setAmount,
   autoFocus = false,
   readOnly = false,
+  max,
+  min,
 }: DualCurrencyInputProps) {
   const getFiatAmount = useGetFiatAmount();
   const getSatsAmount = useGetSatsAmount();
@@ -61,7 +66,11 @@ export function DualCurrencyInput({
   return (
     <View className="w-full flex flex-col items-center justify-center gap-5">
       <Input
-        className="w-full border-transparent bg-transparent text-center mt-3"
+        className={cn(
+          "w-full border-transparent bg-transparent text-center mt-3",
+          ((max && Number(amount) > max) || (min && Number(amount) < min)) &&
+            "text-destructive",
+        )}
         placeholder="0"
         keyboardType={inputMode === "sats" ? "number-pad" : "decimal-pad"}
         value={inputMode === "sats" ? amount : fiatAmount}

components/icons/FailedTransaction.tsx

@@ -0,0 +1,35 @@
+import React from "react";
+import { useColorScheme } from "react-native";
+import Svg, { Path, Rect, SvgProps } from "react-native-svg";
+
+const FailedTransactionIcon = (props: SvgProps) => {
+  const colorScheme = useColorScheme();
+
+  const colors = {
+    light: {
+      rectFill: "#FEE2E2",
+      pathStroke: "#FB7185",
+    },
+    dark: {
+      rectFill: "#450A0A",
+      pathStroke: "#DC2626",
+    },
+  };
+
+  const currentColors = colorScheme === "dark" ? colors.dark : colors.light;
+
+  return (
+    <Svg width={40} height={40} viewBox="0 0 40 40" fill="none" {...props}>
+      <Rect width="40" height="40" rx="20" fill={currentColors.rectFill} />
+      <Path
+        strokeWidth="3.75"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        stroke={currentColors.pathStroke}
+        d="M14.001 26.0002L26 14.0002M25.999 26L14 14.0002"
+      />
+    </Svg>
+  );
+};
+
+export default FailedTransactionIcon;

components/icons/ReceivedTransaction.tsx

@@ -0,0 +1,35 @@
+import React from "react";
+import { useColorScheme } from "react-native";
+import Svg, { Path, Rect, SvgProps } from "react-native-svg";
+
+const ReceivedTransactionIcon = (props: SvgProps) => {
+  const colorScheme = useColorScheme();
+
+  const colors = {
+    light: {
+      rectFill: "#DBFBE6",
+      pathStroke: "#22C45E",
+    },
+    dark: {
+      rectFill: "#022C22",
+      pathStroke: "#10B981",
+    },
+  };
+
+  const currentColors = colorScheme === "dark" ? colors.dark : colors.light;
+
+  return (
+    <Svg width={40} height={40} viewBox="0 0 40 40" fill="none" {...props}>
+      <Rect width="40" height="40" rx="20" fill={currentColors.rectFill} />
+      <Path
+        strokeWidth="3.75"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        stroke={currentColors.pathStroke}
+        d="M25 21.8745L20.5893 26.2852C20.2638 26.6107 19.7362 26.6107 19.4108 26.2852L15 21.8745M20 25.8328L20 13.3328"
+      />
+    </Svg>
+  );
+};
+
+export default ReceivedTransactionIcon;

components/icons/SentTransaction.tsx

@@ -0,0 +1,35 @@
+import React from "react";
+import { useColorScheme } from "react-native";
+import Svg, { Path, Rect, SvgProps } from "react-native-svg";
+
+const SentTransactionIcon = (props: SvgProps) => {
+  const colorScheme = useColorScheme();
+
+  const colors = {
+    light: {
+      rectFill: "#FEECD4",
+      pathStroke: "#FA913C",
+    },
+    dark: {
+      rectFill: "#431407",
+      pathStroke: "#D97706",
+    },
+  };
+
+  const currentColors = colorScheme === "dark" ? colors.dark : colors.light;
+
+  return (
+    <Svg width={40} height={40} viewBox="0 0 40 40" fill="none" {...props}>
+      <Rect width="40" height="40" rx="20" fill={currentColors.rectFill} />
+      <Path
+        strokeWidth="3.75"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        stroke={currentColors.pathStroke}
+        d="M15 18.125L19.4107 13.7143C19.7362 13.3889 20.2638 13.3889 20.5892 13.7143L25 18.125M20 14.1667V26.6667"
+      />
+    </Svg>
+  );
+};
+
+export default SentTransactionIcon;

components/ui/card.tsx

@@ -56,7 +56,7 @@ const CardDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <Text
     ref={ref}
-    className={cn("mt-1 text-sm text-muted-foreground", className)}
+    className={cn("mt-1 text-muted-foreground", className)}
     {...props}
   />
 ));

lib/link.ts

@@ -2,7 +2,12 @@ import { router } from "expo-router";
 import { BOLT11_REGEX } from "./constants";
 import { lnurl as lnurlLib } from "./lnurl";
 
-const SUPPORTED_SCHEMES = ["lightning:", "bitcoin:", "alby:"];
+const SUPPORTED_SCHEMES = [
+  "lightning:",
+  "bitcoin:",
+  "alby:",
+  "nostr+walletconnect:",
+];
 
 // Register exp scheme for testing during development
 // https://docs.expo.dev/guides/linking/#creating-urls
@@ -22,6 +27,19 @@ export const handleLink = async (url: string) => {
 
   if (SUPPORTED_SCHEMES.indexOf(parsedUrl.protocol) > -1) {
     let { username, hostname, protocol, pathname, search } = parsedUrl;
+    if (parsedUrl.protocol === "nostr+walletconnect:") {
+      if (router.canDismiss()) {
+        router.dismissAll();
+      }
+      console.info("Navigating to wallet setup");
+      router.push({
+        pathname: "/settings/wallets/setup",
+        params: {
+          nwcUrl: protocol + hostname + search,
+        },
+      });
+      return;
+    }
 
     if (parsedUrl.protocol === "exp:") {
       if (!parsedUrl.pathname) {

package.json

@@ -58,7 +58,7 @@
     "react-native-get-random-values": "^1.9.0",
     "react-native-qrcode-svg": "^6.3.1",
     "react-native-reanimated": "~3.16.1",
-    "react-native-safe-area-context": "4.12.0",
+    "react-native-safe-area-context": "5.0.0",
     "react-native-screens": "~4.1.0",
     "react-native-svg": "15.8.0",
     "react-native-toast-message": "^2.2.0",