NotionX / NotionX/react-notion-x

Feature Request: mapVideoUrl Utility

Open
#597 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
5.4k
Forks
645
PR merge metrics
No merged PRs in 30d

Description

Description

I’d like to request a mapVideoUrl function, analogous to the existing mapImageUrl utility.

Currently, react-notion-x provides a mapImageUrl utility to customize image sources. However, I need a similar mechanism for videos. Due to Notion’s policies, some embedded videos fail to display properly under certain circumstances (related issue #520).

To work around this limitation, I’d like to host my video content in my own database and then modify the video src values using a mapVideoUrl function, similar to how mapImageUrl works for images.

While this isn’t a fundamental solution, this approach would allow me to circumvent the current restrictions by hosting videos externally and selectively rewriting their src values.

If there’s already a solution for this issue, or if I’ve misunderstood how mapImageUrl might be applied to images, please let me know.

If you think this feature is valuable and would be accepted, I’d be happy to submit a PR as well.

Notion Test Page ID

1532dc3ef514804783f8c0cc0c84d52e

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by locating the existing mapImageUrl utility and the video rendering path in react-notion-x. Compare how image sources are mapped, then determine where a mapVideoUrl callback would be applied to video src values. Done means externally hosted video URLs can be selectively rewritten through the new utility, with coverage for the relevant behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.