/ embark-ui / src / containers / TextEditorContainer.js
TextEditorContainer.js
 1  import React from 'react';
 2  import {connect} from 'react-redux';
 3  import PropTypes from 'prop-types';
 4  import TextEditor from '../components/TextEditor';
 5  import {
 6    addEditorTabs as addEditorTabsAction,
 7    fetchEditorTabs as fetchEditorTabsAction,
 8    removeEditorTabs as removeEditorTabsAction,
 9    toggleBreakpoint
10  } from '../actions';
11  
12  import {getBreakpointsByFilename, getDebuggerLine, getEditorTabs, getTheme} from '../reducers/selectors';
13  
14  class TextEditorContainer extends React.Component {
15    componentDidMount() {
16      this.props.fetchEditorTabs();
17    }
18  
19    render() {
20      return (
21        <TextEditor file={this.props.currentFile}
22                    currentFile={this.props.currentFile}
23                    breakpoints={this.props.breakpoints}
24                    toggleBreakpoint={this.props.toggleBreakpoint}
25                    editorTabs={this.props.editorTabs}
26                    removeEditorTabs={this.props.removeEditorTabs}
27                    addEditorTabs={this.props.addEditorTabs}
28                    debuggerLine={this.props.debuggerLine}
29                    onFileContentChange={this.props.onFileContentChange}
30                    theme={this.props.theme} />
31      );
32    }
33  }
34  
35  function mapStateToProps(state, props) {
36    const breakpoints = getBreakpointsByFilename(state, props.currentFile.name);
37    const editorTabs = getEditorTabs(state);
38    const debuggerLine = getDebuggerLine(state);
39    const theme = getTheme(state);
40    return {breakpoints, editorTabs, debuggerLine, theme};
41  }
42  
43  TextEditorContainer.propTypes = {
44    currentFile: PropTypes.object,
45    onFileContentChange: PropTypes.func,
46    toggleBreakpoints: PropTypes.func,
47    breakpoints: PropTypes.array,
48    toggleBreakpoint: PropTypes.object,
49    fetchEditorTabs: PropTypes.func,
50    removeEditorTabs: PropTypes.func,
51    addEditorTabs: PropTypes.func,
52    debuggerLine: PropTypes.number,
53    editorTabs: PropTypes.array,
54    theme: PropTypes.string
55  };
56  
57  export default connect(
58    mapStateToProps,
59    {
60      toggleBreakpoint,
61      fetchEditorTabs: fetchEditorTabsAction.request,
62      removeEditorTabs: removeEditorTabsAction.request,
63      addEditorTabs: addEditorTabsAction.request
64    },
65  )(TextEditorContainer);