81 lines
1.9 KiB
TypeScript
81 lines
1.9 KiB
TypeScript
import React from 'react';
|
|
import { View, Text, StyleSheet, Pressable } from 'react-native';
|
|
import Ionicons from '@react-native-vector-icons/ionicons';
|
|
import { useTheme, fontFamily } from '../../../theme';
|
|
|
|
interface AgentEmptyStateProps {
|
|
title: string;
|
|
description: string;
|
|
icon?: string;
|
|
actionTitle?: string;
|
|
onAction?: () => void;
|
|
}
|
|
|
|
export const AgentEmptyState = ({
|
|
title,
|
|
description,
|
|
icon = 'document-text-outline',
|
|
actionTitle,
|
|
onAction,
|
|
}: AgentEmptyStateProps) => {
|
|
const theme = useTheme();
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<View style={[styles.iconContainer, { backgroundColor: `${theme.colors.primary}10` }]}>
|
|
<Ionicons name={icon as any} size={48} color={theme.colors.primary} />
|
|
</View>
|
|
<Text style={[styles.title, { color: theme.colors.textPrimary }]}>{title}</Text>
|
|
<Text style={[styles.description, { color: theme.colors.textMuted }]}>{description}</Text>
|
|
|
|
{actionTitle && onAction && (
|
|
<Pressable
|
|
style={[styles.button, { backgroundColor: theme.colors.primary }]}
|
|
onPress={onAction}
|
|
>
|
|
<Text style={[styles.buttonText, { color: theme.colors.white }]}>{actionTitle}</Text>
|
|
</Pressable>
|
|
)}
|
|
</View>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
padding: 32,
|
|
minHeight: 300,
|
|
},
|
|
iconContainer: {
|
|
width: 100,
|
|
height: 100,
|
|
borderRadius: 50,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
marginBottom: 24,
|
|
},
|
|
title: {
|
|
fontSize: 18,
|
|
fontFamily: fontFamily.bold,
|
|
marginBottom: 8,
|
|
textAlign: 'center',
|
|
},
|
|
description: {
|
|
fontSize: 14,
|
|
textAlign: 'center',
|
|
lineHeight: 20,
|
|
marginBottom: 24,
|
|
},
|
|
button: {
|
|
paddingHorizontal: 24,
|
|
paddingVertical: 12,
|
|
borderRadius: 8,
|
|
},
|
|
buttonText: {
|
|
fontSize: 14,
|
|
fontFamily: fontFamily.semibold,
|
|
},
|
|
});
|