feat(catalogs): faceted discovery for examples and environments - #313
Open
sanketsudake wants to merge 1 commit into
Open
feat(catalogs): faceted discovery for examples and environments#313sanketsudake wants to merge 1 commit into
sanketsudake wants to merge 1 commit into
Conversation
Make the /examples and /environments catalogs faster to search by exposing the discovery axes their data already contains, instead of a single language dropdown + free-text search. Examples: - Replace the language dropdown with a chip-based facet bar across three axes: Language (from each group's language field), Trigger (HTTP / Message Queue / WebSocket) and Level (Starter / Application / Spec). - Trigger and Level are derived from the existing tags via a curated TAG_FACETS map in the page script — no examples.json schema change and no tools/examples.py change, so it survives catalog regeneration. - Multi-select within a facet (OR), AND across facets. Adds a Clear all; keeps search, live aria-live count, empty state, group-by-language. Environments (light touch, thin metadata): - Same chip toolbar for consistency: language chips + a single "Has builder image" capability toggle. Keeps search and live count. Chips reuse the design-system pill palette via a new .catalog-facets SCSS namespace (no inline styles). Documented the facet map in the update-examples-catalog skill. Verified in-browser: filter counts match the data (e.g. Message Queue = 12, Go + Starter = 1), AND/OR semantics, empty state, and Clear all all correct; environments builder-only = 14 images across 12 envs. Pinned Hugo build (0.157.0 --minify --gc) passes, 567 pages, no warnings. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
✅ Deploy Preview for fission-website ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
Tick the box to add this pull request to the merge queue (same as
|
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.
What
Makes the
/examples/and/environments/catalogs faster to search by exposing the discovery axes their data already contains — instead of a single language dropdown + free-text search. Goal: treat the catalogs as lookup tools (Tufte: enable comparison, show the choices).Why
examples.jsontags already encode three axes — language, trigger (message queue trigger,keda,kafka,websocket…), and level (hello world,application,spec) — but the UI only exposed language. Someone wanting "all message-queue examples" or "just the starters" had to guess a search term.Examples page
languagefield (replaces the dropdown).TAG_FACETSmap in the page script — noexamples.jsonschema change and notools/examples.pychange, so it survives catalog regeneration from upstreamfission/examples.aria-livecount, empty state, and group-by-language layout.Environments page (light touch)
Thin metadata (language + has-builder), so: same chip toolbar for consistency — language chips + a single "Has builder image" capability toggle. Keeps search and live count.
Styling & maintainability
.catalog-facetsSCSS namespace — no inline styles.update-examples-catalogskill so new upstream tags get slotted into a facet.Verification (in-browser, against the built site)
Pinned Hugo build (
0.157.0 extended --minify --gc) passes: 567 pages, no path warnings. No console errors from the page (the onedocsearchexception is the pre-existing Docsy/Algolia widget, unrelated).Screenshots
Desktop verified for both pages (default view, active filters, empty state). Layout is responsive via
flex-wrapfacet rows + the existing Bootstrap mobile grid.🤖 Generated with Claude Code