Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

On Browse Page Organize Listed Problems By Alphabetical Only

Open Beginner friendly
#340 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
70/100
Issue type
Feature
Clarity
Mostly clear
Activity status
Active
Tech stack
javascript
Domain
frontend

Research direction

Explore the repository to find the browse page component and the list of problems. Look for where the problems array is rendered and add alphabetical sorting, either by modifying the existing sort order or adding a new sort function. Test the change by running the application and verifying the problems list displays in alphabetical order.

Written by the indexing model from the issue text.

Description

Summary

On the Browse page (/browse), list the problem cards in alphabetical order only (A to Z), instead of grouping them by complexity class first.

Background

  • Browse page: the page with filter checkboxes on the side and a grid of problem cards.
  • Complexity class: the tag on each problem such as P, NP-Complete, NP-Hard, or a quantum class (BQP, QMA, ...).
  • Current order: cards are sorted by complexity class first, classical then quantum, low to high (P, NP, NP-Complete, NP-Hard, then the quantum classes). Within one class they are alphabetical. That order was added on purpose in #193 (closed); this issue asks to replace it.

Where

Redux_GUI, default branch ReduxAPI_GUI:

  • components/hooks/ProblemFilters/useProblemFilters.js, lines 135-141: the sort (complexityClassRank, then a.localeCompare(b)).
  • pages/browse/index.js: renders filteredProblems as ProblemCards.
  • The same hook also feeds the main page's problem dropdown (components/pageblocks/ProblemRowReact.js). That dropdown re-sorts its options itself (SearchBarExtensible's groupBy / groupOrder), so changing the hook's sort should not change the dropdown. Check that it doesn't.

Done when

  • Browse cards are in alphabetical order regardless of complexity class, with and without filters applied.
  • The main page's problem dropdown keeps its current order.
  • A test checks the new order (tests/e2e/browse.spec.js covers Browse but doesn't check order today).

Status

Not started; no PR. Filed with only a title (Oct 5).

Open questions

  • Alphabetical by the name shown on the card (displayName) or by the internal problem name? Today's tiebreak compares the internal name.
  • Should the Complexity Class filter's own option order (classical then quantum, from #195) stay as it is? This issue is only about the result cards.

Related

  • #193: added the current classical-then-quantum order for the results.
  • #195: the same order for the Complexity Class filter options.
  • #286: tracker for Browse and Home tags and filters.
Dominant language
JavaScript
Stars
3
Forks
18
Avg merge
1d 3h
Merged PRs (30d)
35

Getting set up

Open in Codespaces

Starts the project's dev container in your browser, under your own GitHub account.

  • Ships a Dockerfile or Docker Compose file
  • Has a pull request template
  • No contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from ReduxISU/Redux_GUI

All issues in ReduxISU/Redux_GUI

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.