NeoScan_Physician/app/modules/Dashboard/components/CaseQueue.tsx
2025-07-18 19:01:23 +05:30

95 lines
2.7 KiB
TypeScript

/*
* File: CaseQueue.tsx
* Description: Component to display a list of cases in the queue
* Design & Developed by Tech4Biz Solutions
* Copyright (c) Spurrin Innovations. All rights reserved.
*/
import React from 'react';
import { View, Text, FlatList, StyleSheet, TouchableOpacity } from 'react-native';
import { Card, InfoCard } from '../../../../shared/src/components/Card';
import { CustomIcon } from '../../../../shared/src/components/Icons';
import { Colors, Spacing, Typography } from '../../../../shared/src/theme';
import { Case } from '../redux/dashboardSlice';
interface CaseQueueProps {
cases: Case[];
onSelect: (item: Case) => void;
}
/**
* CaseQueue - displays a list of cases in the queue
*/
const CaseQueue: React.FC<CaseQueueProps> = ({ cases, onSelect }) => {
if (!cases.length) {
return <InfoCard><Text style={styles.empty}>No cases in queue.</Text></InfoCard>;
}
return (
<FlatList
data={cases}
keyExtractor={item => item.id}
renderItem={({ item }) => (
<TouchableOpacity onPress={() => onSelect(item)}>
<Card style={styles.card}>
<View style={styles.row}>
<CustomIcon
name={item.status === 'critical' ? 'alert' : item.status === 'urgent' ? 'alert-outline' : 'check-circle'}
color={item.status === 'critical' ? Colors.error : item.status === 'urgent' ? Colors.warning : Colors.success}
size={24}
/>
<View style={styles.info}>
<Text style={styles.patient}>{item.patientName}</Text>
<Text style={styles.desc}>{item.description}</Text>
</View>
<Text style={styles.confidence}>{item.aiConfidence}%</Text>
</View>
</Card>
</TouchableOpacity>
)}
/>
);
};
const styles = StyleSheet.create({
card: {
marginBottom: Spacing.sm,
},
row: {
flexDirection: 'row',
alignItems: 'center',
},
info: {
flex: 1,
marginLeft: Spacing.sm,
},
patient: {
fontFamily: Typography.fontFamily.bold,
fontSize: Typography.fontSize.md,
color: Colors.textPrimary,
},
desc: {
fontFamily: Typography.fontFamily.regular,
fontSize: Typography.fontSize.sm,
color: Colors.textSecondary,
},
confidence: {
fontFamily: Typography.fontFamily.bold,
fontSize: Typography.fontSize.md,
color: Colors.info,
marginLeft: Spacing.sm,
},
empty: {
textAlign: 'center',
color: Colors.textMuted,
fontFamily: Typography.fontFamily.regular,
fontSize: Typography.fontSize.md,
},
});
export default CaseQueue;
/*
* End of File: CaseQueue.tsx
* Design & Developed by Tech4Biz Solutions
* Copyright (c) Spurrin Innovations. All rights reserved.
*/