diff options
Diffstat (limited to 'driver/src/App.tsx')
| -rw-r--r-- | driver/src/App.tsx | 173 |
1 files changed, 169 insertions, 4 deletions
diff --git a/driver/src/App.tsx b/driver/src/App.tsx index 4970091..233b96d 100644 --- a/driver/src/App.tsx +++ b/driver/src/App.tsx @@ -1,11 +1,176 @@ -import Login from "./pages/Login" -import SignUp from "./pages/SignUp" +import { addDoc, collection } from "firebase/firestore" +import { db } from "./firebase/firebase_config" +import { Button } from "@/components/ui/button" +import { + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle, + DialogTrigger, +} from "@/components/ui/dialog" +import { Input } from "@/components/ui/input" +import { Label } from "@/components/ui/label" +import { useState } from "react" + +interface RideOrder { + driverName: string + carModel: string + carColor: string + plateNumber: string + status: string + orderTime: Date + fromLocation: string + toLocation: string +} + function App() { + + const [driverName, setDriverName] = useState<string>() + const [carModel, setCarModel] = useState<string>() + const [carColor, setCarColor] = useState<string>() + const [plateNumber, setPlateNumber] = useState<string>() + const [status, _setStatus] = useState<string>('Pending') + const [orderTime, _setOrderTime] = useState<Date>(new Date()) + const [fromLocation, setFromLocation] = useState<string>() + const [toLocation, setToLocation] = useState<string>() + + const [_rideOrder, _setRideOrder] = useState<RideOrder>({ + driverName: "Mahmoud", + carModel: "Toyota Corolla", + carColor: "Red", + plateNumber: "ABC-123", + status: "Pending", + orderTime: new Date("2023-12-20"), + fromLocation: "Abdu-Basha", + toLocation: "5th Settlement", + }) + + const addRideOrderToFirestore = async () => { + try { + // Get a reference to the 'rideOrders' collection + const rideOrdersCollection = collection(db, 'Rides'); + + // Add a new document to the 'rideOrders' collection with the data from the RideOrder object + const newRideOrderRef = await addDoc(rideOrdersCollection, { + driverName: driverName, + carModel: carModel, + carColor: carColor, + plateNumber: plateNumber, + status: status, + orderTime: orderTime, + fromLocation: fromLocation, + toLocation: toLocation, + }); + + console.log('Ride order added with ID:', newRideOrderRef.id); + // 'newRideOrderRef.id' will give you the document ID of the added ride order + } catch (error) { + console.error('Error adding ride order:', error); + } + }; + return ( - // <SignUp /> - <Login /> + <div className="bg-white h-screen w-screen flex items-center justify-center"> + <Dialog> + <DialogTrigger asChild> + <Button className="rounded-xl" variant="outline">Add Ride</Button> + </DialogTrigger> + <DialogContent className="sm:max-w-[425px]"> + <DialogHeader> + <DialogTitle>Ride details</DialogTitle> + <DialogDescription> + Please enter details about your ride and click submit for the ride to appear to other students! + </DialogDescription> + </DialogHeader> + <div className="grid gap-4 py-4"> + <div className="grid grid-cols-4 items-center gap-4"> + <Label htmlFor="name" className="text-right"> + Name + </Label> + <Input + id="Name" + defaultValue="" + className="col-span-3" + onChange={(e) => setDriverName(e.target.value)} + /> + </div> + <div className="grid grid-cols-4 items-center gap-4"> + <Label htmlFor="Car Model" className="text-right"> + Car Model + </Label> + <Input + id="Car Model" + defaultValue="" + className="col-span-3" + onChange={(e) => setCarModel(e.target.value)} + /> + </div> + <div className="grid grid-cols-4 items-center gap-4"> + <Label htmlFor="To Location" className="text-right"> + To Location + </Label> + <Input + id="To Location" + defaultValue="" + className="col-span-3" + onChange={(e) => setToLocation(e.target.value)} + /> + </div> + <div className="grid grid-cols-4 items-center gap-4"> + <Label htmlFor="From location" className="text-right"> + From location + </Label> + <Input + id="From location" + defaultValue="" + className="col-span-3" + onChange={(e) => setFromLocation(e.target.value)} + /> + </div> + <div className="grid grid-cols-4 items-center gap-4"> + <Label htmlFor="Car color" className="text-right"> + Car color + </Label> + <Input + id="Car color" + defaultValue="" + className="col-span-3" + onChange={(e) => setCarColor(e.target.value)} + /> + </div> + <div className="grid grid-cols-4 items-center gap-4"> + <Label htmlFor="Plate Number" className="text-right"> + Plate Number + </Label> + <Input + id="Plate Number" + defaultValue="" + className="col-span-3" + onChange={(e) => setPlateNumber(e.target.value)} + /> + </div> + </div> + <DialogFooter> + <Button type="submit" onClick={addRideOrderToFirestore}>Add Ride</Button> + </DialogFooter> + </DialogContent> + </Dialog> + </div> ) } +// interface RideOrder { +// driverName: string +// carModel: string +// carColor: string +// plateNumber: string +// status: string +// orderTime: Date +// fromLocation: string +// toLocation: string +// } + export default App |
