eletrotupi / tcc/ frontend/components/history/MedicineHistoryCard.tsx63ebf2747779b8e00c4b8154074d000d98ffa751
1.8 KB | 62 lines Raw
1
import { Text, View, StyleSheet } from "react-native";
2
import { MaterialIcons } from "@expo/vector-icons";
3
import { Card } from "@/components/ui/Cards";
4
import type { HistoryCard } from "@/lib/history/types";
5
import type { CareAction } from "@/lib/api";
6
import { Spacing } from "@/constants/theme";
7
import { router } from "expo-router";
8

9
type Props = { card: HistoryCard & { raw: CareAction } };
10

11
export function MedicineHistoryCard({ card }: Props) {
12
  const time = new Date(card.timestamp).toLocaleTimeString("pt-BR", {
13
    hour: "2-digit",
14
    minute: "2-digit",
15
  });
16

17
  return (
18
    <Card
19
      style={styles.card}
20
      onPress={() => (router.push as any)(`/care-actions/${card.raw.id}`)}
21
    >
22
      <View style={styles.row}>
23
        <View style={[styles.iconWrap, styles.iconBg]}>
24
          <MaterialIcons name="medication" size={22} color="#7C3AED" />
25
        </View>
26
        <View style={styles.body}>
27
          <View style={styles.titleRow}>
28
            <Text style={styles.title}>{card.title}</Text>
29
            <Text style={styles.time}>{time}</Text>
30
          </View>
31
          <Text style={styles.summary} numberOfLines={2}>
32
            {card.summary}
33
          </Text>
34
        </View>
35
      </View>
36
    </Card>
37
  );
38
}
39

40
const styles = StyleSheet.create({
41
  card: { padding: Spacing.cardGap },
42
  row: { flexDirection: "row", alignItems: "flex-start", gap: 12 },
43
  iconWrap: {
44
    width: 40,
45
    height: 40,
46
    borderRadius: 20,
47
    alignItems: "center",
48
    justifyContent: "center",
49
    marginTop: 1,
50
  },
51
  iconBg: { backgroundColor: "#EDE9FE" },
52
  body: { flex: 1 },
53
  titleRow: {
54
    flexDirection: "row",
55
    justifyContent: "space-between",
56
    alignItems: "center",
57
    marginBottom: 2,
58
  },
59
  title: { fontSize: 15, fontWeight: "600" },
60
  time: { fontSize: 13, opacity: 0.45 },
61
  summary: { fontSize: 13, opacity: 0.6, lineHeight: 18 },
62
});