feature(mobile): Add proper error handling for server errors

1 files changed, 23 insertions, 0 deletions

diff --git a/apps/mobile/components/FullPageError.tsx b/apps/mobile/components/FullPageError.tsx
new file mode 100644
index 00000000..57fd62ed
--- /dev/null
+++ b/apps/mobile/components/FullPageError.tsx
@@ -0,0 +1,23 @@
+import { Text, View } from "react-native";
+
+import { Button } from "./ui/Button";
+
+export default function FullPageError({
+  error,
+  onRetry,
+}: {
+  error: string;
+  onRetry: () => void;
+}) {
+  return (
+    <View className="size-full items-center justify-center">
+      <View className="h-1/4 items-center justify-between rounded-lg border border-gray-500 border-transparent bg-background px-10 py-4">
+        <Text className="text-bold text-3xl text-foreground">
+          Something Went Wrong
+        </Text>
+        <Text className="text-foreground"> {error}</Text>
+        <Button onPress={() => onRetry()} label="Retry" />
+      </View>
+    </View>
+  );
+}