mirror of
https://github.com/discourse/discourse.git
synced 2026-08-01 17:18:15 -05:00
The Horizon theme's topic card system relied on inspecting
`router.currentRouteName` to decide when to apply card styling. This
was fragile — the theme was coupled to internal routing details — and
made it impossible to scope card behavior per-list (e.g. showing simple
cards for suggested topics but high-context cards on discovery).
This PR introduces a `listContext` string prop that flows through the
topic list component tree, replacing all route-name checks with explicit
context values.
## What changed
### Core: `listContext` prop threading
Every topic list call site now passes an explicit context string
(`"discovery"`, `"suggested"`, `"related"`, `"group-activity"`,
`"user-activity"`, `"messages"`, `"assigned"`). The prop flows from
the call site through `BasicTopicList` → `TopicList` → `Item` and into
all value transformers (`topic-list-class`, `topic-list-columns`,
`topic-list-item-class`, `topic-list-item-style`,
`topic-list-item-mobile-layout`) and the `topic-list-item-click`
behavior transformer.
This lets the theme decide card behavior based on semantic context
rather than route names, and means the theme no longer needs to
`container.lookup("service:router")`.
### Horizon initializer rewrite
- Replace `isHighContextRoute(router.currentRouteName)` with
`isTopicCardContext(listContext)` checks using two declarative arrays:
`TOPIC_CARD_CONTEXTS` and `SIMPLE_CARD_CONTEXTS`.
- Register a `topic-list-class` transformer that adds `--d-topic-cards`
to topic lists in card contexts.
- Suggested/related lists always get the simple card layout, even when
high-context mode is enabled.
- Preserve the `bulk-select` column in high-context layout (its item
cell is hidden by existing CSS) so the header toggle icon renders.
- Set `header: HeaderTopicCell` on the high-context-card column so the
bulk action buttons ("Select All" / "Clear All") appear in the header.
### CSS scoping and cleanup
- **Topic card styles** scoped to `.topic-list.--d-topic-cards` instead
of applying globally to `.topic-list-body`, preventing style leakage
into messages and other non-card lists.
- **Badge category colors** consolidated into CSS custom properties
(`--badge-category-bg`, `--badge-category-text`) on
`.badge-category__wrapper`, replacing 6 repeated
`light-dark(oklch(...))` expressions across 3 files.
- **Messages page**: removed the 72-line `body.user-messages-page`
override block. Messages get `listContext="messages"` which is not a
card context, so they use default rendering. Desktop bulk-select and
header overrides scoped with `body:not(.user-messages-page)`.
- **Bulk select in high-context cards**: fixed checkbox centering,
selected-state background (removed override that reset it to
`--secondary`), sticky header `z-index`, and `max-width: unset` on
header cells at small viewports.
- **Removed** `color-exploration.scss` (unused sidebar color vars),
`excerpt-expanded` grid area styles, hardcoded `#e45735` (now
`var(--danger)`).
- **Renamed** `has-replies` → `--has-replies` for BEM consistency.
### Other fixes
- Extract `getTopicStatusBadge()` into shared utility, fixing
inconsistency where `topic-status-column` only checked `topic.pinned`
but the high-context card checked both `pinned` and `pinned_globally`.
- Fix `topic-list-item-mobile-layout` transformer to properly return
`value` for non-card contexts (was returning `undefined`).
- Fix `hasReplies` to use `replyCount > 0` instead of `posts_count > 1`.
- Typo fix in `chat.scss`.
---------
Co-authored-by: chapoi <101828855+chapoi@users.noreply.github.com>