AppFlowy-IO/AppFlowy

Fork 0

mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2026-03-24 12:56:59 +00:00

[GH-ISSUE #99] [FR] Emoji picker #51

New issue

Closed

opened 2026-03-23 20:31:01 +00:00 by mirror · 11 comments

mirror commented

2026-03-23 20:31:01 +00:00

Owner

Originally created by @LXK-98 on GitHub (Nov 26, 2021).
Original GitHub issue: https://github.com/AppFlowy-IO/AppFlowy/issues/99

Originally assigned to: @gaganyadav80 on GitHub.

1~3 main use cases of the proposed feature
While mobile OSs and Windows both have system-wide emoji pickers, most Linux systems don't. Gnome for example has one, but only for native GTK apps. Having a dedicated emoji picker (like for example the one in Discord) would make adding emojis in documents much easier.

what types of users can benefit from using your proposed feature
Any user who can't/does not want to use external emoji pickers

Additional context
Example of Discord's emoji picker

Originally created by @LXK-98 on GitHub (Nov 26, 2021). Original GitHub issue: https://github.com/AppFlowy-IO/AppFlowy/issues/99 Originally assigned to: @gaganyadav80 on GitHub. **1~3 main use cases of the proposed feature** While mobile OSs and Windows both have system-wide emoji pickers, most Linux systems don't. Gnome for example has one, but only for native GTK apps. Having a dedicated emoji picker (like for example the one in Discord) would make adding emojis in documents much easier. **what types of users can benefit from using your proposed feature** Any user who can't/does not want to use external emoji pickers **Additional context** Example of Discord's emoji picker ![image](https://user-images.githubusercontent.com/52625640/143572178-b494389f-5115-4120-b74c-6eb9a99dfc05.png)

mirror

2026-03-23 20:31:01 +00:00

closed this issue
added the
new feature

help wanted

good first issue for experienced devs
labels

mirror commented

2026-03-23 20:31:02 +00:00

Author

Owner

@annieappflowy commented on GitHub (Nov 26, 2021):

Thanks for the suggestion! Can you explain a bit more about where you'd like to pick an emoji easily? For example, it could be similar to Notion which you pick one for your page title.

@annieappflowy commented on GitHub (Nov 26, 2021): Thanks for the suggestion! Can you explain a bit more about where you'd like to pick an emoji easily? For example, it could be similar to Notion which you pick one for your page title.

mirror commented

2026-03-23 20:31:02 +00:00

Author

Owner

@LXK-98 commented on GitHub (Nov 26, 2021):

Adding emojis to the page title sounds good, but I was thinking more in the page editor itself.
For example in the default page you can see a waving hand at the top.

Having the ability to quickly add emojis in that editor would be great!
In fact, after a quick search I found a module for quill that does just that
https://github.com/contentco/quill-emoji
Im not sure if the flutter-quill component supports adding modules like the normal quilljs, but if it does I would assume adding this feature would be rather easy.

@LXK-98 commented on GitHub (Nov 26, 2021): Adding emojis to the page title sounds good, but I was thinking more in the page editor itself. For example in the default page you can see a waving hand at the top. ![image](https://user-images.githubusercontent.com/52625640/143581017-434f092b-158a-4fff-a10b-fb8b42640745.png) Having the ability to quickly add emojis in that editor would be great! In fact, after a quick search I found a module for quill that does just that https://github.com/contentco/quill-emoji Im not sure if the flutter-quill component supports adding modules like the normal quilljs, but if it does I would assume adding this feature would be rather easy.

mirror commented

2026-03-23 20:31:02 +00:00

Author

Owner

@annieappflowy commented on GitHub (Nov 26, 2021):

Got it! Thank you so much for your elaboration. I'd imagine this would be a great feature to add for emoji lovers 😋

@annieappflowy commented on GitHub (Nov 26, 2021): Got it! Thank you so much for your elaboration. I'd imagine this would be a great feature to add for emoji lovers 😋

mirror commented

2026-03-23 20:31:03 +00:00

Author

Owner

@0xN0x commented on GitHub (Dec 1, 2021):

If you want to do the picker yourself, i just made a pull request to update the emojis dict (slug to emoji) in the frontend repo (#110).

@0xN0x commented on GitHub (Dec 1, 2021): If you want to do the picker yourself, i just made a pull request to update the emojis dict (slug to emoji) in the frontend repo (#110).

mirror commented

2026-03-23 20:31:03 +00:00

Author

Owner

@gaganyadav80 commented on GitHub (Dec 6, 2021):

Hi @annieappflowy, can you confirm if no one is working on this feature request because then I am thinking of doing it.
Also I think this dart package could be of use dart_emoji. It can parse the emoji by name and code both and it also handles the emoji not found case.

@gaganyadav80 commented on GitHub (Dec 6, 2021): Hi @annieappflowy, can you confirm if no one is working on this feature request because then I am thinking of doing it. Also I think this dart package could be of use [dart_emoji](https://pub.dev/packages/dart_emoji). It can parse the emoji by name and code both and it also handles the emoji not found case.

mirror commented

2026-03-23 20:31:03 +00:00

Author

Owner

@annieappflowy commented on GitHub (Dec 6, 2021):

Hi @annieappflowy, can you confirm if no one is working on this feature request because then I am thinking of doing it. Also I think this dart package could be of use dart_emoji. It can parse the emoji by name and code both and it also handles the emoji not found case.

Hi @gaganyadav80 please go ahead. I'll tag your name on Discord's #pr-wanted channel if you're on it.
Also, we need to add an Emoji Picker's trigger button to the editing toolbar

@annieappflowy commented on GitHub (Dec 6, 2021): > Hi @annieappflowy, can you confirm if no one is working on this feature request because then I am thinking of doing it. Also I think this dart package could be of use [dart_emoji](https://pub.dev/packages/dart_emoji). It can parse the emoji by name and code both and it also handles the emoji not found case. Hi @gaganyadav80 please go ahead. I'll tag your name on Discord's #pr-wanted channel if you're on it. Also, we need to add an Emoji Picker's trigger button to the editing toolbar ![image](https://user-images.githubusercontent.com/12026239/144798126-fcc179e2-be93-4f35-b23a-337fc1667c6c.png)

mirror commented

2026-03-23 20:31:03 +00:00

Author

Owner

@gaganyadav80 commented on GitHub (Dec 9, 2021):

Update: I was busy with college work. I have everything setup and going to start working on this asap. 😅

@gaganyadav80 commented on GitHub (Dec 9, 2021): Update: I was busy with college work. I have everything setup and going to start working on this asap. 😅

mirror commented

2026-03-23 20:31:03 +00:00

Author

Owner

@annieappflowy commented on GitHub (Dec 10, 2021):

Update: I was busy with college work. I have everything setup and going to start working on this asap. 😅

No problem. Take your time. Good luck with your school work!

@annieappflowy commented on GitHub (Dec 10, 2021): > Update: I was busy with college work. I have everything setup and going to start working on this asap. 😅 No problem. Take your time. Good luck with your school work!

mirror commented

2026-03-23 20:31:04 +00:00

Author

Owner

@branhillsdesign commented on GitHub (Dec 20, 2021):

@gaganyadav80 would love to see the background of the picker match the sidebar background color.

Then in the designs, there's a drop shadow on popout menus like that. (see img) Not sure what the values would be in flutter for that.

The "tab" selector should match the text color. I think that's 0xff333333

@Gagan as far as functionality goes, if appflowy is the focused window in the OS, can we use the default hotkeys to bring up the emoji picker?

For example hitting "Win + . " on Windows brings up the emoji picker.

@branhillsdesign commented on GitHub (Dec 20, 2021): @gaganyadav80 would love to see the background of the picker match the sidebar background color. Then in the designs, there's a drop shadow on popout menus like that. (see img) Not sure what the values would be in flutter for that. ![image](https://user-images.githubusercontent.com/51428934/146801242-d0f0fee9-d7dc-4adc-acb1-1828027c57d8.png) The "tab" selector should match the text color. I think that's ```0xff333333``` @Gagan as far as functionality goes, if appflowy is the focused window in the OS, can we use the default hotkeys to bring up the emoji picker? For example hitting "Win + . " on Windows brings up the emoji picker.

mirror commented

2026-03-23 20:31:04 +00:00

Author

Owner

@jay-tau commented on GitHub (Dec 31, 2021):

It would be great if we could simply type the emoji we want to use. I'm aware that both Discord and WhatsApp have implemented this. : is the hotkey used to start searching for emojis.

@jay-tau commented on GitHub (Dec 31, 2021): It would be great if we could simply type the emoji we want to use. I'm aware that both Discord and WhatsApp have implemented this. `:` is the hotkey used to start searching for emojis.

mirror commented

2026-03-23 20:31:04 +00:00

Author

Owner

@gaganyadav80 commented on GitHub (Dec 31, 2021):

It would be great if we could simply type the emoji we want to use. I'm aware that both Discord and WhatsApp have implemented this. : is the hotkey used to start searching for emojis.

I have to move back to my college and little busy with it. Once I'm done I'll first finish the emoji picker and then I'll try to implement this also.

@gaganyadav80 commented on GitHub (Dec 31, 2021): > It would be great if we could simply type the emoji we want to use. I'm aware that both Discord and WhatsApp have implemented this. `:` is the hotkey used to start searching for emojis. I have to move back to my college and little busy with it. Once I'm done I'll first finish the emoji picker and then I'll try to implement this also.

mirror referenced this issue

2026-03-23 21:35:40 +00:00

[PR #51] [MERGED] Update README.md #3957