Files
digital-pilates/components/ui/NotificationErrorAlert.tsx
richarjiang cf069f3537 feat(fasting): 重构断食通知系统并增强可靠性
- 新增 useFastingNotifications hook 统一管理通知状态和同步逻辑
- 实现四阶段通知提醒:开始前30分钟、开始时、结束前30分钟、结束时
- 添加通知验证机制,确保通知正确设置和避免重复
- 新增 NotificationErrorAlert 组件显示通知错误并提供重试选项
- 实现断食计划持久化存储,应用重启后自动恢复
- 添加开发者测试面板用于验证通知系统可靠性
- 优化通知同步策略,支持选择性更新减少不必要的操作
- 修复个人页面编辑按钮样式问题
- 更新应用版本号至 1.0.18
2025-10-14 15:05:11 +08:00

81 lines
1.8 KiB
TypeScript

import React from 'react';
import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
interface NotificationErrorAlertProps {
error: string | null;
onRetry?: () => void;
onDismiss?: () => void;
}
export const NotificationErrorAlert: React.FC<NotificationErrorAlertProps> = ({
error,
onRetry,
onDismiss,
}) => {
if (!error) return null;
return (
<View style={styles.container}>
<View style={styles.content}>
<Text style={styles.title}></Text>
<Text style={styles.message}>{error}</Text>
<View style={styles.actions}>
{onRetry && (
<TouchableOpacity style={styles.button} onPress={onRetry}>
<Text style={styles.buttonText}></Text>
</TouchableOpacity>
)}
{onDismiss && (
<TouchableOpacity style={[styles.button, styles.dismissButton]} onPress={onDismiss}>
<Text style={styles.buttonText}></Text>
</TouchableOpacity>
)}
</View>
</View>
</View>
);
};
const styles = StyleSheet.create({
container: {
backgroundColor: '#FEF2F2',
borderLeftWidth: 4,
borderLeftColor: '#EF4444',
marginHorizontal: 20,
marginVertical: 8,
borderRadius: 8,
},
content: {
padding: 12,
},
title: {
fontSize: 14,
fontWeight: '600',
color: '#DC2626',
marginBottom: 4,
},
message: {
fontSize: 13,
color: '#7F1D1D',
marginBottom: 8,
lineHeight: 18,
},
actions: {
flexDirection: 'row',
gap: 8,
},
button: {
paddingHorizontal: 12,
paddingVertical: 6,
backgroundColor: '#DC2626',
borderRadius: 6,
},
dismissButton: {
backgroundColor: '#9CA3AF',
},
buttonText: {
fontSize: 12,
fontWeight: '500',
color: '#FFFFFF',
},
});