Skip to content

Migrate catalog card source to the v2 search surface#623

Open
habdelra wants to merge 4 commits into
mainfrom
cs-11587-catalog-search-codemod
Open

Migrate catalog card source to the v2 search surface#623
habdelra wants to merge 4 commits into
mainfrom
cs-11587-catalog-search-codemod

Conversation

@habdelra

Copy link
Copy Markdown
Contributor

Moves catalog card source off the deprecated @context.prerenderedCardSearchComponent and onto the v2 @context.searchResultsComponent (<SearchResults>) surface, via the @context search codemod (from the boxel repo) plus hand-fixes for the shapes it can't transform mechanically.

Codemod-migrated

  • components/grid.gts, blog-app/blog-post.gts, and the reader-view / theme-picker searches in blog-app/blog-app.gts — the v1 query is adapted through searchEntryWireQueryFromQuery, <:response> becomes {{#each results.entries}}, and rows are addressed by id.

Hand-migrated (shapes the codemod leaves alone)

  • components/card-list.gts — yields each row to a :meta block; the dynamic @format binds through the query's htmlQuery field.
  • catalog-app/components/grid.gts — hands each row to <CardWithHydration> and branched on result count; now renders entries / loading skeleton / no-results explicitly.
  • catalog-app/components/category-filter-group.gts — the query is a per-sphere {{#each}} block value, adapted inline via a searchQueryForSphere helper.
  • catalog-app/components/tag-filter-group.gts — the result list is wrapped in markup rather than a bare {{#each}}.
  • blog-app/blog-app.gts — the library-posts search hands its list to wrapping markup; its <CardList> :meta consumer now reads the row id.

Consumer

  • catalog-app/components/card-with-hydration.gts — now takes a RenderableSearchEntryLike and addresses the row by id.

Where a search yields to children or has a skeleton/empty state, the list renders once results.entries is present (stale entries persist across a live re-fetch) and the loading affordance shows only on the empty initial load.

Verification

  • Every changed .gts transpiles through the realm's own gjsToPlaceholderJS + babel lowering.
  • glint type-checks the v2 usage clean (run against the experiments-realm project, which resolves the shared @cardstack/* + base types).
  • Formatted with the repo's prettier + ember-template-tag config.

Part of the unified-search Phase 1 codemod sweep across the first-party realms.

Move catalog card source off the deprecated
`@context.prerenderedCardSearchComponent` and onto the v2
`@context.searchResultsComponent` (`<SearchResults>`), via the `@context`
search codemod plus hand-fixes for the shapes it can't transform mechanically.

Codemod-migrated:
- `components/grid.gts`, `blog-app/blog-post.gts`, and the reader-view / theme
  searches in `blog-app/blog-app.gts` — the v1 query is adapted through
  `searchEntryWireQueryFromQuery`, `<:response>` becomes
  `{{#each results.entries}}`, and rows are addressed by `id`.

Hand-migrated (shapes the codemod leaves alone):
- `components/card-list.gts` — yields each row to a `:meta` block; the dynamic
  `@format` binds through the query's `htmlQuery` field.
- `catalog-app/components/grid.gts` — hands each row to `<CardWithHydration>`
  and branched on result count; now renders entries / loading skeleton /
  no-results explicitly.
- `catalog-app/components/category-filter-group.gts` — the query is a per-sphere
  `{{#each}}` value, adapted inline via `searchQueryForSphere`.
- `catalog-app/components/tag-filter-group.gts` — the result list is wrapped in
  markup rather than rendered as a bare `{{#each}}`.
- `blog-app/blog-app.gts` — the library-posts search hands its list to wrapping
  markup; its `<CardList>` `:meta` consumer reads the row `id`.

Consumer:
- `catalog-app/components/card-with-hydration.gts` — now takes a
  `RenderableSearchEntryLike` and addresses the row by `id`.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Copilot AI review requested due to automatic review settings June 19, 2026 14:13
Comment thread blog-app/blog-app.gts Outdated
Comment thread blog-app/blog-app.gts Outdated
Comment thread blog-app/blog-app.gts Outdated
Comment thread blog-app/blog-app.gts Outdated
Rename the codemod-generated searchResultsQuery* getters to describe the query
they wrap: picksSearchQuery, latestSearchQuery, themeSearchQuery,
libraryPostsSearchQuery.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@habdelra habdelra requested a review from a team June 19, 2026 14:19

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Migrates catalog/blog UI components from the deprecated @context.prerenderedCardSearchComponent to the v2 @context.searchResultsComponent (<SearchResults>) surface by adapting v1 Query inputs into v2 SearchEntryWireQuery and updating templates to iterate results.entries keyed by id.

Changes:

  • Replaced prerendered search component usage with v2 search results yielding (as |results|) and results.entries.
  • Added searchEntryWireQueryFromQuery adapters (plus realms and htmlQuery format bindings where needed).
  • Updated consumers to treat rows as RenderableSearchEntryLike and use id instead of url.

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 10 comments.

Show a summary per file
File Description
components/grid.gts Switches to v2 search results component and iterates results.entries.
components/card-list.gts Switches to v2 search; yields RenderableSearchEntryLike to :meta; binds format via htmlQuery.
catalog-app/components/tag-filter-group.gts Switches tag pills to v2 search results and uses id addressing.
catalog-app/components/grid.gts Switches listing grid to v2 search results with explicit entries/loading/empty rendering.
catalog-app/components/category-filter-group.gts Switches per-sphere category lists to v2 search results with inline query adaptation.
catalog-app/components/card-with-hydration.gts Updates hydration wrapper to accept RenderableSearchEntryLike and address rows by id.
blog-app/blog-post.gts Switches theme picker search to v2 search results and uses id.
blog-app/blog-app.gts Switches multiple searches (picks/latest/theme/library) to v2 search results and updates :meta consumer to use id.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread components/grid.gts Outdated
Comment thread components/card-list.gts Outdated
Comment thread blog-app/blog-post.gts Outdated
Comment thread blog-app/blog-app.gts Outdated
Comment thread blog-app/blog-app.gts Outdated
Comment thread blog-app/blog-app.gts Outdated
Comment thread catalog-app/components/card-with-hydration.gts
Comment thread blog-app/blog-app.gts Outdated
Comment thread blog-app/blog-app.gts Outdated
Comment thread catalog-app/components/category-filter-group.gts
habdelra and others added 2 commits June 19, 2026 10:38
- Type the blog query getters as `Query` (annotation) instead of casting at
  the call site; inline `latestQuery`'s `eq` so its values are `JSONValue`.
- Render search results immediately and show the loading affordance only on
  the empty initial load — a live re-fetch keeps the previous entries — to
  match the hand-migrated components. The sphere filter likewise keeps its UI
  during a re-fetch instead of collapsing to a skeleton.
- card-with-hydration: card ids never carry a file extension, so drop the
  `removeFileExtension` stripping and compare the id directly.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
CodeRef.module is a branded RealmResourceIdentifier, so the hand-written
themeQuery code refs need rri() (codeRef() already brands the others). This
clears the lint:types CodeRef-module type error.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@habdelra habdelra requested a review from a team June 19, 2026 15:20
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants