fix: link collection source avatars, and fix profile horizontal strips

[tsahimatsliah]

Changes

Two unrelated bug fixes.

1. Collection/brief source avatars are not clickable

Article cards render their source avatar through SourceButton → ProfileImageLink, i.e. a real <a href={source.permalink}>. The collection and brief stacks rendered a bare <img> inside a div, so clicking a source circle fell through to the card's post link instead of going to the source.

• New SourceAvatarLink (components/profile/source/SourceAvatarLink.tsx) — a forwardRef anchor wrapping SourceAvatar, pointing at source.permalink (correct for squads too, whose permalink is /squads/…, not /sources/…). forwardRef is required because Radix's HoverCard.Trigger asChild clones it, so the existing hover cards keep working. Falls back to a bare avatar when the source has no permalink.
• Wired into CollectionSourceStack (collection grid + list cards, brief card) and CollectionPillSources (brief card, brief/digest post pages).
• POST_BY_ID_QUERY / POST_BY_ID_STATIC_FIELDS_QUERY only selected collectionSources { handle image }, so post-page avatars had no URL to link to — added name and permalink. The feed fragment already selected both.

No double navigation: the card's own link is an absolute inset-0 sibling overlay and Card.module.css gives descendant anchors z-index: 1, so the avatar wins — the same mechanism article cards already rely on.

2. Achievement showcase makes the whole profile page scroll horizontally

ProfileAchievementShowcase rendered its tiles as a plain flex gap-3 of shrink-0 64px items. A full showcase (5 tiles = 368px) is wider than the content column at mobile widths, and with nothing clipping it the overflow propagated to the document — the entire profile page scrolled sideways.

• The strip is now no-scrollbar … overflow-x-auto (the pattern already used by ArchiveEntryCard, RelatedEntities, SquadsList), plus min-w-0 on the section root. No overflow: hidden anywhere on the page — only the strip scrolls.
• overflow-x-auto clips both axes, which would have cut the rarity glow and RaritySparkles that deliberately escape each tile. px-2 py-2 gives them room and -mx-2 -my-2 cancels it, so nothing shifts visually.

3. Horizontal strips clip short of the page edge

The profile page wraps every section in p-6, so each horizontally scrolling strip clipped 24px short of the page edge — the content read as abruptly cut off rather than continuing off-screen. Measured on the preview at 390px, all three strips ended at x=373/365 against a 390px viewport.

New profileStripBleed (features/profile/common.ts) cancels that padding and re-applies it inside the scroll container, so a strip clips at the card edge while its items stay aligned with the section heading. Applied to:

• ProfileAchievementShowcase — the showcase strip.
• Activity → HORIZONTAL_FEED_CLASSES — the posts/upvoted feed, scoped to the feed's own .grid scroll container, plus scroll-px-6 so snapped cards still align with the heading. Activity's overflow-hidden guard is removed: the feed grid scrolls itself, and the guard would have clipped the bleed straight back.
• ProfileWidgets — the mobile "Highlights" row, reset with laptop:mx-0 laptop:px-0 because at laptop the same component is the sidebar column, not a strip.

Events

No new tracking events.

Experiment

No new experiments.

Manual Testing

Measured the old vs. new markup against the app's compiled CSS at 375px: the old markup gives the container a scrollWidth of 392 against a 375px viewport (the reported bug); the new markup stays at 375 with the strip itself scrolling (343px visible / 384px content) and the hidden scrollbar taking 0 height.

The profile page can't be loaded on a local dev server — /joudawad is SSG and fails on "Failed to load static props" without the backend — so the layout was verified on the preview deploy instead. Still worth a click-through on a collection card's source circles.

On the preview deploy at 390px, all three strips now span x=1→389 (the full card width) with the page itself still not scrolling horizontally (document.scrollWidth 390 = viewport). At 1280px the activity feed spans the card's inner edges (175→845) and the sidebar widgets are unchanged (862→1146, margin/padding 0).

• Added a CollectionGrid test asserting the avatar renders as an <a href> to the source permalink.
• packages/shared: 39 suites / 235 tests pass (cards + post).
• packages/webapp: 44 suites / 297 tests pass.
• ESLint clean; scripts/typecheck-strict-changed.js clean.

🤖 Generated with Claude Code

Preview domain

https://claude-source-images-achievement.preview.app.daily.dev

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
daily-webapp	Ready	Preview	Jul 29, 2026 6:18am

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
storybook	Ignored		Jul 29, 2026 6:18am

[capJavert]

First-pass review is clear: I found no blocking code issue, and the current CI checks are green. Holding the formal approval for the final reviewer.

[capJavert]

Approved after first-pass review; no blocking code issues found and CI was green.