# TypeError: Cannot read properties of undefined (reading 'dispatch'). This error is located at: in ConsumerComponent (at App.js:10)

- **ID:** `react/context-not-provided`
- **Domain:** react
- **Category:** runtime_error
- **Verification:** ai_generated
- **Fix Rate:** 95%

## Root Cause

A component tries to use useContext to access a context value, but it is not wrapped in the corresponding Provider component, so the context value is undefined.

## Version Compatibility

| Version | Status | Introduced | Deprecated |
|---------|--------|------------|------------|
| react@18.2.0 | active | — | — |
| react-dom@18.2.0 | active | — | — |

## Workarounds

1. **Wrap the component tree with the Provider: `<MyContext.Provider value={{ dispatch }}><ConsumerComponent /></MyContext.Provider>`** (95% success)
   ```
   Wrap the component tree with the Provider: `<MyContext.Provider value={{ dispatch }}><ConsumerComponent /></MyContext.Provider>`
   ```
2. **If the Provider is already present but value is undefined, ensure the value prop is correctly passed: `<MyContext.Provider value={dispatch}>` (not just `value={}`)** (90% success)
   ```
   If the Provider is already present but value is undefined, ensure the value prop is correctly passed: `<MyContext.Provider value={dispatch}>` (not just `value={}`)
   ```

## Dead Ends

- **Importing the context directly and trying to use it as a value** — The context object itself is not the value; it must be provided via a Provider. (75% fail)
- **Adding a default value to createContext but not wrapping in Provider** — The default value is only used when there is no Provider at all, but if the component is wrapped in a Provider without a value prop, the context is still undefined. (50% fail)
- **Using useContext inside a class component** — useContext is a hook and cannot be used in class components; use Context.Consumer instead. (65% fail)