emm - use string instead of date for start/endDate

components/book/dateSelect.tsx

@@ -15,8 +15,8 @@ export default function DateSelect() {
     <>
       <InputWrapper label="Datum" required>
         <Calendar
-          start={dateFormatBackend(startDate)}
-          end={dateFormatBackend(endDate)}
+          start={startDate}
+          end={endDate}
           onChange={onChange}
           className="my-6 max-w-lg"
         />
@@ -28,7 +28,7 @@ export default function DateSelect() {
             type="date"
             className=""
             name="startDate"
-            value={dateFormatBackend(startDate) || ''}
+            value={startDate || ''}
             onChange={onChangeEvent}
             min={today}
             required
@@ -41,10 +41,10 @@ export default function DateSelect() {
             type="date"
             className=""
             name="endDate"
-            value={dateFormatBackend(endDate) || ''}
+            value={endDate || ''}
             placeholder="Von"
             onChange={onChangeEvent}
-            min={dateFormatBackend(startDate) || today}
+            min={startDate || today}
           />
         </div>
       </div>

components/calendar.tsx

@@ -107,6 +107,8 @@ export default function MyCalendar({
               return
             }
 
+            const dateAsBackendFormat = dateFormatBackend(date);
+
             event.preventDefault()
             event.stopPropagation()
 
@@ -122,15 +124,15 @@ export default function MyCalendar({
 
             // when startDate missing or both are already set
             if (!startDate || (!!startDate && !!endDate)) {
-              onChange({ startDate: date, endDate: null })
+              onChange({ startDate: dateAsBackendFormat, endDate: null })
               return
             }
 
             // when startDate set, but end missing
             if (isAfter(date, startDate)) {
-              onChange({ endDate: date })
+              onChange({ endDate: dateAsBackendFormat })
             } else {
-              onChange({ startDate: date, endDate: date })
+              onChange({ startDate: dateAsBackendFormat, endDate: dateAsBackendFormat })
             }
           }}
           tileClassName={tileClassName}

context/book.tsx

@@ -5,7 +5,7 @@ import { clearBookingData, loadBookingData } from '../helpers/storage'
 import { createBooking } from '../helpers/booking'
 import { Booking } from '../db/booking'
 
-export type BookFormData = Omit<Booking, 'uuid' | 'calendarEventId' | 'start' | 'end'>
+export type BookFormData = Omit<Booking, 'uuid' | 'calendarEventId'>
 
 type BookingProviderState = {
   postData?: boolean

db/booking.ts

@@ -1,6 +1,6 @@
 import * as mongoose from 'mongoose'
 import { v4 as uuidv4 } from 'uuid'
-import { dateFormatBackend, getDays, nowInTz } from '../helpers/date'
+import { dateFormatBackend, getDays, nowInTz, dateParseBackend } from '../helpers/date'
 import { createCalendarEvent, deleteCalendarEvent } from '../lib/googlecalendar'
 
 import { Bill } from './bill'
@@ -17,11 +17,9 @@ export type Booking = {
   city: string
   bill?: Bill
   // format YYYY-MM-DD
-  start: string,
-  startDate: Date
+  startDate: string,
   // format YYYY-MM-DD
-  end: string
-  endDate: Date
+  endDate: string,
   status?: BOOKING_STATUS
   purpose?: string
   org?: string
@@ -58,12 +56,18 @@ const BookingSchema = new mongoose.Schema<BookingDocument>(
       required: false,
     },
     startDate: {
-      type: Date,
+      type: String,
       required: true,
+      validator: function (value: string): boolean {
+        return !!dateParseBackend(value);
+      },
     },
     endDate: {
-      type: Date,
-      required: false,
+      type: String,
+      required: true,
+      validator: function (value: string): boolean {
+        return !!dateParseBackend(value);
+      },
     },
     days: {
       type: [String],
@@ -102,16 +106,6 @@ const BookingSchema = new mongoose.Schema<BookingDocument>(
   }
 )
 
-BookingSchema.virtual('start').get(function (): string {
-  const booking = this as BookingDocument
-  return dateFormatBackend(booking.startDate)
-})
-
-BookingSchema.virtual('end').get(function (): string {
-  const booking = this as BookingDocument
-  return dateFormatBackend(booking.endDate)
-})
-
 BookingSchema.pre('validate', function (next: () => void): void {
   const booking = this as BookingDocument
   booking.days = getDays({

helpers/date.ts

@@ -68,6 +68,10 @@ export function dateParseFrontend(input: string): Date {
   return dateParse(input, FRONTEND_FORMAT)
 }
 
+export function dateParseBackend(input: string): Date {
+  return dateParse(input, BACKEND_FORMAT)
+}
+
 export function nowInTz(timezone = 'Europe/Berlin'): Date {
   const now = new Date()
   return utcToZonedTime(now, timezone)

lib/googlecalendar.ts

@@ -49,9 +49,9 @@ export async function createCalendarEvent(booking: Booking): Promise<Booking> {
     calendarId,
     requestBody: {
       summary: getSummary(booking),
-      // description,
-      start: { date: booking.start },
-      end: { date: booking.end },
+      // TODO: description,
+      start: { date: booking.startDate },
+      end: { date: booking.endDate },
     },
   }, {})
 

pages/admin/bookings/[uuid]/index.tsx

@@ -38,7 +38,7 @@ function ShowBookingAdmin({ booking: bookingProp }: { booking: Booking }) {
   return (
     <Layout>
       <h2 className="text-3xl">Buchung {booking.uuid}</h2>
-      <Calendar start={booking.start} end={booking.end} />
+      <Calendar start={booking.startDate} end={booking.endDate} />
       <div>
         <strong>Buchungszeitraum:</strong> {daysFormatFrontend(booking.days)}
       </div>