Skip to content

fix(frontend,devops): error boundaries & sentry context, code splitting, XSS sanitization, and commit hygiene (#1090, #1091, #1092, #1093) - #1106

Open
bitcoindev817-hue wants to merge 1 commit into
SoroLabs:mainfrom
bitcoindev817-hue:fix/frontend-devops-issues-1090-1093
Open

fix(frontend,devops): error boundaries & sentry context, code splitting, XSS sanitization, and commit hygiene (#1090, #1091, #1092, #1093)#1106
bitcoindev817-hue wants to merge 1 commit into
SoroLabs:mainfrom
bitcoindev817-hue:fix/frontend-devops-issues-1090-1093

Conversation

@bitcoindev817-hue

Copy link
Copy Markdown
Contributor

Fixes #1090
Fixes #1091
Fixes #1092
Fixes #1093

Summary & Architectural Improvements

This PR resolves four production & architectural issues (#1090, #1091, #1092, #1093) across frontend resilience, bundle performance, input sanitization security, and repository hygiene.


1. Granular React Error Boundaries & Context-Enriched Sentry Tracking (Fixes #1090)

  • Granular Isolation: Wrapped individual dashboard widgets inside <ErrorBoundary section={widget-${widget.id}}> so an unhandled rendering exception in one card is isolated without crashing the page layout.
  • Local Recovery: Added a "Retry widget" button to the error fallback UI allowing users to clear error state locally without refreshing the browser application.
  • Sentry Context Enrichment: Configured ErrorBoundary to automatically enrich Sentry exception reports with walletProvider, networkId, and contractAddress diagnostic tags and extra context.
  • Automated Verification: Added Jest unit test suite frontend/app/components/__tests__/ErrorBoundary.test.tsx verifying crash isolation, Sentry tags, and recovery state reset.

2. Code Splitting & Dynamic Lazy Loading of Heavy Cryptographic Modules (Fixes #1091)

  • Dynamic Import Code Splitting: Updated heavy ZK prover components (ZKProverPanel) and complex dashboard components (TaskExecutionHeatmapEngine, RPCNodeHealthDashboard) to lazy-load via next/dynamic with animated loading fallbacks.
  • WASM & Vendor Chunking: Configured custom Webpack vendor chunking in frontend/next.config.ts for @stellar/stellar-sdk, snarkjs, recharts, and reactflow with WebAssembly module streaming enabled (asyncWebAssembly: true).
  • Route Pre-fetching: Added prefetch={true} to high-probability navigation paths (/dashboard, /tasks, /board, /keeper-metrics, /zk-prover) on the landing page and navigation menu.

3. DOMPurify Sanitization on Dynamic Resolver Outputs & Markdown Renders (Fixes #1092)

  • Dynamic Output Sanitization: Added sanitizeResolverOutput in frontend/src/lib/sanitize.ts using DOMPurify to strip script tags, event handlers (onload=, onerror=), and javascript: URIs from dynamic resolver strings and task return values.
  • Sandboxed Output Viewer: Created SanitizedTaskOutputViewer component (frontend/components/SanitizedTaskOutputViewer.tsx) for safely rendering task execution return values in code blocks.
  • Markdown Sanitization: Configured MarkdownEditor to sanitize preview HTML via DOMPurify before setting dangerouslySetInnerHTML.
  • Security Regression Test Suite: Created frontend/src/lib/__tests__/security-xss.test.tsx verifying neutralization of stored XSS vectors.

4. Purge Leftover Git Merge Conflict Artifacts & Enforce Commit Hygiene (Fixes #1093)

  • Artifact Purge: Removed all leftover conflicts_*.txt, merge_output_*.txt, and test-rpc.js dump files from the root repository directory.
  • Git Ignore Rules: Added ignore patterns for conflicts_*.txt, merge_output_*.txt, and test-rpc.js to .gitignore.
  • Conflict Marker CI Check: Created scripts/check-conflict-markers.sh to detect unresolved conflict markers (<<<<<<<, =======, >>>>>>>) in tracked files and exit with failure code 1.
  • Enforced Pipeline Integration: Wired conflict marker check into .husky/pre-commit and GitHub Actions CI workflow (.github/workflows/e2e-integration.yml).

Verification & Test Results

  • Conflict Marker Lint Check: ./scripts/check-conflict-markers.sh passed cleanly.
  • Jest Unit & Security Test Suites: 209 test suites passed (2,254 tests passed).
  • Next.js Production Build: Next.js build (npm run build) compiled successfully in 58s with route optimization and dynamic code splitting.

@drips-wave

drips-wave Bot commented Aug 26, 2026

Copy link
Copy Markdown

@bitcoindev817-hue Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@vercel

vercel Bot commented Aug 26, 2026

Copy link
Copy Markdown

Someone is attempting to deploy a commit to the Ayomide Adeniran's projects Team on Vercel.

A member of the Team first needs to authorize it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment