[FRONTEND] Preserve selected Scans filter in URL query params

[utksh1]

Summary

The Scans page status filter resets on refresh. Persist the selected filter in the URL query string so links can be shared and refreshes keep context.

Scope

• Update frontend/src/pages/Scans.tsx.
• Use existing React Router APIs.
• Keep default filter as all.
• Add focused unit test if Scans test setup exists.

Acceptance Criteria

• Selecting a filter updates the URL query, e.g. ?status=completed.
• Loading /scans?status=failed applies the failed filter.
• Invalid status query falls back to all.

[NiravaM]

hi @utksh1 , i would like to work on this under GSSoC '26. Please assign it to me.

[IshikaGanatra]

Hey @utksh1
I'm already familiar with Scans.tsx from my work on #114. I'll use Router's useSearchParams to read and write the query param, initialising the filter from the URL on mount, updating it on filter change, and falling back to all for invalid values.
Happy to work on it once assigned.

[jadhavvedika758-web]

i would like to work on this issue under GSSoC '26. Please assign it to me.

[Jeshika311]

Hi @utksh1

I’d like to work on this issue under GSSoC’26. Since I’ve already contributed to this project before, I’m familiar with the existing frontend structure and filter handling flow, so I think I can implement this more efficiently while keeping the current behavior consistent.

My plan is to persist the selected scan status filter using URL query params through React Router APIs, ensure refresh/shareable links preserve the selected state correctly, and handle invalid query values with fallback behavior as mentioned in the acceptance criteria.

[RosheshChaware]

Hi @utksh1 👋

I would like to work on this issue.

I understand the requirement: the selected status filter on the Scans page should persist via URL query params so that refresh and sharing maintain context. I will implement this by integrating React Router’s query param handling inside frontend/src/pages/Scans.tsx.

Plan:

Sync filter state with ?status= query parameter
On filter change, update URL using existing React Router APIs
On page load, read query param and apply the corresponding filter
Fallback to all if the query param is missing or invalid
Ensure default behavior remains unchanged
Add unit test if the existing test setup supports Scans page

I already have a clear implementation approach and can raise a PR soon after assignment.

Please assign this issue to me under GSSoC ’26. Thank you! 🚀