Merge branch 'main' of https://git.onlinces.net/onlinces/hackathon-opti-1a67c90779374919b2f9ca0914dcd4b4

frontend/package-lock.json

@@ -5208,9 +5208,6 @@
       "cpu": [
         "arm64"
       ],
-      "libc": [
-        "glibc"
-      ],
       "license": "MPL-2.0",
       "optional": true,
       "os": [
@@ -5231,9 +5228,6 @@
       "cpu": [
         "arm64"
       ],
-      "libc": [
-        "musl"
-      ],
       "license": "MPL-2.0",
       "optional": true,
       "os": [
@@ -5254,9 +5248,6 @@
       "cpu": [
         "x64"
       ],
-      "libc": [
-        "glibc"
-      ],
       "license": "MPL-2.0",
       "optional": true,
       "os": [
@@ -5277,9 +5268,6 @@
       "cpu": [
         "x64"
       ],
-      "libc": [
-        "musl"
-      ],
       "license": "MPL-2.0",
       "optional": true,
       "os": [

frontend/src/components/EtaCard.tsx

@@ -0,0 +1,54 @@
+import { View, Text, StyleSheet } from 'react-native';
+import { Colors } from '../constants/theme';
+
+type EtaCardProps = {
+  minutes?: number;
+  status?: string;
+};
+
+export default function EtaCard({
+  minutes = 12,
+  status = 'En Camino',
+}: EtaCardProps) {
+
+  const theme = Colors.light;
+
+  return (
+    <View style={[styles.card, { backgroundColor: theme.backgroundElement }]}>
+      
+      <Text style={[styles.label, { color: theme.textSecondary }]}>
+        ETA estimado
+      </Text>
+
+      <Text style={[styles.time, { color: theme.text }]}>
+        {minutes} min
+      </Text>
+
+      <Text style={[styles.status, { color: theme.textSecondary }]}>
+        {status}
+      </Text>
+
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  card: {
+    margin: 15,
+    padding: 20,
+    borderRadius: 16,
+  },
+  label: {
+    fontSize: 12,
+    marginBottom: 6,
+  },
+  time: {
+    fontSize: 32,
+    fontWeight: 'bold',
+    marginBottom: 6,
+  },
+  status: {
+    fontSize: 14,
+    fontWeight: '600',
+  },
+});