Custom dialogs to edit links and images

[dselman]

The toolbar allows inserting both links and images. Both would benefit from a custom dialog to insert new links or to edit existing links.

[jolanglinais]

Moved to markdown-editor, relates to accordproject/markdown-editor#293

[jolanglinais]

@Michael-Grover any thoughts on this?

From @dselman:

Because images are just specialized links in Markdown, perhaps we can also use for to edit images?

[Michael-Grover]

accordproject/markdown-editor#293 @dselman there is a custom dialogue for links here

Because images are just specialized links in Markdown, perhaps we can also use for to edit images?

if someone wants to edit an image wouldn't they just delete it and add a new one?

[jolanglinais]

Relates to #29

[K-Kumar-01]

@dselman
Keeping the perspective of the image, does it mean that when an image is clicked a popup similar to hyperlink should open up with a field to edit the image URL?

[jolanglinais]

@K-Kumar-01 yes I think that's the right idea.

[K-Kumar-01]

@irmerk @dselman
I have created a PR for the issue. Let me know if there are any changes required.

[jolanglinais]

@Michael-Grover so my interpretation is that this might not be a good feature for images?

[Michael-Grover]

@Michael-Grover

if someone wants to edit an image wouldn't they just delete it and add a new one?

@irmerk

so my interpretation is that this might not be a good feature for images?

I'm just not clear on what the utility of this feature is. Is being able to edit the image URL the standard functionality in editors like this (built on markdown but don't let users edit the markdown directly)? It feels like adding complexity to the UI for no additional utility. @dselman since you opened this issue, what do you think?

It seems simpler to just click on an image, press backspace, then add a new one. Also, when a user uses cmv+v to paste an image, what does should the URL become in the pop up?

[dselman]

I guess I was influenced by the similarity between links and images in the markdown spec. I think there is some precedent for this sort of thing. E.g. in elev.io you can click on an image, select "replace" and then the "by url" button. Fairly sure I've seen it elsewhere as well, but I'll defer to you on utility/design.

I'd also love to get rid of the system prompt displayed when the user presses the "insert image" toolbar button.

[Michael-Grover]

@dselman what's a situation where someone might want to change the URL of an image? I don't actually understand how someone would use the existing functionality where they have to enter a URL to add an image. Where are they getting the URL from? in editors like this, I thought that people usually upload files from their computer or paste images. I just haven't seen entering a URL as a method for adding an image in editors, so I'm having trouble envisioning how users would use the existing functionality, and how it can be improved.

[Michael-Grover]

I think having a pop up appear when clicking an image makes it harder to delete the image, use the keyboard to navigate past the image, and use the cursor to drag and drop an image to a different part of the editor.

[K-Kumar-01]

I think having a pop up appear when clicking an image makes it harder to delete the image, use the keyboard to navigate past the image, and use the cursor to drag and drop an image to a different part of the editor.

@Michael-Grover
I can add a delete button in the popup itself that will make it easier. However, that completely depends on whether we want to use this feature or not.
Navigating the image using the keyboard can also be fixed.
Using the cursor to drag and drop image might be tricky.

[K-Kumar-01]

@dselman @Michael-Grover @irmerk
I also noticed that dragging and dropping images doesn't add an image to the markdown editor. So that might be a feature that we can work on?

[Michael-Grover]

@dselman and I discussed pop up dialogues to edit images and decided that it's not necessary, however we should allow users who extend this component to choose what they want to happen when a user clicks on the image. I think this means having an event happen upon clicking an image, @dselman is that right? Is there any additional context you can add?

[K-Kumar-01]

@dselman
Waiting for your response.