Handle embedded images added to a drawing

[bric3]

1. Copy image to excalidraw
2. Close drawing
3. Re-open

The drawing have the placeholder for the image, but the image was not saved.

Note

The issue is the lack of APIs to load binary files in the excalidraw js library (see #200).

[ixqbar]

+1

[bric3]

Feel free to contribute to speed things up.

[lionelhorn]

@bric3

I tried to have a look at the issue.
My approch was to get the initialData and only then render the

 <Excalidraw />

component. Doing it like that, it seems there is no need to use the api to updateScene or anything.

2024-07-22.00-22-11.mp4

[lionelhorn]

Changed too much stuff in my fork to be able to do a small PR. But I linked my version above.
I would be glad to help to get this issue fixed. Let me know.

[bric3]

@lionelhorn, I'm going on holiday soon. So I don't know when I will be able to have good look at your work.

Also as you may have guessed, I'm far from a web-developer. I have a very shallow understanding of React itself, even Typescript. So when I see the proposition is to use Vite or tailwind, whose I know nothing but the name, I'm lost. I'm not against those two, but still I need to digest that. So maybe you could also help me by detailing the thought process why it's needed, etc. So I can have a better understanding of the stakes and the overall change.
Does an iframe is necessary ?
By the way I like how you split the files, it feels much better and cleaner that way.

By the way thank you very much for helping me fixing this.

[lionelhorn]

@bric3 Many of the deps I used are not necessary but are what I'm familiar to and I used them to get something running quickly.

My first issue (that may come from my lack of knowledge of the jetbrains plugin dev lifecycle & gradle) was that, in development mode, I needed to close the sandbox ide window and rerun the "run plugin" task just to see changes in the html and js assets. Which lead to a poor DX.

That's why I added vite. For its HMR capabilities in dev.
When I made a change to the html UI, the iframe just updated with the new code.

Tailwind is not necessary at all. Juste added it to style a little overlay debug div to display inner state on page (separate from the native jetbrains UI)

Mobx is used for state management replacing react useState. Again not necessary. Just what was easier for me to get something cleaner code wise than passing the setters of useState to the bridge.

Iframe probably not necessary either. Just let me reuse the gradle task and assets bundling from your existing excalidraw-assets gradle build as I'm not familiar enough with it to modify it.