@critical-path/svelte 0.2.1 → 0.2.3

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @critical-path/svelte
 
+## 0.2.3
+
+### Patch Changes
+
+- 3470b61: add optimistic updates with error rollback to Svelte state classes and React hooks
+
+## 0.2.2
+
+### Patch Changes
+
+- Updated dependencies [df22aad]
+  - @critical-path/core@0.2.1
+  - @critical-path/client@0.1.4
+
 ## 0.2.1
 
 ### Patch Changes

package/dist/index.js

@@ -38,8 +38,21 @@ var n = class {
 		}
 	}
 	async createProject(e) {
-		let t = await this.client.createProject(e);
-		return this.data = [...this.data, t], t;
+		let t = `temp_${Date.now()}_${Math.random().toString(36).substring(2, 7)}`, n = (/* @__PURE__ */ new Date()).toISOString(), r = {
+			...e,
+			id: t,
+			createdAt: n,
+			updatedAt: n
+		};
+		this.data = [...this.data, r];
+		try {
+			let n = await this.client.createProject(e);
+			return this.data = this.data.map((e) => e.id === t ? n : e), n;
+		} catch (e) {
+			this.data = this.data.filter((e) => e.id !== t);
+			let n = e instanceof Error ? e : Error(String(e));
+			throw this.error = n, n;
+		}
 	}
 };
 function r(e) {
@@ -85,15 +98,61 @@ var i = class {
 		}
 	}
 	async createTask(e) {
-		let t = await this.client.createTask(e);
-		return this.data = [...this.data, t], t;
+		let t = `temp_${Date.now()}_${Math.random().toString(36).substring(2, 7)}`, n = (/* @__PURE__ */ new Date()).toISOString(), r = {
+			...e,
+			id: t,
+			createdAt: n,
+			updatedAt: n
+		};
+		this.data = [...this.data, r];
+		try {
+			let n = await this.client.createTask(e);
+			return this.data = this.data.map((e) => e.id === t ? n : e), n;
+		} catch (e) {
+			this.data = this.data.filter((e) => e.id !== t);
+			let n = e instanceof Error ? e : Error(String(e));
+			throw this.error = n, n;
+		}
 	}
 	async updateTaskStatus(e, t) {
-		let n = await this.client.updateTask(e, { status: t }), r = this.data.findIndex((t) => t.id === e);
-		return r !== -1 && (this.data[r] = n), n;
+		let n = this.data.findIndex((t) => t.id === e);
+		if (n === -1) return this.client.updateTask(e, { status: t });
+		let r = this.data[n], i = {
+			...r,
+			status: t,
+			updatedAt: (/* @__PURE__ */ new Date()).toISOString()
+		}, a = [...this.data];
+		a[n] = i, this.data = a;
+		try {
+			let n = await this.client.updateTask(e, { status: t }), r = this.data.findIndex((t) => t.id === e);
+			if (r !== -1) {
+				let e = [...this.data];
+				e[r] = n, this.data = e;
+			}
+			return n;
+		} catch (t) {
+			let n = this.data.findIndex((t) => t.id === e);
+			if (n !== -1) {
+				let e = [...this.data];
+				e[n] = r, this.data = e;
+			}
+			let i = t instanceof Error ? t : Error(String(t));
+			throw this.error = i, i;
+		}
 	}
 	async deleteTask(e) {
-		await this.client.deleteTask(e), this.data = this.data.filter((t) => t.id !== e);
+		let t = this.data.findIndex((t) => t.id === e);
+		if (t === -1) return this.client.deleteTask(e);
+		let n = this.data[t];
+		this.data = this.data.filter((t) => t.id !== e);
+		try {
+			await this.client.deleteTask(e);
+		} catch (e) {
+			let r = [...this.data];
+			r.splice(t, 0, n), this.data = r;
+			let i = e instanceof Error ? e : Error(String(e));
+			throw this.error = i, i;
+		}
 	}
 };
 function a(e, t) {

package/dist/project-state.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"project-state.svelte.d.ts","sourceRoot":"","sources":["../src/project-state.svelte.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAEnD,qBAAa,YAAY;IAKX,OAAO,CAAC,MAAM;IAJ1B,IAAI,YAAyB;IAC7B,OAAO,UAA0B;IACjC,KAAK,eAA8B;gBAEf,MAAM,EAAE,kBAAkB;IAExC,KAAK;IAYL,aAAa,CAAC,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,GAAG,WAAW,GAAG,WAAW,CAAC;CAK3E;AAED,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,kBAAkB,GAAG,YAAY,CAE3E"}
+{"version":3,"file":"project-state.svelte.d.ts","sourceRoot":"","sources":["../src/project-state.svelte.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAEnD,qBAAa,YAAY;IAKX,OAAO,CAAC,MAAM;IAJ1B,IAAI,YAAyB;IAC7B,OAAO,UAA0B;IACjC,KAAK,eAA8B;gBAEf,MAAM,EAAE,kBAAkB;IAExC,KAAK;IAYL,aAAa,CAAC,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,GAAG,WAAW,GAAG,WAAW,CAAC;CA0B3E;AAED,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,kBAAkB,GAAG,YAAY,CAE3E"}

package/dist/task-state.svelte.d.ts

@@ -10,7 +10,7 @@ export declare class TaskState {
     fetch(): Promise<void>;
     createTask(input: Omit<Task, 'id' | 'createdAt' | 'updatedAt'>): Promise<Task>;
     updateTaskStatus(taskId: string, status: TaskStatus): Promise<Task>;
-    deleteTask(taskId: string): Promise<void>;
+    deleteTask(taskId: string): Promise<boolean | undefined>;
 }
 export declare function createTaskState(client: CriticalPathClient, projectId?: string): TaskState;
 //# sourceMappingURL=task-state.svelte.d.ts.map

package/dist/task-state.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"task-state.svelte.d.ts","sourceRoot":"","sources":["../src/task-state.svelte.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAE5D,qBAAa,SAAS;IAMlB,OAAO,CAAC,MAAM;IACP,SAAS,CAAC,EAAE,MAAM;IAN3B,IAAI,SAAsB;IAC1B,OAAO,UAA0B;IACjC,KAAK,eAA8B;gBAGzB,MAAM,EAAE,kBAAkB,EAC3B,SAAS,CAAC,EAAE,MAAM,YAAA;IAGrB,KAAK;IAYL,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,GAAG,WAAW,GAAG,WAAW,CAAC;IAM9D,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU;IASnD,UAAU,CAAC,MAAM,EAAE,MAAM;CAIhC;AAED,wBAAgB,eAAe,CAC7B,MAAM,EAAE,kBAAkB,EAC1B,SAAS,CAAC,EAAE,MAAM,GACjB,SAAS,CAEX"}
+{"version":3,"file":"task-state.svelte.d.ts","sourceRoot":"","sources":["../src/task-state.svelte.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAE5D,qBAAa,SAAS;IAMlB,OAAO,CAAC,MAAM;IACP,SAAS,CAAC,EAAE,MAAM;IAN3B,IAAI,SAAsB;IAC1B,OAAO,UAA0B;IACjC,KAAK,eAA8B;gBAGzB,MAAM,EAAE,kBAAkB,EAC3B,SAAS,CAAC,EAAE,MAAM,YAAA;IAGrB,KAAK;IAYL,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,GAAG,WAAW,GAAG,WAAW,CAAC;IA2B9D,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU;IAyCnD,UAAU,CAAC,MAAM,EAAE,MAAM;CAuBhC;AAED,wBAAgB,eAAe,CAC7B,MAAM,EAAE,kBAAkB,EAC1B,SAAS,CAAC,EAAE,MAAM,GACjB,SAAS,CAEX"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@critical-path/svelte",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "Svelte 5 Runes state and reactive integrations for Critical Path headless project management framework",
   "author": "Jack James",
   "license": "MIT",
@@ -18,8 +18,8 @@
     }
   },
   "dependencies": {
-    "@critical-path/client": "0.1.3",
-    "@critical-path/core": "0.2.0"
+    "@critical-path/client": "0.1.4",
+    "@critical-path/core": "0.2.1"
   },
   "peerDependencies": {
     "svelte": "^5.0.0"

package/src/index.test.ts

@@ -45,7 +45,7 @@ describe('@critical-path/svelte Svelte 5 Runes Test Suite', () => {
       expect(projectState.error).toBeNull();
     });
 
-    it('creates project and appends to reactive data', async () => {
+    it('creates project optimistically and rolls back on failure', async () => {
       const mockCreated: Project = {
         id: 'proj_2',
         name: 'Project 2',
@@ -62,11 +62,20 @@ describe('@critical-path/svelte Svelte 5 Runes Test Suite', () => {
 
       expect(res).toEqual(mockCreated);
       expect(projectState.data).toEqual([mockCreated]);
+
+      // Test error rollback
+      const failingClient = {
+        createProject: vi.fn().mockRejectedValue(new Error('Network error'))
+      } as unknown as CriticalPathClient;
+      const failingState = new ProjectState(failingClient);
+
+      await expect(failingState.createProject({ name: 'Failed Proj', key: 'FAIL' })).rejects.toThrow('Network error');
+      expect(failingState.data).toEqual([]);
     });
   });
 
   describe('TaskState', () => {
-    it('fetches, creates, updates status, and deletes tasks', async () => {
+    it('fetches, creates, updates status, and deletes tasks with optimistic updates', async () => {
       const mockTask: Task = {
         id: 'task_1',
         projectId: 'proj_1',
@@ -90,11 +99,61 @@ describe('@critical-path/svelte Svelte 5 Runes Test Suite', () => {
 
       expect(taskState.data).toEqual([mockTask]);
 
+      // Update status
       await taskState.updateTaskStatus('task_1', 'in_progress');
       expect(taskState.data[0].status).toBe('in_progress');
 
+      // Delete task
       await taskState.deleteTask('task_1');
       expect(taskState.data).toEqual([]);
     });
+
+    it('rolls back task status update on server error', async () => {
+      const mockTask: Task = {
+        id: 'task_1',
+        projectId: 'proj_1',
+        title: 'Task 1',
+        status: 'todo',
+        priority: 'medium',
+        createdAt: '2026-01-01',
+        updatedAt: '2026-01-01'
+      };
+
+      const failingClient = {
+        getTasks: vi.fn().mockResolvedValue([mockTask]),
+        updateTask: vi.fn().mockRejectedValue(new Error('Server error'))
+      } as unknown as CriticalPathClient;
+
+      const taskState = createTaskState(failingClient, 'proj_1');
+      await taskState.fetch();
+
+      await expect(taskState.updateTaskStatus('task_1', 'in_progress')).rejects.toThrow('Server error');
+      // Should be rolled back to 'todo'
+      expect(taskState.data[0].status).toBe('todo');
+    });
+
+    it('rolls back task deletion on server error', async () => {
+      const mockTask: Task = {
+        id: 'task_1',
+        projectId: 'proj_1',
+        title: 'Task 1',
+        status: 'todo',
+        priority: 'medium',
+        createdAt: '2026-01-01',
+        updatedAt: '2026-01-01'
+      };
+
+      const failingClient = {
+        getTasks: vi.fn().mockResolvedValue([mockTask]),
+        deleteTask: vi.fn().mockRejectedValue(new Error('Delete failed'))
+      } as unknown as CriticalPathClient;
+
+      const taskState = createTaskState(failingClient, 'proj_1');
+      await taskState.fetch();
+
+      await expect(taskState.deleteTask('task_1')).rejects.toThrow('Delete failed');
+      // Should restore deleted task
+      expect(taskState.data).toEqual([mockTask]);
+    });
   });
 });

package/src/project-state.svelte.ts

@@ -22,9 +22,30 @@ export class ProjectState {
   }
 
   async createProject(input: Omit<Project, 'id' | 'createdAt' | 'updatedAt'>) {
-    const created = await this.client.createProject(input);
-    this.data = [...this.data, created];
-    return created;
+    const tempId = `temp_${Date.now()}_${Math.random().toString(36).substring(2, 7)}`;
+    const now = new Date().toISOString();
+    const tempProject: Project = {
+      ...input,
+      id: tempId,
+      createdAt: now,
+      updatedAt: now
+    };
+
+    // Optimistically add temp project
+    this.data = [...this.data, tempProject];
+
+    try {
+      const created = await this.client.createProject(input);
+      // Replace temp project with server created project
+      this.data = this.data.map((p) => (p.id === tempId ? created : p));
+      return created;
+    } catch (err) {
+      // Rollback on error
+      this.data = this.data.filter((p) => p.id !== tempId);
+      const errorObj = err instanceof Error ? err : new Error(String(err));
+      this.error = errorObj;
+      throw errorObj;
+    }
   }
 }
 

package/src/task-state.svelte.ts

@@ -25,23 +25,95 @@ export class TaskState {
   }
 
   async createTask(input: Omit<Task, 'id' | 'createdAt' | 'updatedAt'>) {
-    const created = await this.client.createTask(input);
-    this.data = [...this.data, created];
-    return created;
+    const tempId = `temp_${Date.now()}_${Math.random().toString(36).substring(2, 7)}`;
+    const now = new Date().toISOString();
+    const tempTask: Task = {
+      ...input,
+      id: tempId,
+      createdAt: now,
+      updatedAt: now
+    };
+
+    // Optimistically add temp task
+    this.data = [...this.data, tempTask];
+
+    try {
+      const created = await this.client.createTask(input);
+      // Replace temp task with created task from server
+      this.data = this.data.map((t) => (t.id === tempId ? created : t));
+      return created;
+    } catch (err) {
+      // Rollback on error
+      this.data = this.data.filter((t) => t.id !== tempId);
+      const errorObj = err instanceof Error ? err : new Error(String(err));
+      this.error = errorObj;
+      throw errorObj;
+    }
   }
 
   async updateTaskStatus(taskId: string, status: TaskStatus) {
-    const updated = await this.client.updateTask(taskId, { status });
     const idx = this.data.findIndex((t) => t.id === taskId);
-    if (idx !== -1) {
-      this.data[idx] = updated;
+    if (idx === -1) {
+      return this.client.updateTask(taskId, { status });
+    }
+
+    const previousTask = this.data[idx];
+    const optimisticTask: Task = {
+      ...previousTask,
+      status,
+      updatedAt: new Date().toISOString()
+    };
+
+    // Optimistically update local task status
+    const newData = [...this.data];
+    newData[idx] = optimisticTask;
+    this.data = newData;
+
+    try {
+      const updated = await this.client.updateTask(taskId, { status });
+      const currentIdx = this.data.findIndex((t) => t.id === taskId);
+      if (currentIdx !== -1) {
+        const confirmedData = [...this.data];
+        confirmedData[currentIdx] = updated;
+        this.data = confirmedData;
+      }
+      return updated;
+    } catch (err) {
+      // Rollback to previous task on error
+      const rollbackIdx = this.data.findIndex((t) => t.id === taskId);
+      if (rollbackIdx !== -1) {
+        const rollbackData = [...this.data];
+        rollbackData[rollbackIdx] = previousTask;
+        this.data = rollbackData;
+      }
+      const errorObj = err instanceof Error ? err : new Error(String(err));
+      this.error = errorObj;
+      throw errorObj;
     }
-    return updated;
   }
 
   async deleteTask(taskId: string) {
-    await this.client.deleteTask(taskId);
+    const idx = this.data.findIndex((t) => t.id === taskId);
+    if (idx === -1) {
+      return this.client.deleteTask(taskId);
+    }
+
+    const previousTask = this.data[idx];
+
+    // Optimistically remove task
     this.data = this.data.filter((t) => t.id !== taskId);
+
+    try {
+      await this.client.deleteTask(taskId);
+    } catch (err) {
+      // Rollback on error by re-inserting at previous index
+      const restoredData = [...this.data];
+      restoredData.splice(idx, 0, previousTask);
+      this.data = restoredData;
+      const errorObj = err instanceof Error ? err : new Error(String(err));
+      this.error = errorObj;
+      throw errorObj;
+    }
   }
 }