infinitered / infinitered/reactotron

I have no idea where to integrate the Reactotron.createEnhancer()

Open
#1,170 3 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
15.6k
Forks
972
PR merge metrics
No merged PRs in 30d

Description

Hey there!

i am trying to configure reactotron-redux with my redux store and i cant get it run!!!
No idea what i am doing wrong, but i haven't seen any examples where to add the Reactotron.createEnhancer() when i am using redux-devtools-extension & redux-logger. Is this even possible?

Any ideas where i add Reactotron.createEnhancer()?

### ReactrotronConfig.js

```
import { reactotronRedux } from 'reactotron-redux';
import { isEmulator } from 'react-native-device-info';
import Reactotron from 'reactotron-react-native';

const name = `unmute App ${isEmulator() ? 'Emulator' : 'Real Device'}`;
const host = isEmulator() ? '127.0.0.1' : 'localhost';
const configOptions = { name, host };

const reactotron = Reactotron.configure(configOptions)
.use(reactotronRedux())
.useReactNative()
.connect();

// clear log on start
Reactotron.clear();

export default reactotron;
```
### store.js

```
import { AsyncStorage } from 'react-native';
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { createLogger } from 'redux-logger';
import { composeWithDevTools } from 'redux-devtools-extension';

import { persistStore, persistReducer } from 'redux-persist';

import Reactotron from "../../ReactotronConfig"

import rootReducer from './reducers/index';

const middleware = [thunk];
let composed = applyMiddleware(...middleware);
if (process.env.NODE_ENV !== 'production') {
middleware.push(createLogger());
composed = composeWithDevTools(applyMiddleware(...middleware));
}

const persistConfig = {
key: 'root',
storage: AsyncStorage,
whitelist: ['authState'],
blacklist: ['counterState']
};

const persistedReducer = persistReducer(persistConfig, rootReducer);
const store = createStore(persistedReducer, composed);
const persistor = persistStore(store);

export { store, persistor };
```

If i push Reactotron.createEnhancer() to the middleware then i always get an error

"TypeError: e.apply is not a function....."

```
middleware.push(Reactotron.createEnhancer())
```

### Environment:

```
"react-native": "0.61.4",
"react-redux": "7.1.1",
"reactotron-react-native": "4.0.2",
"reactotron-redux": "3.1.2",
"redux": "4.0.4",
"redux-devtools-extension": "2.13.8",
"redux-logger": "3.0.6",
"redux-persist": "6.0.0",
"redux-thunk": "2.3.0"
```

Contributor guide

Open the contributing guide

Research direction

Start with the supplied ReactotronConfig.js and store.js, then inspect the Redux integration entry points for createEnhancer and its interaction with composeWithDevTools. Reproduce the e.apply error with the listed versions; done requires an agreed integration path or a documented limitation.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react-native
Domain
devtools, mobile-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
20/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.