FAR UI: tab-per-resource-type redesign#92
Merged
Conversation
- Card list with Fuse.js fuzzy search and match highlighting - Tag chips (#system/#direct/#transitive + lowercased package type), autofocus, keyboard nav, debounced URL sync (q + tags), pin/favorites - Item view: name + version, description (description/author/title fallback), tags - Fix virtualizer row overlap on filtering via getItemKey (FHIR packages + resource types browsers)
Redesign the package detail page to mirror the resource-types list UX: one tab per resource type present in the package (driven by the new list-package-resource-types RPC), plus the existing Package Info tab. Per-tab content uses get-package-entities (search-canonical underneath) with a virtualized list, infinite scroll, keyboard navigation, search input with magnifying glass, and the same card layout as the resource types screen (name/title/id, description/url, per-type + status tags). The card layout includes per-resource-type tag fields (type/derivation for StructureDefinition, base for SearchParameter) plus a common status tag. Tags are clamped to a single line with overflow hidden. The browser/import-package screens get matching max-width containers to align with the redesigned detail page.
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.
Summary
Two-step redesign of the IG / FHIR-packages screens to match the Resource Browser UX.
/ig) and add-package screen moved to the 990px centred container and the card layout used by the Resource Browser (title, description, tags), replacing the dense table on/ig/<package>.aidbox.introspector/list-package-resource-typesRPC) plus the existing Package Info tab. The legacy single "Canonicals" tab is gone.get-package-entities(search-canonicalunderneath) with the same UX as the Resource Browser:url(backed by the new multi-tokenurl:containshandler in FAR).useInfiniteQuery, 50 per page).name || title || id,description || url, tags.statussuffix:StructureDefinition→type,derivation,statusSearchParameter→base[],statusstatusTab order is curated on the backend (StructureDefinition → SearchParameter → ValueSet → CodeSystem → ConceptMap → NamingSystem → TerminologyCapabilities → others alphabetically), so deep-link
?tab=...is stable.FHIRSchema/ImplementationGuideare intentionally excluded.Initial render no longer flashes the wrong tab — we wait for the resource-types query before mounting
<Tabs>.Companion backend changes: HealthSamurai/box
#6320(list-package-resource-typesRPC + multi-tokenurl:contains).Test plan
/u/igshows the card list with the 990px container./u/ig/addshows the same container.hl7.fhir.us.core#7.0.0—StructureDefinition,ValueSet,CodeSystem), noFHIRSchema/ImplementationGuide.?tab=ValueSet&q=racerestores state.StructureDefinitioncards showtype,derivation,statustags;SearchParametercards show one tag perbaseplusstatus.