Add @mention to textarea

Hi everybody,
Is it possible to enrich textarea with "@mention" like in whatsapp by using for example React Tribute framework?

Thank you

1 Like

Hey @poto,

I recently implemented something similar. Not sure what your use-case is but mine was notifying people mentioned in a comment. Could you elaborate a bit?

For me, parsing the textarea after saving, extracting the mentions with some simple regex and replacing the mention with some custom html to show that it was matched worked fine.

Thank you @minijohn . I just want the same thing as here in the forum. I can put "@" and your name is proposed. I want it to appear right on "keydown" event.

1 Like

Aah, got ya. That's not possible natively afaik. You would need to create a custom component with an editor that has that feature or built it on top of it. Sorry :sweat_smile:

:smiling_face_with_tear:
what do you mean by "built it on top of it"? A kind of run js query on 'change' event?
thanks again @minijohn

1 Like

:joy:

At a very high level you'll need a customizable editor that supports custom component development so you can build the UI for user autocompletion right? I'm not aware of that being possible, natively, in any current Retool component.

Take Editor.js for example. You could build a custom component in retool with this library and implement user autocompletion. Heavy lifting tho.

Ah ok. I see now. in a hurry to get started.
Thanks again.

1 Like

hi may I know if you already solved this? I have the same problem

Hey @aseco! Have the solutions mentioned earlier in the thread been helpful at all? Are you stuck at a specific point?

Hi I need guide on importing react mentions or draft js packages in custom react components

Here are our docs on...

Let me know if you run into any issues :slight_smile:

i looked into tryretool github repository for react, can your team add a sample for text editors supporting hashtags and mentions?

I will request that now! Were you able to get this working in your apps?

1 Like