{"id":20045621,"url":"https://github.com/thadeuluz/mui-redux-alerts","last_synced_at":"2025-09-07T01:09:01.908Z","repository":{"id":57304875,"uuid":"86714677","full_name":"ThadeuLuz/mui-redux-alerts","owner":"ThadeuLuz","description":"Material-UI + Redux Dialogs and Snackbars","archived":false,"fork":false,"pushed_at":"2019-01-30T12:56:04.000Z","size":21,"stargazers_count":20,"open_issues_count":1,"forks_count":5,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-08-26T22:11:38.010Z","etag":null,"topics":["dialogs","material-design","material-ui","react","redux","snackbars"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ThadeuLuz.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-03-30T14:50:39.000Z","updated_at":"2025-08-20T13:19:40.000Z","dependencies_parsed_at":"2022-09-20T20:53:36.095Z","dependency_job_id":null,"html_url":"https://github.com/ThadeuLuz/mui-redux-alerts","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ThadeuLuz/mui-redux-alerts","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ThadeuLuz%2Fmui-redux-alerts","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ThadeuLuz%2Fmui-redux-alerts/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ThadeuLuz%2Fmui-redux-alerts/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ThadeuLuz%2Fmui-redux-alerts/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ThadeuLuz","download_url":"https://codeload.github.com/ThadeuLuz/mui-redux-alerts/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ThadeuLuz%2Fmui-redux-alerts/sbom","scorecard":{"id":139549,"data":{"date":"2025-08-11","repo":{"name":"github.com/ThadeuLuz/mui-redux-alerts","commit":"74f48ae79dc592ad15c457a7b8f877de33dc153a"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":2.6,"checks":[{"name":"Code-Review","score":0,"reason":"Found 1/23 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":"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":"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":"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":"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":"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":"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":"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":"Vulnerabilities","score":10,"reason":"0 existing vulnerabilities detected","details":null,"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}},{"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":0,"reason":"license file not detected","details":["Warn: project does not have a license file"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"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":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 8 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"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"}}]},"last_synced_at":"2025-08-16T07:37:25.420Z","repository_id":57304875,"created_at":"2025-08-16T07:37:25.420Z","updated_at":"2025-08-16T07:37:25.420Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":273983421,"owners_count":25202161,"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-09-06T02:00:13.247Z","response_time":2576,"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":["dialogs","material-design","material-ui","react","redux","snackbars"],"created_at":"2024-11-13T11:18:16.265Z","updated_at":"2025-09-07T01:09:01.865Z","avatar_url":"https://github.com/ThadeuLuz.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Mui Redux Alerts\n\nMaterial-UI + Redux Dialogs and Snackbars. \n\nAccording to Material-UI documentation, [Snackbar](http://www.material-ui.com/#/components/snackbar) and [Dialog](http://www.material-ui.com/#/components/dialog) components are presented and used exactly as every other component. Although that's the 'react way' to use them, I personaly feel that due to their volatile nature, they should'nt be used as fixed components with display being set by a parent component. If you also use redux, there is another way.\n\nThis library alows you to open and close Snackbars and Dialogs by dispatching actions.\n\n## Installing\n\nInstall with:\n\n```\n$ npm i -S mui-redux-alerts\n```\n\nThis library has three peer dependencies that need to be in your project for it to work: [Material-UI](https://github.com/callemall/material-ui), [Redux](https://github.com/reactjs/redux) and the [Redux Thunk](https://github.com/gaearon/redux-thunk) middleware, so remember to install them too:\n\n```\n$ npm i -S material-ui redux redux-thunk\n```\n\nMaterial-UI and Redux are required for obvious reasons. Redux-thunk is needed to dispatch close actions asynchronously when snackbar's _autoHideDuration_ ends or when _onRequestClose_ gets triggered, which makes this library easier to use.\n\n## Setup\n\n### Add the Reducer to Redux store\n\nThe first step is to add the reducer to your rootReducer when creating Redux's store.\n```JavaScript\nimport { combineReducers, createStore, applyMiddleware } from 'redux';\nimport thunk from 'redux-thunk';\n\nimport { reducer } from 'mui-redux-alerts';\n\nconst rootReducer = combineReducers({\n  // Add other reducers here\n  alerts: reducer,\n});\n\n// Don't forget redux-thunk\nconst store = createStore(rootReducer, applyMiddleware(thunk));\n```\n\n### Add the Alerts component to the tree\n\nThe second step is to add the `Alerts` component somewhere in your app. Make sure this component is always visible because your snackbars and dialogs will be inside it in the dom tree. This component needs to have your `alerts`. There are several ways to do this, these are two of them:\n\n```JavaScript\nimport { connect } from 'react-redux';\nimport { Alerts } from 'mui-redux-alerts';\n\n// Example 1 - Unconnected parent\n\nconst mapStateToProps = (state) =\u003e ({ alerts: state.alerts });\nconst ConnectedAlerts = connect(mapStateToProps)(Alerts)\n\nconst App = () =\u003e (\n  \u003cdiv\u003e\n    // The rest of your app\n    \u003cConnectedAlerts /\u003e\n  \u003c/div\u003e\n);\n\nexport default App;\n\n// Example 2 - Connected parent\n\nconst Layout = ({ alerts }) =\u003e (\n  \u003cdiv\u003e\n    // The rest of your app\n    \u003cAlerts alerts={alerts} /\u003e\n  \u003c/div\u003e\n);\n\nconst mapStateToProps = (state) =\u003e ({ alerts: state.alerts });\nexport default connect(mapStateToProps)(Layout);\n```\n\n## Usage\n\nNow that you are all setup, lets dispatch snackbars and dialogs. All use cases assume the `dispatch` function from Redux store and these:\n\n```JavaScript\nimport { openDialog, openSnackbar, closeDialog, closeSnackbar } from 'mui-redux-alerts';\n```\n\n### Simple Examples\n\nAll you need is an object that will be used as props for your Dialogs/Snackbars. You can see which props you can use on Material-UI documentation for Snackbars and Dialogs. \n\n\u003e Caveat: It is not necessary to mess with `open` and `onRequestClose` properties. They are filled automatically.\n\n```JavaScript\ndispatch(openSnackbar({ message: 'Simple Snackbar' })); // Click outside to dismiss\ndispatch(openSnackbar({ message: 'Gone in 6 seconds', autoHideDuration: 6000 }));\ndispatch(openDialog({\n    title: 'Simple Dialog',\n    children: 'Click outside or press ESC to close'\n}));\n```\n\n### Dialogs with ID\n\nIf you need to close dialogs programatically, you can pass an ID (string) as the optional first argument and dispatch the `closeSnackbar` or `closeDialog` action.\n\n```JavaScript\ndispatch(openSnackbar('mySnackbar', { message: 'Simple Snackbar' }));\ndispatch(openDialog('myDialog', {\n    moda: true,\n    title: 'Simple Dialog',\n    children: \"Can't close this.\"\n}));\n\n// And later\ndispatch(closeSnackbar('mySnackbar'));\ndispatch(closeDialog('myDialog'));\n```\n\n### Using a function for props\n\nIf instead of an object you send a function for props, it will be calld with a `close` function as the first argument.\n\n```JavaScript\nconst getProps = close =\u003e ({\n  modal: true,\n  title: 'Custom Dialog',\n  children: 'Click OK to close.'\n  actions: [\u003cRaisedButton label=\"OK\" onTouchTap={close} /\u003e]\n});\n\ndispatch(openDialog(getProps));\ndispatch(openDialog('myCustomDialog', getProps)); // Also works\n\n// Later\ndispatch(closeDialog('myCustomDialog'));\n```\n\n## Known issues\n\nSince the elements are shown and hidden by being mounted/unmounted, no animation is shown. I'll fix this on the next version.\n\n## License\n\nThis project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthadeuluz%2Fmui-redux-alerts","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthadeuluz%2Fmui-redux-alerts","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthadeuluz%2Fmui-redux-alerts/lists"}