element-hq / element-hq/element-web
Implement markdown media drag&drop into the composer
- Dominant language
- TypeScript
- Stars
- 13.5k
- Forks
- 2.8k
- PR merge metrics
- PR metrics pending
Description
### Your use case
### What would you like to do?
1. Currently the only way to reference images in markdown is first uploading the image in a separate message, view source, grabbing it's matrix link(ie `mxc://matrix.org/iZnsILDtTYjGzywTrOTuTcRv`) and then referencing that image in markdown with the this format ``
This is a pretty terrible experience, the whole handling of `mxc://` links is completely unfriendly to newbies and needing to do this as 2 separate messages is annoying.
What would be nicer is if I could drag and drop images into my markdown being composed and it displays as an inline image.
This would bring element in line with how github and many others handle images during composing markdown and would completely do away with then need to show a `mxc://` link to users.
___
2. I asked in the element matrix room why external image urls referenced in markdown(ie ` don't work and was given a generic "its for security" answer.
I don't really care to dispute that, but in that case when composing markdown that references external images then those images should be automatically converted and replaced with `mxc://` links when the message is sent.
### Why would you like to do it?
I have a lot of preexisting documentation and training written in markdown that I would link to send to people over matrix.
Currently most of the markdown looks great but none of the images rendering makes it completely unusable as actual documentation/training.
The process of manually uploading images to matrix first, grabbing, and then updating all the image referenced with `msc://` links is quite arduous and error prone. And it doesn't even seem to work in encrypted rooms, see: vector-im/element-web#18817
### Have you considered any alternatives?
_No response_
### Additional context
vector-im/element-web#18817 vector-im/element-web#18816
Contributor guide
Research direction
Start by locating the markdown composer and its media upload and rendering entry points. Review linked issues #18817 and #18816, then trace how mxc:// links and external image URLs are handled, including in encrypted rooms. Done should cover the requested composing workflows without weakening the stated security constraints.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- markdown, typescript
- Domain
- content, frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100