Initial commit

.context/Manual Session State Save.md

@@ -0,0 +1,82 @@
+### 1. Manual Save
+
+#### ✅ "Save Session" Button
+
+- Button icon: 🖫 (diskette), with tooltip: "Save session"
+    
+- Opens modal:
+    
+    - Input: name of the session
+        
+    - Option: overwrite existing session with same name (if applicable)
+        
+- Stores:
+    
+    - Name
+        
+    - Timestamp
+        
+    - State (`data`)
+        
+    - `isAutosave: false`
+        
+
+---
+
+### 2. Saved Sessions Panel
+
+#### ✅ Access
+
+- Button/icon to open modal or dropdown with saved sessions
+    
+
+#### 🔁 Display Rules
+
+- Top item: "Autosaved Session" (non-deletable, clearly labeled)
+    
+- Followed by manually saved sessions, **sorted alphabetically by name**
+    
+
+#### ✅ Item UI Elements
+
+- Session name
+    
+- Save timestamp
+    
+- Load button (clickable name)
+    
+- Delete button (only for manual saves)
+    
+    - Delete must open confirmation modal:
+        
+        > “Delete this saved session? This action cannot be undone.”
+        
+
+#### ✅ Loading a Saved Session
+
+- Replaces current app state with the saved one
+    
+- If unsaved changes exist, confirm before loading:
+    
+    > “Load saved session? This will replace your current progress.”
+    
+
+---
+
+### 🧠 Logic Extension: Loading Saved Sessions & Autosave
+
+> ✅ **When the user loads a saved session, autosave continues in the background.**
+
+- The **loaded state becomes the new working session**.
+    
+- All further changes are autosaved into the `Autosaved Session`.
+    
+- The user can still press "Save Session" again:
+    
+    - If using the **same name**, prompt:
+        
+        > “Overwrite the session ‘ChillBeat’? This will replace the saved version.”
+        
+        - Or offer a new name input
+            
+- User can also choose to **delete the older version** after saving.