Skip to content

feat(picker): add switch for emojis GitHub does not support yet - #347

Open
rickstaa wants to merge 1 commit into
mainfrom
feat/non-github-emojis
Open

feat(picker): add switch for emojis GitHub does not support yet#347
rickstaa wants to merge 1 commit into
mainfrom
feat/non-github-emojis

Conversation

@rickstaa

@rickstaa rickstaa commented Sep 6, 2026

Copy link
Copy Markdown
Owner

Adds a switch below the theme and language selectors, plus a non_github=true URL 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:

  • The data script keeps every Unicode emoji in github_emojis.json and writes the non-GitHub ids to non_github_emojis.json. The GitHub set is unchanged (1870 ids).
  • The picker passes those ids to emoji-mart's exceptEmojis unless the switch is on. Toggling reloads the page, since emoji-mart filters its module-level data once at mount and cannot add emojis back.
  • Emoji versions are clamped to 15 in the data, the newest version emoji-mart can detect, so it does not hide the newer emojis outright. Browsers without a recent emoji font fall back to component glyphs for those.

Also fixes two things the data script needed to run at all: the new copilot custom emoji had no keyword entry, and Node 24 requires with instead of assert for JSON imports.

Verified in a browser: switch off hides phoenix, switch on shows it, clicking copies 1f426-200d-1f525. pnpm lint, typecheck, test, build pass.

Closes #203

Copilot AI lite review requested due to automatic review settings September 6, 2026 19:38
@vercel

vercel Bot commented Sep 6, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
github-emoji-picker Ready Ready Preview Sep 6, 2026 7:47pm UTC

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟡 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 showNonGithub state to app context and a Header switch + non_github=true URL override.
  • Extend the picker wrapper to pass exceptEmojis so non-GitHub emoji IDs can be hidden by default.
  • Update emoji data generation to include all Unicode emojis and emit a non_github_emojis.json ID 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.

Comment on lines +8 to +12
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" };
Comment thread src/components/App.tsx
Comment on lines +175 to +177
navigator.clipboard.writeText(
unifiedToUnicodeEmoji(selectedEmoji?.unified),
);
Comment on lines +1 to +5
- 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>

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟡 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 declares engines.node as >=20.0.0). That can make npm run update-emojis fail with a syntax error for contributors on older 20.x. Consider switching these JSON imports to a createRequire()-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",
Comment thread src/components/App.tsx
Comment on lines +33 to +38
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;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bump:patch Bump the patch version on pull request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add non-github switch to show non-native GitHub emoji's

2 participants