Skip to content

refactor: move sort options into separate SortMenu component - #1

Merged
maryLLay merged 2 commits into
maryLLay:sorting_optionsfrom
JaneliaSciComp:sort-menu-component
Oct 5, 2026
Merged

maryLLay merged 2 commits into
maryLLay:sorting_optionsfrom
JaneliaSciComp:sort-menu-component

Conversation

@allison-truhlar

@allison-truhlar allison-truhlar commented Sep 14, 2026 •

Copy link
Copy Markdown

Suggested follow-up to JaneliaSciComp#331. Merge if you like it, or take what's useful.

What changed

  • Sort options move out of FilterMenu into a new SortMenu component, rendered below the filter menu on md size and larger screens with its own title and Reset button.
  • On small screens, sort is an MUI Select beside the "Filter by tag" button. The drawer holds tag filters only. "No sorting" acts as the reset.
  • "Filter by tag" title now shows in the drawer, and the sidebar gaps between Search, Filter, and Sort are equal on md+.
  • Sort options no longer render on the ecosystems page, where they weren't wired to anything. This makes the comment on PR Sorting options JaneliaSciComp/ossi-website#331 related to this moot.

Verified

npm run build passes. Checked layout in Chrome at 412px and desktop widths.

For awareness: @krokicki

The sort options lived inside FilterMenu, which coupled them to the
tag-filter drawer on small screens and made the sidebar spacing
inconsistent with SearchInput. SortMenu now renders standalone on the
projects page, matching the SearchInput and FilterMenu pattern: a
title, a Reset button, and the option list.

On small screens the drawer stays tag-filters only. Sort becomes an
MUI Select beside the "Filter by tag" button, reusing the Select and
Option primitives from ProjectTypeDropdown for consistent styling.
The "No sorting" option acts as the reset there, so no separate
button is needed.

The ecosystems page never wired up sortedTitlesMap, so the sort
options that previously rendered there did nothing. They no longer
render on that page.
The "Filter by tag" heading and Reset button were hidden below the md
breakpoint, so the drawer had no label. The header now shows on all
screen sizes.

On md+ the header top padding and the empty bottom button row added
extra height, so the gap between the filter list and the sort menu
didn't match the gap between the search input and the filter list.
Both gaps are now 32px.
@maryLLay
maryLLay merged commit ced0d05 into maryLLay:sorting_options Oct 5, 2026
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.

2 participants