Initial commit

components/AttendanceCard.tsx

@@ -0,0 +1,53 @@
+import { AlertTriangle, Clock } from 'lucide-react-native';
+import React from 'react';
+import { Text, View } from 'react-native';
+import { AttendanceRecord } from '@/types/types';
+
+interface AttendanceCardProps {
+    item: AttendanceRecord;
+}
+
+export default function AttendanceCard({ item }: AttendanceCardProps) {
+    return (
+        <View className="bg-white p-5 rounded-3xl shadow-sm border border-gray-100 flex-col mb-4">
+            <View className="flex-row items-center border-b border-gray-50 pb-3 mb-3">
+                <View className="bg-blue-50 p-4 rounded-full mr-4 flex-shrink-0">
+                    <Clock size={24} color="#1071C2" pointerEvents="none"/>
+                </View>
+                <View className="flex-1 mr-2">
+                    <Text className="text-base font-bold text-primary-dark mb-1 leading-tight uppercase" numberOfLines={2}>
+                        {item.place}
+                    </Text>
+                    <Text className="text-xs font-medium text-primary-dark mb-1 leading-tight" numberOfLines={2}>
+                        {item.address}
+                    </Text>
+                    <Text className="text-xs font-bold text-gray-400 mt-1">
+                        {item.date}
+                    </Text>
+                </View>
+            </View>
+            <View className="flex-row items-center flex-wrap gap-x-6 gap-y-2 px-1">
+                <View className="flex-row items-center">
+                    <Text className={`font-bold ${!item.out ? 'text-red-600' : 'text-green-600'}`}>
+                        Entrata: {item.in}
+                    </Text>
+                </View>
+                {item.out && (
+                    <View className="flex-row items-center">
+                        <Text className="font-bold text-green-600">
+                            Uscita: {item.out}
+                        </Text>
+                    </View>
+                )}
+                {!item.out && (
+                    <View className="flex-row items-center">
+                        <AlertTriangle size={16} color="#dc2626" />
+                        <Text className="font-bold text-red-600 ml-1">
+                            In corso
+                        </Text>
+                    </View>
+                )}
+            </View>
+        </View>
+    );
+}