
Security News
High Salaries No Longer Enough to Attract Top Cybersecurity Talent
A survey of 500 cybersecurity pros reveals high pay isn't enough—lack of growth and flexibility is driving attrition and risking organizational security.
redux-timeout
Advanced tools
Timeout middleware for Redux.
npm install --save redux-timeout
Gives ability to call functions if certain actions have not been dispatched in x amount of time.
redux-effects-timeout is a similar library to work with timeouts in redux. The main difference between the 2, is this library (redux-timeout) will watch for actions as they are dispatched and reset the setTimeout accordingly. If you are just looking for a way to dispatch actions after a certain period of time, redux-effects-timeout should be perfectly fine for you.
Because Redux gives us a predictable way to track if events / actions are taking place in the application, we can make some assumptions from this and use this to our advantage.
Example 1. If no actions have been dispatched in the past > 30 minutes, it's pretty safe to assume that the user is not actively using the application. We could then dispatch an action that triggers the user to be logged out and require a fresh login.
Example 2. In a live editing document, if no actions have been dispatched from a form in the past 2 seconds we could dispatch an action that persists the form to the server, therefore eliminating any need for some other debounce logic.
Checkout the tests / examples folder for further examples.
Initialize the middleware
import { reduxTimeout } from 'redux-timeout'
const store = createStore(reducer, applyMiddleware(reduxTimeout()))
Add action to be watched
import { addTimeout } from 'redux-timeout'
import { ACTION_TO_WATCH, SAVE } from '/path/to/my/action/constants'
...
componentDidMount() {
const { addTimeout, save } = this.props
addTimeout(1000, ACTION_TO_WATCH, save)
}
...
const mapDispatchToProps = (dispatch) => {
return {
addTimeout: (timeout, action, fn) => {
dispatch(addTimeout(timeout, action, fn))
},
save: () => {
dispatch({ type: SAVE })
}
}
}
Remove action being watched
import { removeTimeout } from 'redux-timeout'
import { ACTION_TO_WATCH } from '/path/to/my/action/constants'
...
dispatch(removeTimeout(ACTION_TO_WATCH))
...
addTimeout(timeout, ACTION_TO_WATCH, functionToCall)
Arguments
timeout (Integer): time in ms. Uses this value when initializing the setTimeout. This setTimeout will be cleared and recreated on any dispatches of ACTION_TO_WATCH.
ACTION_TO_WATCH (String | Array): action or array of actions to watch for. See purpose above.
functionToCall (Function): function to call when timeout is triggered.
removeTimeout(ACTION_TO_REMOVE)
Arguments
Constants
WATCH_ALL
: set as an action to watch and the middleware will watch for ANY actions that are dispatched. Useful if implementing session timeout functionality (examples above or in test lib)
FAQs
Client side session timeout monitoring for redux
The npm package redux-timeout receives a total of 886 weekly downloads. As such, redux-timeout popularity was classified as not popular.
We found that redux-timeout demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
A survey of 500 cybersecurity pros reveals high pay isn't enough—lack of growth and flexibility is driving attrition and risking organizational security.
Product
Socket, the leader in open source security, is now available on Google Cloud Marketplace for simplified procurement and enhanced protection against supply chain attacks.
Security News
Corepack will be phased out from future Node.js releases following a TSC vote.