scorelab / Codelabz

Codelabz
Apache License 2.0
144 stars 409 forks source link

[ Fix : URL Copied from Image Drawer And Pasted To Quill Editor Shows Image In Preview Or View Mode ] #1165

Open rohitPandey469 opened 7 months ago

rohitPandey469 commented 7 months ago

Description

What was happening? The Copy URL button from Image Drawer is used to paste a particular formatted string in the quill editor. But it won't inject the image i.e. just shows the URL from Copy Url button in preview or view mode. What is happening? When the Copy URL is pasted then the Editor uses custom matcher to handle the pasted URL i.e. as soon as you paste the image by doing ctrl + v, then it parse the URL and injects the corresponding image. If we want to have a functionality like Git Hub where the image URL, will be shown like this ![alt=image; scale=1.0](URL) in editor mode and image in preview mode then to do this I'll be using a blob package so do tell me if that functioning would be more OK. First copy changes from #1158, then from this file to see it's working

Related Issue

Fixes #1161

Motivation and Context

The Copy URL wasn't working, so made it work!!! And.....

How Has This Been Tested?

Tested locally on my machine.

Video:

https://github.com/scorelab/Codelabz/assets/123815256/58b2cf96-0b33-4c78-adc2-0bc20c00846e

The copied URL now directly injects the image from firebase to Quill Editor.

Types of changes

Checklist:

NOTE:

If the image is not uploading then, there might be a CORS related issue - see in console. As the URL from firebase is directly used to upload the image to Editor and it must be happening everywhere in the app ( we can handle it by rolling a small server then fetching), but for now, To handle it need to do some basic steps like setting up a firebase bucket in your Codelabz firebase project. Do look it up how to set it or, refer to issue #1053.