Drafts system implemented

nonpacks/static/css/style.css

@@ -3870,3 +3870,23 @@ a.deletelink {
 .notify-item a { color: var(--md-sys-color-on-surface, #cdd6f4); }
 .notify-item.notify-unread a { color: var(--ctp-mocha-blue, #1e66f5); font-weight: 600; }
 .notify-new { color: var(--ctp-mocha-red); font-weight: 600; }
+
+/* My Projects page */
+.myprojects-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
+.myprojects-header h1 { margin: 0; }
+.myprojects-layout { display: grid; grid-template-columns: 1fr 1px 1fr; gap: 24px; align-items: start; }
+.myprojects-divider { background: var(--md-sys-color-outline-variant, #45475a); align-self: stretch; }
+.myprojects-col h2 { margin-top: 0; font-size: 1.05rem; }
+@media (max-width: 900px) {
+    .myprojects-layout { grid-template-columns: 1fr; }
+    .myprojects-divider { height: 1px; width: 100%; }
+}
+.draft-list { display: flex; flex-direction: column; gap: 0.6rem; }
+.draft-card {
+    background: var(--md-sys-color-surface-variant, #45475a);
+    border-radius: 10px; padding: 0.7rem 0.8rem;
+    display: flex; flex-direction: column; gap: 0.3rem;
+}
+.draft-title { font-weight: 600; color: var(--md-sys-color-on-surface, #cdd6f4); text-decoration: none; }
+.draft-meta { color: var(--md-sys-color-on-surface-variant, #a6adc8); font-size: 0.75rem; }
+.draft-actions { display: flex; gap: 0.4rem; align-items: center; }

nonpacks/static/js/create.js

@@ -9,6 +9,13 @@
         (document.getElementById('packs-draft-uploads') || { textContent: '[]' }).textContent
     );
 
+    const draftUuidEl = document.getElementById('packs-draft-uuid');
+    let draftUuid = '';
+    if (draftUuidEl) {
+        try { draftUuid = JSON.parse(draftUuidEl.textContent || '""'); }
+        catch (e) { draftUuid = draftUuidEl.textContent; }
+    }
+
     const autosaveStatus = document.getElementById('autosave-status');
     const csrf = getCookie('csrftoken');
     const csrfHeader = csrf ? { 'X-CSRFToken': csrf } : {};
@@ -50,7 +57,7 @@
         xhr.onerror = function () {
             setStatus('<i class="fas fa-exclamation-triangle"></i> Save failed', 'error');
         };
-        xhr.send(JSON.stringify({ data }));
+        xhr.send(JSON.stringify({ draft: draftUuid, data }));
     }
 
     function initAutosave() {
@@ -67,7 +74,7 @@
         setTimeout(() => setStatus('<i class="fas fa-check"></i> Saved just now', 'saved'), 2000);
     }
 
-    PacksUploads.init({ pending: pending, onReady: initAutosave });
+    PacksUploads.init({ pending: pending, draftUuid: draftUuid, onReady: initAutosave });
 
     function getCookie(name) {
         let cookieValue = null;

nonpacks/static/js/uploads.js

@@ -21,6 +21,7 @@
     function init(options) {
         const opts = options || {};
         const pending = opts.pending || [];
+        const draftUuid = opts.draftUuid || '';
         const csrf = getCookie('csrftoken');
         const csrfHeader = csrf ? { 'X-CSRFToken': csrf } : {};
 
@@ -112,6 +113,7 @@
             const fd = new FormData();
             fd.append('file', file);
             fd.append('kind', z.kind);
+            if (draftUuid) fd.append('draft_uuid', draftUuid);
 
             const xhr = new XMLHttpRequest();
             xhr.open('POST', '/api/uploads/');