From 19f0e716091f8c85cf165797efa28610a5a8f8ae Mon Sep 17 00:00:00 2001 From: Sanidhya Kumar Verma Date: Wed, 4 Sep 2024 10:19:02 +0000 Subject: [PATCH] refactor: router.replace to router.push and fix typos --- app/(auth)/sign-in.tsx | 2 +- app/(auth)/sign-up.tsx | 2 +- app/(auth)/welcome.tsx | 4 +- app/(root)/confirm-ride.tsx | 2 +- app/(root)/find-ride.tsx | 2 +- components/driver-card.tsx | 6 +- components/google-text-input.tsx | 1 + components/map.tsx | 95 ++++++++++++++++++++++++++++---- lib/map.ts | 1 + 9 files changed, 97 insertions(+), 18 deletions(-) diff --git a/app/(auth)/sign-in.tsx b/app/(auth)/sign-in.tsx index 4512c65..c2a9da4 100644 --- a/app/(auth)/sign-in.tsx +++ b/app/(auth)/sign-in.tsx @@ -27,7 +27,7 @@ const SignIn = () => { if (signInAttempt.status === "complete") { await setActive({ session: signInAttempt.createdSessionId }); - router.replace("/"); + router.push("/"); } else { Alert.alert("Error", "Invalid email or password."); setForm((prevForm) => ({ diff --git a/app/(auth)/sign-up.tsx b/app/(auth)/sign-up.tsx index 020d3d0..d9b2ecf 100644 --- a/app/(auth)/sign-up.tsx +++ b/app/(auth)/sign-up.tsx @@ -235,7 +235,7 @@ const SignUp = () => { router.replace("/(root)/(tabs)/home")} + onPress={() => router.push("/(root)/(tabs)/home")} className="mt-5" /> diff --git a/app/(auth)/welcome.tsx b/app/(auth)/welcome.tsx index 3c8cf2e..b67f187 100644 --- a/app/(auth)/welcome.tsx +++ b/app/(auth)/welcome.tsx @@ -15,7 +15,7 @@ const Welcome = () => { return ( router.replace("/(auth)/sign-up")} + onPress={() => router.push("/(auth)/sign-up")} className="w-full flex justify-end items-end p-5" > Skip @@ -54,7 +54,7 @@ const Welcome = () => { isLastSlide - ? router.replace("/(auth)/sign-up") + ? router.push("/(auth)/sign-up") : swiperRef.current?.scrollBy(1) } title={isLastSlide ? "Get Started" : "Next"} diff --git a/app/(root)/confirm-ride.tsx b/app/(root)/confirm-ride.tsx index 6dd59ce..2517476 100644 --- a/app/(root)/confirm-ride.tsx +++ b/app/(root)/confirm-ride.tsx @@ -24,7 +24,7 @@ const ConfirmRide = () => { router.replace("/(root)/book-ride")} + onPress={() => router.push("/(root)/book-ride")} /> )} diff --git a/app/(root)/find-ride.tsx b/app/(root)/find-ride.tsx index 0f5b2bc..022ddcc 100644 --- a/app/(root)/find-ride.tsx +++ b/app/(root)/find-ride.tsx @@ -42,7 +42,7 @@ const FindRide = () => { router.replace("/(root)/confirm-ride")} + onPress={() => router.push("/(root)/confirm-ride")} className="mt-5" /> diff --git a/components/driver-card.tsx b/components/driver-card.tsx index aad5b94..11e0983 100644 --- a/components/driver-card.tsx +++ b/components/driver-card.tsx @@ -24,7 +24,9 @@ export const DriverCard = ({ - {item.title} + + {item.title ?? `${item.first_name} ${item.last_name}`} + Star @@ -45,7 +47,7 @@ export const DriverCard = ({ - {formatTime(item.time!)} + {formatTime(parseInt(`${item.time}`))} diff --git a/components/google-text-input.tsx b/components/google-text-input.tsx index c89ac41..d6a2d22 100644 --- a/components/google-text-input.tsx +++ b/components/google-text-input.tsx @@ -64,6 +64,7 @@ export const GoogleTextInput = ({ language: "en", }} renderLeftButton={() => ( + // TODO: replace later with View and remove onPress { handlePress({ diff --git a/components/map.tsx b/components/map.tsx index c82ce97..8a9a796 100644 --- a/components/map.tsx +++ b/components/map.tsx @@ -1,12 +1,20 @@ import { useEffect, useState } from "react"; +import { ActivityIndicator, Text, View } from "react-native"; import MapView, { Marker, PROVIDER_DEFAULT } from "react-native-maps"; +import MapViewDirections from "react-native-maps-directions"; -import { calculateRegion, generateMarkersFromData } from "@/lib/map"; -import { useDriverStore, useLocationStore } from "@/store"; -import type { MarkerData } from "@/types/type"; import { icons } from "@/constants"; +import { useFetch } from "@/lib/fetch"; +import { + calculateDriverTimes, + calculateRegion, + generateMarkersFromData, +} from "@/lib/map"; +import { useDriverStore, useLocationStore } from "@/store"; +import type { Driver, MarkerData } from "@/types/type"; -const drivers = [ +// TODO: Remove mocked drivers later +const mockedDrivers = [ { id: 1, driver_id: 1, @@ -20,7 +28,6 @@ const drivers = [ rating: 4.8, latitude: 0, longitude: 0, - title: "", price: "45", time: 5, }, @@ -37,7 +44,6 @@ const drivers = [ rating: 4.6, latitude: 0, longitude: 0, - title: "", price: "45", time: 5, }, @@ -54,7 +60,6 @@ const drivers = [ rating: 4.7, latitude: 0, longitude: 0, - title: "", price: "45", time: 5, }, @@ -71,13 +76,14 @@ const drivers = [ rating: 4.9, latitude: 0, longitude: 0, - title: "", price: "45", time: 5, }, ]; export const Map = () => { + const { data: drivers, loading, error } = useFetch("/(api)/driver"); + const { userLatitude, userLongitude, @@ -96,8 +102,6 @@ export const Map = () => { useEffect(() => { if (Array.isArray(drivers)) { - setDrivers(drivers); - if (!userLatitude || !userLongitude) return; const newMarkers = generateMarkersFromData({ @@ -111,6 +115,49 @@ export const Map = () => { // eslint-disable-next-line react-hooks/exhaustive-deps }, [drivers]); + useEffect(() => { + if (markers.length > 0 && destinationLatitude && destinationLatitude) { + // TODO: Uncomment this code block + + /* calculateDriverTimes({ + markers, + userLatitude, + userLongitude, + destinationLatitude, + destinationLongitude, + }) + .then((drivers) => { + setDrivers(drivers as MarkerData[]); + }) */ + + // TODO: Remove this line + setDrivers(mockedDrivers); + } + }, [ + markers, + destinationLatitude, + destinationLongitude, + userLatitude, + userLongitude, + setDrivers, + ]); + + if (loading || !userLatitude || !userLongitude) { + return ( + + + + ); + } + + if (error) { + return ( + + Error: {error} + + ); + } + return ( { } /> ))} + + {destinationLatitude && destinationLongitude && ( + <> + + + + + )} ); }; diff --git a/lib/map.ts b/lib/map.ts index 7f2bab1..67339e8 100644 --- a/lib/map.ts +++ b/lib/map.ts @@ -106,6 +106,7 @@ export const calculateDriverTimes = async ({ `https://maps.googleapis.com/maps/api/directions/json?origin=${userLatitude},${userLongitude}&destination=${destinationLatitude},${destinationLongitude}&key=${directionsAPI}`, ); const dataToDestination = await responseToDestination.json(); + const timeToDestination = dataToDestination.routes[0].legs[0].duration.value; // Time in seconds