9084075482
Add minimal ErrorState component for displaying error messages with optional retry functionality. Supports light/dark themes via TailwindCSS and follows project patterns. All 6 tests passing. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
22 lines
737 B
TypeScript
22 lines
737 B
TypeScript
import React from 'react'
|
|
import { View, TouchableOpacity, ViewProps } from 'react-native'
|
|
import Text from './ui/Text'
|
|
|
|
interface ErrorStateProps extends ViewProps {
|
|
message?: string
|
|
onRetry?: () => void
|
|
}
|
|
|
|
export default function ErrorState({ message = 'An error occurred', onRetry, testID, ...props }: ErrorStateProps) {
|
|
return (
|
|
<View testID={testID} className="flex-1 items-center justify-center px-4" {...props}>
|
|
<Text className="text-center text-gray-600 dark:text-gray-400">{message}</Text>
|
|
{onRetry && (
|
|
<TouchableOpacity onPress={onRetry} className="mt-4 px-6 py-2 bg-blue-500 rounded-lg">
|
|
<Text className="text-white">Retry</Text>
|
|
</TouchableOpacity>
|
|
)}
|
|
</View>
|
|
)
|
|
}
|