feat(reveals): Redesign /reveals as an immersive six-ink set tracker + Set 13 data (#390)#392
Merged
Merged
Conversation
Engine: add rarity to LorcanaCard + carry it through transformCard (web loader inherits it). Reveals data: setComposition (204/34) + rarity config (real 12/9/8/3/2 split, 5 in-app rarities); useRevealProgress hook for real per-ink counts, rarity tallies and totals (dual-ink cards bucket to primary ink so the six 34-boards sum to 204); curated franchise->ink tint. Data fix: set rarity on 7 late-revealed Set 13 cards, remove 3 promos (Buzz Lightyear, Vixey, Merlin) + their orphaned preview AVIFs.
inkTint helper (rgba/rgb ink tints derived from theme INK_COLORS). ProgressRing: conic sweep masked to a thin ring, ink symbol + count, size-driven desktop/mobile. RaritySymbol: real Lorcana rarity glyphs from vendored SVGs (common/uncommon vector, rare/super-rare/legendary detailed).
CardSlot: ink-art tile — bright + glowing with the real card image when revealed (opens the card modal on click), dimmer ink-symbol placeholder when not; no cost or rarity pips. Retired the geometric RarityGem; rarity config trimmed to {key,name,total}.
Add 5 rarity symbol assets; wire Storybook into .claude/launch.json for previews.
CardMosaic: diamond [4,6,7,7,6,4] of CardSlots with a deterministic per-ink scatter (scatter.ts). InkBoard: header (ink badge + name + fill-scaled glow + COLOR COMPLETE ribbon) wrapping the mosaic + rarity breakdown; reveals.css holds the float/shimmer keyframes (reduced-motion aware). RarityBreakdown: the 5 real rarity symbols with capped revealed/total in a centered band (full-width divider). InkTrackerTile/Strip: six selectable progress-ring tiles with a buttery alpha-fade selection glow (symmetric shadow + constant border). RevealHero: set logo + countdown/stats panels, no intro or progress bar.
) NewFranchises: three debut-franchise cards (real key art contained, not cropped) with ink-tinted bloom, NEW THIS SET pill, name and blurb; franchise.ts gains a blurb per franchise. The 'new this set' mechanics/tribes band was cut from scope (rejected v1) and tracked separately in #391.
Wire RevealHero, InkTrackerStrip, InkBoard, and NewFranchises into RevealsPage; replace the Tracker/Franchises toggle with a per-franchise cards modal. Remove dead Hero, FranchiseTier, ViewToggle, and scatter. Place each card at its true collector-number slot on a 38-slot diamond; rarity breakdown shows live per-rarity counts; auto-rotate landscape location scans 270deg in convert-preview-images (preserved into prod by copyPreviewAvifs). Populate Set 13: 105 preview cards plus art; remap promo cards to main-set ids and numbers; remove Pocahontas. Rewrite reveals-page.spec.ts for the new tracker and franchise modal.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
🎨 Design-surface change detected This PR touches files mirrored by the Inkweave design system project. What changed:
To refresh: open the design system Claude project and prompt:
This is a reminder, not a blocker. Configured in |
|
Important Review skippedToo many files! This PR contains 155 files, which is 5 over the limit of 150. To get a review, narrow the scope: Upgrade to a paid plan to raise the limit. ⚙️ Run configurationConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (5)
📒 Files selected for processing (155)
You can disable this status message by setting the Use the checkbox below for a quick retry:
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![codescene-delta-analysis[bot]](https://avatars.githubusercontent.com/in/53921?s=60&v=4){kind=small}
There was a problem hiding this comment.
(1 files improve in Code Health)
Our agent can fix these. Install it.
Gates Passed
View Improvements
| File | Code Health Impact | Categories Improved |
|---|---|---|
| RevealsPage.tsx | 9.69 → 10.00 | Complex Method |
Quality Gate Profile: Pay Down Tech Debt
Install CodeScene MCP: safeguard and uplift AI-generated code. Catch issues early with our IDE extension and CLI tool.
⚡ Engine Benchmark Results
Compared against base branch. 🟢 >10% faster · ⚪ within 10% · 🔴 >10% slower · Fails at >70% regression. |
size-limit report 📦
|
⚡ Lighthouse Results
Median of 3 runs. 🟢 ≤75% of limit · 🟠 within limit · 🔴 over limit · 🚫 merge-blocking · |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Redesigns
/revealsinto an immersive six-ink set tracker for Set 13 (Attack of the Vine!), replacing the old franchise-grid view, and populates the set with 105 revealed cards and full art.What changed
Tracker view (new default)
RevealHero: set logo over a countdown panel (days to pre-release, release date) and a revealed/total + new-franchises panel.slot = number - ink base), leaving fallback glyphs for unrevealed numbers, with a "COLOR COMPLETE" ribbon at 34.Franchise cards modal
Card-art pipeline
convert-preview-imagesauto-rotates landscape location scans 270deg before the portrait resize; the prod build'scopyPreviewAvifscopies the AVIFs byte-for-byte, so the baked rotation carries to production.Set 13 data
Cleanup
Hero,FranchiseTier,ViewToggle, andscatter.Testing
reveals-page.spec.tsrewritten for the tracker + modal (5 desktop pass, 1 mobile runs on the mobile projects);E2E_TESTS.mdupdated.Phases
Phase 0 (data layer) -> Phase 1 (visual primitives) -> Phase 2 (tracker view) -> Phase 3 (new-franchises) -> Phase 4 (this): wiring + Set 13 data.
Out of scope / follow-ups
Closes #390.