feat(ai): implement AI-powered learning assistant components (#305)

[JoesWalker]

Closes #305

• LearningAssistant: chat UI with typing indicator, aria-live, keyboard nav
• PersonalizedRecommendations: fetches GET /api/ai/recommendations with skeleton loader
• IntelligentProgress: fetches GET /api/user/progress, progress bar + insights
• SmartNotifications: fetches GET /api/ai/reminders, dismiss via DELETE /api/ai/reminders/:id
• NaturalLanguageQuery: POST /api/ai/search with empty/error states
• Tests: 25 tests covering loading, success, error, and interaction states

Placeholder API endpoints documented in each component:
POST /api/ai/chat, GET /api/ai/recommendations,
GET /api/ai/reminders, DELETE /api/ai/reminders/:id, POST /api/ai/search

Closes #305

Description

Brief description of changes

Related Issue

Type of Change

• Bug fix
• New feature
• Breaking change
• Documentation update

Checklist

• Code follows project style guidelines
• Self-review completed
• No console errors
• Uses Lucide icons consistently
• Responsive design implemented
• Starknet best practices followed

Summary

Implements the AI-powered learning assistant frontend as described in issue #305.

Changes

Five new components under src/components/ai/:

• LearningAssistant – Chat UI with message thread, typing indicator, keyboard navigation, and aria-live for screen readers. Sends messages to
  POST /api/ai/chat.
• PersonalizedRecommendations – Fetches GET /api/ai/recommendations and displays a list of courses/resources with title, reason, and CTA link.
  Skeleton loader while fetching.
• IntelligentProgress – Fetches the existing GET /api/user/progress endpoint and renders a progress bar with AI-generated insights (streak, time
  spent, daily goal).
• SmartNotifications – Fetches GET /api/ai/reminders, supports dismissing via DELETE /api/ai/reminders/:id, uses the existing toast pattern for
  confirmations.
• NaturalLanguageQuery – Search input posting to POST /api/ai/search with results list, empty state, and loading/error states.

Placeholder API Endpoints

The following backend endpoints need to be implemented to match:

Method	Path	Body	Response
POST	/api/ai/chat	{ message, context }	{ data: { reply } }
GET	/api/ai/recommendations	—	{ data: Recommendation[] }
GET	/api/ai/reminders	—	{ data: Reminder[] }
DELETE	/api/ai/reminders/:id	—	{ success: true }
POST	/api/ai/search	{ query }	{ data: SearchResult[] }

Tests

25 tests in src/components/ai/__tests__/ai-components.test.tsx covering:

• Loading, success, error, and empty states for all components
• Message send + reply flow in LearningAssistant
• Reminder dismiss with toast confirmation
• NaturalLanguageQuery submit and result rendering

All API calls are mocked — no real AI calls in tests.

Checklist

• No console errors
• Uses lucide-react icons throughout
• Tailwind CSS with responsive + dark mode support
• Accessible (aria-live, aria-label, role attributes, keyboard navigable)
• Matches existing component and API patterns
• 25/25 tests passing

[drips-wave]

@JoesWalker 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