Files
professor/ROADMAP.md
Aodhan Collins f644937604 Initial commit — AI-powered coding tutor (Professor)
Next.js 16, React 19, Monaco editor, Anthropic SDK, multi-provider AI,
Wandbox Python execution, iframe HTML preview, SQLite auth + session persistence.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-04 21:48:34 +00:00

7.8 KiB
Raw Permalink Blame History

Professor — Feature Roadmap

Internal planning document. For architecture and file layout see CLAUDE.md.


Status Key

[ ] Planned  |  [~] In Progress  |  [x] Done


Features

[x] Response Modes

Hint Mode · Strict · Lenient

Three toggles that change how the AI reviews code and responds in chat.

  • Hint Mode (on/off): When ON the AI proactively suggests hints. When OFF it only confirms or rejects — the user must ask explicitly.
  • Strict: AI only accepts code that uses the exact approach the task required. Alternatives are flagged.
  • Lenient (default): Functionally equivalent code is accepted as long as it doesn't circumvent the lesson concept.

Implemented via system-prompt injections. UI: lightbulb toggle + Strict/Lenient pill in EditorToolbar. Settings persisted to localStorage under professor_response_mode and preserved across topic resets.

Key files: types/index.ts, lib/prompts.ts, hooks/useAppState.ts, components/editor/EditorToolbar.tsx, components/AppShell.tsx


[x] Resizable Panes

Drag handle between the editor and chat panes

A thin divider between the left and right panes can be dragged to resize. Clamped to 2080%. Works in both the horizontal (desktop) and vertical (mobile) flex directions — cursor-col-resize on lg+, cursor-row-resize below. Highlights blue on hover/drag.

Key files: components/AppShell.tsx


[x] Custom Topic Input

Free-text topic entry on the topic selector

A "Custom" section at the bottom of the topic selector lets users type any topic (e.g. "Python Classes", "CSS Grid") and pick Python or HTML. Creates a synthetic Topic object and feeds it into the normal task-generation flow.

Key files: components/TopicSelector.tsx


[x] Classroom / Homework Modes

Two distinct learning modes toggled per-session

A Classroom | Homework pill in the ChatPane header switches modes. Mode is preserved across topic resets.

  • Homework (default): Existing behaviour — Monaco editor on the left, task card + review chat on the right.
  • Classroom: Left pane becomes a scrollable AI-generated markdown lesson for the selected topic. Right pane becomes a pure Q&A chat (separate message history, different system prompt, no code review). The lesson is generated lazily on first switch and cached for the session.

AppMode, lessonContent, and classroomMessages added to AppState. Two new AI modes: generate_lesson and classroom_chat.

Key files: types/index.ts, hooks/useAppState.ts, lib/prompts.ts, app/api/ai/route.ts, hooks/useAI.ts, components/AppShell.tsx, components/chat/ChatPane.tsx, components/classroom/LessonPane.tsx (new)


[ ] 1. LLM Personality Cards

Teaching personas that change AI tone and style

Five built-in personas:

Persona Avatar Style
Professor 🎓 Formal, structured, methodical
Mentor 🌱 Warm, Socratic — asks "what do you think happens if…?"
Drill Sergeant Terse, demanding, minimal praise
Peer 👾 Casual, like a knowledgeable dev friend
Rubber Duck 🦆 Reflects questions back — makes you explain your own reasoning

Users can also define custom personas via a JSON template (public/personality-template.json). Custom cards are saved to localStorage.

Each persona adds a systemAddition string to every AI system prompt. Persona selection UI is a card-grid modal accessible via the toolbar.

Key files: lib/personalities.ts (new), components/PersonalityPicker.tsx (new), public/personality-template.json (new), types/index.ts, lib/prompts.ts, components/AppShell.tsx, components/editor/EditorToolbar.tsx


[ ] 2. TODO Tracker

AI-generated checklist that tracks lesson progress

When a task is generated the AI also produces a concrete checklist (e.g. "Define the function with the correct signature", "Handle the empty-input case"). Items are:

  • Ticked automatically: the review response contains a COMPLETED: 0,2 tag (zero-based indices) that is parsed and stripped before display.
  • Togglable manually by clicking the checkbox.

A progress counter ("3 / 5 complete") is shown at the top of the checklist, rendered inside TaskCard below the hints section.

Key files: components/chat/TodoList.tsx (new), types/index.ts, lib/prompts.ts, hooks/useAI.ts, hooks/useAppState.ts, components/chat/TaskCard.tsx


[ ] 3. Revision Journal

AI-generated cheat sheets saved per topic

A notebook icon in the chat header lets the user generate a concise markdown "cheat sheet" at any point. The AI summarises: key concepts covered, syntax patterns used, common pitfalls encountered in the session.

Entries are stored in the revision_journal DB table (for logged-in users) or localStorage (anonymous). A journal modal shows all past entries as expandable markdown cards, newest first.

Key files: components/JournalModal.tsx (new), app/api/journal/route.ts (new), db/schema.ts, types/index.ts, lib/prompts.ts, hooks/useAI.ts, components/chat/ChatPane.tsx


[ ] 4. Curriculum Generator

End-to-end lesson plans on any topic

User enters a free-text subject (e.g. "Python object-oriented programming"), picks a language and depth (beginner / intermediate / advanced), and the AI generates a structured 610 lesson syllabus. Lessons are unlocked and completed sequentially; each task is generated on-demand when the lesson starts.

⚠️ Heavy token usage. Curriculum generation uses significantly more tokens than a single task. This is surfaced clearly in the UI before generation.

Navigation: a collapsible sidebar shows all lessons with ✓ / ▶ / ○ status. A "Generate Curriculum" secondary CTA appears on the topic selector screen.

New tables: curricula Key files: components/CurriculumGenerator.tsx (new), components/CurriculumOverview.tsx (new), components/CurriculumSidebar.tsx (new), app/api/curriculum/route.ts (new), types/index.ts, hooks/useAppState.ts, hooks/useAI.ts, lib/prompts.ts, db/schema.ts, components/AppShell.tsx, components/TopicSelector.tsx


[ ] 5. Mermaid Diagrams in Classroom Mode

Flowcharts, sequence diagrams, and class diagrams in the lesson pane

Extends the Classroom mode lesson pane to render Mermaid diagrams embedded in the AI-generated lesson markdown. The lesson prompt is updated to produce diagrams where appropriate (e.g. flowcharts for control flow topics, class diagrams for OOP).

Note: This was originally scoped as a standalone "Q&A Mode / Blackboard" feature. The ---BLACKBOARD--- split-response approach is dropped in favour of rendering diagrams inline in the existing LessonPane — simpler and consistent with how the lesson document already works.

New package: mermaid Key files: components/classroom/LessonPane.tsx, lib/prompts.ts


Build Order Rationale

The original six features have been partially reordered based on what was built:

  • Response Modes, Resizable Panes, Custom Topics, Classroom/Homework — all shipped. These were zero-DB, low-risk changes that improved the core UX immediately.
  • Personality Cards next — still prompt-only, no DB, straightforward UI addition.
  • TODO Tracker — introduces checklist parsing reused by Curriculum.
  • Revision Journal — first new DB table; small scope, validates storage pattern.
  • Curriculum Generator — highest complexity; builds on TODO Tracker and needs its own DB table.
  • Mermaid in Classroom — cosmetic enhancement to an already-working mode; low risk, deferred until core features are stable.

DB Migration Notes

After Features 3 and 4 are implemented, run:

npm run db:push

New tables added: revision_journal, curricula. Existing data is unaffected.