teal.fm
Your music, beautifully tracked. All yours. (coming soon)
teal.fm
teal-fm
atproto
mmatt.net
1import React from "react";
2import { TouchableOpacity, View } from "react-native";
3import { SafeAreaView } from "react-native-safe-area-context";
4import { router, Stack } from "expo-router";
5import { AlertCircle, Home } from "lucide-react-native";
6
7import { Button } from "../components/ui/button";
8import { Text } from "../components/ui/text";
9import { Icon } from "../lib/icons/iconWithClassName";
10
11const ErrorScreen = () => {
12 return (
13 <SafeAreaView className="flex-1">
14 <Stack.Screen
15 options={{
16 title: "Error",
17 headerBackButtonDisplayMode: "minimal",
18 headerShown: false,
19 }}
20 />
21 <View className="align-center max-w-screen-sm flex-1 justify-center gap-4 p-8 pb-32">
22 <View className="flex items-center">
23 <Icon icon={AlertCircle} className="color-destructive" size={64} />
24 </View>
25 <Text className="text-center text-4xl font-semibold text-foreground">
26 Oops! Something went wrong
27 </Text>
28 <Text className="text-center text-muted-foreground">
29 We couldn't complete your request. Please try again later.
30 </Text>
31 <View className="mt-4 flex flex-row items-center justify-center">
32 <Button className="bg-primary" onPress={() => router.push("/")}>
33 <>
34 <Text className="text-lg font-semibold">Return Home</Text>
35 <Icon icon={Home} />
36 </>
37 </Button>
38 </View>
39 <TouchableOpacity onPress={() => router.back()} className="mt-4">
40 <Text className="text-md text-center text-secondary">Go Back</Text>
41 </TouchableOpacity>
42 </View>
43 </SafeAreaView>
44 );
45};
46
47export default ErrorScreen;