sjdemartini / mui-tiptap

A Material UI (MUI) styled WYSIWYG rich text editor, using Tiptap
MIT License
319 stars 43 forks source link

Embedding a Google Sheets preview #167

Closed cgil closed 1 year ago

cgil commented 1 year ago

Is there a way to embed a preview of a Google Sheets file? I'm imagining a user adds a link with public permissions and selects a column x row range to display.

Or how would one go about implementing this?

sjdemartini commented 1 year ago

Hi @cgil, been super busy so it's taken me a while to get back to you on this.

I think a reasonable way to go about implementing this is to create a custom Tiptap extension, which Tiptap has a guide for here: https://tiptap.dev/guide/custom-extensions (so be sure to check out the "Create New Extensions" section)

You'll seemingly need to take advantage of Node Views to render your own custom interactive JS-based content (mentioned in the above, and with its own more detailed guide here https://tiptap.dev/guide/node-views). I'm not familiar with Google Sheets' APIs, but presumably you could create a Node View that has interaction for the user to select the Sheets URL and column/row range, and use that to render the Sheet in an iframe based on their choice. Hope that's helpful!