find ride and book ride page ui created

2024-09-04 06:42:36 +00:00
parent 78ba198a1f
commit 0b2a3ee944
7 changed files with 252 additions and 10 deletions
@@ -0,0 +1,36 @@
+import { FlatList, View } from "react-native";
+
+import { DriverCard } from "@/components/driver-card";
+import { RideLayout } from "@/components/ride-layout";
+import { CustomButton } from "@/components/custom-button";
+import { router } from "expo-router";
+import { useDriverStore } from "@/store";
+
+const ConfirmRide = () => {
+  const { drivers, selectedDriver, setSelectedDriver } = useDriverStore();
+
+  return (
+    <RideLayout title="Choose a Driver" snapPoints={["65%", "85%"]}>
+      <FlatList
+        data={drivers}
+        renderItem={({ item }) => (
+          <DriverCard
+            item={item}
+            selected={selectedDriver ?? 0}
+            setSelected={() => setSelectedDriver(item.id)}
+          />
+        )}
+        ListFooterComponent={() => (
+          <View className="mx-5 mt-10">
+            <CustomButton
+              title="Select Ride"
+              onPress={() => router.replace("/(root)/book-ride")}
+            />
+          </View>
+        )}
+      />
+    </RideLayout>
+  );
+};
+
+export default ConfirmRide;