0
# Middleware
1

2
Redux-Saga middleware creation and configuration for connecting sagas to your Redux store.
3

4
## Capabilities
5

6
### createSagaMiddleware (Default Export)
7

8
Creates Redux middleware and connects sagas to the Redux Store. The middleware provides methods to run sagas and manage saga context.
9

10
```typescript { .api }
11
/**
12
 * Creates Redux middleware and connects sagas to the Redux Store
13
 * @param options - Configuration options for the middleware
14
 * @returns SagaMiddleware instance with run() and setContext() methods
15
 */
16
function createSagaMiddleware<C extends object>(
17
  options?: SagaMiddlewareOptions<C>
18
): SagaMiddleware<C>;
19

20
interface SagaMiddlewareOptions<C extends object = {}> {
21
  /** Initial value of the saga's context */
22
  context?: C;
23
  /** Monitor for receiving saga execution events */
24
  sagaMonitor?: SagaMonitor;
25
  /** Error handler for uncaught errors from sagas */
26
  onError?(error: Error, errorInfo: ErrorInfo): void;
27
  /** Array of effect middlewares for intercepting effects */
28
  effectMiddlewares?: EffectMiddleware[];
29
  /** Custom channel for take and put effects */
30
  channel?: MulticastChannel<Action>;
31
}
32

33
interface SagaMiddleware<C extends object = {}> extends Middleware {
34
  /** Dynamically run a saga after middleware setup */
35
  run<S extends Saga>(saga: S, ...args: Parameters<S>): Task;
36
  /** Update the saga context */
37
  setContext(props: Partial<C>): void;
38
}
39
```
40

41
**Usage Examples:**
42

43
```typescript
44
import { createStore, applyMiddleware } from "redux";
45
import createSagaMiddleware from "redux-saga";
46

47
// Basic middleware creation
48
const sagaMiddleware = createSagaMiddleware();
49

50
// With options
51
const sagaMiddleware = createSagaMiddleware({
52
  context: { api: apiClient },
53
  onError: (error, errorInfo) => {
54
    console.error("Saga error:", error);
55
    console.error("Stack:", errorInfo.sagaStack);
56
  },
57
  sagaMonitor: myCustomMonitor
58
});
59

60
// Apply to store
61
const store = createStore(
62
  reducer,
63
  applyMiddleware(sagaMiddleware)
64
);
65

66
// Run sagas
67
const task = sagaMiddleware.run(rootSaga);
68
```
69

70
### runSaga
71

72
Allows starting sagas outside the Redux middleware environment. Useful for connecting sagas to external input/output or testing.
73

74
```typescript { .api }
75
/**
76
 * Start a saga outside of Redux middleware environment
77
 * @param options - Configuration for saga execution environment
78
 * @param saga - Generator function to run
79
 * @param args - Arguments to pass to the saga
80
 * @returns Task object representing the running saga
81
 */
82
function runSaga<Action, State, S extends Saga>(
83
  options: RunSagaOptions<Action, State>,
84
  saga: S,
85
  ...args: Parameters<S>
86
): Task;
87

88
interface RunSagaOptions<A, S> {
89
  /** Channel for take effects */
90
  channel?: PredicateTakeableChannel<A>;
91
  /** Function to fulfill put effects */
92
  dispatch?(output: A): any;
93
  /** Function to fulfill select effects */
94
  getState?(): S;
95
  /** Monitor for saga events */
96
  sagaMonitor?: SagaMonitor;
97
  /** Error handler */
98
  onError?(error: Error, errorInfo: ErrorInfo): void;
99
  /** Saga context */
100
  context?: object;
101
  /** Effect middlewares */
102
  effectMiddlewares?: EffectMiddleware[];
103
}
104
```
105

106
**Usage Examples:**
107

108
```typescript
109
import { runSaga } from "redux-saga";
110

111
// Run saga with custom dispatch/getState
112
const task = runSaga(
113
  {
114
    dispatch: (action) => console.log("Action:", action),
115
    getState: () => ({ user: { id: 1 } })
116
  },
117
  mySaga,
118
  { param: "value" }
119
);
120

121
// For testing
122
const dispatched = [];
123
runSaga(
124
  {
125
    dispatch: (action) => dispatched.push(action),
126
    getState: () => mockState
127
  },
128
  sagaToTest
129
);
130
```
131

132
### SagaMonitor
133

134
Interface for monitoring saga execution events. Used for debugging, logging, and development tools.
135

136
```typescript { .api }
137
interface SagaMonitor {
138
  /** Called when a root saga starts */
139
  rootSagaStarted?(options: { effectId: number; saga: Saga; args: any[] }): void;
140
  /** Called when an effect is triggered */
141
  effectTriggered?(options: { 
142
    effectId: number; 
143
    parentEffectId: number; 
144
    label?: string; 
145
    effect: any 
146
  }): void;
147
  /** Called when an effect resolves successfully */
148
  effectResolved?(effectId: number, result: any): void;
149
  /** Called when an effect is rejected with error */
150
  effectRejected?(effectId: number, error: any): void;
151
  /** Called when an effect is cancelled */
152
  effectCancelled?(effectId: number): void;
153
  /** Called when a Redux action is dispatched */
154
  actionDispatched?(action: Action): void;
155
}
156
```
157

158
### Constants
159

160
```typescript { .api }
161
/** Symbol used for cancellation */
162
const CANCEL: string;
163

164
/** Special action type that terminates sagas */
165
const END: EndType;
166
```