{"library":"redux-pack","title":"Redux Pack Middleware for Promise Handling","description":"Redux Pack is a Redux middleware library designed to simplify the handling of asynchronous actions through a declarative, promise-based approach. It aims to reduce boilerplate and prevent common issues associated with `redux-thunk`, such as multiple sequential dispatches causing performance penalties and inconsistent state, by treating a promise's lifecycle as a single action. The library's core utility is the `handle` function, which allows reducers to declaratively respond to the start, success, failure, and completion of a promise. However, the package, currently at version 0.1.5, was last published in March 2017. It is considered abandoned, lacks support for modern Redux versions (e.g., v5+), contemporary JavaScript features like ES Modules, and is superseded by Redux Toolkit's `createAsyncThunk` for robust and officially recommended async logic management. Community-maintained TypeScript types (`@types/redux-pack`) exist, but the core library itself does not offer official type support.","language":"javascript","status":"abandoned","last_verified":"Thu Apr 23","install":{"commands":["npm install redux-pack"],"cli":null},"imports":["import { middleware as reduxPackMiddleware } from 'redux-pack';","import { handle } from 'redux-pack';","export const LOAD_FOO = 'LOAD_FOO';"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import { createStore, applyMiddleware, combineReducers } from 'redux';\nimport { middleware as reduxPackMiddleware, handle } from 'redux-pack';\n\n// 1. Define Action Types\nexport const LOAD_USER = 'LOAD_USER';\n\n// 2. Define an API utility (mock for example)\nconst Api = {\n  getUser: (id) => new Promise(resolve => {\n    setTimeout(() => {\n      console.log(`Fetching user ${id}...`);\n      resolve({ id, name: `User ${id}`, email: `user${id}@example.com` });\n    }, 500);\n  })\n};\n\n// 3. Create an Action Creator\nexport function loadUser(id) {\n  return {\n    type: LOAD_USER,\n    promise: Api.getUser(id),\n    meta: {\n      onStart: () => console.log(`Starting fetch for user ${id}`),\n      onSuccess: (payload) => console.log('User fetched successfully:', payload),\n      onFailure: (error) => console.error('Failed to fetch user:', error),\n      // Other hooks: onFinish, always\n    }\n  };\n}\n\n// 4. Create a Reducer\nconst initialState = { \n  user: null, \n  isLoading: false, \n  error: null \n};\n\nfunction userReducer(state = initialState, action) {\n  switch (action.type) {\n    case LOAD_USER:\n      return handle(state, action, {\n        start: prevState => ({ ...prevState, isLoading: true, error: null }),\n        success: prevState => ({ ...prevState, isLoading: false, user: action.payload }),\n        failure: prevState => ({ ...prevState, isLoading: false, error: action.payload }),\n        finish: prevState => ({ ...prevState })\n      });\n    default:\n      return state;\n  }\n}\n\n// 5. Configure the Redux Store\nconst rootReducer = combineReducers({\n  user: userReducer\n});\n\nconst store = createStore(\n  rootReducer,\n  applyMiddleware(reduxPackMiddleware)\n);\n\n// 6. Dispatch the action\nconsole.log('Initial state:', store.getState());\nstore.dispatch(loadUser(123));\n\nstore.subscribe(() => {\n  console.log('Current state:', store.getState());\n});\n\n// Example dispatch for a second user (showing different state change)\nsetTimeout(() => {\n  store.dispatch(loadUser(456));\n}, 1500);","lang":"javascript","description":"Demonstrates setting up a Redux store with `redux-pack` middleware, defining a promise-based action, and handling its lifecycle in a reducer using the `handle` utility, including optional lifecycle hooks in `meta`.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}