I am creating a little chat app for practice, but I was unsure what direction to take with the editor, out of the options I found TipTap and Lexical, I tried a bit of both (Didn't get very far with either yet) But I am still so torn on which one I should try first

In this I want more possibilities of what you can put in the chat, for example: Embedded images, tables, maybe some excalidraw integration, etc.

I also don't want to spend too much time on either and realizing that picking one over the other was not worth it long-term because of the timetaken

If anyone has used tiptap, lexical or both could you give some pro's and con's to each and some guidance on what I should pick?

Thanks! :)

I want in my practice chat app to be able to paste an image into a text input and be able to send it, on how to actually do this, I am unsure

My idea is this given a text input:

- a user could Ctrl-V (i.e., paste) something from his clipboard (a file in this instance), until a download url is returned (see below) there will be some loader spinner thingy
- In the backend is requested an Upload URL
- (somehow) whatever they pasted is immediately uploaded, likely by the path? But I am still a little bit unsure on that part
- a Download URL is returned on that S3 upload (SOMEHOW)
And thus you replace that temporary spinner with the download URL and the person can send it.

This is at least my idea on how you should be able to upload a piece of media in a message and be able to send it, I don't want just message attachments, that would be an easier story because once the association is made between the message and attachment you display it. I want something like in forums where the image can be embedded anywhere,

There is also one more small concern, on slow connection do you want to wait for the file to finish uploading first and then allow the user to send their message, or just send the message and let the upload come later, if the latter, how would you go across with doing that!?

The issue is, I have no idea on how to do this, I gave my approach above, I would really appreciate it if you guys gave some advice on what your approach would be and secondly, how to implement it, I already can get a presigned URL so that's not an issue

This is more of a design question, but it's also really interlinked with react so sorry if this is the wrong place to ask! ;-;

That's all :)