Skip to content

feat: improve YearHistogramSlider empty/loading states and add to mobile filters#862

Draft
thostetler wants to merge 7 commits intoadsabs:masterfrom
thostetler:feat/year-histogram-mobile-and-empty-states
Draft

feat: improve YearHistogramSlider empty/loading states and add to mobile filters#862
thostetler wants to merge 7 commits intoadsabs:masterfrom
thostetler:feat/year-histogram-mobile-and-empty-states

Conversation

@thostetler
Copy link
Copy Markdown
Member

The year histogram had no meaningful state when data was unavailable, and was missing from the mobile filters drawer entirely.

  • Show a spinner during search loading instead of falling through to the empty layout
  • Show a centered "No data" placeholder when search completes with no histogram data
  • Add showExpand prop to hide the expand button in contexts where it is not useful
  • Add the histogram to the mobile filters drawer with appropriate sizing and no expand button
  • Exclude /v1 from the Next.js middleware matcher so the API proxy rewrite is not intercepted during local network development

thostetler added 7 commits May 4, 2026 20:10
SCIX-871 test: add searchStatus facet gating integration tests

SCIX-871 feat: gate facets on searchStatus to prevent stale data after empty/failed searches

SCIX-871 fix: drive searchStatus from search page to gate facets

SCIX-871 perf: use useLayoutEffect to start facets in same frame as search results
SCIX-871 fix: use varied two-column skeleton rows in facets during search loading

SCIX-871 fix: use spinner instead of skeleton rows in facets during search loading
- Replace useLayoutEffect with useIsomorphicLayoutEffect (falls back to
  useEffect on the server) to eliminate the React SSR warning that fires
  when useLayoutEffect is used on a server-rendered page.
- Move setQuery/submitQuery inside the numFound > 0 branch so empty-result
  searches do not open a Sentry performance span that can never close
  (providers.tsx only closes spans when docs.current is non-empty).
NumFound's SortStats sub-component and YearHistogramSlider both read
latestQuery directly and fire API requests even when the main search
has errored, showing stale data from the previous query. Gate both
on searchStatus === 'success' so they stay quiet until the search
completes successfully.
enabled:false stops new requests but React Query keeps the cached
data in memory. Gate histogramData derivation on searchStatus so
the stale histogram clears immediately when the search transitions
away from success.
…ile filters

- Show HistogramSliderLoader spinner during search loading instead of
  falling through to the no-data state
- Show a centered "No data" placeholder when search completes with no
  histogram data, replacing the collapsed empty layout
- Add showExpand prop to optionally hide the expand button
- Add YearHistogramSlider to the mobile filters drawer
- Exclude /v1 from Next.js middleware matcher so API proxy rewrites
  are not intercepted during local network development
@codecov
Copy link
Copy Markdown

codecov Bot commented May 5, 2026

Codecov Report

❌ Patch coverage is 52.00000% with 36 lines in your changes missing coverage. Please review.
✅ Project coverage is 62.6%. Comparing base (5a4245b) to head (870789a).

Files with missing lines Patch % Lines
src/components/SearchFacet/YearHistogramSlider.tsx 5.6% 34 Missing ⚠️
src/test-utils.tsx 91.4% 1 Missing and 1 partial ⚠️
Additional details and impacted files
@@           Coverage Diff            @@
##           master    #862     +/-   ##
========================================
- Coverage    62.7%   62.6%   -0.0%     
========================================
  Files         323     323             
  Lines       38011   38049     +38     
  Branches     1723    1722      -1     
========================================
+ Hits        23802   23808      +6     
- Misses      14169   14201     +32     
  Partials       40      40             
Files with missing lines Coverage Δ
src/components/SearchFacet/store/FacetStore.ts 85.9% <100.0%> (ø)
src/components/SearchFacet/useGetFacetData.ts 76.7% <100.0%> (+0.3%) ⬆️
src/middleware.ts 91.9% <100.0%> (ø)
src/store/slices/search.ts 91.6% <100.0%> (+0.6%) ⬆️
src/test-utils.tsx 89.2% <91.4%> (+0.2%) ⬆️
src/components/SearchFacet/YearHistogramSlider.tsx 25.0% <5.6%> (-2.9%) ⬇️

... and 4 files with indirect coverage changes

🚀 New features to boost your workflow:
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

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.

1 participant