Commit graph

8 commits

Author SHA1 Message Date
e44bea11c1 fix: Remove module-level side effect from useMachineStore initialization
**Problem:**
Store initialization was happening at module load via side effect:
```typescript
useMachineStore.getState()._setupSubscriptions();
```

This caused several issues:
- Executed before app was ready
- Made testing difficult (runs before test setup)
- Hard to control initialization timing
- Could cause issues in different environments

**Solution:**
- Added public `initialize()` method to useMachineStore
- Call initialization from App component's useEffect (proper lifecycle)
- Removed module-level side effect

**Benefits:**
-  Controlled initialization timing
-  Better testability (no side effects on import)
-  Follows React lifecycle patterns
-  No behavioral changes for end users

**Testing:**
- Build tested successfully
- Linter passed
- All TypeScript types validated

Fixes #38

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2025-12-26 23:29:08 +01:00
2b5e925e72 feature: Refactor useMachineStore into focused stores
Split the 570-line useMachineStore into three focused stores for better
separation of concerns and improved re-render optimization:

**New Stores:**
- useMachineUploadStore (128 lines): Pattern upload state and logic
- useMachineCacheStore (194 lines): Pattern caching and resume functionality
- useMachineStore (reduced to ~245 lines): Connection, status, and polling

**Benefits:**
- Components only subscribe to relevant state (reduces unnecessary re-renders)
- Clear separation of concerns (upload, cache, connection)
- Easier to test and maintain individual stores
- 30% reduction in main store size

**Technical Details:**
- Uses dynamic imports to avoid circular dependencies
- Maintains all existing functionality
- Updated FileUpload, PatternCanvas, and App components
- All TypeScript compilation errors resolved
- Build tested successfully

Implements conservative 2-store extraction approach from issue #31.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2025-12-26 23:21:25 +01:00
2b5e1d763b fix: Store original and uploaded pattern data to prevent rotation inconsistencies
Store both original unrotated pesData and uploaded rotated pesData in cache
to ensure exact consistency on resume and prevent issues from algorithm changes
between versions. This fixes rotation/position reset issues after page reload.

- Cache original unrotated pattern + rotation angle for editing
- Cache exact uploaded pattern data sent to machine
- Restore original offset after loading cached pattern
- Use cached uploaded data on resume instead of recalculating

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2025-12-26 22:48:25 +01:00
d813c22df5 feature: Add pattern rotation with Konva Transformer
Implement comprehensive pattern rotation functionality:
- Use Konva Transformer for native rotation UI with visual handles
- Apply rotation transformation at upload time to stitch coordinates
- Two-layer preview system: original (draggable/rotatable) and uploaded (locked)
- Automatic position compensation for center shifts after rotation
- PEN encoding/decoding with proper bounds calculation from decoded stitches
- Comprehensive unit tests for rotation math and PEN round-trip
- Restore original unrotated pattern on delete

The rotation is applied by transforming stitch coordinates around the pattern's
geometric center, then re-encoding to PEN format. Position adjustments compensate
for center shifts caused by PEN encoder rounding to maintain visual alignment.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2025-12-25 21:06:48 +01:00
38afe33826 style: Apply linter formatting to useMachineStore
Auto-formatted by linter:
- Single quotes → double quotes
- Line wrapping for better readability

No logic changes.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2025-12-17 12:27:34 +01:00
467eb9df95 refactor: Derive patternUploaded from patternInfo instead of syncing state
Removed redundant patternUploaded state from PatternStore and replaced
it with a derived selector usePatternUploaded() in MachineStore that
computes it from patternInfo !== null.

This eliminates duplicate state, removes the need for synchronization
logic, and ensures a single source of truth for pattern upload status.

Updated all components (App, LeftSidebar, FileUpload, PatternCanvas,
WorkflowStepper) to use the derived selector.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2025-12-17 11:25:26 +01:00
11b710eb17 feature: Reorganize code into formats folder structure
Moved embroidery format-related code from utils to new formats folder:

Structure:
- src/formats/pen/ - PEN format encoding and parsing
  - encoder.ts (was utils/penEncoder.ts)
  - encoder.test.ts (was utils/penEncoder.test.ts)
  - parser.ts (was utils/penParser.ts)
  - PEN constants moved inline to encoder.ts

- src/formats/import/ - Pattern import/conversion (currently PES)
  - worker.ts (was workers/patternConverter.worker.ts)
  - client.ts (was utils/patternConverterClient.ts)
  - pesImporter.ts (was utils/pystitchConverter.ts)
  - pyodideLoader.ts (was utils/pyodideLoader.ts)
  - constants.ts (PyStitch/pyembroidery constants)

Benefits:
- Better separation of concerns
- PEN encoder is co-located with PEN parser
- Import logic is in one place and extensible for other formats
- Removed utils/embroideryConstants.ts - split into appropriate locations
- Updated all 18 import references across the codebase

All tests passing, build successful.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2025-12-14 12:19:21 +01:00
e015c587bd feature: Implement Zustand state management
- Add zustand dependency for modern state management
- Create three separate stores for better code organization:
  - useMachineStore: Machine connection, status, and operations
  - usePatternStore: Pattern data, offset, and upload state
  - useUIStore: Pyodide and UI-specific state
- Migrate App.tsx from useBrotherMachine hook to Zustand stores
- Use useShallow for optimized multi-value selections
- Implement dynamic polling intervals based on machine state
- Add ESLint ignore for .vite build directory

Benefits:
- Better separation of concerns with logical store divisions
- Improved performance through selector-based subscriptions
- Cleaner code replacing 445-line hook with maintainable stores
- Full TypeScript support with proper typing

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2025-12-12 21:28:52 +01:00