Add redux-devtools-extension trace feature in development mode if available.

docs/CustomApp.md

@@ -19,22 +19,44 @@ Here is the default store creation for react-admin:
 
 ```js
 // in src/createAdminStore.js
-import { applyMiddleware, combineReducers, compose, createStore } from 'redux';
-import { routerMiddleware, connectRouter } from 'connected-react-router';
+import { createStore, compose, applyMiddleware } from 'redux';
+import { routerMiddleware } from 'connected-react-router';
 import createSagaMiddleware from 'redux-saga';
 import { all, fork } from 'redux-saga/effects';
-import {
-    adminReducer,
-    adminSaga,
-    defaultI18nProvider,
-    USER_LOGOUT,
-} from 'react-admin';
+import { History } from 'history';
+
+import { AuthProvider, DataProvider, I18nProvider } from './types';
+import createAppReducer from './reducer';
+import { adminSaga } from './sideEffect';
+import { CLEAR_STATE } from './actions/clearActions';
+
+interface Window {
+    __REDUX_DEVTOOLS_EXTENSION_COMPOSE__?: (traceOptions: object) => Function;
+}
+
+export type InitialState = object | (() => object);
+
+interface Params {
+    dataProvider: DataProvider;
+    history: History;
+    authProvider?: AuthProvider;
+    customReducers?: any;
+    customSagas?: any[];
+    i18nProvider?: I18nProvider;
+    initialState?: InitialState;
+    locale?: string;
+}
 
 export default ({
-    authProvider,
     dataProvider,
     history,
-}) => {
+    customReducers = {},
+    authProvider = null,
+    customSagas = [],
+    initialState,
+}: Params) => {
+    const appReducer = createAppReducer(customReducers, history);
+
     const reducer = combineReducers({
         admin: adminReducer,
         router: connectRouter(history),
@@ -43,28 +65,52 @@ export default ({
     const resettableAppReducer = (state, action) =>
         reducer(action.type !== USER_LOGOUT ? state : undefined, action);
 
+    const resettableAppReducer = (state, action) =>
+        appReducer(
+            action.type !== CLEAR_STATE
+                ? state
+                : // Erase data from the store but keep location, notifications, ui prefs, etc.
+                  // This allows e.g. to display a notification on logout
+                  {
+                      ...state,
+                      admin: {
+                          ...state.admin,
+                          resources: {},
+                          customQueries: {},
+                          references: { oneToMany: {}, possibleValues: {} },
+                      },
+                  },
+            action
+        );
     const saga = function* rootSaga() {
         yield all(
             [
                 adminSaga(dataProvider, authProvider),
+                ...customSagas,
                 // add your own sagas here
             ].map(fork)
         );
     };
     const sagaMiddleware = createSagaMiddleware();
+    const typedWindow = window as Window;
+
+    const composeEnhancers = typeof typedWindow !== 'undefined' &&
+      typedWindow.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ &&
+      typedWindow.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
+          trace: devToolsTrace,
+          traceLimit: 25
+      }) || compose;
 
     const store = createStore(
         resettableAppReducer,
         { /* set your initial state here */ },
-        compose(
+        typeof initialState === 'function' ? initialState() : initialState,
+        composeEnhancers(
             applyMiddleware(
                 sagaMiddleware,
                 routerMiddleware(history),
                 // add your own middlewares here
             ),
-            typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__
-                ? window.__REDUX_DEVTOOLS_EXTENSION__()
-                : f => f
             // add your own enhancers here
         )
     );

packages/ra-core/src/createAdminStore.ts

@@ -10,7 +10,7 @@ import { adminSaga } from './sideEffect';
 import { CLEAR_STATE } from './actions/clearActions';
 
 interface Window {
-    __REDUX_DEVTOOLS_EXTENSION__?: () => () => void;
+    __REDUX_DEVTOOLS_EXTENSION_COMPOSE__?: (traceOptions: object) => Function;
 }
 
 export type InitialState = object | (() => object);
@@ -61,15 +61,21 @@ export default ({
     const sagaMiddleware = createSagaMiddleware();
     const typedWindow = window as Window;
 
+    const composeEnhancers =
+        (process.env.NODE_ENV === 'development' &&
+            typeof typedWindow !== 'undefined' &&
+            typedWindow.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ &&
+            typedWindow.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
+                trace: true,
+                traceLimit: 25,
+            })) ||
+        compose;
+
     const store = createStore(
         resettableAppReducer,
         typeof initialState === 'function' ? initialState() : initialState,
-        compose(
-            applyMiddleware(sagaMiddleware, routerMiddleware(history)),
-            typeof typedWindow !== 'undefined' &&
-                typedWindow.__REDUX_DEVTOOLS_EXTENSION__
-                ? typedWindow.__REDUX_DEVTOOLS_EXTENSION__()
-                : f => f
+        composeEnhancers(
+            applyMiddleware(sagaMiddleware, routerMiddleware(history))
         )
     );
     sagaMiddleware.run(saga);