| 1 | import { format, isToday, isYesterday } from 'date-fns';
|
| 2 | import { ptBR } from 'date-fns/locale';
|
| 3 | import { StyleSheet, View } from 'react-native';
|
| 4 | import { Text } from '@/components/ui/Text';
|
| 5 | import { router } from 'expo-router';
|
| 6 |
|
| 7 | import { Card } from '@/components/ui/Cards';
|
| 8 | import { Badge } from '@/components/ui/Badge';
|
| 9 | import { getMood } from '@/constants/moods';
|
| 10 | import { Colors, Spacing } from '@/constants/theme';
|
| 11 | import { MoodEntry } from '@/lib/api';
|
| 12 | import { getTimeBadge, formatMoment } from '@/lib/utils/time';
|
| 13 |
|
| 14 | interface MoodEntryLogProps {
|
| 15 | entry: MoodEntry;
|
| 16 | }
|
| 17 |
|
| 18 | const MoodEntryLog = ({ entry }: MoodEntryLogProps) => {
|
| 19 | const moment = new Date(entry.moment);
|
| 20 | const moodDef = getMood(entry.selectedMood.toLowerCase());
|
| 21 | const badge = getTimeBadge(moment);
|
| 22 |
|
| 23 | const handlePress = () => router.push(`/entry/${entry.id}`);
|
| 24 |
|
| 25 | return (
|
| 26 | <Card style={styles.card} onPress={handlePress}>
|
| 27 | <View style={styles.moodIcon}>
|
| 28 | <Text style={styles.moodIconEmoji}>{moodDef?.icon ?? '😐'}</Text>
|
| 29 | </View>
|
| 30 |
|
| 31 | <View style={styles.moodBlock}>
|
| 32 | <Text style={styles.title} numberOfLines={1}>
|
| 33 | {moodDef?.label ?? entry.selectedMood}
|
| 34 | </Text>
|
| 35 |
|
| 36 | <Text style={styles.subtitle} numberOfLines={1}>
|
| 37 | {formatMoment(moment)}
|
| 38 | </Text>
|
| 39 | </View>
|
| 40 |
|
| 41 | <Badge
|
| 42 | label={badge.label}
|
| 43 | variant={badge.variant}
|
| 44 | />
|
| 45 | </Card>
|
| 46 | );
|
| 47 | }
|
| 48 |
|
| 49 | const styles = StyleSheet.create({
|
| 50 | card: {
|
| 51 | flexDirection: "row",
|
| 52 | alignItems: "center",
|
| 53 | gap: 14,
|
| 54 | overflow: "hidden",
|
| 55 | padding: Spacing.cardGap
|
| 56 | },
|
| 57 | moodIcon: {
|
| 58 | width: 48,
|
| 59 | height: 48,
|
| 60 | alignItems: "center",
|
| 61 | justifyContent: "center",
|
| 62 | flexShrink: 0,
|
| 63 | },
|
| 64 | moodIconEmoji: {
|
| 65 | fontSize: 26,
|
| 66 | },
|
| 67 | // Text
|
| 68 | moodBlock: {
|
| 69 | flex: 1,
|
| 70 | minWidth: 0,
|
| 71 | },
|
| 72 | title: {
|
| 73 | fontSize: 15,
|
| 74 | fontWeight: "700",
|
| 75 | color: Colors.light.text,
|
| 76 | letterSpacing: -0.2,
|
| 77 | marginBottom: 3,
|
| 78 | },
|
| 79 | subtitle: {
|
| 80 | fontSize: 12.5,
|
| 81 | fontWeight: "500",
|
| 82 | color: Colors.light.textSecondary,
|
| 83 | letterSpacing: 0.1,
|
| 84 | },
|
| 85 | });
|
| 86 |
|
| 87 | export default MoodEntryLog
|