// // examples.ts // import { EnhancedNestedQueue } from './queue'; // import { LocalStoragePersistence } from './persistence'; // import { useQueue, useActiveRecord } from './hooks'; // // Example 1: Basic Queue Usage // interface TodoItem { // id: number; // title: string; // completed: boolean; // subTasks?: TodoItem[]; // } // const todoQueue = new EnhancedNestedQueue([], { // persistence: new LocalStoragePersistence('todos'), // middleware: [ // { // beforeAction: (action) => { // console.log('Action:', action); // return action; // }, // afterAction: (action, state) => { // console.log('New State:', state); // } // } // ] // }); // // Example 2: React Component with Queue // function TodoList() { // const { data, queue, buffer } = useQueue([], { // persistence: new LocalStoragePersistence('todos') // }); // const addTodo = (title: string) => { // const newTodo = buffer.create({ // id: Date.now(), // title, // completed: false // }); // }; // const toggleTodo = (id: number) => { // const todo = data.find(t => t.id === id); // if (todo) { // buffer.update(id, { completed: !todo.completed }); // } // }; // return ( //
// // {data.map(todo => ( //
// toggleTodo(todo.id)} // /> // {todo.title} //
// ))} //
// ); // } // // Example 3: Active Record Pattern // function TodoEditor({ todoId }: { todoId: number }) { // const { data, queue } = useQueue([]); // const todo = data.find(t => t.id === todoId); // const { // record, // update, // save, // rollback, // isDirty // } = useActiveRecord(queue, todo!); // if (!record) return null; // return ( //
// update({ title: e.target.value })} // /> // // //
// ); // } // // Example 4: Complex Nested Data // interface Department { // id: number; // name: string; // employees: Employee[]; // } // interface Employee { // id: number; // name: string; // roles: string[]; // } // const departmentQueue = new EnhancedNestedQueue(); // // Adding nested data // departmentQueue.add({ // id: 1, // name: 'Engineering', // employees: [ // { id: 1, name: 'John', roles: ['dev'] } // ] // }, ''); // // Updating nested employee // departmentQueue.update('0.employees.0', { // roles: ['dev', 'lead'] // }); // // Sorting employees by name // departmentQueue.sort('name', { // path: '0.employees', // direction: 'asc' // }); // // Example 5: Batch Operations // async function batchUpdate() { // const buffer = departmentQueue.getBuffer(); // // Load multiple records // const records = await Promise.all([ // buffer.load({ id: 1, name: 'Dept 1', employees: [] }), // buffer.load({ id: 2, name: 'Dept 2', employees: [] }) // ]); // // Update multiple records // records.forEach(record => { // buffer.update(record.id, { name: `Updated ${record.data.name}` }); // }); // // Flush all changes at once // await buffer.flush(); // }