scttcper / ngx-emoji-mart

Customizable Slack-like emoji picker for Angular
https://ngx-emoji-mart.vercel.app
MIT License
450 stars 94 forks source link

[Question / Bug] recent is not working on ngOnInit. #409

Open KennyEng12 opened 2 years ago

KennyEng12 commented 2 years ago

Hi, we are using version: 6.2.0 on Angular Typescript 13.

We are facing an issue with the recent is showing blank (image shown below) even we assigned the value to recent: image

Here is our HTML code:

<emoji-mart emoji="" [showSingleCategory]="true"
    [recent]="recentlyUsed" (emojiSelect)="selectedEmojiEvent($event)" title="Please choose..." set="twitter"
    [darkMode]="false">
</emoji-mart>

Here is our Angular Typescript code:

export interface RecentlyUsedEmojiTable {
    id: string;
    lastUsedDateTime: Date;
}

recentlyUsed: string[] = [''];

getRecentlyUsedEmoji(): Promise<RecentlyUsedEmojiTable[]> {
    return new Promise<RecentlyUsedEmojiTable[]>((resolve, reject) => {
        db.recentlyUsedEmoji.orderBy('lastUsedDateTime').toArray().then((results) => {
            resolve(results);
        });
    });
}

ngOnInit(): void {
  this.getRecentlyUsedEmoji().then((results) => {
    if (results.length > 0) {
      for (const result of results) {
        this.recentlyUsed.push(result.id);
      }
    }
  });
}

But the recent emojis are showed after we clicked on any categories and back to recent category. So we are wondering if there is an API to request in order to refresh the recent category or this is a bug?

Thanks, Kenny.