{"library":"redux-cookies-middleware","title":"Redux Cookies Middleware","description":"Redux Cookies Middleware is a specialized Redux middleware designed to synchronize specific parts of a Redux state tree with browser cookies. Developers configure `paths` to indicate which state subsets, using dot-notation, should be persisted, along with their corresponding cookie names. It also offers `getStateFromCookies` to hydrate the initial Redux state from existing cookies, ensuring state continuity across sessions. The current stable version is 0.2.1. However, the project appears to be abandoned, with its last commit occurring in November 2018 and no significant updates since, which means it likely does not support modern Redux Toolkit patterns or ESM-only environments directly. Its primary differentiation lies in its explicit, configurable mapping of state paths to individual cookies, offering fine-grained control over what data is stored on the client side.","language":"javascript","status":"abandoned","last_verified":"Wed Apr 22","install":{"commands":["npm install redux-cookies-middleware"],"cli":null},"imports":["import reduxCookiesMiddleware from 'redux-cookies-middleware';","import getStateFromCookies from 'redux-cookies-middleware/getStateFromCookies';","const paths = { 'auth.token': { name: 'my_app_token' } };"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import { applyMiddleware, createStore, compose } from 'redux';\nimport reduxCookiesMiddleware from 'redux-cookies-middleware';\nimport getStateFromCookies from 'redux-cookies-middleware/getStateFromCookies';\n\n// A dummy reducer for demonstration purposes\nconst reducer = (state = {}, action) => {\n  switch (action.type) {\n    case 'SET_AUTH_TOKEN':\n      return { ...state, auth: { ...state.auth, token: action.payload } };\n    case 'SET_SESSION':\n      return { ...state, session: action.payload };\n    default:\n      return state;\n  }\n};\n\n// Initial state structure\nlet initialState = {\n  auth: {\n    token: null,\n    key: 'some_key'\n  },\n  session: null\n};\n\n// Define which parts of the state to persist in cookies and their cookie names\nconst paths = {\n  'auth.token': { name: 'my_app_token' },\n  'session': { name: 'my_app_session', httpOnly: false, secure: process.env.NODE_ENV === 'production' }\n};\n\n// Read stored data from cookies and merge it with the initial state\n// This should happen before creating the store to ensure initial state is hydrated.\ninitialState = getStateFromCookies(initialState, paths);\n\n// Create Redux store with the middleware\nconst store = createStore(\n  reducer,\n  initialState,\n  applyMiddleware(reduxCookiesMiddleware(paths))\n);\n\n// Example dispatch to demonstrate persistence\nstore.dispatch({ type: 'SET_AUTH_TOKEN', payload: 'new-auth-token-123' });\nstore.dispatch({ type: 'SET_SESSION', payload: 'user-session-abc' });\n\nconsole.log('Store state after dispatches:', store.getState());\n// In a browser, you would now see 'my_app_token' and 'my_app_session' cookies.\n// For Node.js, this example would require a cookie-aware environment or mocking.","lang":"javascript","description":"This quickstart demonstrates how to set up `redux-cookies-middleware` to persist specific parts of the Redux state ('auth.token' and 'session') into browser cookies, and how to hydrate the initial state from those cookies upon application load.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}