feat request: Do not display missing native emojis when isNative is set to true

[somq]

It appears that when setting the mart to isNative="true" some devices cannot render missing emojis.

Though the native way if often the way to go on mobile devices for performance reasons, this display with grey squares does not look that great :/

Is there any existing implementation to avoid this?
If no, I would suggest to use the canvas trick to identify missing emojis.

Please let me know if you would need or a PR

[somq]

Well, my bad I didn't see the emojisToShowFilter prop.
I found the solution but unfortunately it's way to slow, better render squares than slow the low end devices that much (from 1 to 6 secs due to the ngfor iteration + func)...

Just for reference here is what I did:

component.ts

import { Component, Input, OnInit } from '@angular/core';
import { EmojiData, EmojiEvent } from '@ctrl/ngx-emoji-mart/ngx-emoji';
import { PopoverController, IonInput } from '@ionic/angular';
import ifEmoji from 'if-emoji'

/**
 * @see docs https://github.com/scttcper/ngx-emoji-mart
 */
@Component({
  selector: 'app-emoji-mart-popover',
  templateUrl: './emoji-mart-popover.component.html',
  styleUrls: ['./emoji-mart-popover.component.scss'],
})
export class EmojiMartPopoverComponent implements OnInit {
  @Input() isDarkMode = false

  constructor(
    private popoverCtrl: PopoverController,
  ) { }

  ngOnInit() { }

  async onEmojiSelected(event: EmojiEvent) {
    return await this.popoverCtrl.dismiss({ emoji: event.emoji })
  }

  isMissingEmoji(data: EmojiData) {
    return ifEmoji(String.fromCodePoint(parseInt(data as any as string, 16)))
  };
}

component.html

<emoji-mart
  (emojiClick)="onEmojiSelected($event)"
  set="google"
  [showPreview]="false"
  [i18n]="{
    search: 'Recherche',
    categories: { search: 'Résultats de recherche', recent: 'Récents' }
  }"
  perLine="6"
  sheetSize="32"
  [darkMode]="isDarkMode"
  showSingleCategory="true"
  isNative="true"
  [emojisToShowFilter]="isMissingEmoji"
></emoji-mart>

Maybe ifEmoji could be optimized but then we would experience false positives... 🤯

[somq]

If anyone has any idea I'm into it, if no just close...

[scttcper]

There isn't a great way to do this

[somq]

Unfortunately you are right, closing, thanks.