Skip to content

[Feature] Added pagination and filtration to news admin panel - #32

Merged
AnastasiaRakuta merged 3 commits into
devfrom
feature/news-panel-pagination-and-search
Aug 6, 2026
Merged

[Feature] Added pagination and filtration to news admin panel#32
AnastasiaRakuta merged 3 commits into
devfrom
feature/news-panel-pagination-and-search

Conversation

@AnastasiaRakuta

@AnastasiaRakuta AnastasiaRakuta commented Aug 6, 2026

Copy link
Copy Markdown
Contributor

Summary by CodeRabbit

  • New Features

    • Added search, status, and date-range filtering to the admin news list.
    • Added Apply and Reset controls with an active-filter count.
    • Added simple previous/next pagination and increased the page size to 15 items.
    • Added English and Ukrainian translations for the new controls, search, and pagination.
  • Bug Fixes

    • Improved pagination behavior when search or filters change.

@AnastasiaRakuta AnastasiaRakuta self-assigned this Aug 6, 2026
@coderabbitai

coderabbitai Bot commented Aug 6, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Warning

Review limit reached

@AnastasiaRakuta, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 42 minutes

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 43f2204e-62fc-4719-9517-d6f959c0d6e6

📥 Commits

Reviewing files that changed from the base of the PR and between 2836857 and e1dfb9f.

📒 Files selected for processing (3)
  • src/pages/admin/News/NewsAdminList.tsx
  • src/pages/admin/News/NewsFilters.tsx
  • src/shared/services/newsService.ts
📝 Walkthrough

Walkthrough

The admin news list now supports search, status filters, date ranges, and simplified pagination. The news service serializes active filters, while English and Ukrainian translations provide labels for the new controls.

Changes

Admin news filtering

Layer / File(s) Summary
Filter contracts and service query
src/shared/models/news.ts, src/shared/services/newsService.ts
The news model defines supported statuses. getAllNewsForAdmin accepts optional statuses and date ranges and serializes non-empty filters.
Shared controls and filter popover
src/pages/admin/News/NewsFilters.tsx, src/shared/components/AdminSearchInput.tsx, src/shared/components/SimplePagination.tsx, public/i18n/*/admin.json, public/i18n/*/common.json, public/i18n/*/public.json
The new controls manage search, filter selection, reset/apply actions, and page navigation. English and Ukrainian localization keys were added or moved.
Admin list integration
src/pages/admin/News/NewsAdminList.tsx
The list loads 15 items with active filters, reloads when filter state changes, resets pagination when filters are applied, and uses SimplePagination.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Sequence Diagram(s)

sequenceDiagram
  participant NewsAdminList
  participant AdminSearchInput
  participant NewsFilters
  participant newsService
  participant SimplePagination

  AdminSearchInput->>NewsAdminList: Update search and reset page
  NewsFilters->>NewsAdminList: Apply statuses and date range
  NewsAdminList->>newsService: Request filtered news page
  newsService-->>NewsAdminList: Return admin news response
  NewsAdminList->>SimplePagination: Provide page and total pages
Loading

Possibly related PRs

Suggested reviewers: stinvestigator

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ 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 clearly summarizes the main changes: pagination and filtering for the news admin panel.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches 💡 1
📝 Generate docstrings 💡
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feature/news-panel-pagination-and-search

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

Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (2)
src/shared/services/newsService.ts (1)

2-2: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Combine the @shared/models/news imports.

SonarCloud reports that this module is already imported in this file. Merge NewsStatus into the existing import.

🤖 Prompt for 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.

In `@src/shared/services/newsService.ts` at line 2, Combine the duplicate
`@shared/models/news` imports in newsService.ts by adding NewsStatus to the
existing import declaration, leaving only one import from that module.

Source: Linters/SAST tools

src/pages/admin/News/NewsFilters.tsx (1)

1-6: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Apply the repository import order.

The static check reports import-order violations in both files.

  • src/pages/admin/News/NewsFilters.tsx#L1-L6: reorder the aliased and package imports to satisfy the configured import-order rule.
  • src/pages/admin/News/NewsAdminList.tsx#L1-L5: move @components/SimplePagination before @services/newsService.
🤖 Prompt for 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.

In `@src/pages/admin/News/NewsFilters.tsx` around lines 1 - 6, Reorder imports in
src/pages/admin/News/NewsFilters.tsx (lines 1-6) according to the repository’s
configured import-order rule, placing aliased and package imports in the
required order. In src/pages/admin/News/NewsAdminList.tsx (lines 1-5), move the
`@components/SimplePagination` import before `@services/newsService`; no other
changes are needed.

Source: Linters/SAST tools

🤖 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/pages/admin/News/NewsFilters.tsx`:
- Around line 72-92: Associate the date labels with their controls in the
NewsFilters date range fields by adding matching htmlFor and id attributes for
the pendingDateFrom and pendingDateTo inputs. Keep the existing values and
handlers unchanged.

---

Nitpick comments:
In `@src/pages/admin/News/NewsFilters.tsx`:
- Around line 1-6: Reorder imports in src/pages/admin/News/NewsFilters.tsx
(lines 1-6) according to the repository’s configured import-order rule, placing
aliased and package imports in the required order. In
src/pages/admin/News/NewsAdminList.tsx (lines 1-5), move the
`@components/SimplePagination` import before `@services/newsService`; no other
changes are needed.

In `@src/shared/services/newsService.ts`:
- Line 2: Combine the duplicate `@shared/models/news` imports in newsService.ts by
adding NewsStatus to the existing import declaration, leaving only one import
from that module.
🪄 Autofix

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: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 1911f218-eb05-4ab5-827a-f4e3c50ac299

📥 Commits

Reviewing files that changed from the base of the PR and between 6a9398f and 2836857.

📒 Files selected for processing (12)
  • public/i18n/en/admin.json
  • public/i18n/en/common.json
  • public/i18n/en/public.json
  • public/i18n/uk/admin.json
  • public/i18n/uk/common.json
  • public/i18n/uk/public.json
  • src/pages/admin/News/NewsAdminList.tsx
  • src/pages/admin/News/NewsFilters.tsx
  • src/shared/components/AdminSearchInput.tsx
  • src/shared/components/SimplePagination.tsx
  • src/shared/models/news.ts
  • src/shared/services/newsService.ts
💤 Files with no reviewable changes (2)
  • public/i18n/en/public.json
  • public/i18n/uk/public.json

Comment thread src/pages/admin/News/NewsFilters.tsx Outdated
@sonarqubecloud

sonarqubecloud Bot commented Aug 6, 2026

Copy link
Copy Markdown

@AnastasiaRakuta
AnastasiaRakuta merged commit 9d9f1f6 into dev Aug 6, 2026
4 checks passed
@AnastasiaRakuta
AnastasiaRakuta deleted the feature/news-panel-pagination-and-search branch August 6, 2026 10:12
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