diff --git a/modules/rtasks/components/folk-tasks-board.ts b/modules/rtasks/components/folk-tasks-board.ts index 3012555..1998658 100644 --- a/modules/rtasks/components/folk-tasks-board.ts +++ b/modules/rtasks/components/folk-tasks-board.ts @@ -20,7 +20,7 @@ class FolkTasksBoard extends HTMLElement { private isDemo = false; private dragTaskId: string | null = null; private editingTaskId: string | null = null; - private showCreateForm = false; + private showCreateForm: string | false = false; private boardView: "board" | "checklist" = "board"; private dragOverStatus: string | null = null; private dragOverIndex = -1; @@ -413,21 +413,28 @@ class FolkTasksBoard extends HTMLElement { return ''; } - private async submitCreateTask(title: string, priority: string, description: string, dueDate?: string) { + private async submitCreateTask(title: string, priority: string, description: string, dueDate?: string, status?: string) { if (!title.trim()) return; + const taskStatus = status || this.statuses[0] || "TODO"; if (this.isDemo) { - this.tasks.push({ id: `d${Date.now()}`, title: title.trim(), status: this.statuses[0] || "TODO", priority, labels: [], description: description.trim() || undefined, due_date: dueDate || null, sort_order: 0 }); + this.tasks.push({ id: `d${Date.now()}`, title: title.trim(), status: taskStatus, priority, labels: [], description: description.trim() || undefined, due_date: dueDate || null, sort_order: 0 }); this.showCreateForm = false; this.render(); return; } try { const base = this.getApiBase(); - await fetch(`${base}/api/spaces/${this.workspaceSlug}/tasks`, { + const res = await fetch(`${base}/api/spaces/${this.workspaceSlug}/tasks`, { method: "POST", headers: this.authHeaders({ "Content-Type": "application/json" }), - body: JSON.stringify({ title: title.trim(), priority, description: description.trim() || undefined, due_date: dueDate || undefined }), + body: JSON.stringify({ title: title.trim(), priority, status: taskStatus, description: description.trim() || undefined, due_date: dueDate || undefined }), }); + if (!res.ok) { + const data = await res.json().catch(() => ({})); + this.error = data.error || `Failed to create task (${res.status})`; + this.render(); + return; + } this.showCreateForm = false; this.loadTasks(); } catch { this.error = "Failed to create task"; this.render(); } @@ -647,6 +654,7 @@ class FolkTasksBoard extends HTMLElement { .column { min-width: 240px; max-width: 280px; flex-shrink: 0; background: var(--rs-bg-surface-sunken); border: 1px solid var(--rs-border); border-radius: 10px; padding: 12px; + cursor: pointer; } .col-header { font-size: 13px; font-weight: 600; text-transform: uppercase; color: var(--rs-text-muted); margin-bottom: 10px; display: flex; justify-content: space-between; } .col-count { background: var(--rs-border); border-radius: 10px; padding: 0 8px; font-size: 11px; } @@ -715,7 +723,8 @@ class FolkTasksBoard extends HTMLElement { @keyframes pulse-indicator { 0%, 100% { opacity: 0.6; } 50% { opacity: 1; box-shadow: 0 0 8px var(--rs-primary); } } /* Empty column drop zone */ - .empty-drop-zone { border: 2px dashed var(--rs-border); border-radius: 8px; padding: 24px 12px; text-align: center; color: var(--rs-text-muted); font-size: 12px; font-weight: 600; pointer-events: none; opacity: 0.4; transition: all 0.15s; } + .empty-drop-zone { border: 2px dashed var(--rs-border); border-radius: 8px; padding: 24px 12px; text-align: center; color: var(--rs-text-muted); font-size: 12px; font-weight: 600; cursor: pointer; opacity: 0.4; transition: all 0.15s; } + .empty-drop-zone:hover { opacity: 0.7; border-color: var(--rs-primary); color: var(--rs-primary); } .column.drag-over .empty-drop-zone { opacity: 1; border-color: #22c55e; color: #22c55e; background: rgba(34,197,94,0.05); } /* Checklist view */ @@ -857,11 +866,12 @@ class FolkTasksBoard extends HTMLElement { this._tour.start(); } - private renderCreateForm(): string { - if (!this.showCreateForm) return ""; + private renderCreateForm(forStatus: string): string { + if (this.showCreateForm !== forStatus) return ""; return `
+