feat: Schedule bookings

app/composables/useBoatImage.ts

@@ -0,0 +1,23 @@
+const BUCKET = 'boat-images'
+
+export function useBoatImage() {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const supabase = useSupabaseClient() as any
+
+  function url(path: string | null | undefined, width?: number, height?: number): string {
+    if (!path) return ''
+    const opts = width && height
+      ? { transform: { width, height, resize: 'cover' as const } }
+      : undefined
+    const { data } = supabase.storage.from(BUCKET).getPublicUrl(path, opts)
+    return data.publicUrl as string
+  }
+
+  return {
+    thumbnail: (path: string | null | undefined) => url(path, 150, 150),
+    small:     (path: string | null | undefined) => url(path, 400, 300),
+    medium:    (path: string | null | undefined) => url(path, 800, 600),
+    large:     (path: string | null | undefined) => url(path, 1200, 900),
+    original:  (path: string | null | undefined) => url(path),
+  }
+}