{"id":21667724,"url":"https://github.com/alan2207/mobx-async-toolkit","last_synced_at":"2026-06-24T17:31:42.821Z","repository":{"id":98816359,"uuid":"444074126","full_name":"alan2207/mobx-async-toolkit","owner":"alan2207","description":"Toolkit for handling async operations in MobX stores","archived":false,"fork":false,"pushed_at":"2022-05-16T11:33:02.000Z","size":136,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-01-25T08:27:03.695Z","etag":null,"topics":["async","cache","mobx","mobx-state","mobx-store","mutation","query","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alan2207.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-01-03T13:38:32.000Z","updated_at":"2023-06-14T00:16:18.000Z","dependencies_parsed_at":"2023-05-25T14:00:30.123Z","dependency_job_id":null,"html_url":"https://github.com/alan2207/mobx-async-toolkit","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alan2207%2Fmobx-async-toolkit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alan2207%2Fmobx-async-toolkit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alan2207%2Fmobx-async-toolkit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alan2207%2Fmobx-async-toolkit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alan2207","download_url":"https://codeload.github.com/alan2207/mobx-async-toolkit/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244566948,"owners_count":20473451,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["async","cache","mobx","mobx-state","mobx-store","mutation","query","typescript"],"created_at":"2024-11-25T11:46:42.287Z","updated_at":"2026-06-24T17:31:42.109Z","avatar_url":"https://github.com/alan2207.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# mobx-async-toolkit\n\n[![NPM](https://img.shields.io/npm/v/mobx-async-toolkit.svg)](https://www.npmjs.com/package/mobx-async-toolkit)\n\nToolkit for handling async operations in MobX stores\n\n## Table of Contents\n\n- [Prerequisites](#prerequisites)\n- [Installation](#installation)\n- [Usage](#usage)\n- [API](#api)\n- [Contributing](#contributing)\n- [LICENSE](#license)\n\n## Prerequisites\n\nIt is required to have `mobx` installed.\n\n## Installation\n\n```\n$ npm install mobx-async-toolkit\n```\n\nWith Yarn:\n\n```\n$ yarn add mobx-async-toolkit\n```\n\n## Usage\n\nFirst of all, a `Toolkit` instance must be created and exported.\n\n```ts\n// src/lib/toolkit.ts\n\nimport { createToolkit } from 'mobx-async-toolkit';\n\nexport const toolkit = createToolkit();\n```\n\nThen it can be used to create queries and mutations as following:\n\n```ts\nimport { makeAutoObservable } from 'mobx';\nimport {\n  createTodo,\n  CreateTodoOptions,\n  getTodo,\n  GetTodoOptions,\n  getTodos,\n  GetTodosOptions,\n  Todo,\n} from '../lib/api';\nimport { toolkit } from '../lib/toolkit';\n\nexport class TodoStore {\n  constructor() {\n    makeAutoObservable(this);\n  }\n\n  todoQuery = toolkit.createQuery\u003cTodo, GetTodoOptions\u003e({\n    fn: getTodo,\n    key: 'todo',\n  });\n\n  todosQuery = toolkit.createQuery\u003cTodo[], GetTodosOptions\u003e({\n    fn: getTodos,\n    key: 'todos',\n  });\n\n  createTodoMutation = toolkit.createMutation\u003cTodo, CreateTodoOptions\u003e({\n    fn: createTodo,\n  });\n}\n```\n\nThen a query can be consumed as following:\n\n```ts\nconst todoStore = new TodoStore();\n\ntodoStore.todosQuery.data;\ntodoStore.todosQuery.status;\ntodoStore.todosQuery.error;\ntodoStore.todosQuery.fetch(options);\ntodoStore.todosQuery.refetch();\n```\n\nAnd here is a mutation:\n\n```ts\nimport { toolkit } from '../../lib/toolkit';\n\nconst todoStore = new TodoStore();\n\nconst handleSubmit = (data: CreateTodoOptions) =\u003e {\n  await todoStore.createTodoMutation.mutate(data);\n\n  // refetch data after a mutation:\n  await this.model.todosQuery.refetch();\n};\n\ntodoStore.createTodoMutation.status;\ntodoStore.createTodoMutation.error;\n```\n\n## API\n\n### `createToolkit`\n\nFunction that creates and returns a `Toolkit` instance.\n\n```ts\n// src/lib/auth.ts\nexport const toolkit = createToolkit();\n```\n\n### `Toolkit`\n\nOrganizes queries and mutations.\n\n```ts\n// src/lib/auth.ts\nexport const toolkit = createToolkit();\n```\n\n###### `Toolkit` options\n\nA `Toolkit` instance will have the following properties and methods:\n\n- `createQuery: (options: QueryOptions \u0026 {key: string}) =\u003e Query`\n\n  - creates a new `Query` instance\n  - If `key` is provided, the query will be treated as a singleton.\n\n- `createMutation: (options: MutationOptions) =\u003e Mutation`\n\n  - creates a new `Mutation` instance\n\n### `Query`\n\nControls and tracks the lifecycle of a query\n\n```ts\nconst todosQuery = toolkit.createQuery\u003cTodo[], GetTodosOptions\u003e({\n  fn: getTodos,\n  key: 'todos',\n});\n```\n\n#### `QueryOptions`:\n\n- `fn: (options?: Options) =\u003e Promise\u003cData\u003e`\n\n  - function that fetches data\n\n  - once resolved, its return value will be set as the `data` property of the query\n\n- `onSuccess: (data: Data, options?: Options) =\u003e void`\n\n  - called if the query succeeds\n\n- `onError: (error: Error, options?: Options) =\u003e void`\n  - called if the query fails\n\n###### A `Query` instance will have the following properties and methods:\n\n- `data: Data | null`\n\n  - state of the data that is being fetched\n\n- `status: Status`\n\n  - status of a query\n\n- `error: Error`\n\n  - error of a query\n\n- `fetch: (options?: Options) =\u003e Promise\u003cData | undefined\u003e`\n\n  - triggers a query to start fetching the data\n\n- `refetch: () =\u003e Promise\u003cData | undefined\u003e`\n\n  - re-runs latest `fetch` call\n\n- `startPolling: (interval: number, options: Options) =\u003e Promise\u003cvoid\u003e`\n\n  - fetches data on passed `interval`\n\n- `stopPolling: () =\u003e void)`\n\n  - stops polling\n\n- `isIdle: boolean`\n- `isLoading: boolean`\n- `isSuccess: boolean`\n- `isError: boolean`\n\n### `Mutation`\n\nControls and tracks the lifecycle of a mutation\n\n```ts\nconst createTodoMutation = toolkit.createMutation\u003cTodo, CreateTodoOptions\u003e({\n  fn: createTodo,\n});\n```\n\n#### `MutationOptions`:\n\n- `fn: (options?: Options) =\u003e Promise\u003cdata | undefined\u003e`\n\n  - function that calls mutation operation\n\n- `onSuccess: (data: Data, options?: Options) =\u003e void`\n\n  - called if the mutation succeeds\n\n- `onError: (error: Error, options?: Options) =\u003e void`\n  - called if the mutation fails\n\n###### A `Mutation` instance will have the following properties and methods:\n\n- `status: Status`\n\n  - status of a query\n\n- `error: Error`\n\n  - error of a query\n\n- `mutate: (options?: Options): Promise\u003cData | undefined\u003e`\n\n  - triggers a mutation operation\n\n- `isIdle: boolean`\n- `isLoading: boolean`\n- `isSuccess: boolean`\n- `isError: boolean`\n\n## Contributing\n\n1. Clone this repo\n2. Create a branch: `git checkout -b your-feature`\n3. Make some changes\n4. Test your changes\n5. Push your branch and open a Pull Request\n\n## LICENSE\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falan2207%2Fmobx-async-toolkit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falan2207%2Fmobx-async-toolkit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falan2207%2Fmobx-async-toolkit/lists"}