Skip to content

Commit 1109bcc

Browse files
matthiskmatthisk
committed
Refactor reducers
1 parent 7075b80 commit 1109bcc

File tree

15 files changed

+437
-315
lines changed

15 files changed

+437
-315
lines changed

‎jsconfig.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"compilerOptions": {
3+
"target": "es6"
4+
},
5+
"exclude": [
6+
"node_modules",
7+
"dist"
8+
]
9+
}

‎src/compilers/index.js

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,20 @@ import Regenerator from './regenerator'
77

88
export const DEFAULT_COMPILER = 'Babel (6)';
99

10-
export default {
11-
'Babel (6)' : new Babel(),
12-
'Babel (5)' : new Babel5(),
13-
'Traceur' : new Traceur(),
14-
'TypeScript' : new TypeScript(),
15-
'Regenerator' : new Regenerator(),
10+
export function getCompiler(name) {
11+
if (!compilers.hasOwnProperty(name)) {
12+
throw new ReferenceError(`Unexpected compiler naem ${name} please pick one of ${Object.keys(compilers)}`);
13+
}
14+
15+
return compilers[name];
16+
}
17+
18+
const compilers = {
19+
'Babel (6)': new Babel(),
20+
'Babel (5)': new Babel5(),
21+
'Traceur': new Traceur(),
22+
'TypeScript': new TypeScript(),
23+
'Regenerator': new Regenerator(),
1624
};
25+
26+
export default compilers;

‎src/components/Header/Header.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
padding: 0 10px;
1313

1414
position: relative;
15-
z-index: 10000;
15+
z-index: 9999;
1616

1717
display: flex;
1818
}

‎src/containers/AppContainer.js

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,17 @@ import { browserHistory, Router } from 'react-router'
33
import { Provider } from 'react-redux'
44

