diff --git a/src/pages/parking_areas/parking_areas.js b/src/pages/parking_areas/parking_areas.js
index d04b3baed44e612e13afeee4f77aa00942898af2..8ba7ac22b11d49683a8a80425a1d1098965ed840 100644
--- a/src/pages/parking_areas/parking_areas.js
+++ b/src/pages/parking_areas/parking_areas.js
@@ -52,6 +52,7 @@ const ParkingAreasPage = () => {
       const response = await fetch(
         `${API_URL}/location/parking-locations?postcode=${postcode}&radius=${radius}`
       );
+      const data = await response.json();
       // const data = [
       //   {
       //     _id: 1,
@@ -63,7 +64,6 @@ const ParkingAreasPage = () => {
       //     spaces_available: 100,
       //   },
       // ];
-      const data = await response.json();
       setParkingAreas(data);
     } catch (error) {
       console.error(error);
@@ -87,20 +87,24 @@ const ParkingAreasPage = () => {
     setIsBookingLoading(true);
     setBookingError(null);
 
-    const bookingServiceBaseUrl  = process.env.REACT_APP_BOOKING_SERVICE_ENDPOINT;
+    const bookingServiceBaseUrl = process.env.REACT_APP_BOOKING_SERVICE_ENDPOINT;
+
+    console.log(selectedParkingArea);
+    console.log(startTime);
 
     try {
       const response = await fetch(
-        `${bookingServiceBaseUrl}/bookings/createBooking`,
+        `${bookingServiceBaseUrl}/bookings/create`,
         {
           method: "POST",
           headers: {
             "Content-Type": "application/json",
+            Authorization: `Bearer ${localStorage.getItem("token")}`,
           },
           body: JSON.stringify({
-            refNO: selectedParkingArea._id,
+            location_id: selectedParkingArea,
             start_time: startTime,
-            expiry_time: expiryTime,
+            expires_hours: expiryTime,
           }),
         }
       );
@@ -134,35 +138,35 @@ const ParkingAreasPage = () => {
               Find a Space
             </Heading>
             <Stack direction="row" spacing={4} mb={4} maxW={"50vw"}>
-            <Stack direction="column" spacing={4} mb={4} maxW={"50vw"}>
-              <Input
-                placeholder="Postcode"
-                value={postcode}
-                onChange={handlePostcodeChange}
-              />
-              <Stack direction="row" mb={4} >
-              <Text my={2} >Radius (miles): </Text>
-              <NumberInput
-                value={radius}
-                onChange={(value) => {
-                  const intValue = parseInt(value);
-                  if (!isNaN(intValue) && intValue > 0) {
-                    setRadius(
-                      intValue
-                    );
-                  }
-                }
-                }
-              >
-                <NumberInputField />
-                <NumberInputStepper>
-                  <NumberIncrementStepper />
-                  <NumberDecrementStepper />
-                </NumberInputStepper>
-              </NumberInput>
-              </Stack>
+              <Stack direction="column" spacing={4} mb={4} maxW={"50vw"}>
+                <Input
+                  placeholder="Postcode"
+                  value={postcode}
+                  onChange={handlePostcodeChange}
+                />
+                <Stack direction="row" mb={4} >
+                  <Text my={2} >Radius (miles): </Text>
+                  <NumberInput
+                    value={radius}
+                    onChange={(value) => {
+                      const intValue = parseInt(value);
+                      if (!isNaN(intValue) && intValue > 0) {
+                        setRadius(
+                          intValue
+                        );
+                      }
+                    }
+                    }
+                  >
+                    <NumberInputField />
+                    <NumberInputStepper>
+                      <NumberIncrementStepper />
+                      <NumberDecrementStepper />
+                    </NumberInputStepper>
+                  </NumberInput>
+                </Stack>
 
-            </Stack>
+              </Stack>
               <Button colorScheme="teal" onClick={handleSearchClick}>
                 Search
               </Button>
@@ -195,8 +199,8 @@ const ParkingAreasPage = () => {
                     <Text color="gray.500">No spaces available</Text>
                   ) : (
                     <>
-                    <Text>Spaces available: {parkingArea.spaces_available}</Text>
-                    <Button onClick={() => handleParkingAreaClick(parkingArea)} colorScheme="teal">Book a space</Button>
+                      <Text>Spaces available: {parkingArea.spaces_available}</Text>
+                      <Button onClick={() => handleParkingAreaClick(parkingArea._id)} colorScheme="teal">Book a space</Button>
                     </>
                   )}
                 </VStack>
@@ -215,6 +219,7 @@ const ParkingAreasPage = () => {
                     type="datetime-local"
                     value={startTime}
                     onChange={handleStartTimeChange}
+                  // min={Date.now()}
                   />
                 </FormControl>
                 <FormControl mb={4}>
@@ -249,7 +254,7 @@ const ParkingAreasPage = () => {
                     <Button
                       colorScheme="teal"
                       onClick={handleBookingSubmit}
-                      isDisabled={!startTime || !expiryTime}
+                    // isDisabled={!startTime || !expiryTime}
                     >
                       Book
                     </Button>