Editor: Add "link to existing content" feature

[kriskarkoski]

Original title: Create wplink TinyMCE replacement that uses our Dialog component

We need to implement the "Link to existing content" feature in the Calypso editor. Here's what it looks like in WP Admin:

[folletto]

Here's a concept with the add / search and edit screen, iterating on @jasmussen's concept and aligning with Calypso UI:

With the search contextual inside the link there are no different states anymore between add and edit. :)

[aduth]

@folletto : It's not clear to me from the concepts how a user proceeds from having selected some unlinked text to choosing where it should link. Do they still need to click "Add Link" in the toolbar? Or do we show an inline menu as soon as some text is highlighted? For the latter of these, we should consider how this behaves in mobile browsers, since it may be obscured by the stock browser formatting toolbar (iOS Safari).

[folletto]

Do they still need to click "Add Link" in the toolbar?

Correct. I haven't done it because it's identical as now. 👍

[alexjgustafson]

Subscribing because wpcom user requested this in 269098-chat

[timmyc]

@kellychoffman I was hoping to get this taken care of this week. Wondering what your thoughts are design-wise. Should we go for the unified search box as @folletto has shown above, or take a similar approach to what is done in wp-admin.

One concern I have with the approach above is the discoverability of the feature.

Going the wp-admin route could drop in the page-selector component fairly easily. So I suppose we could start there, and iterate on it more down the road. This is a highly requested feature so far, which makes me want to leverage our existing component to get it out there.

[folletto]

One concern I have with the approach above is the discoverability of the feature.

Partially true, but:

• The text says it — if anyone has better ideas for the copy is welcome ;)
• Once you start typing, regardless of what's your intent, triggers the dropdown with the auto-complete
• Google does it. ;)

That said...

Going the wp-admin route could drop in the page-selector component fairly easily. So I suppose we could start there, and iterate on it more down the road

I agree would be sensible to get incrementally there if it takes too much time. 👍 ;)

[timmyc]

@folletto totally missed the placeholder text while glancing at the issue again. Also re-read the old issue for even more design context.

[timmyc]

Also this is the top requested feature from feedback. 65 votes so far.

[folletto]

Also this is the top requested feature from feedback. 65 votes so far.

Yeh. Very very important. :)

[kellychoffman]

We should go with the designs based on @jasmussen's core mocks that @folletto posted above.

The text says it — if anyone has better ideas for the copy is welcome ;)

Copy is good, but we could probably mention the URL first. "Enter URL or the name of a page or post" Reason: more links are external urls than internal pages.

What do we think about auto selecting the "Open link in a new window/tab" if a non page or post is selected?

Also, instead of the "delete" icon we should do the "link-break" icon we are currently using so its less scary, especially if it is a page/post link.

[timmyc]

What do we think about auto selecting the "Open link in a new window/tab" if a non page or post is selected?

👍

[folletto]

What do we think about auto selecting the "Open link in a new window/tab" if a non page or post is selected?

LOL sorry to be the annoying guy here but... this shouldn't be a default, like, ever. Breaks navigation without user knowledge, and on mobile forces the swap tab animation and makes going back not a matter of just tapping back anymore.

It's akin to the huge debate around deprecating target="_blank". ;)

Copy is good, but we could probably mention the URL first. "Enter URL or the name of a page or post" Reason: more links are external urls than internal pages.

Good point 👍

Also, instead of the "delete" icon we should do the "link-break" icon we are currently using so its less scary, especially if it is a page/post link.

Good point as well 👍

[kellychoffman]

What do we think about auto selecting the "Open link in a new window/tab" if a non page or post is selected?

Talked with some others, read some things, and decided against it.

[csonnek]

Also requested in 2508907-t

[designsimply]

Yay! Happy to see this go in. :)

[folletto]

@aduth Pinging about the closure of this one: are we tracking then the inline design above in a different issue?