hunghg255 / reactjs-tiptap-editor

A modern WYSIWYG rich text editor based on tiptap and shadcn ui for Reactjs
https://reactjs-tiptap-editor.vercel.app/
MIT License
203 stars 37 forks source link

[Bug]: add video as link #112

Closed waleedsalah4 closed 4 days ago

waleedsalah4 commented 5 days ago

Trying to add a video link as in this picture

Screenshot (7)

and press apply

Screenshot (8) the video is shown as expected, but submit the form and save the content to local storage and try to reload the page, and the initial content for the editor will be that data saved into local storage, I got this weird form inside the editor

Screenshot (9)

you can find the code here and see issue

check the code on stackblitz

hunghg255 commented 5 days ago

@waleedsalah4 can you record a video for this bug?

waleedsalah4 commented 4 days ago

Here's a recorded video for the bug

https://github.com/user-attachments/assets/5f0252ea-5fa8-4259-ba79-f10830590b81

hunghg255 commented 4 days ago

Here's a recorded video for the bug

VID_20241117_191242.mp4

oke, this is a bug, we need to validate the video when submit, We only accept link video format mp4, mov,..

waleedsalah4 commented 1 day ago

Still can't add a YouTube video or other links and prevent men from pasting the url into the field and gives invalid url

But when I past a link that ends with .mp4 or other supported formats by the editor it adds it So l, I think this an issue that need to be fixed and allow user to add there own video links like YouTube ones

https://github.com/user-attachments/assets/d653dc05-df16-4330-9966-07213f5e737b

hunghg255 commented 1 day ago

you should use iframe to add link youtube format video is mp4 file, mov file,.. @waleedsalah4

waleedsalah4 commented 1 day ago

Ok, and thank you for the quick fix and the clarification—it’s much appreciated! @hunghg255