From a982408f51a92398c136653d090579f3ef99dc1e Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 14 Jul 2026 18:12:44 +0000 Subject: [PATCH] Render the Keyrune set-symbol glyph in the card-details "Canonical Card" row CardDetailedViewModal's "Canonical Card" row (shown when clicking a card image) had the same gap as PrintingTagPicker/PrintingTagQueue before this branch's earlier fix: expansion code rendered as bare text, no Keyrune glyph. AutofillTable's row values accept a React.ReactElement, so this uses the same SetIcon component directly rather than a plain string. Verified: tsc, eslint, and a full production build are clean. The GridSelectorModal Playwright suite (including its CanonicalCardFilter presence/absence tests) passes 23/23, confirming no regression. Could not get a direct screenshot of this specific modal in this sandbox - the same pre-existing "Card Details" modal-opening timeout that already affects PrintingTagPicker and TagVotePicker specs (unrelated to any change on this branch, reproduced deterministically and in isolation) blocks it here too. Co-Authored-By: Claude Sonnet 5 Claude-Session: https://claude.ai/code/session_01Hfe2ccmc67RXotYNbMxKzr --- .../CardDetailedViewModal.tsx | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/frontend/src/features/cardDetailedView/CardDetailedViewModal.tsx b/frontend/src/features/cardDetailedView/CardDetailedViewModal.tsx index ae43c1adb..f44a9352b 100644 --- a/frontend/src/features/cardDetailedView/CardDetailedViewModal.tsx +++ b/frontend/src/features/cardDetailedView/CardDetailedViewModal.tsx @@ -19,6 +19,7 @@ import { AutofillTable } from "@/components/AutofillTable"; import { ClickToCopy } from "@/components/ClickToCopy"; import DisableSSR from "@/components/DisableSSR"; import { RightPaddedIcon } from "@/components/icon"; +import { SetIcon } from "@/components/SetIcon"; import { AttributeVotingPanel } from "@/features/attributeVoting/AttributeVotingPanel"; import { AddCardToFavorites } from "@/features/card/AddCardToFavorites"; import { AddCardToProjectForm } from "@/features/card/AddCardToProjectForm"; @@ -140,11 +141,19 @@ export function CardDetailedViewModal({ ["File Size", imageSizeToMBString(cardDocument.size, 2)], [ "Canonical Card", - cardDocument.canonicalCard - ? `${cardDocument.canonicalCard.expansionCode.toUpperCase()} ${ - cardDocument.canonicalCard.collectorNumber - }` - : "Unknown", + cardDocument.canonicalCard ? ( + <> + {" "} + {cardDocument.canonicalCard.expansionCode.toUpperCase()}{" "} + {cardDocument.canonicalCard.collectorNumber} + + ) : ( + "Unknown" + ), ], [ "Canonical Aritst",