Som Ramnani - refactor(FaqSection): fix dark mode & add copy contact email functionality

[somramnani]

Description

Related PRS (if any):

This PR is related to PR#3241.

Main changes explained:

• Updated FaqSection.jsx to apply dark mode through a single container-level CSS Module class instead of adding separate dark-mode classes to individual elements.
• Updated FaqSection.module.css with scoped dark-mode styles for FAQ questions, answers, search fields, category filters, borders, contact links, and empty states.
• Updated ActivityFAQs.jsx to replace the inactive contact link with a button that copies onecommunityglobal@gmail.com to the clipboard.
• Added success and failure notifications using the existing react-toastify system. A successful copy displays “Email copied!”, while a clipboard failure displays “Failed to copy email.”
• Updated ActivityFAQs.module.css so the contact button retains the appearance of a link in both light and dark modes.
• Added FaqSection.test.jsx to cover theme selection, accordion behavior, searching, category filtering, and contact interaction.
• Added ActivityFAQs.test.jsx to verify that the correct email is copied and that the appropriate success or error toast is displayed.

How to test:

1. Check into som-fix/activity-faqs-dark-mode
2. Do npm install and start the app locally.
3. Clear site data/cache
4. Log in as admin user
5. Navigate to /communityportal/activity/1/faq or replace 1 with an available activity ID.
6. Confirm that the FAQ page loads correctly. Expand questions and test the search and category filters.
7. Enable dark mode and confirm that all FAQ content—including questions, answers, filters, search fields, and contact text—is clearly visible.
8. Click contact and confirm that an “Email copied!” toast appears. Paste the clipboard contents and verify that it contains onecommunityglobal@gmail.com.

Screenshots or videos of changes:

Screen.Recording.2026-08-20.at.1.50.44.PM.mov

Note:

• This PR focuses only on the FAQ dark-mode improvements and contact email copy functionality.
• Activity-specific FAQ fetching remains unchanged and can be addressed in a separate PR.
• The legacy FaqSection component is currently not mounted by an active route, but its dark-mode styling and tests were updated for future use.
• The contact button currently copies the code-provided onecommunityglobal@gmail.com address rather than an event-specific email.
• No backend or API changes are included.

[netlify]

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	ba75934
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/6a872f0122611500083ac1d0
😎 Deploy Preview	https://deploy-preview-5456--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

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

[sonarqubecloud]

Quality Gate passed

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

[MahalakshmiPFW]

Hi! Everything works fine. The email gets copied, the FAQs are expanding correctly in both themes (dark and light). However, the Contact button is not being highlighted in the dark mode but it works when I click on it (he email is getting copied). I have attached the screenshots. Please take a look at it.