History

Thomas Hallock ae1a0a8e2d fix(practice): use React Query cache for /resume page session data The /resume page was showing stale session data when navigating mid-session. Now uses useActiveSessionPlan with server props as initialData, so cached session data from the active practice session takes priority. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>		2025-12-09 12:48:05 -06:00
..
.claude	fix(practice): make session plan page self-sufficient for data loading	2025-12-09 11:52:52 -06:00
.storybook	…
__tests__	…
content/blog	feat: add auto-submit on correct answer + Newton poem blog post	2025-12-07 06:46:12 -06:00
data	…
docs	feat(practice): add three-part daily practice session system	2025-12-06 12:23:53 -06:00
drizzle	feat(help-system): add schema for progressive help and feedback loop	2025-12-06 15:16:52 -06:00
e2e	feat(know-your-world): live crop updates and safe zone improvements	2025-11-28 19:46:23 -06:00
public	feat: add auto-submit on correct answer + Newton poem blog post	2025-12-07 06:46:12 -06:00
scripts	…
src	fix(practice): use React Query cache for /resume page session data	2025-12-09 12:48:05 -06:00
.dockerignore.test	…
.gitignore	…
CARD_SORTING_PORT_PLAN.md	…
COMPLEMENT_RACE_PORT_PLAN.md	…
DEVELOPMENT_STANDARDS.md	…
LINTING.md	…
README.md	feat(practice): integrate progressive help with decomposition display	2025-12-07 08:56:35 -06:00
biome.jsonc	chore: miscellaneous updates and documentation	2025-12-08 11:40:59 -06:00
drizzle.config.ts	…
eslint.config.js	…
next-env.d.ts	…
next.config.js	…
package.json	feat(know-your-world): add fire tracer animation for learning mode takeover	2025-12-01 09:44:03 -06:00
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	…

README.md

Soroban Web Application

Interactive web application for learning soroban (Japanese abacus) calculation with tutorials, practice sessions, and multiplayer arcade games.

Features

Tutorials - Step-by-step lessons for learning soroban techniques
Practice Sessions - Adaptive practice with progressive help system
Arcade Games - Multiplayer educational games for reinforcement
Worksheet Generator - Create printable math worksheets

Getting Started

# Install dependencies
pnpm install

# Start development server
pnpm dev

# Run type checks
npm run type-check

# Run all quality checks
npm run pre-commit

Documentation

Components

Component	Description
Decomposition Display	Interactive mathematical decomposition visualization
Worksheet Generator	Math worksheet creation with Typst PDF generation

Games

Game	Description
Arcade System	Modular multiplayer game architecture
Know Your World	Geography quiz game

Developer Documentation

Located in .claude/ directory:

CLAUDE.md - Project conventions and guidelines
CODE_QUALITY_REGIME.md - Quality check procedures
GAME_SETTINGS_PERSISTENCE.md - Game config architecture
Z_INDEX_MANAGEMENT.md - Z-index layering system
DEPLOYMENT.md - Deployment and CI/CD

Project Structure

apps/web/
├── src/
│   ├── app/                 # Next.js App Router pages
│   ├── components/          # Shared React components
│   │   ├── decomposition/   # Math decomposition display
│   │   ├── practice/        # Practice session components
│   │   └── tutorial/        # Tutorial player components
│   ├── contexts/            # React context providers
│   ├── arcade-games/        # Multiplayer game implementations
│   ├── hooks/               # Custom React hooks
│   ├── lib/                 # Utilities and libraries
│   └── db/                  # Database schema and queries
├── .claude/                 # Developer documentation
├── public/                  # Static assets
└── styled-system/           # Generated Panda CSS

Technology Stack

Framework: Next.js 14 (App Router)
Language: TypeScript
Styling: Panda CSS
Database: SQLite with Drizzle ORM
Abacus Visualization: @soroban/abacus-react

Parent: Main README - Complete project overview Abacus Component: packages/abacus-react - Abacus visualization library