feat: Convergio Education Web App - Production Ready

[Roberdan]

Summary

Complete educational web application with AI-powered voice tutors (Maestri) for personalized learning.

Key Features

• 14 AI Maestri - Historical master teachers with unique teaching styles
• Voice Sessions - Real-time voice conversations via Azure OpenAI Realtime API
• Dynamic Tools - Mindmaps (MarkMap), flashcards (FSRS), quizzes during lessons
• Full Accessibility - Dyslexia, ADHD, autism, visual/motor impairments support
• Gamification - XP, levels, badges, streaks

Release Checklist Completed (16/16)

Category	Status
Security (7 items)	✅
Code Quality (3 items)	✅
Missing Features (2 items)	✅
Accessibility (2 items)	✅
Performance (1 item)	✅
Critical Fixes (1 item)	✅

Notable Changes

• MarkMap Migration - Replaced Mermaid.js for mindmaps (fixes text truncation)
• WebSocket Proxy - API keys never exposed to client
• DOMPurify Hardened - XSS prevention in HTML preview
• Escape Key Handlers - All modals closeable via keyboard
• ARIA Labels - All icon-only buttons accessible
• Structured Logger - No console.log in production

Verification

npm run lint      ✅ 0 errors
npm run typecheck ✅ no errors
npm run build     ✅ success

ADR

• web/docs/adr/0001-markmap-for-mindmaps.md

Test Plan

• Voice session connects and responds
• Mindmaps render without text truncation
• Flashcards save progress
• Quizzes grade correctly
• Accessibility modes work (dyslexia font, high contrast)
• All modals close with Escape key

🤖 Generated with Claude Code

[Copilot]

Pull request overview

This PR introduces a comprehensive educational web application featuring 14 AI-powered voice tutors (Maestri) for personalized learning. The implementation includes real-time voice sessions via Azure OpenAI, dynamic learning tools (mindmaps, flashcards, quizzes), full accessibility support, and gamification features.

Key Changes:

• Complete UI implementation with 50+ React components for education, gamification, and accessibility
• WebSocket proxy for secure API key handling in voice sessions
• FSRS-5 algorithm integration for spaced repetition flashcards
• Full WCAG 2.1 AA accessibility compliance with specialized modes for dyslexia, ADHD, and autism

Reviewed changes

Copilot reviewed 97 out of 169 changed files in this pull request and generated 7 comments.

Show a summary per file

File	Description
web/src/components/tools/chart-renderer.tsx	Chart.js integration for data visualization in lessons
web/src/components/settings/settings-view.tsx	Comprehensive settings UI with accessibility, AI provider, and profile management
web/src/components/providers.tsx	Root provider setup with theme, accessibility, and store initialization
web/src/components/progress/progress-view.tsx	Progress tracking dashboard with XP, streaks, and mastery visualization
web/src/components/education/*.tsx	Educational tools including quizzes, flashcards, mindmaps, and homework help
web/src/components/gamification/*.tsx	Gamification system with achievements, streaks, and subject mastery
web/src/components/accessibility/*.tsx	Accessibility features including TTS, ADHD timers, and dyslexia support
web/src/app/layout.tsx	Root layout with providers and metadata
web/src/app/api/**/*.ts	API routes for user management, settings, and version info
web/postcss.config.mjs	PostCSS configuration for Tailwind CSS

---

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

[Copilot]

Corrected spelling of 'Accessibilita' to 'Accessibilità'.

Suggested change

	{ id: 'accessibility', label: 'Accessibilita', icon: <Accessibility className="w-5 h-5" /> },
	{ id: 'accessibility', label: 'Accessibilità', icon: <Accessibility className="w-5 h-5" /> },

[Copilot]

Corrected spelling of 'Universita' to 'Università'.

Suggested change

	{ value: 'university', label: 'Universita' },
	{ value: 'university', label: 'Università' },

[Copilot]

The eslint-disable comment suggests an anti-pattern. Consider using a ref to track mount status instead of setting state in useEffect, or restructure to avoid this pattern.

Suggested change

	const [mounted, setMounted] = useState(false);
	// Avoid hydration mismatch
	useEffect(() => {
	// eslint-disable-next-line react-hooks/set-state-in-effect
	setMounted(true);
	}, []);
	const isReady = typeof window !== 'undefined' && resolvedTheme !== undefined;

[Copilot]

The level value should include aria-label for screen readers to announce 'Level' followed by the number for better context.

Suggested change

	value={level.toString()}
	value={<span aria-label={`Level ${level}`}>{level}</span>}

[Copilot]

Function 'sendMaieuticMessage' is defined after 'handleAskQuestion' which uses it. Consider reordering function declarations to improve code readability and avoid the need for eslint-disable comments.

[Copilot]

The skip link should have position styling to be visible on focus. Ensure the 'skip-link' class includes appropriate CSS to show the link when focused.

Suggested change

	tabIndex={0}
	tabIndex={0}
	style={{ position: 'absolute', top: 0, left: 0, zIndex: 1000 }}

[Copilot]

Using delete on potentially untrusted input could miss fields if the data structure changes. Consider using an allowlist approach where you explicitly pick allowed fields rather than deleting forbidden ones.

Suggested change

	// Remove fields that shouldn't be updated directly
	delete data.id;
	delete data.userId;
	delete data.createdAt;
	delete data.updatedAt;
	const settings = await prisma.settings.upsert({
	where: { userId },
	update: data,
	create: { userId, ...data },
	// Create a new object without fields that shouldn't be updated directly
	const { id, userId: _ignoredUserId, createdAt, updatedAt, ...sanitizedData } =
	(data ?? {}) as Record<string, unknown>;
	const settings = await prisma.settings.upsert({
	where: { userId },
	update: sanitizedData,
	create: { userId, ...sanitizedData },

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[chatgpt-codex-connector]

Realtime proxy uses OpenAI URL instead of Azure endpoint

The proxy builds the websocket URL as /openai/v1/realtime?model=...&api-key=... and appends the API key as a query string. Azure’s Realtime API expects .../openai/realtime?api-version=...&deployment=... with the api-key supplied as a header, so this path/query will return 401/404 even when AZURE_OPENAI_REALTIME_* env vars are set, breaking all voice sessions. Please align the URL and authentication with the Azure Realtime endpoint format.

Useful? React with 👍 / 👎.