Skip to content
This repository has been archived by the owner on Sep 26, 2023. It is now read-only.

How can we add custom tags to improve search terms? #222

Open
marquizzo opened this issue Aug 1, 2022 · 1 comment
Open

How can we add custom tags to improve search terms? #222

marquizzo opened this issue Aug 1, 2022 · 1 comment
Assignees
Labels
enhancement New feature or request triaged Issue has been looked at and triaged
Milestone

Comments

@marquizzo
Copy link

marquizzo commented Aug 1, 2022

I'd like to add custom tags to existing emojis to improve searchability.

For instance, the "🎃" emoji has the following tags in the default database: "celebration", "halloween", "jack", "lantern". However, it does not include the "pumpkin" tag, which is a pretty common name for it. So I'd like to:

  1. Get the database after it's been retrieved from the CDN
  2. Search for the emoji with "label": "jack-o-lantern"
  3. Add a custom search term with tags.push("pumpkin")
const emojiPicker = picmo.createPicker(options);
emojiPicker.addEventListener("data:ready", () => {
    // How do I access database here?
});

I've scoured the API documents for a property or method that lets me access the DB, but I can't find it. I've tried adding custom emojis in the createPicker() options, but that appends a new emoji, instead of modifying an existing one. Finally, I came up with a hacky solution, but this creates a second 🎃 entry, instead of just modifying the existing one:

emojiPicker.customEmojis.push({
    "label":"jack-o-lantern",
    "tags":["pumpkin"],
    "emoji":"🎃",
})

How do I gain access to the DB to add extra search terms?

@joeattardi
Copy link
Owner

Interesting, this is not a use case I thought of.

There is not an official way to do this currently, but I can think of a few potential solutions:

(1) If you're using the default data store strategy, it's just an IndexedDB database. The data:ready event gives you a database object that encapsulates the underlying IndexedDB database itself. This object doesn't expose the actual DB, but you can just use the regular IndexedDB APIs. The name of the database is PicMo_<locale> where is the current locale, so for example, PicMo-en. You could use the IDB APIs to look up emoji records and add additional tags to the tags array.

(2) You can install the emojibase-data package and supply the static data (by default, PicMo will download it from a CDN). See here for details. To add your tags here, you'd just import the JSON data from emojibase-data. Add your tags to the emojis' tags array, then initialize PicMo and pass your modified dataset. You can probably wrap this up in a new datastore factory as well to encapsulate the tagging.

I'm hesitant to add a specific API to do this because PicMo is already a little complex with all the options it supports.

If you do find one of the above options works well for your use case, let me know! At the very least we can add some documentation about how to accomplish this!

I'll leave the issue open for now, let me know how you make out.

@joeattardi joeattardi added the enhancement New feature or request label Aug 2, 2022
@joeattardi joeattardi added this to the 6.0.0 milestone Aug 31, 2022
@joeattardi joeattardi self-assigned this Aug 31, 2022
@joeattardi joeattardi added the triaged Issue has been looked at and triaged label Jan 10, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
enhancement New feature or request triaged Issue has been looked at and triaged
Projects
Status: Todo
Development

No branches or pull requests

2 participants