diff --git a/.gitignore b/.gitignore index 268a2dc..4e3b8b4 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,7 @@ -node_modules -temp -*.log -.vscode -.idea -build +node_modules +temp +*.log +.vscode +.idea +build +packages/demo-main/src/react-app-env.d.ts diff --git a/packages/demo-main/package.json b/packages/demo-main/package.json index 06c2372..d063f01 100644 --- a/packages/demo-main/package.json +++ b/packages/demo-main/package.json @@ -1,6 +1,6 @@ { "name": "recoil-toolkit-demo-main", - "version": "0.0.2", + "version": "0.0.3", "private": true, "dependencies": { "@chakra-ui/react": "^1.1.2", @@ -18,7 +18,7 @@ "react-dom": "^17.0.1", "react-scripts": "4.0.1", "recoil": "yarn:@salvoravida/recoil@^0.1.4", - "recoil-toolkit" : "^0.0.2" + "recoil-toolkit": "^0.0.3" }, "devDependencies": { "typescript": "^4.1.3" diff --git a/packages/demo-main/src/App.tsx b/packages/demo-main/src/App.tsx index c31cad8..5295ef4 100644 --- a/packages/demo-main/src/App.tsx +++ b/packages/demo-main/src/App.tsx @@ -11,7 +11,7 @@ function App() { <> - + Recoil Todolist CRUD Example Fake Api delay : 2.500 ms diff --git a/packages/demo-main/src/recoil/hooks.ts b/packages/demo-main/src/recoil/hooks.ts index 6b310a3..d635245 100644 --- a/packages/demo-main/src/recoil/hooks.ts +++ b/packages/demo-main/src/recoil/hooks.ts @@ -1,5 +1,4 @@ import { useRecoilTask } from 'recoil-toolkit'; -import { Item } from '../server'; import { useRecoilState, useRecoilValue } from 'recoil'; import { itemLocked, itemStatus, todoList } from './atoms'; import { @@ -10,18 +9,14 @@ import { removeItemTask, } from './tasks'; -export const useGetTodoListTask = () => useRecoilTask(getTodoListTask, []); - -export const useTodoList = () => { - return { - ...useGetTodoListTask(), - data: useRecoilValue(todoList), - }; -}; - export const useItemStatus = (id: number) => useRecoilState(itemStatus(id)); export const useItemLocked = (id: number) => useRecoilValue(itemLocked(id)); +export const useTodoList = () => + useRecoilTask(getTodoListTask, [], { + dataSelector: todoList, + }); + export const useAddItemTask = () => useRecoilTask(addItemTask, [], { loaderStack: 'addItemTask', diff --git a/packages/recoil-toolkit/package.json b/packages/recoil-toolkit/package.json index c85193e..db8346c 100644 --- a/packages/recoil-toolkit/package.json +++ b/packages/recoil-toolkit/package.json @@ -1,6 +1,6 @@ { "name": "recoil-toolkit", - "version": "0.0.2", + "version": "0.0.3", "description": "recoil-toolkit", "main": "./build/es5/index.js", "module": "./build/es6/index.js", diff --git a/packages/recoil-toolkit/src/hooks/useRecoilTask.ts b/packages/recoil-toolkit/src/hooks/useRecoilTask.ts index 5467ded..d31c87d 100644 --- a/packages/recoil-toolkit/src/hooks/useRecoilTask.ts +++ b/packages/recoil-toolkit/src/hooks/useRecoilTask.ts @@ -5,13 +5,13 @@ import { lastTaskByKey, taskById, tasks, errorStack as errorStackAtom, loader } import { pushTask, updateTaskDone, updateTaskError, pushError } from '../updaters'; import { TaskOptions, TaskStatus, RecoilTaskInterface } from '../types'; -export function useRecoilTask, Return>( +export function useRecoilTask, Return, T>( taskCreator: (a: RecoilTaskInterface) => (...args: Args) => Return, deps?: ReadonlyArray, - options?: TaskOptions, + options?: TaskOptions, ) { const optionsRef = useRef(options || {}); //options freeze - const { key, errorStack, loaderStack, exclusive } = optionsRef.current; + const { key, errorStack, loaderStack, exclusive, dataSelector } = optionsRef.current; if (exclusive && !key) { throw 'Exclusive tasks must have a key!'; @@ -20,6 +20,8 @@ export function useRecoilTask, Return>( const taskId = useRef(0); const task = useRecoilValue(exclusive ? lastTaskByKey(key || '') : taskById(taskId.current)); + const taskData: T = dataSelector ? useRecoilValue(dataSelector) : task && task.data; + const execute = useRecoilCallback( ({ set, snapshot, ...rest }: RecoilTaskInterface) => async (...args: Args) => { if (exclusive && key) { @@ -49,7 +51,7 @@ export function useRecoilTask, Return>( loading: task && task.status === TaskStatus.Running, execute, error: task && task.error, - data: task && task.data, + data: taskData, success: task && task.status === TaskStatus.Done, taskId: taskId.current, }; diff --git a/packages/recoil-toolkit/src/types.ts b/packages/recoil-toolkit/src/types.ts index 0153204..bd4064a 100644 --- a/packages/recoil-toolkit/src/types.ts +++ b/packages/recoil-toolkit/src/types.ts @@ -11,13 +11,14 @@ export enum TaskStatus { Done, } -export type TaskOptions = { +export type TaskOptions = { key?: string; errorStack?: boolean; loaderStack?: string; exclusive?: boolean; startAuto?: boolean; startAutoArgs?: ReadonlyArray; + dataSelector?: RecoilValue; }; export type Task = {