[NEW PLUGIN] - @MentionInput - Enable users to mention each other on any input

Hi Bubblers !
I’m happy to announce my latest plugin @MentionInput!
This plugin allows you to enable users to use “@” sign to mention a user or another thing with a dropdown menu inside any input.

Useful for chat, comment section, email writing etc.

Check it out :slight_smile:

Demo page
Plugin page

How to use:

Make your app look and feel more like Twitter, Facebook and other tech giants!

12 Likes

Very nice!

1 Like

Thank you !

Great stuff @joao1997domingues !

1 Like

Thank you ! :slight_smile:

Thanks! It would be really nice if there also were some basic style possibilities. Some examples:

  • once I tag someone the “@username” should be more visible (make it bold, change color)
  • also it would be nice to give some basic style changes to the dropdown (border styles, bg, maybe even use profile pictures)

No critique just some thought that could help you make it better & also get more clients.

I will also buy if you implement some of these. :+1:

2 Likes

Hi @maze !
That’s kind of tricky to implement because the objective of the plugin is to be able to use it inside Bubble’s default inputs but I’ll definitely look at this and I’ll get back to you :wink:

Thanks for the feedback !

2 Likes

Implementing that yourself wont be hard. Just add conditional formatting in your editor/data display.

When input’s value is “do a search for user usernames” then Go bold.

I think that way it does not work - because once I write more than just the username - the search returns a “no” and the condition will not be activated. Also you want to submit the input afterwards (however maybe it is also possible to do in text…). But thanks for the idea I am going to try around a little bit.

1 Like

You are right, it won’t work…
But I’m working on this! I’ll have news very soon :smiley:

1 Like

@joao1997domingues I just purchased the plugin but apparently I can’t use its value.
I mean, I don’t have the possibility to retrieve “@MentionInput A’s value”.
I need it because, when a user is mentioned, I’d like to trigger a notification.
Am I missing something?
Thx

2 Likes

Hi @gianluca1 !

You can’t read the value from the element because it has no value, it exists only to provide the functionality on the selected element ID.
About the event, currently there’s no event triggered when a user selects something from the dropdown but I will take care of adding that feature shortly.

Hi again @gianluca1,

Following your comment and as I said I would do:
I’ve added the feature to have an event triggered every time a user selects a value from the dropdown.

I’ve also added a value to the @MentionInput element that reflects the last value that was selected in the dropdown. So you can now read the element’s value and get the selected option

Finally I would like to thank you again for your input as it helped make the plugin better :slight_smile:

Happy Bubbling!

João Domingues

Mobile number: +351912109550

Email: joao@assistedlearning.io

2 Likes

Shout out to @joao1997domingues for an awesome and simple plugin that just works! Added the “{” trigger today so it now works for common merge tag formats such as {{first_name}}.

1 Like

@joao1997domingues, one @Mention Input per page is working well, added another element for reply messages inside repeating group and @Mention Input isn’t working, can you help us?

Hi @joao1997domingues, the plugin is throwing this error every time it loads.

It still works, but wanted to report.

1 Like

Thank you ! Just updated the plugin to remove deprecated code (responsible for the console errors)

Sorry @alexandra I missed this message :grimacing: please tell me if you’re still facing this issue.

Thanks!

Is it possible to trigger a workflow when clicking a mentioned user? I’d like to take the user to a specific page (ex. - the clicked user’s profile, another chat channels, etc. depending on which mention was clicked).

Thank you!