Skip to content

Fix timeframe sorting dropdown not reloading page - #587

Closed
ahmedsicp wants to merge 1 commit into
redlib-org:mainfrom
ahmedsicp:fix/timeframe-sorting
Closed

ahmedsicp wants to merge 1 commit into
redlib-org:mainfrom
ahmedsicp:fix/timeframe-sorting

Conversation

@ahmedsicp

Copy link
Copy Markdown

What

When visiting a subreddit and sorting by Top or Controversial (such as /r/reddit/top), picking an option from the timeframe dropdown (Hour, Day, Week, Month, Year, All) does not reload the page or update the URL to ?t=<timeframe>. Users currently have to manually click the tiny arrow submit button next to the dropdown for the timeframe filter to apply.

Root cause

  1. The <select id="timeframe"> dropdown had no change event listener or onchange handler, so choosing an option only mutated the <select> value in the DOM without submitting the parent form.
  2. The <form id="sort"> did not specify an explicit method="get" and action attribute pointing to the active sort listing (/r/{sub}/top or /top).
  3. Redlib's Content Security Policy (script-src 'self' blob:;) disallows inline script execution, so inline onchange="..." handlers alone are blocked by the browser unless accompanied by a script served from 'self'.

Changes

  • CSP-compliant client script (static/sort.js): Added a small script registered in src/main.rs as /sort.js and loaded with defer in templates/base.html. It listens for change events on #timeframe, #sort_select, #commentSortSelect, and #search_sort select[name="sort"] and submits the form upon selection.
  • Form actions & methods: Added explicit method="get" and action to sort forms in templates/subreddit.html, templates/user.html, templates/search.html, and templates/post.html, along with an onchange="this.form.submit()" inline fallback.
  • Non-JS fallback preserved: The <button id="sort_submit"> button is kept in place so users browsing with JavaScript disabled can still submit the form manually.
  • Unit test: Added test_subreddit_sort_form_render in src/subreddit.rs to verify that SubredditTemplate renders the form with the expected action, onchange handler, and script tag.

Verification

  • Built and tested with cargo check and cargo test.
  • Ran a local Redlib instance and verified:
    • Visiting /r/reddit/top and selecting a timeframe submits the form and reloads at /r/reddit/top?t=<timeframe>.
    • Same behavior verified for /top, multireddits (/r/rust+golang/top), /r/reddit/controversial, /user/:name, and /search.
    • Verified /sort.js serves HTTP 200 with content-type: text/javascript.

- Add static/sort.js to automatically submit sort and timeframe forms on selection change
- Register /sort.js route in main.rs and include in base.html
- Set explicit method and action for sort forms across subreddit, user, search, and post templates
- Add onchange fallback on timeframe and sort dropdowns
- Add unit test for subreddit sort form rendering
@ahmedsicp ahmedsicp closed this Oct 16, 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.

1 participant