mirror of
				https://github.com/reduxjs/redux-devtools.git
				synced 2025-11-04 01:47:25 +03:00 
			
		
		
		
	Merge remote-tracking branch 'gaearon/master'
Conflicts: package.json
This commit is contained in:
		
						commit
						c14dffc6b0
					
				| 
						 | 
					@ -4,10 +4,7 @@ import { connect } from 'react-redux';
 | 
				
			||||||
import Counter from '../components/Counter';
 | 
					import Counter from '../components/Counter';
 | 
				
			||||||
import * as CounterActions from '../actions/CounterActions';
 | 
					import * as CounterActions from '../actions/CounterActions';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@connect(state => ({
 | 
					class CounterApp extends Component {
 | 
				
			||||||
  counter: state.counter
 | 
					 | 
				
			||||||
}))
 | 
					 | 
				
			||||||
export default class CounterApp extends Component {
 | 
					 | 
				
			||||||
  render() {
 | 
					  render() {
 | 
				
			||||||
    const { counter, dispatch } = this.props;
 | 
					    const { counter, dispatch } = this.props;
 | 
				
			||||||
    return (
 | 
					    return (
 | 
				
			||||||
| 
						 | 
					@ -16,3 +13,11 @@ export default class CounterApp extends Component {
 | 
				
			||||||
    );
 | 
					    );
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					function select(state) {
 | 
				
			||||||
 | 
					  return {
 | 
				
			||||||
 | 
					    counter: state.counter
 | 
				
			||||||
 | 
					  };
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					export default connect(select)(CounterApp);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,21 +1,14 @@
 | 
				
			||||||
import React, { Component } from 'react';
 | 
					import React, { Component } from 'react';
 | 
				
			||||||
 | 
					import { connect } from 'react-redux';
 | 
				
			||||||
import { bindActionCreators } from 'redux';
 | 
					import { bindActionCreators } from 'redux';
 | 
				
			||||||
import { Connector } from 'react-redux';
 | 
					 | 
				
			||||||
import Header from '../components/Header';
 | 
					import Header from '../components/Header';
 | 
				
			||||||
import MainSection from '../components/MainSection';
 | 
					import MainSection from '../components/MainSection';
 | 
				
			||||||
import * as TodoActions from '../actions/TodoActions';
 | 
					import * as TodoActions from '../actions/TodoActions';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export default class TodoApp extends Component {
 | 
					class TodoApp extends Component {
 | 
				
			||||||
  render() {
 | 
					  render() {
 | 
				
			||||||
    return (
 | 
					    const { todos, actions } = this.props;
 | 
				
			||||||
      <Connector select={state => ({ todos: state.todos })}>
 | 
					 | 
				
			||||||
        {this.renderChild}
 | 
					 | 
				
			||||||
      </Connector>
 | 
					 | 
				
			||||||
    );
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
  renderChild({ todos, dispatch }) {
 | 
					 | 
				
			||||||
    const actions = bindActionCreators(TodoActions, dispatch);
 | 
					 | 
				
			||||||
    return (
 | 
					    return (
 | 
				
			||||||
      <div>
 | 
					      <div>
 | 
				
			||||||
        <Header addTodo={actions.addTodo} />
 | 
					        <Header addTodo={actions.addTodo} />
 | 
				
			||||||
| 
						 | 
					@ -24,3 +17,17 @@ export default class TodoApp extends Component {
 | 
				
			||||||
    );
 | 
					    );
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					function mapState(state) {
 | 
				
			||||||
 | 
					  return {
 | 
				
			||||||
 | 
					    todos: state.todos
 | 
				
			||||||
 | 
					  };
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					function mapDispatch(dispatch) {
 | 
				
			||||||
 | 
					  return {
 | 
				
			||||||
 | 
					    actions: bindActionCreators(TodoActions, dispatch)
 | 
				
			||||||
 | 
					  };
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					export default connect(mapState, mapDispatch)(TodoApp);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -30,7 +30,7 @@
 | 
				
			||||||
  "dependencies": {
 | 
					  "dependencies": {
 | 
				
			||||||
    "classnames": "^2.1.2",
 | 
					    "classnames": "^2.1.2",
 | 
				
			||||||
    "react": "^0.13.3",
 | 
					    "react": "^0.13.3",
 | 
				
			||||||
    "react-redux": "^0.2.1",
 | 
					    "react-redux": "^0.5.0",
 | 
				
			||||||
    "redux": "^1.0.0-rc"
 | 
					    "redux": "^1.0.0-rc"
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
  "devDependencies": {
 | 
					  "devDependencies": {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,6 +1,6 @@
 | 
				
			||||||
{
 | 
					{
 | 
				
			||||||
  "name": "redux-devtools",
 | 
					  "name": "redux-devtools",
 | 
				
			||||||
  "version": "0.1.3",
 | 
					  "version": "0.2.0",
 | 
				
			||||||
  "description": "Redux DevTools with hot reloading and time travel",
 | 
					  "description": "Redux DevTools with hot reloading and time travel",
 | 
				
			||||||
  "main": "lib/index.js",
 | 
					  "main": "lib/index.js",
 | 
				
			||||||
  "scripts": {
 | 
					  "scripts": {
 | 
				
			||||||
| 
						 | 
					@ -48,7 +48,7 @@
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
  "dependencies": {
 | 
					  "dependencies": {
 | 
				
			||||||
    "react-mixin": "^1.7.0",
 | 
					    "react-mixin": "^1.7.0",
 | 
				
			||||||
    "react-redux": "^0.2.2",
 | 
					    "react-redux": "^0.5.0",
 | 
				
			||||||
    "redux": "^1.0.0-rc"
 | 
					    "redux": "^1.0.0-rc"
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,12 +1,22 @@
 | 
				
			||||||
import createAll from 'react-redux/lib/components/createAll';
 | 
					import createAll from 'react-redux/lib/components/createAll';
 | 
				
			||||||
import { bindActionCreators } from 'redux';
 | 
					 | 
				
			||||||
import { ActionCreators } from './devTools';
 | 
					import { ActionCreators } from './devTools';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export default function createDevTools(React) {
 | 
					export default function createDevTools(React) {
 | 
				
			||||||
  const { PropTypes, Component } = React;
 | 
					  const { PropTypes, Component } = React;
 | 
				
			||||||
  const { Provider, Connector } = createAll(React);
 | 
					  const { Provider, connect } = createAll(React);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return class DevTools extends Component {
 | 
					  @connect(
 | 
				
			||||||
 | 
					    state => state,
 | 
				
			||||||
 | 
					    ActionCreators
 | 
				
			||||||
 | 
					  )
 | 
				
			||||||
 | 
					  class DevTools extends Component {
 | 
				
			||||||
 | 
					    render() {
 | 
				
			||||||
 | 
					      const { monitor: Monitor } = this.props;
 | 
				
			||||||
 | 
					      return <Monitor {...this.props} />;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  return class DevToolsWrapper extends Component {
 | 
				
			||||||
    static propTypes = {
 | 
					    static propTypes = {
 | 
				
			||||||
      monitor: PropTypes.func.isRequired,
 | 
					      monitor: PropTypes.func.isRequired,
 | 
				
			||||||
      store: PropTypes.shape({
 | 
					      store: PropTypes.shape({
 | 
				
			||||||
| 
						 | 
					@ -24,32 +34,21 @@ export default function createDevTools(React) {
 | 
				
			||||||
        );
 | 
					        );
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
      super(props, context);
 | 
					      super(props, context);
 | 
				
			||||||
 | 
					      this.renderDevTools = ::this.renderDevTools;
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    render() {
 | 
					    render() {
 | 
				
			||||||
      const { devToolsStore } = this.props.store;
 | 
					      const { devToolsStore } = this.props.store;
 | 
				
			||||||
      return (
 | 
					      return (
 | 
				
			||||||
        <Provider store={devToolsStore}>
 | 
					        <Provider store={devToolsStore}>
 | 
				
			||||||
          {this.renderRoot}
 | 
					          {this.renderDevTools}
 | 
				
			||||||
        </Provider>
 | 
					        </Provider>
 | 
				
			||||||
      );
 | 
					      );
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    renderRoot = () => {
 | 
					    renderDevTools() {
 | 
				
			||||||
      return (
 | 
					      const { store, ...rest } = this.props;
 | 
				
			||||||
        <Connector>
 | 
					      return <DevTools {...rest} />;
 | 
				
			||||||
          {this.renderMonitor}
 | 
					    }
 | 
				
			||||||
        </Connector>
 | 
					 | 
				
			||||||
      );
 | 
					 | 
				
			||||||
    };
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    renderMonitor = ({ dispatch, ...state }) => {
 | 
					 | 
				
			||||||
      const { monitor: Monitor, ...rest } = this.props;
 | 
					 | 
				
			||||||
      return (
 | 
					 | 
				
			||||||
        <Monitor {...state}
 | 
					 | 
				
			||||||
                 {...bindActionCreators(ActionCreators, dispatch)}
 | 
					 | 
				
			||||||
                 {...rest} />
 | 
					 | 
				
			||||||
      );
 | 
					 | 
				
			||||||
    };
 | 
					 | 
				
			||||||
  };
 | 
					  };
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in New Issue
	
	Block a user