CodeIssuesDiscussionsWikiPull RequestsProjectsCommitsActionsReleasesContributorsPulse● GatesSecuritySettingsDeploymentsPipelineInsightsAgents✨ Explain✨ Ask AI✨ Workspace✨ Spec✨ Tests▓ Debt Map✨ NL Search🏛 Archaeology
Blame · Line-by-line history
ErrorState.tsx
Each line is annotated with the commit that last touched it. Click any SHA to jump to that commit and see the surrounding change.
| c53cf00 | 1 | import React from 'react'; |
| 2 | import { View, Text, TouchableOpacity, StyleSheet } from 'react-native'; | |
| 3 | import { colors } from '../theme/colors'; | |
| 4 | import { fontSizes } from '../theme/typography'; | |
| 5 | ||
| 6 | interface Props { | |
| 7 | message: string; | |
| 8 | onRetry?: () => void; | |
| 9 | } | |
| 10 | ||
| 11 | export function ErrorState({ message, onRetry }: Props) { | |
| 12 | return ( | |
| 13 | <View style={styles.container}> | |
| 14 | <Text style={styles.icon}>!</Text> | |
| 15 | <Text style={styles.message}>{message}</Text> | |
| 16 | {onRetry && ( | |
| 17 | <TouchableOpacity style={styles.retryBtn} onPress={onRetry} activeOpacity={0.75}> | |
| 18 | <Text style={styles.retryText}>Retry</Text> | |
| 19 | </TouchableOpacity> | |
| 20 | )} | |
| 21 | </View> | |
| 22 | ); | |
| 23 | } | |
| 24 | ||
| 25 | const styles = StyleSheet.create({ | |
| 26 | container: { | |
| 27 | flex: 1, | |
| 28 | alignItems: 'center', | |
| 29 | justifyContent: 'center', | |
| 30 | padding: 32, | |
| 31 | backgroundColor: colors.bg, | |
| 32 | }, | |
| 33 | icon: { | |
| 34 | fontSize: 40, | |
| 35 | color: colors.red, | |
| 36 | marginBottom: 12, | |
| 37 | fontWeight: '700', | |
| 38 | }, | |
| 39 | message: { | |
| 40 | color: colors.textMuted, | |
| 41 | fontSize: fontSizes.base, | |
| 42 | textAlign: 'center', | |
| 43 | lineHeight: 22, | |
| 44 | marginBottom: 20, | |
| 45 | }, | |
| 46 | retryBtn: { | |
| 47 | backgroundColor: colors.accentDim, | |
| 48 | borderRadius: 8, | |
| 49 | paddingHorizontal: 20, | |
| 50 | paddingVertical: 10, | |
| 51 | }, | |
| 52 | retryText: { | |
| 53 | color: colors.accent, | |
| 54 | fontSize: fontSizes.base, | |
| 55 | fontWeight: '600', | |
| 56 | }, | |
| 57 | }); |