feat(picker): add switch for emojis GitHub does not support yet - #347
feat(picker): add switch for emojis GitHub does not support yet#347rickstaa wants to merge 1 commit into
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
🟡 Changes recommended
The emoji data script uses JSON import with { type: "json" } which won’t parse under the repo’s Node 20 CI workflows, and the PR also includes generated .playwright-mcp artifacts that should not be committed.
Once you've addressed the issues Copilot identified, you can request another Copilot review.
Pull request overview
Adds an opt-in “non-GitHub” mode to the emoji picker so users can browse/copy newer Unicode emojis that don’t have GitHub shortcodes, backed by updated data generation.
Changes:
- Add
showNonGithubstate to app context and a Header switch +non_github=trueURL override. - Extend the picker wrapper to pass
exceptEmojisso non-GitHub emoji IDs can be hidden by default. - Update emoji data generation to include all Unicode emojis and emit a
non_github_emojis.jsonID list; update docs/translations/tests accordingly.
File summaries
| File | Description |
|---|---|
| src/store/theme-context.ts | Extends ThemeContext defaults to include non-GitHub toggle state and handler. |
| src/data/non_github_emojis.json | Adds generated list of non-GitHub emoji IDs to hide by default. |
| src/data/github_custom_emojis.json | Adds missing copilot custom emoji entry/keywords in generated data. |
| src/components/Header/Header.tsx | Adds UI switch to toggle showing non-GitHub emojis. |
| src/components/EmojiPicker/EmojiPicker.tsx | Adds exceptEmojis prop passthrough to emoji-mart picker. |
| src/components/App.tsx | Implements URL/localStorage preference, filtering, and unicode-copy behavior for non-GitHub emojis. |
| src/components/App.test.tsx | Adds tests covering default/URL-param behavior for the non-GitHub switch. |
| scripts/keywords.json | Adds missing keyword entry for the new copilot custom emoji. |
| scripts/create_github_emoji_list.js | Updates data generation to annotate all emojis, clamp versions, and output non-GitHub IDs. |
| README.md | Documents the new switch and non_github URL parameter behavior. |
| public/locales/en/translation.json | Adds translation string for the new switch label. |
| .playwright-mcp/page-2026-09-06T19-35-09-701Z.yml | Adds Playwright/MCP snapshot artifact from local verification. |
| .playwright-mcp/page-2026-09-06T19-32-31-240Z.yml | Adds Playwright/MCP snapshot artifact from local verification. |
| .playwright-mcp/page-2026-09-06T19-34-35-043Z.yml | Adds Playwright/MCP snapshot artifact from local verification. |
| .playwright-mcp/page-2026-09-06T19-31-28-706Z.yml | Adds Playwright/MCP snapshot artifact from local verification. |
| .playwright-mcp/console-2026-09-06T19-31-28-468Z.log | Adds Playwright/MCP console log artifact from local verification. |
Review details
- Files reviewed: 15/17 changed files
- Comments generated: 3
- Review effort level: Lite
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
| import emojiLib from "emojilib" with { type: "json" }; // Emoji data search library. | ||
| import emojiData from "emoji-datasource" with { type: "json" }; // Multi-OS emoji data. | ||
| import unicodeEmoji from "unicode-emoji-json" with { type: "json" }; // Unicode emoji data. | ||
| import { Octokit } from "@octokit/core"; | ||
| import CustomKeyWords from "./keywords.json" with { type: "json" }; |
| navigator.clipboard.writeText( | ||
| unifiedToUnicodeEmoji(selectedEmoji?.unified), | ||
| ); |
| - generic [active] [ref=f11e1]: | ||
| - generic [ref=f11e2]: | ||
| - generic [ref=f11e4]: | ||
| - generic [ref=f11e6]: | ||
| - heading "GitHub Emoji Picker" [level=1] [ref=f11e8] |
The data script now keeps every Unicode emoji and lists the ids GitHub lacks; the picker hides those through exceptEmojis unless the switch or the non_github URL parameter is on. Toggling reloads because emoji-mart filters its singleton data once at mount. Emoji versions are clamped to 15, the newest emoji-mart can detect, so 15.1 and 16 emojis can show. Also adds the copilot keyword and Node 24 import syntax the script needs. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
4e1ecf5 to
0eb4440
Compare
There was a problem hiding this comment.
🟡 Changes recommended
The updated JSON import syntax in the data script can be incompatible with the currently declared Node engine range, risking update-emojis breakage for contributors running older Node 20 minors.
Once you've addressed the issues Copilot identified, you can request another Copilot review.
Review details
Suppressed comments (1)
scripts/create_github_emoji_list.js:12
with { type: "json" }import attributes require newer Node 20 minors (and the repo currently declaresengines.nodeas>=20.0.0). That can makenpm run update-emojisfail with a syntax error for contributors on older 20.x. Consider switching these JSON imports to acreateRequire()-based load (or bump the minimum engine version).
import emojiLib from "emojilib" with { type: "json" }; // Emoji data search library.
import emojiData from "emoji-datasource" with { type: "json" }; // Multi-OS emoji data.
import unicodeEmoji from "unicode-emoji-json" with { type: "json" }; // Unicode emoji data.
import { Octokit } from "@octokit/core";
import CustomKeyWords from "./keywords.json" with { type: "json" };
- Files reviewed: 11/12 changed files
- Comments generated: 2
- Review effort level: Lite
| { | ||
| "header.description": "A simple emotion picker that displays all the supported GitHub emojis.", | ||
| "header.themeSwitch.description": "Switch to your preferred theme and language.", | ||
| "header.nonGithubSwitch.label": "Show emojis GitHub does not support yet", |
| const getShowNonGithub = () => { | ||
| const param = new URLSearchParams(window.location.search).get("non_github"); | ||
| if (param !== null) { | ||
| const show = param.toLowerCase() === "true"; | ||
| window.localStorage.setItem("nonGithub", String(show)); | ||
| return show; |
Adds a switch below the theme and language selectors, plus a
non_github=trueURL parameter, that shows the 36 Unicode emojis GitHub does not support yet (Emoji 15.1 and 16.0). These have no shortcode, so clicking one always copies the Unicode and the snackbar says why.How it works:
github_emojis.jsonand writes the non-GitHub ids tonon_github_emojis.json. The GitHub set is unchanged (1870 ids).exceptEmojisunless the switch is on. Toggling reloads the page, since emoji-mart filters its module-level data once at mount and cannot add emojis back.Also fixes two things the data script needed to run at all: the new
copilotcustom emoji had no keyword entry, and Node 24 requireswithinstead ofassertfor JSON imports.Verified in a browser: switch off hides phoenix, switch on shows it, clicking copies
1f426-200d-1f525.pnpm lint,typecheck,test,buildpass.Closes #203