Replace CSP unsafe-inline with a nonce for the theme pre-paint script

[mikewheeleer]

Tighten the script CSP by nonce-ing the inline theme script

Description

src/lib/securityHeaders.ts builds a CSP that currently allows script-src 'unsafe-inline' (and unsafe-eval in dev), which is required only because src/app/layout.tsx injects an inline theme pre-paint script via dangerouslySetInnerHTML. unsafe-inline defeats much of the XSS protection a CSP provides. This issue replaces it with a per-request nonce.

Requirements and context

• Repository scope: Agentpay-Org/Agentpay-frontend only.
• Generate a per-request nonce (via src/middleware.ts or the header builder), add it to script-src 'nonce-…', and drop unsafe-inline from script-src.
• Apply the same nonce to the inline theme script in src/app/layout.tsx so it still executes before paint.
• Keep style-src working for the next/font Geist setup and preserve all other directives in src/lib/securityHeaders.ts.
• Document the nonce flow and any dev/prod differences.

Suggested execution

• Fork the repo and create a branch
• git checkout -b security/config-csp-nonce
• Implement changes
  • Write code in: src/lib/securityHeaders.ts, src/middleware.ts (new if needed), and src/app/layout.tsx.
  • Write comprehensive tests in: extend src/__tests__/securityHeaders.test.ts — assert script-src contains a nonce placeholder and no unsafe-inline.
  • Add documentation: update the "Security headers" section in README.md.
  • Validate the app still loads (theme applies, no CSP console violations).
• Test and commit

Test and commit

• Run npm run lint, npm run typecheck, npm test, and npm run build.
• Cover edge cases: dev vs prod CSP, missing nonce path, and font/style loading.
• Include the npm test output and a curl -I header dump from npm run start.

Example commit message

fix(security): nonce the inline theme script and drop script-src unsafe-inline

Guidelines

• Minimum 95 percent test coverage for the policy builder.
• Clear, reviewer-focused documentation.
• Timeframe: 96 hours.

Community & contribution rewards

• 💬 Join the AgentPay community on Discord for questions, reviews, and faster merges: https://discord.gg/eXvRKkgcv
• ⭐ This is a GrantFox OSS / Official Campaign task and may be rewarded. When your PR is merged you'll be prompted to rate the project — if this issue and the maintainers helped you ship, we'd be grateful for a 5-star rating. Clear questions in Discord and tidy, well-tested PRs are the fastest path to a merge and a reward.

[YfengJ]

Hi maintainers, I would like to take this issue if it is available.

If assigned, I would keep the change focused on replacing the theme pre-paint unsafe-inline path with a nonce-compatible approach, preserving the current light/dark/system theme behavior and avoiding hydration regressions. I would also update the CSP configuration/docs as needed and add focused tests or assertions around the generated nonce/script behavior.

I will wait for assignment or explicit confirmation before opening a PR.

[GBOYEE]

I can take this up — adding nonce generation to the security headers builder and wiring it into the layout's inline theme script. Starting on it.

[gloskull]

Hello, I have 4 years of experience delivering solutions for projects like this, covering backend, frontend, and smart contract development. After carefully reviewing your requirements, I have a clear understanding of the task and am confident in my ability to deliver a clean, efficient, and thoroughly tested solution on time. I prioritize code quality, maintainability, and industry best practices throughout the development process. My PR will be submitted in under 10hours.