Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Emoji picker issues & enhancements #2334

Open
taoeffect opened this issue Sep 8, 2024 · 2 comments
Open

Emoji picker issues & enhancements #2334

taoeffect opened this issue Sep 8, 2024 · 2 comments
Labels
App:Frontend Kind:Bug Kind:Enhancement Improvements, new features, performance upgrades, etc. Note:UI/UX

Comments

@taoeffect
Copy link
Member

Problem

  1. External resources: it seems like emojis are loaded from https://unpkg.com/[email protected]/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.

@taoeffect taoeffect added Kind:Bug Kind:Enhancement Improvements, new features, performance upgrades, etc. App:Frontend Level:Starter Note:UI/UX labels Sep 8, 2024
@corrideat
Copy link
Member

corrideat commented Sep 8, 2024

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
Copy link
Member

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
App:Frontend Kind:Bug Kind:Enhancement Improvements, new features, performance upgrades, etc. Note:UI/UX
Projects
None yet
Development

No branches or pull requests

2 participants