43 lines
915 B
TypeScript
43 lines
915 B
TypeScript
import React from 'react'
|
|
import { View, Text, StyleSheet } from 'react-native'
|
|
|
|
export interface MessageEmptyStateProps {
|
|
message?: string
|
|
icon?: React.ReactNode
|
|
}
|
|
|
|
export function MessageEmptyState({
|
|
message = '暂无消息',
|
|
icon,
|
|
}: MessageEmptyStateProps) {
|
|
return (
|
|
<View testID="message-empty-state" style={styles.container}>
|
|
<View testID="empty-state-icon" style={styles.iconContainer}>
|
|
{icon || <Text style={styles.defaultIcon}>📭</Text>}
|
|
</View>
|
|
<Text testID="empty-state-message" style={styles.message}>
|
|
{message}
|
|
</Text>
|
|
</View>
|
|
)
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
backgroundColor: 'transparent',
|
|
},
|
|
iconContainer: {
|
|
marginBottom: 12,
|
|
},
|
|
defaultIcon: {
|
|
fontSize: 48,
|
|
},
|
|
message: {
|
|
fontSize: 14,
|
|
color: '#8A8A8A',
|
|
},
|
|
})
|