Skip to content

Kwilo Intelligence (AI Tutor)

The AI Tutor at /ai-tutor is the product's core: SSE streaming, a mode system, and conversation resume. It serves trainers (7 modes) and learners (5 modes) with a shared chat surface and UX guardrails around the streaming core.

How it works

The streaming core, mode switching, and conversation resume work as one chat. The guardrails that wrap it:

  • Inside DashboardLayout. The page renders in the standard <main> with the normal sidebar and topbar, so it has the same chrome as every other page (it used to bypass the layout with a fixed-height container).
  • Visible mode chips + "More". Learners see Explain | Practice | Doubt as chips with Revision | Exam Prep in a "More" dropdown, matching the trainer pattern (4 chips + dropdown). The most common modes are discoverable without opening a dropdown.
  • Correct learner copy. The welcome reads "Your AI learning partner", not the trainer-research "What would you like to create?".
  • Tool results render inline. A ToolResultCard renders message.toolResult as a collapsible card below the tool-call badge: tool name, success/failure, and output truncated with a "Show more" toggle. When a tool completes, the spinning badge transitions to a result card instead of disappearing.
  • Quota via QuotaPill. Remaining quota and reset time surface through the B2C QuotaPill in the topbar and near the composer, so users see their budget before they hit the wall. The dedicated QuotaExceededModal is wired only on the B2C ChatPage freemium path, not on /ai-tutor.

Lesson-context wiring (opening the tutor from a lesson with ?lessonId and ?mode context) is a separate phase, not built here.

Trainer modes (7)

ID Label Purpose
chat Chat Free-form conversation
research Research Web search + citations
lesson_plan Lesson Planning Generate lesson structures
create_content Content Creation Generate lesson content
question_bank Question Bank Generate assessment questions
teaching_ideas Teaching Ideas Pedagogy brainstorming
student_feedback Learner Feedback Draft feedback for learners

Learner modes (5)

ID Label Purpose
explain Explain Concept explanations
practice Practice Practice problems
doubt Clear Doubts Problem-solving guidance
revision Revision Review & revision
exam_prep Exam Prep Mock tests & exam practice

Where it lives

  • apps/web/src/pages/shared/AITutorPage/index.tsx
  • apps/web/src/pages/shared/AITutorPage/components/ChatInput/: split folder: index.tsx (~148 LOC) + ModeChipRow, ContextSelectorRow, HintBar
  • apps/web/src/pages/shared/AITutorPage/components/MessageBubble.tsx: renders tool results
  • apps/web/src/pages/b2c/components/QuotaPill.tsx + apps/web/src/components/layouts/dashboard/TopBar.tsx: quota surface
  • apps/web/src/components/ai-quota/QuotaExceededModal.tsx: wired on B2C ChatPage, not /ai-tutor
  • apps/web/src/services/ai-tutor.ts: mode constants