diff --git a/packages/notion-types/src/block.ts b/packages/notion-types/src/block.ts
index 48140b8c..7edb4fa5 100644
--- a/packages/notion-types/src/block.ts
+++ b/packages/notion-types/src/block.ts
@@ -133,6 +133,7 @@ export interface BaseContentBlock extends BaseBlock {
caption?: Decoration[]
}
format?: {
+ link_title: string
block_alignment: 'center' | 'left' | 'right'
block_width: number
block_height: number
@@ -359,6 +360,7 @@ export interface GoogleDriveBlock extends BaseContentBlock {
user_name: string
modified_time: number
}
+ link_title: string
block_alignment: 'center' | 'left' | 'right'
block_width: number
block_height: number
diff --git a/packages/react-notion-x/src/components/asset.tsx b/packages/react-notion-x/src/components/asset.tsx
index d85c24b2..70210450 100644
--- a/packages/react-notion-x/src/components/asset.tsx
+++ b/packages/react-notion-x/src/components/asset.tsx
@@ -3,7 +3,12 @@ import { type BaseContentBlock, type Block } from 'notion-types'
import { getTextContent } from 'notion-utils'
import { useNotionContext } from '../context'
-import { getUrlParams, getYoutubeId } from '../utils'
+import {
+ deleteUrlParams,
+ getUrlParams,
+ getYoutubeId,
+ setUrlParams
+} from '../utils'
import { LazyImage } from './lazy-image'
import { LiteYouTubeEmbed } from './lite-youtube-embed'
@@ -135,9 +140,7 @@ export function Asset({
}
if (block.space_id) {
- const url = new URL(source)
- url.searchParams.set('spaceId', block.space_id)
- source = url.toString()
+ source = setUrlParams(source, { spaceId: block.space_id })
}
let content = null
@@ -187,6 +190,7 @@ export function Asset({
block.type === 'drive' ||
block.type === 'replit'
) {
+ let displaySource = block.format?.display_source
if (
block.type === 'video' &&
source &&
@@ -200,19 +204,36 @@ export function Asset({
!source.includes('tella')
) {
style.paddingBottom = undefined
-
+ const videoTitle = block.format?.link_title || 'block.type'
+ if (displaySource) {
+ delete style.height
+ displaySource = deleteUrlParams(displaySource, ['spaceId'])
+ }
content = (
-
+ <>
+ {displaySource ? (
+
+ ) : (
+
+ )}
+ >
)
} else {
- let src = block.format?.display_source || source
+ let src = displaySource || source
if (src) {
const youtubeVideoId: string | null =
diff --git a/packages/react-notion-x/src/components/audio.tsx b/packages/react-notion-x/src/components/audio.tsx
index 861d8cc1..35f78b99 100644
--- a/packages/react-notion-x/src/components/audio.tsx
+++ b/packages/react-notion-x/src/components/audio.tsx
@@ -2,7 +2,7 @@ import type React from 'react'
import { type AudioBlock } from 'notion-types'
import { useNotionContext } from '../context'
-import { cs } from '../utils'
+import { cs, setUrlParams } from '../utils'
export function Audio({
block,
@@ -21,9 +21,7 @@ export function Audio({
}
if (block.space_id) {
- const url = new URL(source)
- url.searchParams.set('spaceId', block.space_id)
- source = url.toString()
+ source = setUrlParams(source, { spaceId: block.space_id })
}
return (
diff --git a/packages/react-notion-x/src/components/file.tsx b/packages/react-notion-x/src/components/file.tsx
index d01ad412..1db8ae24 100644
--- a/packages/react-notion-x/src/components/file.tsx
+++ b/packages/react-notion-x/src/components/file.tsx
@@ -3,7 +3,7 @@ import { type FileBlock } from 'notion-types'
import { useNotionContext } from '../context'
import { FileIcon } from '../icons/file-icon'
-import { cs } from '../utils'
+import { cs, setUrlParams } from '../utils'
import { Text } from './text'
export function File({
@@ -23,9 +23,7 @@ export function File({
}
if (block.space_id) {
- const url = new URL(source)
- url.searchParams.set('spaceId', block.space_id)
- source = url.toString()
+ source = setUrlParams(source, { spaceId: block.space_id })
}
return (
diff --git a/packages/react-notion-x/src/utils.ts b/packages/react-notion-x/src/utils.ts
index c4025727..930a4ba3 100644
--- a/packages/react-notion-x/src/utils.ts
+++ b/packages/react-notion-x/src/utils.ts
@@ -131,3 +131,22 @@ export const getUrlParams = (
return
}
+
+export const setUrlParams = (
+ urlString: string,
+ params: Record
+): string => {
+ const url = new URL(urlString)
+ for (const [key, value] of Object.entries(params)) {
+ url.searchParams.set(key, value)
+ }
+ return url.toString()
+}
+
+export const deleteUrlParams = (urlString: string, keys: string[]): string => {
+ const url = new URL(urlString)
+ for (const key of keys) {
+ url.searchParams.delete(key)
+ }
+ return url.toString()
+}