Ajay: Fixed dark mode for weekly summaries filter modals and selects

[naiduajaykumar]

Description

Fixed the dark theme for input fields and all components in Weekly Summaries Report Page.

Related PRS (if any):

Not related to any PR

How to test:

1. check into current branch
2. check into current branch
3. do yarn install and run this PR locally
4. Clear site data/cache
5. log as admin user
6. go to dashboard→ Reports → Weekly Summaries Report

Screenshots or videos of changes:

Recording.2026-01-14.195133.mp4

[netlify]

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	499e9b0
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/697f05040ec46c00082d7735
😎 Deploy Preview	https://deploy-preview-4713--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[Anusha-Gali]

Hi Ajay,

I have reviewed your PR locally and most of the issues do work as per requirement, there is "Select Filter" which is not adapted to dark mode.
Issue

Works as expected

[Vikas-8055]

hi ajay i have reviewed and tested your pr the dark theme works for all input fields and all components

[rohanrastogi311]

Hey Ajay,

Well done with this implementation. All functional.

[Shravan-neelamsetty]

Hi Ajay,
i have tested this pr locally and everything is functional.

[Anusha-Gali]

Hi Ajay,

Thanks for making the necessary update. That issue appears to be fixed but i found one other issue
Fixed

Trying select filter or Manage filter choice as you can see below the toggle when selected is grey whereas if i select the save option in Select Team Code - it is blue

Note: Do let me know if this is not in your scope since every other requirements works as expected.

[rohanrastogi311]

Hi Ajay,

Well done with this implementation.

[Ganesh112001]

I tested PR #4713 and verified that the dark mode fix for Weekly Summaries filter modals works perfectly. After checking out the Ajay-darkmode-weekly-summaries branch and navigating to /weeklysummariesreport, I enabled dark mode and clicked the "Select Filter" button to open the filter modal. All components in the modal are properly styled for dark mode with good contrast and readability. Input fields, dropdown selects for team codes and extra members, logged hours range selector, and date range filters all have appropriate dark backgrounds with light-colored text. The close button is clearly visible, and there are no white backgrounds breaking the dark theme. Theme toggle works correctly between light and dark modes. No console errors observed. Everything functions perfectly and is ready for merge!

[naiduajaykumar]

Hi Ajay,

Thanks for making the necessary update. That issue appears to be fixed but i found one other issue Fixed Trying select filter or Manage filter choice as you can see below the toggle when selected is grey whereas if i select the save option in Select Team Code - it is blue

Note: Do let me know if this is not in your scope since every other requirements works as expected.

Those are not related to my task, my task is to fix dark mode for some missing input fields.

Other than that if you find fixed please accept changes.

[sayali-2308]

Testing Environment:

• Branch: Ajay-darkmode-weekly-summaries
• Tested as: Admin user
• Browser: Chrome
• Date: January 29, 2026

What Was Tested:

1. Page Navigation:

   • Navigated to Reports → Weekly Summaries Report
   • Page loaded correctly in both light and dark modes

2. Dark Mode Input Fields:

   • "Select Team Code" dropdown - dark styling correct
   • "Select Color" dropdown - dark styling correct
   • "Select Extra Members" dropdown - dark styling correct
   • "Logged Hours Range" dropdown - dark styling correct
   • All input fields have proper dark background and readable text

3. Dark Mode UI Components:

   • Week selection tabs (This Week, Last Week, etc.) - proper styling
   • Toggle switches (Show Chart, Filter by Special Colors, etc.) - work correctly
   • Buttons (Select Filter, Manage Filters, Open PDF, Load Badges, etc.) - all functional
   • Filter toggles (Purple, Green, Navy, Bio Status, Trophies, Over Hours) - proper styling

4. Dark Mode Modals:

   • "Select a Filter" modal - dark background, good contrast
   • "Update or Delete Filter" modal - dark background, good contrast
   • Modal input fields properly styled

5. Data Display:

   • Weekly summary data displays correctly in dark mode
   • User information section (blue background) maintains readability
   • Text contrast good throughout

6. Cross-Mode Testing:

   • Switched between light and dark modes multiple times
   • All elements maintain proper styling in both modes
   • No visual inconsistencies

Dark mode implementation is complete and functional for all components on the Weekly Summaries Report page. All input fields, dropdowns, modals, and UI elements display correctly with good contrast and readability.

[Anusha-Gali]

Hi Ajay,
Thanks for making the necessary update. That issue appears to be fixed but i found one other issue Fixed Trying select filter or Manage filter choice as you can see below the toggle when selected is grey whereas if i select the save option in Select Team Code - it is blue
Note: Do let me know if this is not in your scope since every other requirements works as expected.

Those are not related to my task, my task is to fix dark mode for some missing input fields.

Other than that if you find fixed please accept changes.

Thanks for the update Ajay.

[Anusha-Gali]

Approving the PR since the issue i have pointed out is not in the scope of the PR and the rest of the functionalities work as per requirements mentioned.

[sayali-2308]

Re-reviewed and tested the dark mode implementation for Weekly Summaries Report (#4713).

• Branch: Ajay-darkmode-weekly-summaries
• Backend: development branch
• Tested on: Windows, Chrome
• Date: January 31, 2026

Dark Mode Implementation Verified:

1. All input fields properly styled with dark backgrounds and light text:
   • "Search and select team codes..." dropdown
   • "Select color filters..." dropdown
   • "Select extra members..." dropdown
   • "Select range..." (Logged Hours Range) dropdown
2. All modals display correctly in dark mode:
   • "Select a Filter" modal - dark background, good contrast
   • Filter details modal - all sections properly styled
3. All UI components work correctly:
   • Week selection tabs styled properly
   • Toggle switches visible and functional
   • Buttons (Select Filter, Manage Filters, Open PDF, Load Badges, Load Trophies, Refresh) all have appropriate dark styling
4. Dropdown lists properly styled with dark backgrounds
5. Data display area maintains good readability with dark blue background
6. Text contrast excellent throughout

Minor Observation:
Selected items in dropdown lists show light gray background. While functional, using blue highlighting (like the filter dropdown border) would provide more visual consistency. This is outside the PR scope but worth noting for future enhancement.

[rohanrastogi311]

Hi Ajay,

The text colours are not contrasting with highlight colours for the box.

[sonarqubecloud]

Quality Gate passed

Issues
25 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