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