fix: address UI component review feedback — timeouts, ARIA, active nav, env vars, type cleanup

[Copilot]

Resolves a batch of bugs and code quality issues flagged in review on the UI overhaul PR: leaked timers, PII in logs, hardcoded secrets, missing ARIA semantics, incorrect MIME types, dead nav links, and unused imports/props.

Timer & Cleanup Fixes

• contact-banner.tsx: revertTimeout was returned from inside the setTimeout callback (no-op). Both timers now tracked in refs and cleared in effect cleanup.
• video-player.tsx: Retry setTimeout ID stored in a ref, cleared on unmount.

MIME Type / VideoPlayer

• Made webmSrc optional; MIME type inferred from extension via module-level getType().
• services/page.tsx & contact/page.tsx: Removed duplicate .mp4 URL incorrectly passed as webmSrc.

Security / Privacy

• api/contact/route.ts: PII fields (name, email, message) removed from server log; log gated behind NODE_ENV === 'development'.
• contact/page.tsx: Hardcoded Google Maps API key moved to NEXT_PUBLIC_GOOGLE_MAPS_API_KEY; .env.example updated.

Header — Active Links & Safe Click Handling

• Nav links now use pathname to apply active styles and aria-current="page".
• Global click handler skips modified-key clicks, middle-clicks, and target≠_self anchors to avoid stalled progress bar.

PortfolioModal

• Added role="dialog", aria-modal, aria-labelledby (via useId()).
• Body overflow now captures and restores the previous value instead of resetting to "".
• Description link-splitting rewired to safely handle missing labels and render all occurrences as links:

const parts = description.split(link.label)
return parts.map((part, i) => (
  <React.Fragment key={i}>
    {part}
    {i < parts.length - 1 && <a href={link.href}>…</a>}
  </React.Fragment>
))

Cleanup

• footer.tsx: http:// → https:// for social URLs; Skype gets no target="_blank"; dead routes (/technology, /sitemap, /privacy-policy) removed.
• contact-banner.tsx: <a href="/contact"> → <Link>.
• TeamMember.tsx: Removed unused Link import; dropped icon/iconPack from ContactLink (never read — icon chosen by label).
• about/page.tsx: Removed unused FA imports (faEnvelope, faPhone, faGithub, faLinkedin, faDiscord).
• portfolio/page.tsx: Replaced two hard-coded 4-item row slices with a single dynamic grid over the full portfolioItems array.
• ProgressBar.tsx: duration-800 → duration-[800ms] (non-standard class wasn't generated by Tailwind).

---

📱 Kick off Copilot coding agent tasks wherever you are with GitHub Mobile, available on iOS and Android.

[github-actions]

🚀 Preview deployment ready!

📎 Preview URL: https://dev.codebuilder.org/preview/copilot-sub-pr-10/

Deployed from commit 4994c3e

[Copilot]

Just as a heads up, I was blocked by some firewall rules while working on your feedback. Expand below for details.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• fonts.googleapis.com
  • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node node /home/REDACTED/work/codebuilder-frontend/codebuilder-frontend/node_modules/.bin/next build (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

[Copilot]

Pull request overview

This PR addresses a set of UI review follow-ups across the Next.js app, focusing on timer cleanup, accessibility semantics, safer navigation/progress handling, privacy/security tweaks, and small type/prop cleanups.

Changes:

• Fix leaked/uncleared timers (Contact banner + VideoPlayer retry) and improve VideoPlayer source handling/MIME typing.
• Improve UI semantics and navigation UX (active nav with aria-current, safer global click interception, modal ARIA attributes).
• Remove sensitive/hardcoded values (PII logging reduction + move Google Maps key to NEXT_PUBLIC_GOOGLE_MAPS_API_KEY) and perform general cleanup (dead links, unused imports, Tailwind class fix, grid refactor).

Reviewed changes

Copilot reviewed 13 out of 14 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
src/components/video-player.tsx	Makes webmSrc optional, infers <source type> from extension, and clears the retry timeout on unmount.
src/components/portfolio/PortfolioModal.tsx	Adds dialog ARIA attributes and rewrites description link rendering; improves body overflow restoration.
src/components/layout/header.tsx	Improves click interception safety and adds active-link styling with aria-current="page".
src/components/layout/footer.tsx	Updates social URLs to https, avoids _blank for Skype, and removes dead footer routes.
src/components/layout/contact-banner.tsx	Fixes timer cleanup via refs and replaces <a> with Next.js <Link>.
src/components/about/TeamMember.tsx	Removes unused Link import and simplifies ContactLink typing (label/href only).
src/components/about/ProgressBar.tsx	Fixes Tailwind duration class to a generated arbitrary value.
src/app/services/page.tsx	Removes incorrect duplicate .mp4 passed as webmSrc.
src/app/portfolio/page.tsx	Replaces fixed 2-row slicing with a single dynamic grid render.
src/app/contact/page.tsx	Removes incorrect duplicate .mp4 webmSrc and moves Maps key to env var.
src/app/api/contact/route.ts	Gates logging to development and removes PII fields from logs.
src/app/about/page.tsx	Removes unused FontAwesome imports and updates contactLinks to match simplified typing.
.env.example	Documents NEXT_PUBLIC_GOOGLE_MAPS_API_KEY.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.