Files
waseel/components/driver-card.tsx
KrikoriosandClaude Opus 5 8807ff41c5 Waseel: driver capture, chat/calls, dispatch, and session fixes
Driver onboarding now photographs the licence, ID card and vehicle
registration and reads the credential fields off them, plus a camera-only
profile selfie riders check the arriving driver against. Adds in-app chat
and WebRTC calls, push-backed ride offers, ratings, cancellation and
payment sheets, settlement, and the owner dashboard endpoints behind them.

Camera permission on Android:
  - Declare CAMERA and READ_MEDIA_IMAGES in the manifest. expo-image-picker's
    own plugin never declares CAMERA, and Android denies a request for an
    undeclared permission instantly and silently — no dialog is ever shown,
    which is indistinguishable from the app not asking at all.
  - Handle canAskAgain: once Android stops showing the dialog, repeating why
    we need it is a dead end, so offer Open Settings instead (lib/capture-
    permission.ts), matching what the location flow already did.

Session: a 401 on a request that carried a token now ends the session
instead of being reinterpreted per-screen — driver-home had been reading it
as "this user has no driver profile" and showing an onboarding form to an
already-onboarded driver. Requests without a token are exempt so a failed
sign-in doesn't sign you out, and the notification is latched per token so
concurrent polls tear the session down once. (root) gains the auth guard
that turns that into the sign-in screen; app/index.tsx only guarded the way
in, leaving a session that ended mid-screen with nowhere to go.

Also ignore .uploads/ — it holds driver licence, ID and vehicle scans plus
profile photos, which are personal data and must not be committed.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-08-26 02:17:55 +03:00

86 lines
2.8 KiB
TypeScript

import { Image, Text, TouchableOpacity, View } from "react-native";
import { icons } from "@/constants";
import { driverPhotoUri } from "@/lib/driver-photo";
import { tr } from "@/lib/i18n";
import { formatTime } from "@/lib/utils";
import { DriverCardProps } from "@/types/type";
export const DriverCard = ({
item,
selected,
setSelected,
}: DriverCardProps) => {
return (
<TouchableOpacity
onPress={setSelected}
className={`${
selected === item.id
? "bg-general-600 dark:bg-primary-500/20"
: "bg-white dark:bg-neutral-900"
} flex flex-row items-center justify-between py-5 px-3 rounded-xl`}
>
<Image
source={{ uri: driverPhotoUri(item.profile_image_url) }}
alt={tr("components.driverCard.avatarAlt")}
className="w-14 h-14 rounded-full"
/>
<View className="flex-1 flex flex-col items-start justify-center mx-3">
<View className="flex flex-row items-center justify-start mb-1">
<Text className="text-lg font-JakartaRegular text-black dark:text-white">
{item.title ?? `${item.first_name} ${item.last_name}`}
</Text>
<View className="flex flex-row items-center space-x-1 ml-2">
<Image
source={icons.star}
alt={tr("components.driverCard.starAlt")}
className="w-3.5 h-3.5"
/>
<Text className="text-sm font-JakartaRegular text-black dark:text-white">
{item.rating}
</Text>
</View>
</View>
<View className="flex flex-row items-center justify-start">
<View className="flex flex-row items-center">
<Image
source={icons.dollar}
alt={tr("components.driverCard.dollarAlt")}
className="w-4 h-4"
/>
<Text className="text-sm font-JakartaRegular ml-1 text-black dark:text-white">
${item.price}
</Text>
</View>
<Text className="text-sm font-JakartaRegular text-general-800 dark:text-neutral-400 mx-1">
|
</Text>
<Text className="text-sm font-JakartaRegular text-general-800 dark:text-neutral-400">
{formatTime(parseInt(`${item.time}`))}
</Text>
<Text className="text-sm font-JakartaRegular text-general-800 dark:text-neutral-400 mx-1">
|
</Text>
<Text className="text-sm font-JakartaRegular text-general-800 dark:text-neutral-400">
{tr("components.driverCard.seats", {}, item.car_seats)}
</Text>
</View>
</View>
<Image
source={{ uri: item.car_image_url }}
alt={tr("components.driverCard.carAlt")}
className="h-14 w-14"
resizeMode="contain"
/>
</TouchableOpacity>
);
};