{"id":19273964,"url":"https://github.com/rintoj/react-reflux","last_synced_at":"2025-10-11T20:05:10.389Z","repository":{"id":57343411,"uuid":"87344654","full_name":"rintoj/react-reflux","owner":"rintoj","description":"The main objective of this module is to provide an implementation that has minimal touch points, while providing all the benefits of Redux","archived":false,"fork":false,"pushed_at":"2017-05-26T04:31:39.000Z","size":574,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-08-23T04:01:51.712Z","etag":null,"topics":[],"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/rintoj.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-04-05T18:44:50.000Z","updated_at":"2017-05-13T03:44:13.000Z","dependencies_parsed_at":"2022-09-12T06:30:36.217Z","dependency_job_id":null,"html_url":"https://github.com/rintoj/react-reflux","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/rintoj/react-reflux","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rintoj%2Freact-reflux","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rintoj%2Freact-reflux/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rintoj%2Freact-reflux/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rintoj%2Freact-reflux/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rintoj","download_url":"https://codeload.github.com/rintoj/react-reflux/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rintoj%2Freact-reflux/sbom","scorecard":{"id":776917,"data":{"date":"2025-08-11","repo":{"name":"github.com/rintoj/react-reflux","commit":"59f4cafc228042312b9c145876dc40d0d9155ed6"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":1.7,"checks":[{"name":"Code-Review","score":0,"reason":"Found 0/30 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"SAST","score":0,"reason":"no SAST tool detected","details":["Warn: no pull requests merged into dev branch"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"Vulnerabilities","score":0,"reason":"55 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw","Warn: Project is vulnerable to: GHSA-832h-xg76-4gv6","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-cwfw-4gq5-mrqx","Warn: Project is vulnerable to: GHSA-g95f-p29q-9xw4","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-9vvw-cc9w-f27h","Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c","Warn: Project is vulnerable to: GHSA-hr2v-3952-633q","Warn: Project is vulnerable to: GHSA-h6ch-v84p-w6p9","Warn: Project is vulnerable to: GHSA-qrmc-fj45-qfc2","Warn: Project is vulnerable to: GHSA-fjxv-7rqg-78g4","Warn: Project is vulnerable to: GHSA-8r6j-v8pm-fqw3","Warn: Project is vulnerable to: MAL-2023-462","Warn: Project is vulnerable to: GHSA-xf7w-r453-m56c","Warn: Project is vulnerable to: GHSA-pfrx-2q88-qq97","Warn: Project is vulnerable to: GHSA-44pw-h2cw-w3vq","Warn: Project is vulnerable to: GHSA-jp4x-w63m-7wgm","Warn: Project is vulnerable to: GHSA-c429-5p7v-vgjp","Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37","Warn: Project is vulnerable to: GHSA-896r-f27r-55mw","Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h","Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq","Warn: Project is vulnerable to: GHSA-fvqr-27wr-82fm","Warn: Project is vulnerable to: GHSA-4xc9-xhrj-v574","Warn: Project is vulnerable to: GHSA-x5rq-j2xg-h7qm","Warn: Project is vulnerable to: GHSA-jf85-cpcp-j695","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9","Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-w9mr-4mfr-499f","Warn: Project is vulnerable to: GHSA-r683-j2x4-v87g","Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9","Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp","Warn: Project is vulnerable to: GHSA-6g33-f262-xjp4","Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-2m39-62fm-q8r3","Warn: Project is vulnerable to: GHSA-mf6x-7mm4-x2g7","Warn: Project is vulnerable to: GHSA-j44m-qm6p-hp7m","Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9","Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh","Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36","Warn: Project is vulnerable to: GHSA-g7q5-pjjr-gqvp","Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3","Warn: Project is vulnerable to: GHSA-884p-74jh-xrg2","Warn: Project is vulnerable to: GHSA-j7fq-p9q7-5wfv","Warn: Project is vulnerable to: GHSA-662x-fhqg-9p8v","Warn: Project is vulnerable to: GHSA-394c-5j6w-4xmx","Warn: Project is vulnerable to: GHSA-fhg7-m89q-25r3","Warn: Project is vulnerable to: GHSA-332q-7ff2-57h2"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-23T03:51:27.913Z","repository_id":57343411,"created_at":"2025-08-23T03:51:27.913Z","updated_at":"2025-08-23T03:51:27.913Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279008578,"owners_count":26084480,"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","status":"online","status_checked_at":"2025-10-11T02:00:06.511Z","response_time":55,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":[],"created_at":"2024-11-09T20:44:41.020Z","updated_at":"2025-10-11T20:05:10.359Z","avatar_url":"https://github.com/rintoj.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# react-reflux\n\n**React reflux** is a predictable state container for React apps just like REDUX. It helps you implement a unidirectional data flow (Flux architecture) in an easy and elegant way without much boilerplate code. The main objective of this module is to provide an implementation that has minimal touch points, while providing all the benefits of Redux. This is inspired by [refluxjs](https://github.com/reflux/refluxjs), [redux](http://redux.js.org/) \u0026 [angular-reflux](https://github.com/rintoj/angular-reflux) and uses TypeScript decorators.\n\nPlease note: This module is specially written for React applications. Methods and APIs defer from framework to framework. If you indent to use this module for angular check [angular-reflux](https://github.com/rintoj/angular-reflux)\n\n## This project is migrated to [StateX](https://github.com/rintoj/statex)\n**This project is no longer maintained. To know how to migrate to StateX [read this](https://github.com/rintoj/statex)**\n\n## About\n\nFlux is an architecture for unidirectional data flow. By forcing the data to flow in a single direction, Flux makes it easy to reason *how data-changes will affect the application* depending on what actions have been issued. The components themselves may only update  application-wide data by executing an action to avoid double maintenance nightmares.\n\n## Install\n\n```\nnpm install react-reflux --save\n```\n\n## 5 Simple Steps\n\n### 1. Define State\nTo get the best out of TypeScript, declare interfaces that defines the structure of the application-state.\n\n```ts\nexport interface Todo {\n  id?: string;\n  text?: string;\n  completed?: boolean;\n}\n\nexport interface AppState {\n  todos?: Todo[];\n  selectedTodo?: Todo;\n}\n```\n\n### 2. Define Action\nDefine actions as classes with the necessary arguments passed on to the constructor. This way we will benefit from the type checking; never again we will miss-spell an action, miss a required parameter or pass a wrong parameter. Remember to extend the action from `Action` class. This makes your action listenable and dispatch-able.\n\n```ts\nimport { Action } from 'react-reflux';\n\nexport class AddTodoAction extends Action {\n  constructor(public todo: Todo) { super(); }\n}\n```\n\n### 3. Create Store \u0026 Bind Action\nUse `@action` decorator to bind a reducer function with an Action. The second parameter to the reducer function (`addTodo`) is an action (of type `AddTodoAction`); `@action` uses this information to bind the correct action. Also remember to decorate this class with `@store`.\n\n```ts\nimport { AppState } from '../state';\nimport { AddTodoAction } from '../action';\nimport { action, store } from 'react-reflux';\n\n@store\nexport class TodoStore {\n\n  @action\n  addTodo(state: AppState, action: AddTodoAction): AppState {\n    return { todos: state.todos.concat([action.todo]) }\n  }\n}\n```\n\nDid you notice `@store`? Well, stores must bind each action with the reducer function at the startup and also must have a singleton instance. Both of these are taken care by `@store` decorator. Read [Organizing Stores](#organizing-stores) to understand more.\n\n### 4. Dispatch Action\n\nNo singleton dispatcher! Instead this module lets every action act as dispatcher by itself. One less dependency to define, inject and maintain.\n\n```ts\nnew AddTodoAction({\n  id: 'sd2wde',\n  text: 'Sample task'\n}).dispatch();\n```\n\n### 5. Consume Data\n\nUse `@data` decorator and a selector function (parameter to the decorator) to get updates from application state. The property gets updated only when the value returned by the selector function, changes from previous state to the current state. Additionally, just like a map function, you could map the data to another value as you choose.\n\n```ts\nimport * as React from 'react'\nimport { data, inject } from 'react-reflux'\n\nclass Props {\n  @data((state: AppState) =\u003e state.todos)\n  todos: Todo[]\n\n  @data((state: AppState) =\u003e state.todos \u0026\u0026 state.todos.length \u003e 0)\n  hasTodos: boolean\n}\n\ninterface State { }\n\n@inject(Props)\nexport class TodoListComponent extends React.Component\u003cProps, State\u003e {\n\n  render() {\n    const todos = this.props.todos.map(\n      todo =\u003e \u003cli key={todo.id}\u003e{todo.text}\u003c/li\u003e\n    )\n\n    return \u003cdiv\u003e\n      { this.props.hasTodos \u0026\u0026 \u003cul\u003e {todos} \u003c/ul\u003e }\n    \u003c/div\u003e\n  }\n}\n```\n\n## Reducer Functions \u0026 Async Tasks\n\nReducer functions can return either of the following\n\n1. A portion of the application state as plain object\n```ts\n@action\nadd(state: AppState, action: AddTodoAction): AppState {\n  return {\n    todos: (state.todos || []).concat(action.todo)\n  }\n}\n```\n\n2. A portion of the application state wrapped in Promise, if it needs to perform an async task.\n```ts\n@action\nadd(state: AppState, action: AddTodoAction): Promise\u003cAppStore\u003e {\n  return new Promise((resolve, reject) =\u003e {\n    asyncTask().then(() =\u003e {\n      resolve({\n        todos: (state.todos || []).concat(action.todo)\n      })\n    })\n  })\n}\n```\n\n3. A portion of the application state wrapped in Observables, if the application state needs update multiple times over a period of time, all when handling an action. For example, you have to show loader before starting the process, and hide loader after you have done processing, you may use this.\n```ts\n@action\nadd(state: AppState, action: AddTodoAction): Observable\u003cAppState\u003e {\n  return Observable.create((observer: Observer\u003cAppState\u003e) =\u003e {\n    observer.next({ showLoader: true })\n    asyncTask().then(() =\u003e {\n      observer.next({\n        todos: (state.todos || []).concat(action.todo),\n        showLoader: false\n      })\n      observer.complete()\n    })\n  })\n}\n```\n\n## Immutable Application State\nTo take advantage of React's change detection strategy we need to ensure that the state is indeed immutable. This module uses [seamless-immutable](https://github.com/rtfeldman/seamless-immutable) for immutability.\n\nSince application state is immutable, the reducer functions will not be able to update state directly; any attempt to update the state will result in error. Therefore a reducer function should either return a portion of the state that needs change (recommended) or a new application state wrapped in `ReplaceableState`, instead.\n\n```ts\n@store\nexport class TodoStore {\n\n  @action\n  selectTodo(state: AppState, action: SelectTodoAction): AppState {\n    return {\n      selectedTodo: action.todo\n    }\n  }\n\n  @action\n  resetTodos(state: AppState, action: ResetTodosAction): AppState {\n    return new ReplaceableState({\n      todos: [],\n      selectedTodo: undefined\n    })\n  }\n}\n```\n\n## Organizing Stores\n\nAll stores must be decorated with `@store` and must be imported into application.\n\n1. Create `index.ts` in `stores` folder and import all stores\n```ts\nimport './todo-store'\n```\n\n2. Import stores into application (`app.tsx`)\n```ts\nimport './stores'\n\n...\nexport class AppComponent extends React.Component\u003c{}, {}\u003e {\n  ...\n}\n```\n\n## Sample Code\n\n[Removed]\n\n### Hope this module is helpful to you. Please make sure to checkout my other [projects](https://github.com/rintoj) and [articles](https://medium.com/@rintoj). Enjoy coding!\n\n## Contributing\nContributions are very welcome! Just send a pull request. Feel free to contact [me](mailto:rintoj@gmail.com) or checkout my [GitHub](https://github.com/rintoj) page.\n\n## Author\n\n**Rinto Jose** (rintoj)\n\nFollow me:\n  [GitHub](https://github.com/rintoj)\n| [Facebook](https://www.facebook.com/rinto.jose)\n| [Twitter](https://twitter.com/rintoj)\n| [Google+](https://plus.google.com/+RintoJoseMankudy)\n| [Youtube](https://youtube.com/+RintoJoseMankudy)\n\n## Versions\n[Check CHANGELOG](https://github.com/rintoj/react-reflux/blob/master/CHANGELOG.md)\n\n## License\n```\nThe MIT License (MIT)\n\nCopyright (c) 2017 Rinto Jose (rintoj)\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in\nall copies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\nTHE SOFTWARE.\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frintoj%2Freact-reflux","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frintoj%2Freact-reflux","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frintoj%2Freact-reflux/lists"}