diff options
Diffstat (limited to 'apps/mobile/components')
| -rw-r--r-- | apps/mobile/components/ui/Toast.tsx | 49 |
1 files changed, 30 insertions, 19 deletions
diff --git a/apps/mobile/components/ui/Toast.tsx b/apps/mobile/components/ui/Toast.tsx index fd122c25..96323263 100644 --- a/apps/mobile/components/ui/Toast.tsx +++ b/apps/mobile/components/ui/Toast.tsx @@ -1,5 +1,6 @@ import { createContext, useContext, useEffect, useRef, useState } from "react"; -import { Animated, View } from "react-native"; +import { Animated, Platform, View } from "react-native"; +import { FullWindowOverlay } from "react-native-screens"; import { Text } from "@/components/ui/Text"; import { cn } from "@/lib/utils"; @@ -147,27 +148,37 @@ function ToastProvider({ setMessages((prev) => prev.filter((message) => message.id !== id)); }; + const content = ( + <View + className={cn("absolute left-0 right-0", { + "top-[45px]": position === "top", + "bottom-0": position === "bottom", + })} + > + {messages.map((message) => ( + <Toast + key={message.id} + id={message.id} + message={message.text} + variant={message.variant} + duration={message.duration} + showProgress={message.showProgress} + onHide={removeToast} + /> + ))} + </View> + ); + return ( <ToastContext.Provider value={{ toast, removeToast }}> {children} - <View - className={cn("absolute left-0 right-0", { - "top-[45px]": position === "top", - "bottom-0": position === "bottom", - })} - > - {messages.map((message) => ( - <Toast - key={message.id} - id={message.id} - message={message.text} - variant={message.variant} - duration={message.duration} - showProgress={message.showProgress} - onHide={removeToast} - /> - ))} - </View> + {/* Use FullWindowOverlay on iOS to ensure toasts appear above all content */} + {/* Platform specific implementation due to FullWindowOverlay being iOS-only */} + {Platform.OS === "ios" ? ( + <FullWindowOverlay>{content}</FullWindowOverlay> + ) : ( + content + )} </ToastContext.Provider> ); } |
