rich-markdown-editor icon indicating copy to clipboard operation
rich-markdown-editor copied to clipboard

Using custom image preview paths

Open dave-db opened this issue 4 years ago • 0 comments

For various (near-unspeakable) reasons, I'm using a remote git instance as a CMS backend (in a similar vein to how Netlify CMS does). Changes are made on new branches, each save is a commit, reviews are handled with PRs etc. Image uploads have been thorny - because only images on master are actually deployed to the live site, uploading an image to the current edit's branch means it can't readily be viewed (as it's not deployed on the same instance as the active site). Netlify gets around this by immediately uploading all images to master, but that's not an option for me thanks to the aforementioned review process.

It's possible to read the image directly from the CMS, though, the moment it's uploaded, and a quick tweak of the image path means you can change a reference from:

/static/images/uploaded.png

to

https://git-server/project/raw/static/images/uploaded.png?at=refs/heads/branchname

Ideally, I'd use the getLinkComponent prop to handle this like an Embed - detect an image/image path, do a quick inline replace for rendering purposes, but crucially leave the underlying source unaffected (as once the change merges, the first path will be correct).

Would there be some way to override image preview behaviour?

dave-db avatar May 11 '20 15:05 dave-db