georges/waseel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix home map and location, add service selector

Browse Source 
The Android map never drew because mapType was "mutedStandard", an Apple
Maps value. Android's MapManager looks the name up in a fixed table and
unboxes the result into an int, so an unrecognised value threw a
NullPointerException in the native view manager before any tile
rendered. Android now gets "standard" plus a customMapStyle that mutes
POI and transit labels, since showsPointsOfInterest is iOS-only too.

Location hung indefinitely: getCurrentPositionAsync was called with no
accuracy and no timeout, so it waited for a GPS fix that never arrives
indoors or on an emulator with no mock location. useUserLocation now
takes a cached fix first for an immediate render, caps the precise
reading at 15 seconds, and checks device location services separately
from app permission. Reverse geocoding moved off the critical path so a
failed lookup costs the address label rather than the coordinates. The
single boolean became five states, each with its own notice and either a
retry or a settings shortcut, since retrying a hard denial does nothing.

Map also no longer deletes itself when the driver fetch fails or the
location is still pending: drivers are an overlay, and calculateRegion
already falls back to Beirut.

Adds a four-tile service selector above Recent Rides - Car, Moto,
Courier, My Car - with the choice held in useServiceStore for the
booking flow to read. English only for now; the intended Arabic names
are recorded in constants/services.ts for the language pass. Selection
styling matches the role picker on sign-up so the two read as one
control.

app.config.js layers the Google Maps key and expo-location permission
strings onto app.json. No effect under Expo Go, which ignores native
config, but required for the first EAS build.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Krikorios
2026-08-23 23:34:04 +03:00
co-authored by Claude Opus 5
parent bc23c94ea2
commit 59e336c23d
8 changed files with 471 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/(root)/(tabs)/home.tsx
+33 -50
View File
@@ -1,6 +1,4 @@
import * as Location from "expo-location";
import { router } from "expo-router";
import { useEffect, useState } from "react";
import {
ActivityIndicator,
FlatList,
@@ -12,22 +10,27 @@ import {
import { SafeAreaView } from "react-native-safe-area-context";
import { GoogleTextInput } from "@/components/google-text-input";
import { LocationNotice } from "@/components/location-notice";
import { Map } from "@/components/map";
import { RideCard } from "@/components/ride-card";
import { ServiceSelector } from "@/components/service-selector";
import { icons, images } from "@/constants";
import { useSession } from "@/lib/session";
import { useUserLocation } from "@/lib/use-user-location";
import { useLocationStore } from "@/store";
import { useFetch } from "@/lib/fetch";
import type { Ride } from "@/types/type";
const Home = () => {
const { setUserLocation, setDestinationLocation } = useLocationStore();
const setDestinationLocation = useLocationStore(
(state) => state.setDestinationLocation,
);
const { signOut, user } = useSession();
const { data: recentRides, loading } = useFetch<Ride[]>(
`/(api)/ride/${user?.id}`,
);
const [hasPermissions, setHasPermissions] = useState(false);
const { status: locationStatus, retry: retryLocation } = useUserLocation();
const handleSignOut = () => {
signOut();
@@ -44,43 +47,6 @@ const Home = () => {
router.push("/(root)/find-ride");
};
useEffect(() => {
const requestLocation = async () => {
try {
let { status } = await Location.requestForegroundPermissionsAsync();
if (status !== "granted") return setHasPermissions(false);
setHasPermissions(true);
let location = await Location.getCurrentPositionAsync();
let addressText = "Unknown location";
try {
const address = await Location.reverseGeocodeAsync({
longitude: location.coords?.longitude,
latitude: location.coords?.latitude,
});
if (address[0]) {
addressText = `${address[0].name}, ${address[0].region}`;
}
} catch (geocodeErr) {
console.log("[REVERSE_GEOCODE]: ", geocodeErr);
}
setUserLocation({
latitude: location.coords.latitude,
longitude: location.coords.longitude,
address: addressText,
});
} catch (err) {
console.log("[LOCATION]: ", err);
setHasPermissions(false);
}
};
requestLocation();
}, [setUserLocation]);
return (
<SafeAreaView className="bg-general-500">
@@ -140,19 +106,36 @@ const Home = () => {
Your Current Location
</Text>
<View className="flex flex-row items-center bg-transparent h-[300px]">
{hasPermissions ? (
<Map />
<View className="w-full h-[300px] rounded-2xl overflow-hidden bg-white">
{locationStatus === "pending" || locationStatus === "granted" ? (
<>
{/* The map draws straight away on the Beirut fallback so the
slot never sits empty while the fix is still coming. */}
<Map />
{locationStatus === "pending" ? (
<View className="absolute bottom-3 self-center flex-row items-center rounded-full bg-white/95 px-4 py-2 shadow-md shadow-neutral-400/40">
<ActivityIndicator size="small" color="#0286ff" />
<Text className="ml-2 text-xs font-JakartaMedium text-general-200">
Finding your location…
</Text>
</View>
) : null}
</>
) : (
<View className="flex-1 items-center justify-center bg-white rounded-2xl h-full">
<Text className="text-general-200 text-center font-JakartaMedium px-5">
Location access is off.{"\n"}Enable it in your device
settings to see nearby drivers.
</Text>
</View>
<LocationNotice
status={locationStatus}
onRetry={retryLocation}
/>
)}
</View>
<Text className="text-xl font-JakartaBold mt-5 mb-3">
What do you need?
</Text>
<ServiceSelector />
<Text className="text-xl font-JakartaBold mt-5 mb-3">
Recent Rides
</Text>