feat(person): add sort controls to person credits page

[Maxwell2022]

Description

Note

AI Disclosure: Code generation and implementation were assisted by Cursor AI. The changes were reviewed and tested locally before submission.

Adds a sort dropdown to the person page, alongside the existing media type filter (All / Movies / Series). Cast and crew credits are sorted client-side via sortPersonCredits in server/utils/personCreditHelpers.ts.

Sort options: vote count (ascending/descending), release date (ascending/descending), and title (A-Z / Z-A). The default is vote count descending, matching the previous implicit behavior. Release date sorting addresses browsing a person's filmography chronologically.

Popularity and TMDB rating sorts were considered but omitted — they produced misleading order on person filmographies compared to Discover pages.

This change reuses existing Seerr patterns rather than introducing new abstractions:

• localStorage persistence (pd-filter-settings, same approach as RequestList and IssueList)
• icon + <select> filter controls (CircleStackIcon for media type, BarsArrowDownIcon for sort, consistent with list and Discover pages)
• responsive filter layout (flex-col sm:flex-row toolbar; desktop controls in the page header, mobile below the bio)

Sort labels follow Discover wording where applicable. No new shared components, API changes, or settings changes.

• Fixes Sort by release date #1767

How Has This Been Tested?

Tested locally on macOS with Node v25 (using pnpm --config.engine-strict=false where required; CI uses Node 22).

• pnpm i18n:extract
• pnpm typecheck:client
• pnpm test server/utils/personCreditHelpers.test.ts (6 tests)
• pnpm lint on changed files
• pnpm build:next and pnpm build:server
• pnpm dev — server starts on port 5055

Manual verification:

1. Log in at http://localhost:5055 (or run pnpm cypress:prepare for a test admin account).
2. Open http://localhost:5055/person/31 (Tom Hanks).
3. Confirm the sort dropdown appears next to the media type filter (top-right on desktop, below the bio on mobile).
4. Confirm the default selection is vote count descending (previous behaviour).
5. Verify cast/crew order updates for release date, title, and vote count sorts.
6. Change the media type filter and confirm sorting still applies.
7. Reload the page and confirm choices are restored from localStorage.

I've also added some basic unit test for the filters

Screenshots / Logs (if applicable)

Checklist:

• I have read and followed the contribution guidelines.
• Disclosed any use of AI (see our policy)
• I have updated the documentation accordingly.
• All new and existing tests passed.
• Successful build pnpm build
• Translation keys pnpm i18n:extract
• Database migration (if required)

Summary by CodeRabbit

• New Features
  • Added credit sorting to person details. Users can now sort credits by release date, title, or vote count in both ascending and descending order.
  • Sort preferences are automatically saved and restored between sessions.
  • Integrated a new sort dropdown alongside the existing media-type filter.

[coderabbitai]

📝 Walkthrough

Walkthrough

A new sortPersonCredits server utility is introduced with a PersonCreditSort type and DEFAULT_PERSON_CREDIT_SORT constant. PersonDetails is updated to use this helper, adding a sort picker UI with six sort options, localStorage persistence for filter and sort state, and corresponding i18n strings. Unit tests cover all sort paths and duplicate-grouping behavior.

Changes

Person Credit Sorting Feature

Layer / File(s)	Summary
sortPersonCredits utility: types, constants, comparators, and grouping logic server/utils/personCreditHelpers.ts	Exports PersonCreditSort union type and DEFAULT_PERSON_CREDIT_SORT constant; adds field extractors for releaseDate/title across media types; implements string and numeric comparators; implements sortPersonCredits that groups by a caller-supplied key, merges groups, then sorts by releaseDate, title, or voteCount.
Unit tests for sortPersonCredits and DEFAULT_PERSON_CREDIT_SORT server/utils/personCreditHelpers.test.ts	Adds makeCredit factory and six tests covering the default constant, voteCount.desc ordering, releaseDate.desc cross-media ordering, empty-date placement, title.asc localized field selection, and duplicate-id grouping with character-field merging.
PersonDetails sort state, localStorage persistence, sort picker UI, and i18n src/components/PersonDetails/index.tsx, src/i18n/locale/en.json	Adds six sort i18n keys; introduces currentSort state and SortOptions map; adds useEffect hooks to load and save filter/sort settings to localStorage; replaces lodash/groupBy + manual sort with sortPersonCredits; adds a sortPicker select composed with mediaTypePicker into a filtersToolbar rendered on desktop and mobile.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Suggested reviewers

• fallenbagel

Poem

🐇 Hop, hop, the credits align,
By vote count, title, or release date fine!
I grouped the duplicates, neat and small,
Persisted your picks through each browser call.
Now sorted films leap across the screen —
The freshest carrots sorted cleanest and clean! 🥕

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'feat(person): add sort controls to person credits page' accurately describes the main feature addition: implementing sorting controls for person credits.
Linked Issues check	✅ Passed	The PR fully addresses issue #1767 by implementing sort controls for person credits, supporting vote count, release date, and title sorting with appropriate default behavior.
Out of Scope Changes check	✅ Passed	All changes are directly related to implementing sort controls and supporting infrastructure; no unrelated modifications detected.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/components/PersonDetails/index.tsx`:
- Around line 74-90: The JSON.parse call in the useEffect hook lacks error
handling, which will crash the component if localStorage contains malformed
JSON. Wrap the JSON.parse statement in a try-catch block to gracefully handle
parsing errors, and ensure the component continues to function normally by
returning early or skipping the state updates when an error occurs.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 28cbc55a-8a1c-4b6a-a06e-2a78bc12d538

📥 Commits

Reviewing files that changed from the base of the PR and between 0a1f703 and a10d986.

📒 Files selected for processing (4)

• server/utils/personCreditHelpers.test.ts
• server/utils/personCreditHelpers.ts
• src/components/PersonDetails/index.tsx
• src/i18n/locale/en.json