From 77b9d8754b0f507a7d16f000ce6759dbff1a9867 Mon Sep 17 00:00:00 2001
From: hack_21031301_c761d3 <21031301@itcelaya.edu.mx>
Date: Sat, 23 May 2026 05:38:19 -0600
Subject: [PATCH] =?UTF-8?q?feat:=20GPS=20autocompleta=20direcci=C3=B3n=20y?=
 =?UTF-8?q?=20CP,=20220=20colonias=20reales=20por=20CP?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/App.js | 45 +++++++++++++++++++++++++++------------------
 1 file changed, 27 insertions(+), 18 deletions(-)

diff --git a/frontend/App.js b/frontend/App.js
index 7f06a05..34eea7e 100644
--- a/frontend/App.js
+++ b/frontend/App.js
@@ -41,6 +41,7 @@ export default function App() {
   const [localizando, setLocalizando] = useState(false);
   const [latGPS, setLatGPS] = useState(20.5185);
   const [lngGPS, setLngGPS] = useState(-100.8450);
+  const [coloniasCP, setColoniasCP] = useState([]);
 
   useEffect(() => {
     cargarSesion();
@@ -292,22 +293,11 @@ export default function App() {
         const dirAuto = `${lugar.street || ''} ${lugar.streetNumber || ''}`.trim();
         const cpAuto = lugar.postalCode || '';
         if (dirAuto) setDireccion(dirAuto);
-        if (cpAuto) setCodigoPostal(cpAuto);
-      }
-
-      const res = await fetch(
-        `${API_URL}/domicilios/ruta-por-coordenadas?lat=${latitude}&lng=${longitude}`,
-        { headers: { 'Authorization': `Bearer ${token}` } }
-      );
-      const data = await res.json();
-      if (data.cobertura) {
-        setColoniaSeleccionada(data.colonia_sugerida);
-        Alert.alert(
-          '📍 Ubicación detectada',
-          `Zona: ${data.colonia_sugerida}\nRuta: ${data.nombre_ruta}\nDistancia: ${data.distancia_metros}m`
-        );
-      } else {
-        Alert.alert('Sin cobertura', 'Tu ubicación no está dentro de las zonas de Celaya');
+        if (cpAuto) {
+          await buscarColoniasPorCP(cpAuto);
+        }
+        Alert.alert('📍 Ubicación detectada', 
+          `Dirección: ${dirAuto}\nCP: ${cpAuto}\nSelecciona tu colonia del listado`);
       }
     } catch {
       Alert.alert('Error', 'No se pudo obtener tu ubicación');
@@ -315,6 +305,25 @@ export default function App() {
     setLocalizando(false);
   };
 
+  const buscarColoniasPorCP = async (cp) => {
+    setCodigoPostal(cp);
+    if (cp.length === 5) {
+      try {
+        const res = await fetch(`${API_URL}/colonias-por-cp?codigo_postal=${cp}`, {
+          headers: { 'Authorization': `Bearer ${token}` }
+        });
+        const data = await res.json();
+        if (data.encontrado && data.colonias.length > 0) {
+          setColoniasCP(data.colonias);
+        } else {
+          setColoniasCP([]);
+        }
+      } catch { setColoniasCP([]); }
+    } else {
+      setColoniasCP([]);
+    }
+  };
+
   if (screen === 'splash') return (
     <View style={styles.splashContainer}>
       <Text style={styles.splashEmoji}>🚛</Text>
@@ -373,7 +382,7 @@ export default function App() {
       <TextInput style={styles.input} placeholder="Dirección (ej: Calle Morelos 123)"
         value={direccion} onChangeText={setDireccion} />
       <TextInput style={styles.input} placeholder="Código postal (ej: 38000)"
-        value={codigoPostal} onChangeText={setCodigoPostal} keyboardType="numeric" />
+        value={codigoPostal} onChangeText={buscarColoniasPorCP} keyboardType="numeric" />
       <TouchableOpacity
         style={[styles.btnUbicacion, localizando && { opacity: 0.6 }]}
         onPress={usarUbicacion}
@@ -391,7 +400,7 @@ export default function App() {
       </TouchableOpacity>
       {mostrarColonias && (
         <View style={styles.dropdown}>
-          {COLONIAS.map(c => (
+          {(coloniasCP.length > 0 ? coloniasCP : COLONIAS).map(c => (
             <TouchableOpacity key={c} style={styles.dropdownItem}
               onPress={() => { setColoniaSeleccionada(c); setMostrarColonias(false); }}>
               <Text style={styles.dropdownText}>{c}</Text>