Add self-hosted auth, admin API, and owner web dashboard

- Replace Clerk with self-hosted JWT auth (register/login/verify, bcrypt
  passwords, Gmail OTP with console fallback)
- Add lib/db.ts pg pool + transaction helpers; seed script migrates legacy
  Clerk-era schema (drop clerk_id, enforce UUID ids and unique email)
- Add owner-gated admin API: stats, users, drivers CRUD, rides
- Add dashboard/ Vite React owner dashboard (login, overview, users,
  fleet, rides) with dev-server proxy to avoid Expo CORS middleware
- Add scripts/set-owner.mjs for role management

components/payment.tsx

@@ -1,17 +1,19 @@
-import { useAuth } from "@clerk/clerk-expo";
 import { router } from "expo-router";
 import * as WebBrowser from "expo-web-browser";
 import { useState } from "react";
-import { Alert, Image, Text, View } from "react-native";
+import { Alert, Image, Text, TouchableOpacity, View } from "react-native";
 import ReactNativeModal from "react-native-modal";
 
 import { images } from "@/constants";
 import { fetchAPI } from "@/lib/fetch";
+import { formatLBP } from "@/lib/pricing";
 import { useLocationStore } from "@/store";
 import type { PaymentProps } from "@/types/type";
 
 import { CustomButton } from "./custom-button";
 
+type PaymentMethod = "cash" | "card";
+
 export const Payment = ({
   fullName,
   email,
@@ -27,11 +29,11 @@ export const Payment = ({
     destinationAddress,
     destinationLongitude,
   } = useLocationStore();
-  const { userId } = useAuth();
+  const [method, setMethod] = useState<PaymentMethod>("cash");
   const [success, setSuccess] = useState(false);
   const [processing, setProcessing] = useState(false);
 
-  const recordRide = async () => {
+  const recordRide = async (paymentStatus: string) => {
     await fetchAPI("/(api)/ride/create", {
       method: "POST",
       headers: {
@@ -45,15 +47,31 @@ export const Payment = ({
         destination_latitude: destinationLatitude,
         destination_longitude: destinationLongitude,
         ride_time: rideTime.toFixed(0),
-        fare_price: parseInt(amount) * 100, // in cents
-        payment_status: "paid",
+        fare_price: Math.round(parseFloat(amount) * 100), // in cents
+        payment_status: paymentStatus,
         driver_id: driverId,
-        user_id: userId,
       }),
     });
   };
 
-  const payWithAreeba = async () => {
+  // Cash is settled directly with the driver at drop-off.
+  const payWithCash = async () => {
+    setProcessing(true);
+    try {
+      await recordRide("cash");
+      setSuccess(true);
+    } catch (err) {
+      console.log("[PAYMENT]: ", err);
+      Alert.alert(
+        "Error",
+        "Something went wrong while booking your ride. Please try again.",
+      );
+    } finally {
+      setProcessing(false);
+    }
+  };
+
+  const payWithCard = async () => {
     setProcessing(true);
 
     try {
@@ -99,7 +117,7 @@ export const Payment = ({
       });
 
       if (verification.success) {
-        await recordRide();
+        await recordRide("paid");
         setSuccess(true);
       } else {
         Alert.alert(
@@ -118,12 +136,66 @@ export const Payment = ({
     }
   };
 
+  const confirm = () =>
+    method === "cash"
+      ? payWithCash()
+      : Alert.alert("Pay by card", `Your card will be charged $${amount}.`, [
+          { text: "Cancel", style: "cancel" },
+          { text: "Continue", onPress: () => void payWithCard() },
+        ]);
+
   return (
     <>
+      <Text className="text-lg font-JakartaSemiBold mt-4 mb-2">
+        Payment Method
+      </Text>
+
+      <View className="flex flex-row gap-x-3">
+        <TouchableOpacity
+          onPress={() => setMethod("cash")}
+          className={`flex-1 items-center py-3 rounded-xl border ${
+            method === "cash"
+              ? "bg-general-600 border-primary-500"
+              : "bg-white border-general-700"
+          }`}
+        >
+          <Text
+            className={`font-JakartaMedium ${
+              method === "cash" ? "text-white" : "text-black"
+            }`}
+          >
+            💵 Cash
+          </Text>
+        </TouchableOpacity>
+
+        <TouchableOpacity
+          onPress={() => setMethod("card")}
+          className={`flex-1 items-center py-3 rounded-xl border ${
+            method === "card"
+              ? "bg-general-600 border-primary-500"
+              : "bg-white border-general-700"
+          }`}
+        >
+          <Text
+            className={`font-JakartaMedium ${
+              method === "card" ? "text-white" : "text-black"
+            }`}
+          >
+            💳 Card
+          </Text>
+        </TouchableOpacity>
+      </View>
+
       <CustomButton
-        title={processing ? "Processing..." : "Confirm ride"}
-        className="my-2"
-        onPress={payWithAreeba}
+        title={
+          processing
+            ? "Processing..."
+            : method === "cash"
+              ? "Book ride · Pay cash to driver"
+              : "Confirm & Pay by Card"
+        }
+        className="my-2 mt-4"
+        onPress={confirm}
         disabled={processing}
       />
 
@@ -141,7 +213,9 @@ export const Payment = ({
           <Text className="text-base text-general-200 text-JakartaMedium text-center mt-3">
             Thank you for your booking.{"\n"} Your reservation has been placed.
             {"\n"}
-            Please proceed with your trip.
+            {method === "cash"
+              ? `Please have ${formatLBP(parseFloat(amount))} ready.`
+              : null}
           </Text>
 
           <CustomButton