43 lines
2.0 KiB
JavaScript
43 lines
2.0 KiB
JavaScript
import React from 'react';
|
|
import { Pressable, Text, View } from 'react-native';
|
|
import { styles } from '../styles';
|
|
|
|
export default function HistoryTab({ selectedTrip, selectedTripCheckups, selectedCheckupId, setSelectedCheckupId }) {
|
|
return (
|
|
<View style={styles.section}>
|
|
<Text style={styles.sectionTitle}>History</Text>
|
|
|
|
{!selectedTrip ? <Text style={styles.muted}>Select a trip first.</Text> : null}
|
|
{selectedTrip ? <Text style={styles.tripHistoryLabel}>Check-ups for: {selectedTrip.name}</Text> : null}
|
|
{selectedTrip && selectedTripCheckups.length === 0 ? <Text style={styles.muted}>No check-ups saved yet.</Text> : null}
|
|
|
|
{selectedTripCheckups.map((checkup) => (
|
|
<View key={checkup.id} style={styles.cardSoft}>
|
|
<Pressable onPress={() => setSelectedCheckupId((prev) => (prev === checkup.id ? null : checkup.id))}>
|
|
<Text style={styles.cardTitle}>{new Date(checkup.createdAt).toLocaleString()}</Text>
|
|
<Text style={styles.cardMeta}>
|
|
{checkup.snapshot.length} items · correct: {checkup.stats?.correct ?? checkup.snapshot.filter((x) => x.result === 'correct').length} · bad:{' '}
|
|
{checkup.stats?.bad ?? checkup.snapshot.filter((x) => x.result === 'bad').length}
|
|
</Text>
|
|
<Text style={styles.cardMeta}>{selectedCheckupId === checkup.id ? 'Tap to collapse' : 'Tap to open'}</Text>
|
|
</Pressable>
|
|
|
|
{selectedCheckupId === checkup.id ? (
|
|
<View style={styles.snapshotWrap}>
|
|
{checkup.snapshot.map((entry) => (
|
|
<View key={entry.itemId} style={styles.snapshotRow}>
|
|
<Text style={styles.snapshotTitle}>{entry.name}</Text>
|
|
<Text style={styles.cardMeta}>
|
|
{entry.status} · {entry.placement}
|
|
{entry.status === 'lent-to' && entry.lentTo ? ` · ${entry.lentTo}` : ''}
|
|
</Text>
|
|
</View>
|
|
))}
|
|
</View>
|
|
) : null}
|
|
</View>
|
|
))}
|
|
</View>
|
|
);
|
|
}
|