feat: Add Sort by option for programs on Mentorship page #3593

[sonu1680]

Description

Adds a Sort by dropdown to the My Mentorship page, allowing users to control the order of programs. This matches the existing sorting functionality on the /projects page.

Before

• Programs displayed in a fixed order (by creation date descending)
• No way to control or change the display order
• Users had to scroll through all programs to find specific ones
• Search only helped if you knew the exact program name

After

• Sort by dropdown appears next to the search bar
• Users can sort programs by:
  • Newest (default) - by creation date
  • Name - alphabetical order
  • Start Date - by program start date
  • End Date - by program end date
• Toggle between ascending/descending order
• Sort preferences persist in URL (shareable links)

Changes

Backend

• backend/apps/mentorship/api/internal/queries/program.py
  • Added sort_by and order parameters to myPrograms resolver
  • Supports sorting by: name, started_at, ended_at, nest_created_at

Frontend

• frontend/src/utils/sortingOptions.ts - Added sortOptionsMentorshipPrograms constant
• frontend/src/app/my/mentorship/page.tsx - Integrated SortBy component with URL persistence
• frontend/src/server/queries/programsQueries.ts - Updated GraphQL query
• frontend/src/types/generated/programsQueries.generated.ts - Updated types

Tests

• frontend/tests/unit/pages/MyMentorship.test.tsx - Added test for SortBy component

Checklist

• Code follows the project's coding style
• Tests added for new functionality
• No breaking changes
• Follows existing SortBy pattern from /projects page

[github-actions]

PR validation failed: No linked issue and no valid closing issue reference in PR description

[coderabbitai]

Caution

Review failed

The pull request is closed.

Summary by CodeRabbit

• New Features

  • Users can now export mentorship issues as CSV or JSON files
  • Added sorting options for mentorship programs by creation date, name, start date, or end date

• Tests

  • Added comprehensive test coverage for export utilities, sorting functionality, and UI components

_{✏️ Tip: You can customize this high-level summary in your review settings.}

Walkthrough

This pull request adds end-to-end export functionality for mentorship issues in CSV/JSON formats and dynamic sorting for mentorship programs. It introduces backend export utilities, GraphQL types, and a new export_issues resolver on ModuleNode, alongside a frontend ExportButton component and sorting UI integration on the programs page.

Changes

Cohort / File(s)	Summary
Backend Export Core backend/apps/mentorship/api/internal/nodes/export_types.py, backend/apps/mentorship/utils/export.py, backend/apps/mentorship/utils/__init__.py	New GraphQL type definitions (ExportResult, ExportFormatEnum) and utility module for serializing issues to CSV (with UTF-8 BOM) and JSON formats, including filename generation and helper functions for datetime/list formatting.
Backend GraphQL Integration backend/apps/mentorship/api/internal/nodes/module.py, backend/apps/mentorship/api/internal/queries/program.py	Added export_issues resolver on ModuleNode with label filtering and export limit enforcement; added dynamic sort_by/order parameters to my_programs query with field mapping.
Backend Tests backend/tests/apps/mentorship/...__init__.py, backend/tests/apps/mentorship/utils/export_test.py	Package markers and comprehensive test suite for CSV/JSON serialization, filename generation, edge cases (empty inputs, special characters, newlines), and mock issue/label/user structures.
Frontend Export UI frontend/src/components/ExportButton.tsx, frontend/src/utils/exportUtils.ts, frontend/src/app/.../issues/page.tsx	New ExportButton component with dropdown format selection; utility functions to build GraphQL export queries, parse responses, handle errors, and trigger downloads; integrated into issues page with toast notifications.
Frontend Sorting frontend/src/utils/sortingOptions.ts, frontend/src/app/my/mentorship/page.tsx, frontend/src/server/queries/programsQueries.ts	New sortOptionsMentorshipPrograms constant; updated my mentorship programs page to manage sortBy/order state, sync with URL, and pass parameters to GraphQL query; updated GET_MY_PROGRAMS query to accept sorting variables.
Frontend Tests frontend/__tests__/unit/utils/exportUtils.test.ts, frontend/__tests__/unit/pages/MyMentorship.test.tsx, frontend/__tests__/unit/pages/CreateModule.test.tsx, frontend/__tests__/a11y/pages/MyMentorship.a11y.test.tsx	New export utility tests covering query building, response parsing, error mapping, and download flow; added SortBy component rendering test; restructured CreateModule test with async/await and expanded form interaction; accessibility test wrapped in waitFor.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~30 minutes

Possibly related PRs

• Unify issues view between module issues page and Mentee page #3050: Modifies the same issues page file (frontend/src/app/.../issues/page.tsx) to add export functionality and ExportButton integration.
• UI/UX issue and issue details page #2398: Adds issue-related fields and resolvers to ModuleNode, which this PR extends with the new export_issues method.
• Feature/test sortby component 1915 #1950: Introduces dedicated unit test suite for the SortBy component, which this PR integrates into the mentorship programs page.

Suggested labels

backend, frontend, feature, backend-tests, frontend-tests

Suggested reviewers

• arkid15r
• kasya

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

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.}

[sonarqubecloud]

Quality Gate passed

Issues
7 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud