Skip to content

Render Keyrune set-symbol glyphs in the "What's That Card?" printing frames - #15

Merged
WilfordGrimley merged 1 commit into
masterfrom
claude/keyrune-icons-diagnosis-pjpxf6
Jul 14, 2026
Merged

Render Keyrune set-symbol glyphs in the "What's That Card?" printing frames#15
WilfordGrimley merged 1 commit into
masterfrom
claude/keyrune-icons-diagnosis-pjpxf6

Conversation

@WilfordGrimley

Copy link
Copy Markdown

Description

PrintingTagPicker and PrintingTagQueue (the "What's That Card?" quick-tag row and full vote queue) showed bare expansion codes as plain text - the Keyrune set-symbol icon integration added for CanonicalCardFilter's printing dropdown was never extended here.

Adds frontend/src/components/SetIcon.tsx, a small component using real <i class="ss ss-<code>"> markup (Keyrune's own classes, already loaded globally via _document.tsx) rather than the embedded-PUA-character trick CanonicalCardFilter needs for its plain-string-label-constrained dropdown library - no such constraint applies to this plain JSX, so the idiomatic Keyrune markup works directly. An expansion code Keyrune doesn't recognise falls back to its default glyph automatically, matching CanonicalCardFilter's existing fallback behavior.

Wired into all 4 set-code display sites across both files (candidate grid + consensus line, both components).

Rebased twice onto master while in flight (through PR #12/#13, then PR #14) since both landed changes to PrintingTagQueue.tsx and its dependencies concurrently - diff confirmed unchanged and re-verified after each rebase.

Checklist

  • I have installed pre-commit and installed the hooks with pre-commit install before creating any commits.
  • I have updated any related tests for code I modified or added new tests where appropriate.
    • No test changes needed - this is a presentational addition with no new logic branches; existing PrintingTagQueue/PrintingTagPicker/VoteQueue/NoMatchReasonStrip/PrintingConfirmStrip Playwright specs all still pass unmodified.
  • I have manually tested my changes as follows:
    • tsc --noEmit, ESLint, and a full production build are clean.
    • A throwaway Playwright screenshot (not committed) confirmed the glyph renders as a real vector icon, not tofu, using the default-glyph fallback path (test fixtures use fake abc/xyz codes).
    • Full relevant Playwright suite passes: PrintingTagQueue, PrintingTagPicker, VoteQueue, NoMatchReasonStrip, PrintingConfirmStrip specs (15/15 passing; 2 pre-existing PrintingTagPicker failures unrelated to this change, confirmed by reproducing them identically with these changes stashed out).
  • I have updated any relevant documentation or created new documentation where appropriate.
    • No new documentation needed - this follows the existing Keyrune integration pattern already documented for CanonicalCardFilter.

Generated by Claude Code

…frames

PrintingTagPicker and PrintingTagQueue showed bare expansion codes as
plain text - the Keyrune integration added for CanonicalCardFilter's
printing dropdown was never extended here. Adds a small SetIcon
component using real <i class="ss ss-<code>"> markup (Keyrune's own
classes, already loaded via _document.tsx) rather than the
embedded-PUA-character trick CanonicalCardFilter needs for its
plain-string-label-constrained dropdown library - no such constraint
applies to this plain JSX, so the idiomatic Keyrune markup works
directly. An expansion code Keyrune doesn't recognise falls back to its
default glyph automatically, matching CanonicalCardFilter's existing
fallback behavior.

Verified: tsc, eslint, and a full production build are clean; a
throwaway Playwright screenshot (not committed) confirmed the glyph
renders as a real vector icon, not tofu; the existing
PrintingTagQueue/PrintingTagPicker/VoteQueue Playwright specs pass
(2 pre-existing PrintingTagPicker failures confirmed unrelated by
reproducing them with these changes stashed out).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Hfe2ccmc67RXotYNbMxKzr
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants