🐛 (video) Parse youtube start time query param

Closes #1589

packages/schemas/features/blocks/bubbles/video/constants.ts

@@ -31,7 +31,11 @@ export const verticalVideoSuggestionSize = {
 
 const youtubeBaseUrl = 'https://www.youtube.com/embed'
 export const youtubeRegex =
-  /youtube\.com\/(watch\?v=|shorts\/)([\w-]+)|youtu\.be\/([\w-]+)/
+  /youtube\.com\/(watch\?v=|shorts\/)([\w-]+)|youtu\.be\/([\w-]+)(\?.+)/
+
+export const youtubeEmbedParamsMap = {
+  t: 'start',
+}
 
 const vimeoBaseUrl = 'https://player.vimeo.com/video'
 export const vimeoRegex = /vimeo\.com\/(\d+)/

packages/schemas/features/blocks/bubbles/video/helpers.ts

@@ -7,6 +7,7 @@ import {
   tiktokRegex,
   gumletRegex,
   oneDriveRegex,
+  youtubeEmbedParamsMap,
 } from './constants'
 import { VideoBubbleBlock } from './schema'
 
@@ -16,6 +17,7 @@ export const parseVideoUrl = (
   type: VideoBubbleContentType
   url: string
   id?: string
+  queryParamsStr?: string
   videoSizeSuggestion?: Pick<
     NonNullable<VideoBubbleBlock['content']>,
     'aspectRatio' | 'maxWidth'
@@ -24,12 +26,22 @@ export const parseVideoUrl = (
   if (youtubeRegex.test(url)) {
     const match = url.match(youtubeRegex)
     const id = match?.at(2) ?? match?.at(3)
+    const queryParams = match?.at(4)
+      ? new URLSearchParams(match.at(4))
+      : undefined
+    Object.entries(youtubeEmbedParamsMap).forEach(([key, value]) => {
+      if (queryParams?.has(key)) {
+        queryParams.set(value, queryParams.get(key)!)
+        queryParams.delete(key)
+      }
+    })
     const parsedUrl = match?.at(0) ?? url
     if (!id) return { type: VideoBubbleContentType.URL, url: parsedUrl }
     return {
       type: VideoBubbleContentType.YOUTUBE,
       url: parsedUrl,
       id,
+      queryParamsStr: queryParams ? '?' + queryParams.toString() : undefined,
       videoSizeSuggestion: url.includes('shorts')
         ? verticalVideoSuggestionSize
         : horizontalVideoSuggestionSize,

packages/schemas/features/blocks/bubbles/video/schema.ts

@@ -11,6 +11,7 @@ export const videoBubbleContentSchema = z.object({
   height: z.number().or(variableStringSchema).optional(),
   aspectRatio: z.string().optional(),
   maxWidth: z.string().optional(),
+  queryParamsStr: z.string().optional(),
 })
 
 export const videoBubbleBlockSchema = blockBaseSchema.merge(