Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/nperez0111/bookhive. Track your books, share your shelves, see what others are reading bookhive.buzz
atproto bluesky books bookshelf goodreads management-system
Something went wrong. Try again.
2.7 kB · 95 lines
TSX
at main
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596import React from "react";import { View, StyleSheet } from "react-native";import { ThemedText } from "./ThemedText";import { ThemedView } from "./ThemedView";import { Ionicons } from "@expo/vector-icons";import { useThemeColor } from "@/hooks/useThemeColor";import { NetworkErrorView, NetworkError } from "./NetworkErrorView";import { classifyNetworkError } from "@/utils/networkErrorHandler";import { useNetworkStatus } from "@/hooks/useNetworkStatus";
interface QueryErrorHandlerProps { error: any; onRetry?: () => void; onGoBack?: () => void; showRetryButton?: boolean; showGoBackButton?: boolean;}
export const QueryErrorHandler: React.FC<QueryErrorHandlerProps> = ({ error, onRetry, onGoBack, showRetryButton = true, showGoBackButton = true,}) => { const { isConnected } = useNetworkStatus(); const backgroundColor = useThemeColor({}, "background"); const textColor = useThemeColor({}, "text");
// Classify the error const networkError: NetworkError = error?.networkError || classifyNetworkError(error);
// If we're offline and it's a network error, show offline message if (!isConnected && networkError.type === "network") { return ( <ThemedView style={[styles.container, { backgroundColor }]}> <View style={styles.content}> <Ionicons name="wifi-outline" size={64} color="#FBBF24" /> <ThemedText style={[styles.title, { color: textColor }]}>You're Offline</ThemedText> <ThemedText style={[styles.message, { color: textColor }]}> Please check your internet connection and try again. </ThemedText> {onRetry && ( <ThemedText style={[styles.retryHint, { color: textColor }]}> Pull down to refresh when you're back online. </ThemedText> )} </View> </ThemedView> ); }
// Use the NetworkErrorView for other types of errors return ( <NetworkErrorView error={networkError} onRetry={onRetry} onGoBack={onGoBack} showRetryButton={showRetryButton} showGoBackButton={showGoBackButton} /> );};
const styles = StyleSheet.create({ container: { flex: 1, justifyContent: "center", alignItems: "center", padding: 20, }, content: { alignItems: "center", maxWidth: 300, }, title: { fontSize: 24, fontWeight: "bold", marginTop: 16, marginBottom: 8, textAlign: "center", }, message: { fontSize: 16, textAlign: "center", marginBottom: 16, lineHeight: 24, }, retryHint: { fontSize: 14, textAlign: "center", opacity: 0.7, fontStyle: "italic", },});