fix: positioning of toasts, icon (#116)

getAlby · Sep 12, 2024 · a3f10d7 · a3f10d7
1 parent ce5d6ba
commit a3f10d7
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 3 deletions.
diff --git a/app/_layout.tsx b/app/_layout.tsx
@@ -103,7 +103,7 @@ export default function RootLayout() {
         <PolyfillCrypto />
         <SafeAreaView className="w-full h-full bg-background">
           <Stack />
-          <Toast config={toastConfig} position="bottom" bottomOffset={140} />
+          <Toast config={toastConfig} position="bottom" bottomOffset={140} topOffset={140} />
           <PortalHost />
         </SafeAreaView>
       </ThemeProvider>

diff --git a/components/Icons.tsx b/components/Icons.tsx
@@ -35,6 +35,7 @@ import {
   Palette,
   Egg,
   HelpCircle,
+  CircleCheck,
 } from "lucide-react-native";
 import { cssInterop } from "nativewind";
 
@@ -85,6 +86,7 @@ interopIcon(CameraOff);
 interopIcon(Palette);
 interopIcon(Egg);
 interopIcon(HelpCircle);
+interopIcon(CircleCheck);
 
 export {
   AlertCircle,
@@ -122,4 +124,5 @@ export {
   Palette,
   Egg,
   HelpCircle,
+  CircleCheck,
 };
diff --git a/components/ToastConfig.tsx b/components/ToastConfig.tsx
@@ -1,7 +1,7 @@
 import { ToastConfig } from "react-native-toast-message";
 import { Text } from "./ui/text";
 import { View } from "react-native";
-import { CheckCircle, XCircle } from "./Icons";
+import { CircleCheck, XCircle } from "./Icons";
 import { Link } from "expo-router";
 import { Button } from "./ui/button";
 import { useAppStore } from "~/lib/state/appStore";
@@ -10,7 +10,7 @@ export const toastConfig: ToastConfig = {
   success: ({ text1, text2 }) => (
     <View className="bg-foreground rounded-full px-6 py-3 mx-6">
       <View className="flex flex-row gap-2 justify-center items-center">
-        <CheckCircle className="text-background" width={16} height={16} />
+        <CircleCheck className="text-background" width={16} height={16} />
         <Text className="text-background font-semibold2">{text1}</Text>
       </View>
       {text2 && <Text className="text-background text-center">{text2}</Text>}

diff --git a/pages/settings/Wallets.tsx b/pages/settings/Wallets.tsx
@@ -37,6 +37,7 @@ export function Wallets() {
                       Toast.show({
                         type: "success",
                         text1: `Switched wallet to ${item.item.name || DEFAULT_WALLET_NAME}`,
+                        position: "top",
                       });
                     }
                   }}

diff --git a/pages/settings/wallets/WalletConnection.tsx b/pages/settings/wallets/WalletConnection.tsx
@@ -79,6 +79,7 @@ export function WalletConnection() {
         type: "success",
         text1: "Wallet Connected",
         text2: "Your lightning wallet is ready to use",
+        position: "top"
       });
     } catch (error) {
       console.error(error);