feat: Web app for side-by-side lecture annotation and translation correction

[mmcky]

Problem

Currently, reviewing and correcting translations requires cloning the target repo, editing Markdown files directly, and submitting PRs manually. This workflow is too technical for many potential reviewers (e.g. bilingual economics students, native speakers who aren't developers).

There's also no structured way to capture reviewer corrections as training data to improve future AI translations.

Proposal

Build a web interface for side-by-side lecture annotation and correction:

Core Layout

┌─────────────────────────┬─────────────────────────┐
│   SOURCE (English)      │   TARGET (中文)          │
│                         │                         │
│   [read-only]           │   [editable]            │
│                         │                         │
│   Section-by-section    │   Section-by-section    │
│   synchronized scroll   │   synchronized scroll   │
└─────────────────────────┴─────────────────────────┘
                    [Submit Corrections]

Key Features

1. Dual-pane viewer — source language (read-only) alongside target language (editable), synced by section
2. Section-level editing — click a section to edit the translation, with the English source visible for reference
3. PR generation — corrections are collected and submitted as a PR to the target repo
4. Correction logging — every edit is recorded as structured data (original translation → corrected translation, section ID, reviewer, timestamp)
5. Feeds back into action-translation — collected corrections serve as training signal:
   • Common correction patterns can inform translation prompts
   • Repeated corrections for the same term can update the glossary
   • Section-level quality scores can prioritise future review

Possible Architecture

• Frontend: React/Next.js or similar, Markdown rendering with section-level editing
• Backend: GitHub API for reading source/target repos and creating PRs
• Auth: GitHub OAuth (reviewers need write access or fork-based PRs)
• Data: Correction records stored alongside the target repo or in a separate annotations repo

Workflow

1. Reviewer opens a lecture in the web app
2. Browses section-by-section with source and target side by side
3. Clicks to edit any section's translation
4. Submits — app creates a PR with the corrections
5. Correction data is logged for future translation improvement

Integration Points

• Could use the existing heading-map metadata to align source ↔ target sections
• Section IDs from parser.ts provide stable anchors across languages
• The review quality rubric from reviewer.ts could highlight sections likely to need attention
• Correction patterns could feed into language-config.ts rules

Open Questions

• Standalone app or integrated into the existing QuantEcon site?
• Should it support inline comments/suggestions (like Google Docs) in addition to direct editing?
• How to handle concurrent reviewers editing the same lecture?
• MVP scope: start with read-only dual pane + single-section edit + PR creation?

[mmcky]

@HumphreyYang thanks for our discussions today. I have recorded this idea as well.