Migrate Button, Radio, and DropdownMenu to ShadCN and Add Tests +3 issues resolved

[idanidan29]

What kind of change does this PR introduce?

• Adapted 3 components to use the ShadCN library.
• Created and adjusted Cypress test files for these 3 components and for the shadCN card element to ensure reliability and behavior coverage.
• While adapting the components, utilized ShadCN's Button ,Radio and Collapsible elements.
• Added hover effects to the sections in the tools filter.
• Added a counter to each section indicating the number of active filters in use.

Issue Number:

• Closes ✨ Enhancement: Migrate Tools page Components to ShadCN/UI #1656
• Closes 🐛 Bug: Checkbox Tick Icon Misaligned to Bottom in Tolls page #1724
• Closes ✨ Enhancement: Display Selected Filter Count as Badges on Filter Dropdowns #1447
• Closes ✨ Enhancement: Adding Hover effect to tools page #1591

Screenshots/videos:

Screen.Recording.2025-06-14.234317.mp4

The Radio component was not being used at the moment but still have been adapted to ShadCN for future use.

Summary

This PR:

• Migrated the existing Button.tsx, Radio.tsx, and DropdownMenu components to the ShadCN library.
• Enhanced the styling of the button component to improve dark mode compatibility (open to feedback).
• Added Cypress tests for all implemented components to ensure reliability and behavior coverage.
• solved 3 issues as related to phase 1:
  • Hover effects for better interactivity.
  • A visual counter showing the number of active filters per section.
  • fixed the checkbox icon to the middle

Does this PR introduce a breaking change?

no

Checklist

Please ensure the following tasks are completed before submitting this pull request.

• Read, understood, and followed the contributing guidelines.

[github-actions]

built with Refined Cloudflare Pages Action

⚡ Cloudflare Pages Deployment

Name	Status	Preview	Last Commit
website	✅ Ready (View Log)	Visit Preview	66af35d

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 100.00%. Comparing base (1ac0817) to head (66af35d).
Report is 3 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff            @@
##              main     #1709   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           18        23    +5     
  Lines          448       477   +29     
  Branches       116       122    +6     
=========================================
+ Hits           448       477   +29     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[benjagm]

Great work Idan. I just found some weird behaviours in the clear filters button. We need to review the logic to make sure whe are clearing all the field selections after clicking the clear filter button.

[idanidan29]

@benjagm I've adjusted the clean filters logic, fixed the issue mentioned in #1724, and added tests to ensure correct sizing and placement of the checkbox icon

[benjagm]

Looks great to me. Let's merge it.