timeslots API

apps/web/components/BookingSummary.tsx

@@ -1,19 +1,5 @@
 import React from 'react';
-
-interface BookingType {
-  id: string;
-  name: string;
-  display_name: string;
-  requires_payment: boolean;
-  price_per_person: number;
-}
-
-interface TimeSlot {
-  id: string;
-  start_time: string;
-  end_time: string;
-  available: boolean;
-}
+import { BookingType, TimeSlot } from '@/types/bookings';
 
 interface BookingSummaryProps {
   selectedBookingTypeData: BookingType | undefined;
@@ -34,6 +20,23 @@ const BookingSummary: React.FC<BookingSummaryProps> = ({
 }) => {
   const selectedTimeSlotData = timeSlots.find(s => s.id === selectedTimeSlot);
 
+  // Format time to display in Tbilisi timezone (UTC+4)
+  const formatTime = (time: string) => {
+    if (time.match(/^\d{2}:\d{2}$/)) {
+      return time;
+    }
+    if (time.includes('T') || time.includes(' ') || time.includes('Z')) {
+      const date = new Date(time);
+      return date.toLocaleTimeString('en-US', { 
+        timeZone: 'Asia/Tbilisi',
+        hour12: false, 
+        hour: '2-digit', 
+        minute: '2-digit' 
+      });
+    }
+    return time;
+  };
+
   return (
     <div className="bg-white rounded-xl p-6 shadow-sm">
       <h2 className="text-xl font-semibold text-gray-900 mb-4">Booking Summary</h2>
@@ -50,7 +53,10 @@ const BookingSummary: React.FC<BookingSummaryProps> = ({
         <div className="flex justify-between">
           <span className="text-gray-600">Time:</span>
           <span className="font-medium">
-            {selectedTimeSlotData?.start_time} - {selectedTimeSlotData?.end_time}
+            {selectedTimeSlotData?.start_time && selectedTimeSlotData?.end_time 
+              ? `${formatTime(selectedTimeSlotData.start_time)}—${formatTime(selectedTimeSlotData.end_time)}`
+              : 'Not selected'
+            }
           </span>
         </div>
         <div className="flex justify-between">