Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ability to search for user tags on comment and post inputs #2185

Open
wants to merge 1 commit into
base: the-future
Choose a base branch
from

Conversation

logiczsniper
Copy link

Description

When users are typing in the create post input or any comment box, they can type '@' and what immediately follows will be a user tag query. If they are satisfied with the top result, they may hit 'TAB' to autocomplete the top user tag. Otherwise, they may select a value from the dropdown of results that is tethered to the input box with a 5 second lifespan (before it is cleared)

Gifs :)

autocomplete-done-1
autocomplete-done-2

/cc @hummingbird-me/staff

@logiczsniper
Copy link
Author

@Reinachan here it is! Honestly not a big deal if this never gets merged, it was a fun experiment and trying to get used to ember.js; ill most likely never ever need this ability but ah well :P
Also im not even that happy with the code quality on this one but if we really want to merge this i may try clean it up

Copy link
Member

@Reinachan Reinachan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for the PR, I generally love this, but there are some usability things I think needs to be addressed before this can be merged.

I don't like that it disappears after a couple of seconds. I'd rather it disappears if you click outside the box.

It's using dark colours whether you're in light-theme or dark-theme. Is that intentional? I think it would be better to make it look more like the existing dropdown menues colour-wise.

Currently it's kinda in a weird space between being a "tooltip" and a dedicated block. I'd suggest either making it appear underneath the location you're writing the mention or have it insert itself as a block above the post button. I think the first option is preferred as it's possible to write a long post and then go back and add a mention at the top.

It should show up immediately when you type an @. If you haven't loaded any users yet, display a loading indicator. I didn't think it was working at first because it wasn't showing up immediately.

You should be able to select other users with the keyboard, not just the top result. I suggest making arrowkeys navigate a selection and tab and enter inserting it. I also think the first result should be highlighted initially.

The comment input is gone! Which speaking of, this should ideally integrate there too.

I'd suggest you look at GitHub's popup for @ mentions.

TL:DR
The changes I request are

  • make it disappear when the typing cursor is no longer at relevant text
  • make it no longer disappear on a timer
  • make it appear under the @ rather than under the post
  • make it show immediately when typing a character after @. Show loader if there's no data yet.
  • make it keyboard-friendly. Arrow keys should move a selection and tab and enter should insert it.
  • fix the bug that hides the comments input

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants