Replace emoji picker package with a custom impl #38

New issue

Open

opened 2026-06-06 22:23:35 -04:00 by Henry-Hiles · 1 comment

Henry-Hiles commented

2026-06-06 22:23:35 -04:00

Owner

As title says, the emoji picker package isnt that good, and we already have to maintain a fork. We should write our own. We already have emoji_controller, so it shouldn't be that hard. As a bonus, we can probably add support for free text reactions. It will also pave the way for custom emoji reactions in nexus.

Notes

As title says, the emoji picker package isnt that good, and we already have to maintain a fork. We should write our own. We already have `emoji_controller`, so it shouldn't be that hard. As a bonus, we can probably add support for free text reactions. It will also pave the way for custom emoji reactions in nexus. [Notes](https://docs.federated.nexus/docs/3b163ffd-44a7-421c-894c-0a2496e319fc/)

Henry-Hiles added the

Good First Issue

label

2026-06-06 22:30:39 -04:00

istalri self-assigned this

2026-07-25 07:58:55 -04:00

istalri commented

2026-07-25 08:31:11 -04:00

Member

Shortly discussed with @Henry-Hiles that I want to work on it.

We have to make sure it works well on mobile and desktop. We discussed whether a bottom sheet is the best solution or if it makes sense to have different approaches for mobile and desktop. My first thought was that the different approaches long term are required since that what everyone expects from a chat app looking at discord for example. But I thought about it and think for now the bottom sheet idea works and gives us less code to manage in the end.

But maybe we can have a setting where you can simply say I want the bottom sheet or a pop up. The inner layout is basically the same.

We want some tabs for the different categories and under them; A page with the emojis from that category listed and a search bar to search across all categories. Also a history would be nice. This means aside from the normal category tabs we need a history tab(Recently used/most used emoji) and a search result tab that automatically opens if we search for something.

According to the matrix spec we can use https://spec.matrix.org/v1.19/client-server-api/#recently-used-emoji for the history.

Quoting the spec:

When an emoji is used, the sending client moves (or adds) it to the beginning of the recent_emoji array and increments (or initializes) its counter. This keeps the array ordered by last usage time which facilitates evaluating the data. How exactly the client evaluates and uses the collected data is deliberately left unspecified.

This means the ordering is clear but how we use it is up to us. I think we keep it simple and have a tab for recently used emojis and just render the contents of this in order: Left to right, top to bottom. This is what most users would expect as this is the way for most emoji pickers.

Shortly discussed with @Henry-Hiles that I want to work on it. We have to make sure it works well on mobile and desktop. We discussed whether a bottom sheet is the best solution or if it makes sense to have different approaches for mobile and desktop. My first thought was that the different approaches long term are required since that what everyone expects from a chat app looking at discord for example. But I thought about it and think for now the bottom sheet idea works and gives us less code to manage in the end. But maybe we can have a setting where you can simply say I want the bottom sheet or a pop up. The inner layout is basically the same. We want some tabs for the different categories and under them; A page with the emojis from that category listed and a search bar to search across all categories. Also a history would be nice. **This means aside from the normal category tabs we need a history tab(Recently used/most used emoji) and a search result tab that automatically opens if we search for something.** According to the matrix spec we can use https://spec.matrix.org/v1.19/client-server-api/#recently-used-emoji for the history. Quoting the spec: > When an emoji is used, the sending client moves (or adds) it to the beginning of the recent_emoji array and increments (or initializes) its counter. This keeps the array ordered by last usage time which facilitates evaluating the data. How exactly the client evaluates and uses the collected data is deliberately left unspecified. This means the ordering is clear but how we use it is up to us. I think we keep it simple and have a tab for recently used emojis and just render the contents of this in order: Left to right, top to bottom. This is what most users would expect as this is the way for most emoji pickers.

No labels

Blocked

Good First Issue

No milestone

No project

No assignees

2 participants

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference

Nexus/nexus#38

No description provided.

Rows
Columns