Forem Creators and Builders 🌱

Cover image for Changelog: Autocomplete for user mentions
Suzanne Aitchison for Forem Core Team

Posted on

Changelog: Autocomplete for user mentions

I'm pleased to say that Forem now supports autocomplete for usernames πŸŽ‰

This functionality is already available in the comment section of all Forems, and will shortly roll out to the post editor.

How it works

When you type '@' followed by another two characters, search results will automatically start being fetched and displayed in a dropdown. Search results are based on username only at this time.

For screen-reader users, as soon as search results start fetching, the component conforms to the Combobox pattern; announcing the number of search results found and how to interact with them.

Selecting a user either by click or by keyboard will populate the full username in the text area. When your comment/post is published, this is turned into a link to that user's profile ✨

We hope you find this feature useful!

Top comments (8)

Collapse
 
kvaibhav01 profile image
Vaibhav Khulbe

I also requested this feature in one of my PRs to DEV. Now it's happening and I'm much excited.

Let me give it a try...

@s_aitchison

Excited GIF

Collapse
 
s_aitchison profile image
Suzanne Aitchison

@kvaibhav01 we're all going to be mentioning so many users πŸ˜„

Collapse
 
kvaibhav01 profile image
Vaibhav Khulbe

Let the game begin! 😎

Collapse
 
rafi993 profile image
Rafi • Edited

This is awesome. There is one issue though if I search for "Suzanne" it does not search the display name but only searches username. So I have to look up the username for the user before mentioning the user.

Collapse
 
s_aitchison profile image
Suzanne Aitchison

That's right, at the moment it only searches by username. Hopefully in the future we'll extend it to name as well πŸ™‚

Collapse
 
thomasbnt profile image
Thomas Bnt

greaat @s_aitchison !

Collapse
 
lee profile image
Lee

Niiiiece!!

Collapse
 
link2twenty profile image
Andrew Bone

@s_aitchison even works on mobile, cool! ☺️