flux_crud_store_todo_entity_add_update_delete_quickstart.ts

1import { CrudStore, CrudActionType } from 'flux-crud-store';
2
3// 1. Define your data model
4interface Todo {
5  id: string;
6  title: string;
7  completed: boolean;
8}
9
10// 2. Initialize the store for the Todo type
11// The constructor takes a unique namespace/name for the store
12const todoStore = new CrudStore<Todo>('todos');
13
14// 3. Subscribe to changes
15todoStore.addListener(() => {
16  console.log('Store updated:', todoStore.getState());
17});
18
19// 4. Perform CRUD operations using standard flux actions
20// Create / Add
21todoStore.dispatch({
22  type: CrudActionType.CREATE,
23  payload: { id: '1', title: 'Learn Flux CRUD Store', completed: false }
24});
25
26// Update
27todoStore.dispatch({
28  type: CrudActionType.UPDATE,
29  payload: { id: '1', completed: true }
30});
31
32// Delete
33todoStore.dispatch({
34  type: CrudActionType.DELETE,
35  payload: { id: '1' }
36});
37
38// Access state directly
39const allTodos = todoStore.getAll();
40console.log('Current items:', allTodos);