Implemented comprehensive dark/light mode support throughout the app:
- Added ColorSchemeScript to layout for auto-detection of system preference
- Updated MantineProvider to use 'auto' color scheme (respects system)
- Updated theme.ts with dynamic Paper component styles based on color scheme
- Created ThemeToggle component with sun/moon icons
- Added toggle to desktop sidebar navigation
- Created theme-specific favicons (favicon-light.svg, favicon-dark.svg)
- Made ThoughtGalaxy 3D visualization theme-aware:
- Dynamic node colors based on theme
- Theme-aware lighting intensity
- Theme-aware link colors
- Theme-aware text labels
- Added comprehensive Playwright tests for theme functionality
- Theme preference persists via localStorage
Tested manually with Playwright MCP:
- ✅ Theme toggle switches between light and dark modes
- ✅ Theme persists across page reloads
- ✅ Both modes render correctly with appropriate colors
- ✅ Icons change based on current theme (sun/moon)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
This commit fixes two critical bugs in the galaxy navigation:
**Bug #1: Direct node URLs redirected to /chat**
- Updated AppStateMachine to recognize /galaxy/* paths (including query params) as galaxy state
- Changed line 55 from `pathname === '/galaxy'` to `pathname === '/galaxy' || pathname.startsWith('/galaxy/')`
- Changed line 89 to compare pathname instead of lastNavigatedPathRef to preserve query params
**Bug #2: Modal closed when clicking nodes**
- Refactored ThoughtGalaxy to use URL query params (?node=xxx) instead of route params (/galaxy/node:xxx)
- This prevents component unmounting when switching between nodes
- Deleted app/galaxy/[node-id]/page.tsx (no longer needed)
- Updated app/galaxy/page.tsx with documentation comment
- Modified ThoughtGalaxy to:
- Use useSearchParams() hook
- Get selectedNodeId from query params
- Update URL with query params on node click (doesn't cause remount)
- Clear query params when modal closes
**Testing:**
- Verified manually with Playwright MCP that /galaxy?node=xxx preserves query params
- Verified state machine correctly recognizes galaxy state
- Created comprehensive Playwright test suite in tests/playwright/galaxy.spec.ts
**Files changed:**
- components/AppStateMachine.tsx: Fixed state machine to handle /galaxy/* paths and preserve query params
- components/ThoughtGalaxy.tsx: Refactored to use query params instead of route params
- app/galaxy/page.tsx: Added documentation
- app/galaxy/[node-id]/page.tsx: Deleted (replaced with query param approach)
- tests/playwright/galaxy.spec.ts: Added comprehensive test suite
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Fixed OAuth client configuration to properly use localhost for client_id and 127.0.0.1 for redirect_uris per RFC 8252 and ATproto spec
- Added proper grapheme counting using RichText API instead of character length
- Fixed thread splitting to account for link suffix and thread indicators in grapheme limits
- Added GOOGLE_EMBEDDING_DIMENSIONS env var to all env files
- Added clear-nodes.ts utility script for database management
- Added galaxy node detail page route
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Increase logo size (48x48 desktop, 56x56 mobile) for better visibility
- Add logo as favicon
- Add logo to mobile header
- Move user menu to navigation bars (sidebar on desktop, bottom bar on mobile)
- Fix desktop chat layout - container structure prevents voice controls cutoff
- Fix mobile bottom bar - use icon-only ActionIcons instead of truncated text buttons
- Hide Create Node/New Conversation buttons on mobile to save header space
- Make fixed header and voice controls work properly with containers
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implements interactive 3D visualization of user's thought network using
React Three Fiber and UMAP dimensionality reduction.
Key components:
- /api/calculate-graph: UMAP projection from 768-D embeddings to 3-D coords
- /galaxy page: UI with "Calculate My Graph" button and 3D canvas
- ThoughtGalaxy component: Interactive R3F scene with nodes and links
- Magnitude tests: Comprehensive test coverage for galaxy features
Technical implementation:
- Uses umap-js for dimensionality reduction (768-D → 3-D)
- React Three Fiber for WebGL 3D rendering
- CameraControls for smooth navigation
- Client-side SurrealDB connection for fetching nodes/links
- Hackathon workaround: API uses root credentials with user DID filtering
Note: Authentication fix applied - API route uses root SurrealDB credentials
with JWT-extracted user DID filtering to maintain security while working
around JWT authentication issues in hackathon timeframe.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
