Summary
Build a clean, intuitive faceted search UI on top of the Typesense-backed search. Users should be able to narrow results by clicking filters in a sidebar — the way Addgene's catalog works. The look-and-feel target: natural to use, not visually busy, facets auto-populate from the data (no hardcoded lists).
Design principles
Addgene-like layout
Auto-populated: every facet value + its count comes from the backend (Typesense facet_by), never hardcoded. New data → facets update automatically.
Not busy: collapsible facet groups; show the top ~8 values per facet with a "Show more"; hide facets that have no values for the current result set; counts update as filters are applied.
Live: selecting/clearing a facet updates results and the other facets' counts without a full page reload.
What a "facet" is here
A facet = a field you can filter by, shown as a list of values with counts, e.g.:
Type
☐ ComponentDefinition (104,275)
☐ Sequence (93,660)
☐ ModuleDefinition (13,016)
☐ Collection (8,569)
Role (SO term)
☐ Promoter (…)
☐ CDS (…)
...
Backend prerequisites (coordinate with @cl117 — small, do first)
Currently only type and graph are facet-enabled in the Typesense part collection. Before/alongside this issue:
Enable facet: true on role and sboltype (and confirm type, graph/collection which are already on).
(For a length facet) add a numeric length field to the index + decide bucket ranges (e.g. <100, 100–500, 500–2000, >2000 bp). If length isn't ready, ship the categorical facets first and add length later — don't block on it.
Milestone 1 — Core faceted browsing
Where to build it
Build as a standalone demo page served by SBOLExplorer (extend [flask/templates/index.html]/ the /test route) that calls the Typesense-backed /search. Production integration into SynBioHub's UI stays with the team — keep your component self-contained so it can be ported.
Deliverables
- The faceted search page
- A short README: how facets map to Typesense fields, how to add a new facet.
- A screen recording / screenshots for the paper's UI figure.
Acceptance criteria
Facets auto-populate from live data (verified by adding a doc and seeing counts change).
Selecting/clearing facets updates results + counts live, no full reload.
Clean Addgene-like layout; uncluttered; no hardcoded facet values anywhere.
Reference
Addgene catalog faceting: https://www.addgene.org/search/catalog/plasmids/
Typesense faceting: facet_by, facet_query, max_facet_values, filter_by.
Note:
It has a real backend dependency — role/sboltype aren't facet-enabled yet and there's no length field.
Summary
Build a clean, intuitive faceted search UI on top of the Typesense-backed search. Users should be able to narrow results by clicking filters in a sidebar — the way Addgene's catalog works. The look-and-feel target: natural to use, not visually busy, facets auto-populate from the data (no hardcoded lists).
Design principles
Addgene-like layout
Auto-populated: every facet value + its count comes from the backend (Typesense facet_by), never hardcoded. New data → facets update automatically.
Not busy: collapsible facet groups; show the top ~8 values per facet with a "Show more"; hide facets that have no values for the current result set; counts update as filters are applied.
Live: selecting/clearing a facet updates results and the other facets' counts without a full page reload.
What a "facet" is here
A facet = a field you can filter by, shown as a list of values with counts, e.g.:
Type
☐ ComponentDefinition (104,275)
☐ Sequence (93,660)
☐ ModuleDefinition (13,016)
☐ Collection (8,569)
Role (SO term)
☐ Promoter (…)
☐ CDS (…)
...
Backend prerequisites (coordinate with @cl117 — small, do first)
Currently only type and graph are facet-enabled in the Typesense part collection. Before/alongside this issue:
Enable facet: true on role and sboltype (and confirm type, graph/collection which are already on).
(For a length facet) add a numeric length field to the index + decide bucket ranges (e.g. <100, 100–500, 500–2000, >2000 bp). If length isn't ready, ship the categorical facets first and add length later — don't block on it.
Milestone 1 — Core faceted browsing
✅ Exit: a user can type rbs, then click Type = ComponentDefinition and Role = …, and see the list narrow with correct counts.
Milestone 2 — Polish to the Addgene bar
Where to build it
Build as a standalone demo page served by SBOLExplorer (extend [flask/templates/index.html]/ the /test route) that calls the Typesense-backed /search. Production integration into SynBioHub's UI stays with the team — keep your component self-contained so it can be ported.
Deliverables
Acceptance criteria
Facets auto-populate from live data (verified by adding a doc and seeing counts change).
Selecting/clearing facets updates results + counts live, no full reload.
Clean Addgene-like layout; uncluttered; no hardcoded facet values anywhere.
Reference
Addgene catalog faceting: https://www.addgene.org/search/catalog/plasmids/
Typesense faceting: facet_by, facet_query, max_facet_values, filter_by.
Note:
It has a real backend dependency — role/sboltype aren't facet-enabled yet and there's no length field.