55
import { DEFAULT_COMPILER } from 'compilers'
6-
import {
7-
selectCompiler,
8-
transformCode,
9-
runCode,
6+
import {
7+
selectCompiler,
8+
runCode,
109
} from 'store/ide'
1110
import { loadExamples } from 'store/examples'
1211
import { loadThemes } from 'store/themes'
1312

1413
class AppContainer extends Component {
1514
static propTypes = {
16-
routes : PropTypes.object.isRequired,
17-
store : PropTypes.object.isRequired
15+
routes: PropTypes.object.isRequired,
16+
store: PropTypes.object.isRequired
1817
}
1918

2019
componentDidMount() {
@@ -28,11 +27,11 @@ class AppContainer extends Component {
2827
this.props.store.dispatch(loadThemesAction);
2928
}
3029

31-
shouldComponentUpdate () {
30+
shouldComponentUpdate() {
3231
return false;
3332
}
3433

35-
render () {
34+
render() {
3635
const { routes, store } = this.props
3736

3837
return (

‎src/routes/Home/components/HomeView.js

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import Icon from 'semantic-ui-react/dist/commonjs/elements/Icon'
1515
class _REPLConsole extends Component {
1616

1717
render() {
18-
let {
18+
let {
1919
display,
2020
toggleConsoleDisplay,
2121
} = this.props;
@@ -27,10 +27,10 @@ class _REPLConsole extends Component {
2727

2828
return (
2929
<div className={cn}>
30-
<div className='ide__console-title'
31-
onClick={toggleConsoleDisplay}>
30+
<div className='ide__console-title'
31+
onClick={toggleConsoleDisplay}>
3232
<span>Console</span>
33-
{ !display ?
33+
{!display ?
3434
<Icon name='chevron up' /> :
3535
<Icon name='chevron down' />
3636
}
@@ -64,19 +64,19 @@ class _IDEViewPort extends Component {
6464
<span>ES6</span>
6565
</div>
6666
</div>
67-
<Editor name='es6'
68-
onChange={this.props.transformOnType} />
67+
<Editor name='es6'
68+
onChange={this.props.transformOnType} />
6969
</div>
7070

7171
<div className='ide__column'
72-
style={this.columnStyle()}>
72+
style={this.columnStyle()}>
7373
<div className='ide__column-gutter second'
74-
onClick={this.props.toggleEditorDisplay.bind(null, 'es5')}>
74+
onClick={this.props.toggleEditorDisplay.bind(null, 'es5')}>
7575
<div className='title'>
7676
<span>ES5</span>
7777
</div>
7878
</div>
79-
<Editor name='es5'/>
79+
<Editor name='es5' />
8080
</div>
8181
</div>
8282
);

‎src/routes/Home/components/HomeView.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525

2626
.ide__column-gutter {
2727
position: absolute;
28-
z-index: 9999;
28+
z-index: 5000;
2929
top: 0; left: 0;
3030
bottom: 0;
3131
width: 25px;

‎src/store/actionTypes.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
// ------------------------------------
2+
// Action Types
3+
// ------------------------------------
4+
export const RUN_CODE = 'ide/RUN_CODE';
5+
export const SELECT_COMPILER = 'ide/SELECT_COMPILER';
6+
export const LOADED_COMPILER = 'ide/LOADED_COMPILER';
7+
export const TRANSFORMED_CODE = 'ide/TRANSFORMED_CODE';
8+
export const TRANSFORM_ON_TYPE = 'ide/TRANSFORM_ON_TYPE';
9+
export const UPDATE_CODE = 'ide/UPDATE_CODE';
10+
export const TOGGLE_EDITOR_DISPLAY = 'ide/TOGGLE_EDITOR_DISPLAY';
11+
export const TOGGLE_CONSOLE_DISPLAY = 'ide/TOGGLE_CONSOLE_DISPLAY';
12+
export const FLUSH_BUFFER = 'ide/FLUSH_BUFFER';
13+
export const TOGGLE_COMPILER_PRESET = 'ide/TOGGLE_COMPILER_PRESET';
14+
export const UPDATE_EDITOR_CONFIG = 'ide/UPDATE_EDITOR_CONFIG';
15+
export const SAVE_SUCCESS = 'ide/SAVE_SUCCESS';
16+
export const SAVE_FAILURE = 'ide/SAVE_FAILURE';
17+
export const SAVE_REQUEST = 'ide/SAVE_REQUEST';
18+
export const LOAD_SUCCESS = 'ide/LOAD_SUCCESS';
19+
export const LOAD_FAILURE = 'ide/LOAD_FAILURE';
20+
export const LOAD_REQUEST = 'ide/LOAD_REQUEST';

‎src/store/ducks/babelPresets.js

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import { loadPersistedState} from 'store/middleware/localStorage'
2+
3+
import * as actionTypes from 'store/actionTypes'
4+
5+
let initialState = loadPersistedState('ide', 'babelPresets') || {
6+
'es2015': { checked: true },
7+
'es2016': { checked: false },
8+
'es2017': { checked: false },
9+
'react': { checked: false },
10+
'stage-0': { checked: false },
11+
'stage-1': { checked: false },
12+
'stage-2': { checked: false },
13+
'stage-3': { checked: false },
14+
};
15+
16+
export default function reducer(state = initialState, action) {
17+
switch(action.type) {
18+
19+
case actionTypes.TOGGLE_COMPILER_PRESET:
20+
return {
21+
...state,
22+
[action.payload] : {
23+
checked: ! state[action.payload].checked,
24+
},
25+
};
26+
27+
default:
28+
return state;
29+
}
30+
}
31+

‎src/store/ducks/compilers.js

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import * as actionTypes from 'store/actionTypes'
2+
3+
import Compilers from 'compilers'
4+
5+
export function getSelectedCompiler(compilers) {
6+
for (let key of Object.keys(compilers)) {
7+
if (compilers[key].selected) {
8+
return key;
9+
}
10+
}
11+
}
12+
13+
const initialState = (() => {
14+
const result = {};
15+
const keys = Object.keys(Compilers);
16+
17+
for (let key of keys) {
18+
result[key] = {
19+
loading: false,
20+
initialized: false,
21+
selected: false,
22+
};
23+
}
24+
25+
return result;
26+
})();
27+
export default function reducer(state = initialState, action) {
28+
switch(action.type) {
29+
case actionTypes.LOADED_COMPILER:
30+
return {
31+
...state,
32+
[action.payload]: {
33+
loading: false,
34+
initialized: true,
35+
},
36+
};
37+
38+
case actionTypes.SELECT_COMPILER:
39+
return {
40+
...state,
41+
[action.payload]: {
42+
selected: true,
43+
loading: true,
44+
initialized: false,
45+
},
46+
};
47+
48+
default:
49+
return state;
50+
}
51+
}

‎src/store/ducks/console.js

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import * as actionTypes from 'store/actionTypes'
2+
3+
const initialState = {
4+
display: false,
5+
logBuffer: [],
6+
};
7+
export default function reducer(state = initialState, action) {
8+
switch (action.type) {
9+
case actionTypes.TOGGLE_CONSOLE_DISPLAY:
10+
return {
11+
...state,
12+
display: !state.display,
13+
};
14+
15+
case actionTypes.FLUSH_BUFFER:
16+
return {
17+
...state,
18+
logBuffer: [],
19+
};
20+
21+
default:
22+
return state;
23+
}
24+
}

‎src/store/ducks/editorConfig.js

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import * as actionTypes from 'store/actionTypes'
2+
3+
import { loadPersistedState} from 'store/middleware/localStorage'
4+
5+
let initialState = loadPersistedState('ide', 'editorConfig') || {
6+
lineWrapping: true,
7+
matchBrackets: true,
8+
lineNumbers: true,
9+
continueComments: true,
10+
indentUnit: 2,
11+
theme : "default",
12+
};
13+
14+
export default function reducer(state = initialState, action) {
15+
switch(action.type) {
16+
case actionTypes.UPDATE_EDITOR_CONFIG:
17+
return {
18+
...state,
19+
[action.payload.key]: action.payload.value,
20+
};
21+
22+
default:
23+
return state;
24+
}
25+
}
26+

‎src/store/ducks/editors.js

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import * as actionTypes from 'store/actionTypes'
2+
3+
import { loadPersistedState } from 'store/middleware/localStorage'
4+
5+
let initialState = {
6+
'es6': {
7+
errors: [],
8+
code: loadPersistedState('ide', 'editors', 'es6', 'code') || '',
9+
display: true,
10+
},
11+
'es5': {
12+
errors: [],
13+
code: loadPersistedState('ide', 'editors', 'es6', 'code') || '',
14+
display: false,
15+
},
16+
};
17+
18+
export default function reducer(state = initialState, action) {
19+
switch (action.type) {
20+
case actionTypes.LOAD_SUCCESS:
21+
return {
22+
...state,
23+
'es6': {
24+
...state['es6'],
25+
code: action.payload.snippet,
26+
}
27+
};
28+
29+
case actionTypes.UPDATE_CODE:
30+
return {
31+
...state,
32+
[action.editor]: {
33+
...state[action.editor],
34+
code: action.payload.code,
35+
},
36+
};
37+
38+
case actionTypes.TOGGLE_EDITOR_DISPLAY:
39+
return {
40+
...state,
41+
[action.payload]: {
42+
...state[action.payload],
43+
display: !state[action.payload].display,
44+
}
45+
};
46+
47+
default:
48+
return state;
49+
}
50+
}

‎src/store/ducks/index.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import babelPresetsReducer from './babelPresets'
2+
import compilersReducer from './compilers'
3+
import consoleReducer from './console'
4+
import editorConfigReducer from './editorConfig'
5+
import editorsReducer from './editors'
6+
7+
export {
8+
babelPresetsReducer,
9+
compilersReducer,
10+
consoleReducer,
11+
editorConfigReducer,
12+
editorsReducer,
13+
};

0 commit comments

Comments
 (0)