How to use the redux-devtools-extension/developmentOnly.composeWithDevTools function in redux-devtools-extension

To help you get started, we’ve selected a few redux-devtools-extension examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github mAAdhaTTah / brookjs / packages / brookjs-cli / templates / app.hbs.js View on Github external
import 'babel-polyfill';
import { domDelta, observeDelta } from 'brookjs';
import { applyMiddleware, combineReducers, createStore } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension/developmentOnly';
import { init } from './actions';
import {} from './deltas';
import { el, view } from './dom';
import {} from './reducers';
import { selectProps } from './selectors';

const { __INITIAL_STATE__ } = global;

const compose = composeWithDevTools({
    name: '{{name}}'
});

const enhancer = compose(applyMiddleware(observeDelta(
    // Register your deltas here
    domDelta({ el, view, selectProps })
)));

const reducer = combineReducers({
    // Register your reducers here
});

const store = createStore(reducer, __INITIAL_STATE__, enhancer);

store.dispatch(init());
github rdrnt / tps-calls / src / js / store.js View on Github external
import { createStore, applyMiddleware } from 'redux';
import thunkMiddleware from 'redux-thunk';
import { composeWithDevTools } from 'redux-devtools-extension/developmentOnly';

import rootReducer from './reducers';

// Store setup
const middleware = applyMiddleware(thunkMiddleware);

const store = createStore(rootReducer, {}, composeWithDevTools(middleware));

export default store;
github pekkis / hardcore-react-training / src / utils / redux-little-router.js View on Github external
initialState = undefined,
) {
  const {
    routerEnhancer,
    routerMiddleware,
  } = routerForBrowser({
    // The configured routes. Required.
    routes,
    // The basename for all routes. Optional.
    // basename: '/'
  });

  middlewares.unshift(routerMiddleware);
  enhancers.unshift(routerEnhancer);

  const createStoreWithMiddleware = composeWithDevTools(
    applyMiddleware(
      ...middlewares,
    ),
    ...enhancers,
  )(reduxCreateStore);

  const store = createStoreWithMiddleware(reducers, initialState);
  return store;
}
github labzero / lunch / src / store / configureStore.js View on Github external
normalizedInitialState.teams.items = normalize(initialState.teams.items, [schemas.team]);
  normalizedInitialState.users.items = normalize(initialState.users.items, [schemas.user]);
  normalizedInitialState.restaurants.items.entities.votes = normalizedInitialState.restaurants.items.entities.votes || {};

  const reducers = generateReducers(reducerMaps, normalizedInitialState);

  const helpers = createHelpers(helpersConfig);
  const middleware = [thunk.withExtraArgument(helpers)];

  let enhancer;

  if (__DEV__) {
    middleware.push(createLogger());

    // https://github.com/zalmoxisus/redux-devtools-extension#14-using-in-production
    const composeEnhancers = composeWithDevTools({
      // Options: https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Arguments.md#options
      name: `${name}@${version}`,
    });

    // https://redux.js.org/docs/api/applyMiddleware.html
    enhancer = composeEnhancers(applyMiddleware(...middleware));
  } else {
    enhancer = applyMiddleware(...middleware);
  }

  const store = createStore(
    combineReducers(reducers),
    normalizedInitialState,
    enhancer
  );
github wireapp / wire-webapp / src / script / auth / configureStore.ts View on Github external
const createMiddleware = (thunkArguments: object) => {
  const middlewares = [thunk.withExtraArgument(thunkArguments), createLoggerMiddleware()];

  // Note: Redux DevTools will only be applied when NODE_ENV is NOT production
  // https://github.com/zalmoxisus/redux-devtools-extension/blob/master/npm-package/developmentOnly.js
  return composeWithDevTools(applyMiddleware(...middlewares));
};
github cypress-io / cypress-example-realworld / client / src / store.js View on Github external
myRouterMiddleware,
      promiseMiddleware,
      localStorageMiddleware
    )
  } else {
    // Enable additional logging in non-production environments.
    return applyMiddleware(
      myRouterMiddleware,
      promiseMiddleware,
      localStorageMiddleware,
      createLogger()
    )
  }
}

export const store = createStore(reducer, composeWithDevTools(getMiddleware()))
github jsdrupal / drupal-admin-ui / packages / admin-ui / src / App.js View on Github external
// Persist state.
  const state = store.getState();

  // Save to local storage
  const stringifiedState = JSON.stringify(localStorageStore(state));
  try {
    localStorage.setItem(localStorageName, stringifiedState);
  } catch (e) {
    // This will happen with Safari in private browsing mode.
  }
};

const store = createStore(
  combineReducers({ ...reducers, router: routerReducer }),
  deepMerge(initialState, restoreState()),
  composeWithDevTools(applyMiddleware(sagaMiddleware, middleware)),
);
sagaMiddleware.run(actions);

if (typeof window === 'object') {
  store.subscribe(() => storeState(store));
}

const generateClassName = createGenerateClassName();
const jss = create(jssPreset());
// We define a custom insertion point that JSS will look for injecting the styles in the DOM.
jss.options.insertionPoint = document.getElementById('jss-insertion-point');

const theme = createMuiTheme({
  typography: {
    useNextVariants: true,
  },
github pekkis / hardcore-react-training / client / src / services / redux.js View on Github external
export function createStore(
  reducers,
  middlewares = [],
  enhancers = [],
  initialState = undefined
) {
  const createStoreWithMiddleware = composeWithDevTools(
    ...enhancers,
    applyMiddleware(...middlewares)
  )(reduxCreateStore);

  const combinedReducer = combineReducers({
    ...reducers
  });

  return createStoreWithMiddleware(combinedReducer, initialState);
}
github experiment322 / controlloid-client / js / redux / store.js View on Github external
export default () => {
  const store = createStore(persistedReducer, composeWithDevTools());
  const persistor = persistStore(store);
  return {
    store,
    persistor,
  };
};
github DCtheTall / node-video-chat / src / client / store / index.js View on Github external
import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension/developmentOnly';
import thunk from 'redux-thunk';
import reducers from '../reducers';

export default createStore(
  reducers,
  {},
  composeWithDevTools(applyMiddleware(thunk)),
);