Jean-Luc Makiola
6c76dbbee3
Phase 29 Image Presentation verified and marked complete. 14/14 must-haves passed. Next: Phase 30 Onboarding Redesign. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2.4 KiB
2.4 KiB
phase, status, verified
| phase | status | verified |
|---|---|---|
| 29 | passed | 2026-04-12 |
Phase 29: Image Presentation — Verification
Goal
Images display within the fixed aspect ratio using fit-within framing (letterbox/pillarbox) instead of hard crops, preserving the full image.
Must-Haves Verification
| # | Must-Have | Status | Evidence |
|---|---|---|---|
| 1 | GearImage component with object-contain | PASS | src/client/components/GearImage.tsx contains object-contain |
| 2 | All 12 gear surfaces use GearImage | PASS | object-cover only in GearImage internal, ProfileSection, users avatar |
| 3 | Dominant color background fill | PASS | imageContainerBg() helper used in all parent containers |
| 4 | dominantColor field on items, globalItems, threadCandidates | PASS | 3 occurrences of dominant_color in schema.ts |
| 5 | Crop fields on all 3 tables | PASS | cropZoom, cropX, cropY on items, globalItems, threadCandidates |
| 6 | Upload endpoints return dominantColor | PASS | Both POST routes return dominantColor |
| 7 | Zod schemas accept new fields | PASS | 3 schemas updated |
| 8 | Zoom+pan editor component | PASS | ImageCropEditor.tsx with react-easy-crop |
| 9 | Editor in ImageUpload | PASS | Shows after upload when onCropChange provided |
| 10 | "Adjust framing" on item detail | PASS | Button renders when image exists |
| 11 | "Adjust framing" on candidate detail | PASS | Button renders when image exists |
| 12 | Backfill migration script | PASS | scripts/backfill-dominant-colors.ts |
| 13 | Build passes | PASS | bun run build succeeds |
| 14 | Lint passes | PASS | bun run lint — 0 issues |
Score: 14/14
Human Verification Items
- Visual quality: Upload images of various aspect ratios (portrait, landscape, square) and verify letterbox/pillarbox backgrounds look intentional with dominant color fill
- Crop editor UX: Open item detail, click "Adjust framing", verify zoom slider and drag-to-pan work smoothly
- Cross-surface consistency: View the same image on ItemCard, item detail, and candidate card — verify framing is consistent
Notes
- Database migration generated but db:push deferred (no database accessible in dev environment). Must run
bun run db:pushbefore deployment. - Global item detail "Adjust framing" skipped — no update endpoint exists for global items.
- Pre-existing test failures (311 fails) unrelated to this phase —
setup_itemsrelation issues in pglite test setup.