88 lines
2.7 KiB
TypeScript
88 lines
2.7 KiB
TypeScript
import React from 'react';
|
|
import { View, Text, ScrollView, TouchableOpacity, Alert } from 'react-native';
|
|
import { useAppTheme } from '@theme';
|
|
import { PersonIcon } from '@icons';
|
|
import { getStyles } from './inboxScreen.styles';
|
|
|
|
export const InboxScreen: React.FC = () => {
|
|
const { colors } = useAppTheme();
|
|
const styles = getStyles(colors);
|
|
|
|
const chats = [
|
|
{
|
|
id: 'support',
|
|
sender: 'SG Partner Support',
|
|
snippet: 'Hi Rahul, your document verification is complete. Let us know if you need assistance.',
|
|
time: '10 mins ago',
|
|
unreadCount: 1,
|
|
isSystem: true,
|
|
},
|
|
{
|
|
id: 'rohit',
|
|
sender: 'Rohit Sharma (Customer)',
|
|
snippet: 'Please leave the order near the gate, thank you.',
|
|
time: '1 hour ago',
|
|
unreadCount: 0,
|
|
isSystem: false,
|
|
},
|
|
{
|
|
id: 'ccd',
|
|
sender: 'Cafe Coffee Day (Merchant)',
|
|
snippet: 'Hi, the order #ORD125487 is ready for pickup. Please arrive.',
|
|
time: '2 hours ago',
|
|
unreadCount: 0,
|
|
isSystem: false,
|
|
},
|
|
];
|
|
|
|
const handleChatPress = (sender: string) => {
|
|
Alert.alert('Chat Thread', `Opening conversation with ${sender}...`);
|
|
};
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<ScrollView contentContainerStyle={styles.scrollContainer} showsVerticalScrollIndicator={false}>
|
|
<View style={styles.headerContainer}>
|
|
<Text style={styles.title}>Inbox</Text>
|
|
</View>
|
|
|
|
{chats.map((chat) => (
|
|
<TouchableOpacity
|
|
key={chat.id}
|
|
style={styles.chatItem}
|
|
activeOpacity={0.7}
|
|
onPress={() => handleChatPress(chat.sender)}
|
|
>
|
|
{/* Sender Avatar */}
|
|
<View style={styles.avatar}>
|
|
<PersonIcon size={24} color={chat.isSystem ? colors.primary : colors.textSecondary} />
|
|
</View>
|
|
|
|
{/* Chat Content Info */}
|
|
<View style={styles.chatInfo}>
|
|
<View style={styles.chatHeader}>
|
|
<Text style={styles.chatTitleText} numberOfLines={1}>{chat.sender}</Text>
|
|
<Text style={styles.timeText}>{chat.time}</Text>
|
|
</View>
|
|
<Text style={styles.chatSnippetText} numberOfLines={1}>
|
|
{chat.snippet}
|
|
</Text>
|
|
</View>
|
|
|
|
{/* Unread badge info */}
|
|
{chat.unreadCount > 0 && (
|
|
<View style={styles.rightMeta}>
|
|
<View style={styles.unreadBadge}>
|
|
<Text style={styles.unreadBadgeText}>{chat.unreadCount}</Text>
|
|
</View>
|
|
</View>
|
|
)}
|
|
</TouchableOpacity>
|
|
))}
|
|
</ScrollView>
|
|
</View>
|
|
);
|
|
};
|
|
|
|
export default InboxScreen;
|