fix: from PRs

Author: transitive-bullshit

package.json

@@ -26,7 +26,7 @@
     "@changesets/cli": "^2.27.9",
     "@fisch0920/eslint-config": "^1.4.0",
     "@total-typescript/ts-reset": "^0.6.1",
-    "@types/node": "^22.8.4",
+    "@types/node": "^22.9.0",
     "del-cli": "^6.0.0",
     "eslint": "^8.57.1",
     "npm-run-all2": "^7.0.1",
@@ -35,8 +35,8 @@
     "react-dom": "^18.3.1",
     "tsup": "^8.3.5",
     "tsx": "^4.19.2",
-    "turbo": "^2.2.3",
+    "turbo": "^2.3.0",
     "typescript": "^5.6.3",
-    "vitest": "^2.1.4"
+    "vitest": "^2.1.5"
   }
 }

packages/react-notion-x/src/block.tsx

@@ -88,7 +88,6 @@ export function Block(props: BlockProps) {
     disableHeader
   } = props
 
-
   if (!block) {
     return null
   }

packages/react-notion-x/src/components/asset.tsx

@@ -130,14 +130,15 @@ export function Asset({
   let source =
     recordMap.signed_urls?.[block.id] || block.properties?.source?.[0]?.[0]
 
+  if (!source) {
+    return null
+  }
+
   if (block.space_id) {
     source = source.concat('&spaceId=', block.space_id)
   }
-  let content = null
 
-  if (!source) {
-    return null
-  }
+  let content = null
 
   if (block.type === 'tweet') {
     const src = source

packages/react-notion-x/src/components/audio.tsx

@@ -17,8 +17,13 @@ export function Audio({
     recordMap.signed_urls[block.id] || block.properties?.source?.[0]?.[0]
 
   if (block.space_id) {
-    source = source.concat('&spaceId=', block.space_id)
+    source = source?.concat('&spaceId=', block.space_id)
   }
+
+  if (!source) {
+    return null
+  }
+
   return (
     <div className={cs('notion-audio', className)}>
       <audio controls preload='none' src={source} />

packages/react-notion-x/src/components/file.tsx

@@ -18,6 +18,10 @@ export function File({
   let source =
     recordMap.signed_urls[block.id] || block.properties?.source?.[0]?.[0]
 
+  if (!source) {
+    return null
+  }
+
   if (block.space_id) {
     source = source.concat('&spaceId=', block.space_id)
   }

packages/react-notion-x/src/components/lite-youtube-embed.tsx

@@ -11,31 +11,33 @@ const qs = (params: Record<string, string>) => {
 }
 
 type ImageType = 'jpg' | 'webp'
-// Define a type for video resolutions
-type VideoResolution = 120 | 320 | 480 | 640 | 1280
 
-const resolutions: VideoResolution[] = [120, 320, 480, 640, 1280]
+const resolutions = [120, 320, 480, 640, 1280] as const
+type VideoResolution = (typeof resolutions)[number]
 
 const resolutionMap: Record<VideoResolution, string> = {
   120: 'default',
   320: 'mqdefault',
   480: 'hqdefault',
   640: 'sddefault',
   1280: 'maxresdefault'
-  // 2k, 4k, 8k images don't seem to be available
-  // Source: https://longzero.com/articles/youtube-thumbnail-sizes-url/
+  // 2k, 4k, 8k images don't seem to be available
+  // Source: https://longzero.com/articles/youtube-thumbnail-sizes-url/
 }
 
-// Function to get the poster URL based on the resolution type
+const resolutionSizes = resolutions
+  .map((resolution) => `(max-width: ${resolution}px) ${resolution}px`)
+  .join(', ')
+
 function getPosterUrl(
   id: string,
   resolution: VideoResolution = 480,
   type: ImageType = 'jpg'
 ): string {
-  // Return the appropriate URL based on the image type
   if (type === 'webp') {
     return `https://i.ytimg.com/vi_webp/${id}/${resolutionMap[resolution]}.webp`
   }
+
   // Default to jpg
   return `https://i.ytimg.com/vi/${id}/${resolutionMap[resolution]}.jpg`
 }
@@ -46,12 +48,6 @@ function generateSrcSet(id: string, type: ImageType = 'jpg'): string {
     .join(', ')
 }
 
-function generateSizes(): string {
-  return resolutions
-    .map((resolution) => `(max-width: ${resolution}px) ${resolution}px`)
-    .join(', ')
-}
-
 export function LiteYouTubeEmbed({
   id,
   defaultPlay = false,
@@ -107,13 +103,13 @@ export function LiteYouTubeEmbed({
       {/*
         'it seems pretty unlikely for a browser to support preloading but not WebP images'
         Source: https://blog.laurenashpole.com/post/658079409151016960
-      */}
+       */}
       <link
         rel='preload'
         as='image'
         href={getPosterUrl(id)}
         imageSrcSet={generateSrcSet(id, 'webp')}
-        imageSizes={generateSizes()}
+        imageSizes={resolutionSizes}
       />
 
       {isPreconnected && (
@@ -128,7 +124,9 @@ export function LiteYouTubeEmbed({
 
       {isPreconnected && adLinksPreconnect && (
         <>
-          {/* Not certain if these ad related domains are in the critical path. Could verify with domain-specific throttling. */}
+          {/* Not certain if these ad related domains are in the critical path.
+              Could verify with domain-specific throttling.
+            */}
           <link rel='preconnect' href='https://static.doubleclick.net' />
           <link rel='preconnect' href='https://googleads.g.doubleclick.net' />
         </>
@@ -149,7 +147,7 @@ export function LiteYouTubeEmbed({
           {/*
             Browsers which don't support srcSet will most likely not support webp too
             These browsers will then just get the default 480 size jpg
-          */}
+           */}
           {resolutions.map((resolution) => (
             <source
               key={resolution}
@@ -158,6 +156,7 @@ export function LiteYouTubeEmbed({
               type='image/webp'
             />
           ))}
+
           <img
             src={getPosterUrl(id)}
             className='notion-yt-thumbnail'