7fbc743c4c
Implement comprehensive skill customization system allowing teachers to: - Configure existing default skills with custom difficulty settings - Create entirely new custom skills from scratch - Visualize skills in mastery progression context with directional edges - Interact with difficulty space using 2D plot with hover tooltips Database Schema: - custom_skills table: Stores user-created skills - skill_customizations table: Stores modifications to default skills - Both tables track regrouping config, display rules, and metadata API Endpoints: - POST /api/worksheets/skills/custom - Create custom skill - GET /api/worksheets/skills/custom - List custom skills - PUT /api/worksheets/skills/custom/[id] - Update custom skill - DELETE /api/worksheets/skills/custom/[id] - Delete custom skill - POST /api/worksheets/skills/[skillId]/customize - Save customization - GET /api/worksheets/skills/customizations - List customizations Components: - DifficultyPlot2D: Interactive 2D visualization of difficulty space - Regrouping Intensity (x-axis) × Scaffolding Level (y-axis) - Dual mode: Default presets vs Mastery progression skills - Directional edges showing skill progression sequence - Hover tooltips with skill details - Click to select configuration - Visual legend explaining elements - SkillConfigurationModal: Modal for skill configuration - Name and description fields - Digit range slider - 2D difficulty plot integration - Shows mastery progression context when editing - Real-time configuration summary - MasteryModePanel Integration: - "Configure Skill" button for existing skills - "Create Custom Skill" button for new skills - Passes mastery progression to modal for context Visual Design: - Purple theme (#9333ea) for mastery progression skills - Green theme (#10b981) for current configuration - Dashed arrows with triangular arrow heads - Numbered skill circles with hover tooltips - Compact legend in top-right corner Technical Features: - PlotPoint interface for custom skill plotting - Conditional snapping to either presets or custom points - Vector math for arrow head calculations - Z-ordering: edges before points - Event propagation control for hover interactions - Storybook examples for both components Bug Fixes: - Fix page indicator stuck on page 1 in WorksheetPreview - Changed from threshold-based to most-visible-page tracking - Works correctly for both scroll directions 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| .claude | ||
| .storybook | ||
| __tests__ | ||
| content/blog | ||
| data | ||
| docs | ||
| drizzle | ||
| e2e | ||
| public | ||
| scripts | ||
| src | ||
| .dockerignore.test | ||
| .gitignore | ||
| CARD_SORTING_PORT_PLAN.md | ||
| COMPLEMENT_RACE_PORT_PLAN.md | ||
| DEVELOPMENT_STANDARDS.md | ||
| LINTING.md | ||
| README.md | ||
| biome.jsonc | ||
| drizzle.config.ts | ||
| eslint.config.js | ||
| next-env.d.ts | ||
| next.config.js | ||
| package.json | ||
| panda.config.ts | ||
| playwright.config.ts | ||
| pnpm-lock.yaml | ||
| server.js | ||
| svg-processing-test.js | ||
| test-arcade-api.sh | ||
| test-flashcards-final.pdf | ||
| test-flashcards.pdf | ||
| test-simplified.pdf | ||
| test_fullscreen_persistence.html | ||
| test_panda_simple.html | ||
| tsconfig.json | ||
| tsconfig.server.json | ||
| vitest.config.ts | ||