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

Waseel: driver app, dispatch, POI suggestions, map fixes

Browse Source
This commit is contained in:
Krikorios
2026-08-25 02:57:49 +03:00
parent 899ca93cd5
commit 1d84003e0a
50 changed files with 3625 additions and 625 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/ride-card.tsx
+26 -25
View File
@@ -1,6 +1,7 @@
import { Image, Text, View } from "react-native";
import { icons } from "@/constants";
import { tr } from "@/lib/i18n";
import { formatDate, formatTime } from "@/lib/utils";
import type { Ride } from "@/types/type";
@@ -17,22 +18,22 @@ export const RideCard = ({ ride }: { ride: Ride }) => {
} = ride;
return (
<View className="flex flex-row items-center justify-center bg-white rounded-lg shadow-sm shadow-neutral-300 mb-3">
<View className="flex flex-row items-center justify-center bg-white dark:bg-neutral-900 rounded-lg shadow-sm shadow-neutral-300 dark:shadow-neutral-950/40 mb-3">
<View className="flex flex-col items-center justify-center p-3">
<View className="flex flex-row items-center justify-between">
<Image
source={{
uri: `https://maps.geoapify.com/v1/staticmap?style=osm-bright&width=600&height=400&center=lonlat:${destination_longitude},${destination_latitude}&zoom=14&apiKey=${process.env.EXPO_PUBLIC_GEOAPIFY_API_KEY}`,
}}
alt="Map"
alt={tr("components.rideCard.mapAlt")}
className="w-[80px] h-[90px] rounded-lg"
/>
<View className="flex flex-col mx-5 gap-y-5 flex-1">
<View className="flex flex-row items-center gap-x-2">
<Image source={icons.to} alt="Origin" className="w-5 h-5" />
<Image source={icons.to} alt={tr("components.rideCard.originAlt")} className="w-5 h-5" />
<Text className="font-JakartaMedium" numberOfLines={1}>
<Text className="font-JakartaMedium text-black dark:text-white" numberOfLines={1}>
{origin_address}
</Text>
</View>
@@ -40,71 +41,71 @@ export const RideCard = ({ ride }: { ride: Ride }) => {
<View className="flex flex-row items-center gap-x-2">
<Image
source={icons.point}
alt="Destination"
alt={tr("components.rideCard.destinationAlt")}
className="w-5 h-5"
/>
<Text className="font-JakartaMedium" numberOfLines={1}>
<Text className="font-JakartaMedium text-black dark:text-white" numberOfLines={1}>
{destination_address}
</Text>
</View>
</View>
</View>
<View className="flex flex-col w-full mt-5 bg-general-500 rounded-lg p-3 items-start justify-center">
<View className="flex flex-col w-full mt-5 bg-general-500 dark:bg-neutral-800 rounded-lg p-3 items-start justify-center">
<View className="flex flex-row items-center w-full justify-between mb-5">
<Text className="font-JakartaMedium text-gray-500 text-xs">
Date &amp; Time
<Text className="font-JakartaMedium text-gray-500 dark:text-neutral-400 text-xs">
{tr("components.rideCard.dateTime")}
</Text>
<Text className="font-JakartaMedium text-gray-500 text-xs">
<Text className="font-JakartaMedium text-gray-500 dark:text-neutral-400 text-xs">
{formatDate(created_at)}, {formatTime(ride_time)}
</Text>
</View>
<View className="flex flex-row items-center w-full justify-between mb-5">
<Text className="font-JakartaMedium text-gray-500 text-xs">
Driver
<Text className="font-JakartaMedium text-gray-500 dark:text-neutral-400 text-xs">
{tr("components.rideCard.driver")}
</Text>
<Text className="font-JakartaMedium text-gray-500 text-xs">
<Text className="font-JakartaMedium text-gray-500 dark:text-neutral-400 text-xs">
{driver.first_name} {driver.last_name}
</Text>
</View>
<View className="flex flex-row items-center w-full justify-between mb-5">
<Text className="font-JakartaMedium text-gray-500 text-xs">
Car Seats
<Text className="font-JakartaMedium text-gray-500 dark:text-neutral-400 text-xs">
{tr("components.rideCard.carSeats")}
</Text>
<Text className="font-JakartaMedium text-gray-500 text-xs">
<Text className="font-JakartaMedium text-gray-500 dark:text-neutral-400 text-xs">
{driver.car_seats}
</Text>
</View>
<View className="flex flex-row items-center w-full justify-between mb-5">
<Text className="font-JakartaMedium text-gray-500 text-xs">
Fare
<Text className="font-JakartaMedium text-gray-500 dark:text-neutral-400 text-xs">
{tr("components.rideCard.fare")}
</Text>
<Text className="font-JakartaMedium text-gray-500 text-xs">
<Text className="font-JakartaMedium text-gray-500 dark:text-neutral-400 text-xs">
${(ride.fare_price / 100).toFixed(2)}
</Text>
</View>
<View className="flex flex-row items-center w-full justify-between mb-5">
<Text className="font-JakartaMedium text-gray-500 text-xs">
Payment Status
<Text className="font-JakartaMedium text-gray-500 dark:text-neutral-400 text-xs">
{tr("components.rideCard.paymentStatus")}
</Text>
<Text
className={`font-JakartaMedium capitalize text-xs ${payment_status === "paid" ? "text-emerald-500" : "text-gray-500"}`}
className={`font-JakartaMedium capitalize text-xs ${payment_status === "paid" ? "text-emerald-500 dark:text-emerald-400" : "text-gray-500 dark:text-neutral-400"}`}
>
{payment_status === "cash"
? "Cash · Pay to driver"
? tr("components.rideCard.paymentCash")
: payment_status === "paid"
? "Paid by card"
: payment_status}
? tr("components.rideCard.paymentPaid")
: tr("components.rideCard.paymentOther", { status: payment_status })}
</Text>
</View>
</View>