mirror of
https://github.com/PR0M3TH3AN/Artstr-Studio.git
synced 2026-10-27 16:50:40 +00:00
- Fix 'key is not defined' error in publishDiscDesignToNostr function - Preserve layers when importing disc designs into template slots from both JSON files and Nostr - Check both discDesign.layers and top-level payload.layers during import - Populate designer metadata (title, category, imdbId) when loading projects - Auto-set Nostr browse modal to 'disc-design' filter when importing from template slots - Add undo/redo feature plan documentation for future implementation Co-Authored-By: Claude Sonnet 4.6 <[email protected]>
2.9 KiB
2.9 KiB
Undo/Redo Feature Plan
Overview
Add undo/redo functionality to allow users to fix mistakes and reverse unintended changes. State snapshots will be saved to browser localStorage.
Complexity
Moderate - Estimated 1-2 hours to implement
Key Components
1. Undo/Redo Stack
- Maintain two stacks:
undoStackandredoStack - Each stack stores snapshots of the entire
stateobject - Limit stack size to 20-50 snapshots to avoid filling localStorage (~2-5MB usage)
2. State Snapshot Capture
Save snapshots at major action points (not on every keystroke):
- Project import/load
- Add/delete/modify layers
- Design image URL changes
- Design property edits (fit, zoom, x, y, rotate)
- Metadata edits (title, category, imdbId)
- Add/remove disc designs in template slots
3. Storage Strategy
- Serialize state snapshots using
JSON.stringify() - Store in localStorage key like
undo-stackandredo-stack - Include timestamp with each snapshot for debugging
- Implement size checks to prevent localStorage overflow
4. Core Functions Needed
function saveUndoSnapshot(label)
// Save current state to undo stack, clear redo stack
function undo()
// Restore previous state from undo stack, move current to redo stack
function redo()
// Restore state from redo stack, move current to undo stack
function updateUndoRedoUI()
// Enable/disable undo/redo buttons based on stack availability
5. UI Changes
- Add "Undo" button in toolbar/header
- Add "Redo" button next to undo
- Show disabled state when no undo/redo available
- Optional: Show keyboard shortcuts (Ctrl+Z, Ctrl+Shift+Z)
- Optional: Show snapshot label on hover
6. Integration Points
Modify existing functions to call saveUndoSnapshot() after:
importDiscDesignFromPayload()- after design importedaddLayer()- after layer created- Layer deletion handlers
- Design image URL updates
- Metadata input change handlers
- Template preset changes
Performance Considerations
- Serializing/deserializing state is fast (~1-5ms)
- No performance impact on normal operations
- localStorage access is synchronous and fast
- Consider debouncing rapid metadata edits
Limitations
- Browser localStorage only (not synced across devices/browsers)
- Limited to current session if user closes browser
- Large image URLs could impact stack size
- No undo for external Nostr publishes (data already on network)
Future Enhancements
- IndexedDB for larger storage capacity
- Undo history UI showing snapshots
- Selective undo (undo specific action)
- Cloud sync of undo history
- Keyboard shortcuts configuration
Testing Checklist
- Undo works after layer add
- Undo works after image URL change
- Undo works after metadata edit
- Redo restores undone actions
- Stack limits prevent localStorage overflow
- Buttons disable when stacks empty
- Page refresh preserves undo stack (if kept in localStorage)
- Works across template/designer mode switches