{"id":13496146,"url":"https://github.com/effector/redux-devtools-adapter","last_synced_at":"2025-06-28T04:33:19.567Z","repository":{"id":157926906,"uuid":"631602887","full_name":"effector/redux-devtools-adapter","owner":"effector","description":"Simple adapter to connect Effector's Inspect API to Redux DevTools","archived":false,"fork":false,"pushed_at":"2023-12-02T13:15:05.000Z","size":148,"stargazers_count":22,"open_issues_count":2,"forks_count":1,"subscribers_count":5,"default_branch":"main","last_synced_at":"2025-04-11T06:01:51.202Z","etag":null,"topics":["devtools","effector","redux"],"latest_commit_sha":null,"homepage":"https://npmjs.com/@effector/redux-devtools-adapter","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/effector.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}},"created_at":"2023-04-23T14:44:59.000Z","updated_at":"2025-01-08T06:26:04.000Z","dependencies_parsed_at":"2023-09-28T18:18:22.309Z","dependency_job_id":"f8d9a609-bb16-42d0-9c61-a7aeee52aa19","html_url":"https://github.com/effector/redux-devtools-adapter","commit_stats":{"total_commits":72,"total_committers":5,"mean_commits":14.4,"dds":"0.26388888888888884","last_synced_commit":"f2198f03ccd55648b2e457e33fa13c231db3099f"},"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/effector%2Fredux-devtools-adapter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/effector%2Fredux-devtools-adapter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/effector%2Fredux-devtools-adapter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/effector%2Fredux-devtools-adapter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/effector","download_url":"https://codeload.github.com/effector/redux-devtools-adapter/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249974003,"owners_count":21354270,"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":["devtools","effector","redux"],"created_at":"2024-07-31T19:01:43.009Z","updated_at":"2025-04-24T13:33:21.410Z","avatar_url":"https://github.com/effector.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"# redux-devtools-adapter\n\nSimple adapter to connect Effector's Inspect API to Redux DevTools, extracted from the old `effector-logger` project.\n\n\u003cimg width=\"1512\" alt=\"image\" src=\"https://user-images.githubusercontent.com/32790736/235296652-b74df685-c436-45c1-911e-7a6e99e78770.png\"\u003e\n\n## Installation\n\n```sh\nyarn add -D @effector/redux-devtools-adapter\n```\n\n## Usage\n\n### Prepare metadata\n\nTo make logs more useful we need additional metadata (like names, locations in the code, etc), which is provided by one of the `effector` plugins.\n\n#### Babel-plugin\n\nBabel-plugin is built-in in the `effector` package.\n\nJust add it to your babel configuration.\n\n```json\n{\n  \"plugins\": [\"effector/babel-plugin\"]\n}\n```\n\nIt is also useful to enable `loc` generation for dev environment, to see for exact locations of `sample`s and other operators in the code.\n\n```json\n{\n  \"plugins\": [[\"effector/babel-plugin\", { \"addLoc\": true }]]\n}\n```\n\n[Read the docs](https://effector.dev/docs/api/effector/babel-plugin/#usage)\n\n#### SWC Plugin\n\n[Read effector SWC plugin documentation](https://github.com/effector/swc-plugin)\n\n### In the code\n\nJust call `attachReduxDevTools()` somewhere in your project's entrypoint and you are good to go.\n\n```ts\n// e.g. src/main.ts\nimport { attachReduxDevTools } from \"@effector/redux-devtools-adapter\";\n\nattachReduxDevTools();\n```\n\nYou can also provide some additional configuration. All fields are optional.\n\n#### name\n\nType: `string`.\nWill be visible in the Redux Devtools\n\n#### scope\n\nType: `Scope`\nEffector's Scope from Fork API, if your app uses it.\n\nSee [the docs](https://effector.dev/docs/api/effector/scope/) and [the article](https://dev.to/effector/the-best-part-of-effector-4c27)\n\n#### trace\n\nType: `boolean`\nEnables traces of effector's calculations in the actions. Disabled by default.\n\n#### batch\n\nType: `boolean | { size: number; latency: number; }`.\nEnables batching of logs at the adapter's side. Redux DevTools are trying to print each and every log they get, which may cause performance issues in the large apps.\n\nWith batching enabled adapter sends logs only once in `latency` milliseconds and with number of logs no more than `size` number.\nThis means that only last `size` number of logs will be visible in the DevTools at all times.\n\nEnabled by default, defautls are: last 100 logs with latency 500 milliseconds.\n\n### stateTab\n\nType: `boolean`.\nEnables state tab with state of all stores at each point in time. May cause performance issues in the large apps. Disabled by default.\n\n#### devToolsConfig\n\nConfig for Redux DevTools, passed directly to the `connect` call.\nSee [the official docs](https://github.com/reduxjs/redux-devtools/blob/main/extension/docs/API/Arguments.md).\n\nExample of configurated call:\n\n```ts\nimport { attachReduxDevTools } from \"@effector/redux-devtools-adapter\";\n\nattachReduxDevTools({\n  name: \"My App\",\n  scope,\n  trace: true,\n});\n```\n\n### In the Next.js - Pages Router\n\n[Read effector/next documentation](https://github.com/effector/next#pages-router-dev-tools-example)\n\n### In the Next.js - App Router\n\n[Read effector/next documentation](https://github.com/effector/next#app-router-dev-tools-example)\n\n## Release process\n\n1. Check out the [draft release](https://github.com/effector/redux-devtools-adapter/releases).\n1. All PRs should have correct labels and useful titles. You can [review available labels here](https://github.com/effector/redux-devtools-adapter/blob/main/.github/release-drafter.yml).\n1. Update labels for PRs and titles, next [manually run the release drafter action](https://github.com/effector/redux-devtools-adapter/actions/workflows/release-drafter.yml) to regenerate the draft release.\n1. Review the new version and press \"Publish\"\n1. If required check \"Create discussion for this release\"\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feffector%2Fredux-devtools-adapter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feffector%2Fredux-devtools-adapter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feffector%2Fredux-devtools-adapter/lists"}