okTurtles / group-income

A decentralized and private (end-to-end encrypted) financial safety net for you and your friends.
https://groupincome.org
GNU Affero General Public License v3.0
331 stars 44 forks source link

Emoji picker issues & enhancements #2334

Open taoeffect opened 2 months ago

taoeffect commented 2 months ago

Problem

  1. External resources: it seems like emojis are loaded from https://unpkg.com/emoji-datasource-apple@5.0.1/img/apple/sheets-256/64.png. No external resources should be used.
  2. Lack of fallback: After 'reacting', the reaction may or may not display (well, it'll display but show a placeholder character), based on the availability of glyphs.
  3. It doesn't contain all of the emojis, some are missing (I don't remember which ones exactly, but remember using one on Slack that wasn't available on in the GI one)
  4. It doesn't immediately autoselect the input field when you bring it up, so you can't immediately start typing to find an emoji

Solution

Either find a way to use the existing library while addressing the above issues or maybe pick a different one. Remember: the fewer dependencies it has the better. Ideally, zero dependencies on other libraries.

corrideat commented 2 months ago

zero dependencies on other libraries

I agree, but I think in this case a dependency would help at least for categorising things. Then, using a picker library isn't too far off.

When it comes to loading resources, ideally one could use the system font (no dependencies, smaller payload to deliver). The issue is that this could have some inconsistencies issues across clients (e.g., different degrees of completeness, different rendering, etc.). For example, (some) Android and iOS have different rendering for the gender-neutral pictograms. Another emblematic example is the PISTOL (or WATER PISTOL) emoji, aka U+1F52B. See https://commons.wikimedia.org/wiki/Category:U%2B1F52B for examples of different renderings, which is bound to cause misunderstandings.

corrideat commented 2 months ago

It seems like the remote resource is defined at frontend/assets/style/components/_emoji-mart.scss. Replacing the URL there fixes issue 1.

It doesn't contain all of the emojis, some are missing (I don't remember which ones exactly, but remember using one on Slack that wasn't available on in the GI one)

As with many dependencies, the package version used isn't current. The emoji image version referenced is 5.0.1, while the current version is 15.0.1. This could explain some of the missing elements.