{"id":22662727,"url":"https://github.com/ng-turkey/ngxs-reset-plugin","last_synced_at":"2025-08-06T11:30:42.766Z","repository":{"id":34183957,"uuid":"171208128","full_name":"ng-turkey/ngxs-reset-plugin","owner":"ng-turkey","description":"Reset plugin for NGXS: Effortlessly clears, resets, or overwrites NGXS states respecting the state tree.","archived":false,"fork":false,"pushed_at":"2024-06-23T16:05:04.000Z","size":1444,"stargazers_count":108,"open_issues_count":5,"forks_count":8,"subscribers_count":18,"default_branch":"master","last_synced_at":"2024-11-09T06:16:14.180Z","etag":null,"topics":["angular","clear","defaults","ngxs","overwrite","plugin","reset","state-management"],"latest_commit_sha":null,"homepage":"https://stackblitz.com/edit/ngxs-pizza","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/ng-turkey.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","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":"2019-02-18T03:26:14.000Z","updated_at":"2024-10-15T01:58:38.000Z","dependencies_parsed_at":"2024-06-18T18:22:03.398Z","dependency_job_id":"40605597-ead8-4824-9279-9b23128395b8","html_url":"https://github.com/ng-turkey/ngxs-reset-plugin","commit_stats":{"total_commits":103,"total_committers":10,"mean_commits":10.3,"dds":"0.47572815533980584","last_synced_commit":"c7ca20dec54450fc8f76d4924a33d22f2013817e"},"previous_names":[],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ng-turkey%2Fngxs-reset-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ng-turkey%2Fngxs-reset-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ng-turkey%2Fngxs-reset-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ng-turkey%2Fngxs-reset-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ng-turkey","download_url":"https://codeload.github.com/ng-turkey/ngxs-reset-plugin/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":228886856,"owners_count":17986899,"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":["angular","clear","defaults","ngxs","overwrite","plugin","reset","state-management"],"created_at":"2024-12-09T12:02:03.275Z","updated_at":"2024-12-09T12:02:06.380Z","avatar_url":"https://github.com/ng-turkey.png","language":"TypeScript","funding_links":[],"categories":["State Management"],"sub_categories":["NGXS"],"readme":"# NGXS Reset Plugin\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://travis-ci.org/ng-turkey/ngxs-reset-plugin\"\u003e\u003cimg src=\"https://travis-ci.org/ng-turkey/ngxs-reset-plugin.svg?branch=master\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://codeclimate.com/github/ng-turkey/ngxs-reset-plugin/maintainability\"\u003e\u003cimg src=\"https://api.codeclimate.com/v1/badges/94f61495acc71b81033a/maintainability\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://codecov.io/gh/ng-turkey/ngxs-reset-plugin\"\u003e\u003cimg src=\"https://codecov.io/gh/ng-turkey/ngxs-reset-plugin/branch/master/graph/badge.svg\" /\u003e\u003c/a\u003e\n  \u003cimg src=\"https://img.shields.io/github/license/ng-turkey/ngxs-reset-plugin.svg\" /\u003e\n  \u003ca href=\"https://twitter.com/ngTurkiye\"\u003e\u003cimg src=\"https://img.shields.io/twitter/follow/ngTurkiye.svg?label=Follow\"/\u003e\u003c/a\u003e\n\u003c/p\u003e\n\nThis plugin is designed to clear, reset, and overwrite [NGXS](https://www.npmjs.com/package/@ngxs/store) states on dispatch of predefined actions. Please check [this playground](https://stackblitz.com/edit/ngxs-pizza?file=src%2Fapp%2Forder%2Forder.handler.ts) for a working example.\n\nPlease use the table below to make sure you are using the correct version of this library.\n\n| Angular\u003cbr\u003eversion | ngxs-reset-plugin\u003cbr\u003eversion |\n| :----------------: | :--------------------------: |\n|        18+         |              4               |\n|        14+         |              3               |\n|         13         |              2               |\n|         12         |              2               |\n|        \u003c 12        |              1               |\n\nIf you wonder why you would need a plugin like this, when there is already a reset method in NGXS, you may find the [reasons](#reasons-to-use-this-plugin) below. Otherwise, skip to the [installation](#installation) or [usage](#usage) section.\n\n## Reasons to Use This Plugin\n\nCalling the reset method of NGXS Store like `store.reset(myNewStateObject)` can:\n\n- replace a state with a new one.\n- do it silently (triggering nothing), which is useful for tests.\n\nDrawbacks/missing features of the reset method of NGXS Store are:\n\n- the developer needs to select states or state snapshots and build a new state tree up of them. This is both difficult and painful multi-level states are in place. It becomes even more difficult when multiple state slices are required to be kept. Imagine shared parent states and merging several state slices based on path meta data.\n- there is no method proposed to reset a state to its already defined defaults. That is an even more crucial requirement due to the simple fact that it is more frequently needed and replacing a state with anything other than defaults can potentially break your app.\n- the execution is untrackable. Tracking it with [Redux DevTools plugin](https://www.npmjs.com/package/@ngxs/devtools-plugin) or the [Logger plugin](https://www.npmjs.com/package/@ngxs/logger-plugin) or acting upon it declaratively (such as a handler) is impossible.\n- it \"can cause unintended side effects if improperly used and should be used with caution!\" (quoted from NGXS official documentation)\n\nReset plugin improves all these because it:\n\n- provides a **clear and easy to implement API** (simple action dispatch).\n- **resolves multi-level state structures** and keeps intended states while removing others.\n- **eliminates the complexity of resetting a state tree** by recursively resetting child states.\n- **finds and sets defaults of state classes** without any boilerplate or additional work.\n- **supports every tracking method any other action dispatch does**, including but not limited to Redux DevTools, Logger plugin, and Actions stream by following the CQRS pattern.\n\nHow the concept of meta reducers related to all this is:\n\n- every issue above can be solved using them. However, that literally means writing your own plugin.\n- this plugin IS basically a meta reducer, but a robust and carefully tested one.\n\n## Installation\n\nRun the following code in your terminal:\n\n```\nyarn add ngxs-reset-plugin\n```\n\nor if you are using npm:\n\n```\nnpm install ngxs-reset-plugin\n```\n\n## Usage\n\n### Setup Before Initial Use\n\nImport `withNgxsResetPlugin` into your app config like:\n\n```TS\nimport { withNgxsResetPlugin } from 'ngxs-reset-plugin';\n\nexport const appConfig: ApplicationConfig = {\n  providers: [\n    providerStore([]),\n    withNgxsResetPlugin()\n  ]\n}\n```\n\n### How to Clear States\n\nTo clear all states (on logout for example):\n\n```TS\nthis.store.dispatch(\n  new StateClear()\n);\n```\n\nTo clear all states but one: \\*\n\n```TS\nthis.store.dispatch(\n  new StateClear(SomeState)\n);\n```\n\nTo clear all states but some: \\*\n\n```TS\nthis.store.dispatch(\n  new StateClear(SomeState, SomeOtherState)\n);\n```\n\n\\* Keeping states while deleting others is useful especially combined with [`@ngxs/storage-plugin`](https://npmjs.com/package/@ngxs/storage-plugin)\n\n### How to Reset States to Defaults\n\nTo reset a single state to its defaults on certain events (such as route change):\n\n```TS\nthis.store.dispatch(\n  new StateReset(SomeState)\n);\n```\n\nTo reset multiple states to their defaults (may prove useful in distributed scenarios):\n\n```TS\nthis.store.dispatch(\n  new StateReset(SomeState, SomeOtherState)\n);\n```\n\n### How to Reset All States to Defaults\n\nTo reset all states to their defaults:\n\n```TS\nthis.store.dispatch(\n  new StateResetAll()\n);\n```\n\nTo reset all states to their defaults but keep one:\n\n```TS\nthis.store.dispatch(\n  new StateResetAll(SomeState)\n);\n```\n\nTo reset all states to their defaults but keep some:\n\n```TS\nthis.store.dispatch(\n  new StateResetAll(SomeState, SomeOtherState)\n);\n```\n\n\u003e **Important Note:** Since it does not know anything about the actual states, `StateResetAll` resets the states based on `InitState` action dispatched by NGXS at init. If you are persisting states with @ngxs/storage-plugin and want them to get reset as well, you need to reset those persisted states with `StateReset` instead. Otherwise, next time the app starts, the storage plugin will put them in the store before `InitState` and `StateResetAll` will reset to initial states from storage and not to the original defaults of those states.\n\n### How to Overwrite States\n\nTo replace the value of a single state with a new one: \\*\n\n```TS\n// type OverwriteTuple = [StateClass, any];\n\nthis.store.dispatch(\n  new StateOverwrite([SomeState, newStateValue])\n);\n```\n\nTo replace the value of multiple states with new ones: \\*\n\n```TS\n// type OverwriteTuple = [StateClass, any];\n\nthis.store.dispatch(\n  new StateOverwrite([SomeState, newStateValue], [SomeOtherState, newOtherStateValue])\n);\n```\n\n\\* Overwriting states with improper values can break your application. Proceed with caution.\n\n## Roadmap\n\n- [x] Clear NGXS state(s) on dispatch of StateClear action\n\n- [x] Reset some NGXS state(s) to defaults on dispatch of StateReset action\n\n- [x] Reset all NGXS states to defaults to on dispatch of StateResetAll action\n\n- [x] Overwrite NGXS state(s) on dispatch of StateOverwrite action\n\n- [x] Test coverage\n\n- [x] Documentation \u0026 examples\n\n- [x] Permissive license\n\n- [x] Inclusive code of conduct\n\n- [x] Issue submission templates\n\n- [x] Contribution guidelines\n\n- [x] CI integrations\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fng-turkey%2Fngxs-reset-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fng-turkey%2Fngxs-reset-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fng-turkey%2Fngxs-reset-plugin/lists"}