Skip to content
This repository was archived by the owner on May 24, 2024. It is now read-only.

Commit 2e09aed

Browse files
vivaxyvivaxy
committedApr 10, 2017
refactor(redux): 🎨Move redux actions and reducers into same files to make it more easier to main
This provide a better code organization
·
v1.8.0v1.5.2
1 parent fbcabe0 commit 2e09aed

File tree

25 files changed

+242
-330
lines changed

25 files changed

+242
-330
lines changed
 

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
"main": "webpack.config.js",
66
"scripts": {
77
"test": "ava",
8-
"lint": "eslint .",
8+
"lint": "eslint ./src",
99
"release": "standard-version && git push --follow-tag",
1010
"dev": "NODE_ENV=development node ./scripts/dev.js",
1111
"beta": "NODE_ENV=beta npm run build",

‎src/actions/button.js

Lines changed: 0 additions & 20 deletions
This file was deleted.

‎src/actions/index.js

Lines changed: 0 additions & 16 deletions
This file was deleted.

‎src/actions/newsList.js

Lines changed: 0 additions & 16 deletions
This file was deleted.

‎src/actions/routing.js

Lines changed: 0 additions & 26 deletions
This file was deleted.

‎src/actions/toast.js

Lines changed: 0 additions & 22 deletions
This file was deleted.

‎src/components/pianist-demo.js

Lines changed: 0 additions & 120 deletions
This file was deleted.

‎src/config/actions.js

Lines changed: 0 additions & 11 deletions
This file was deleted.

‎src/containers/Demo/PianistDemo.js

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
/**
2+
* @since 2016-09-18 11:14
3+
* @author vivaxy
4+
*/
5+
6+
import React, { Component, PropTypes } from 'react';
7+
import { connect } from 'react-redux';
8+
9+
import { VerticalFlexBox, VerticalFlexItem } from 'react-pianist/VerticalFlex';
10+
import { HorizontalFlexBox, HorizontalFlexItem } from 'react-pianist/HorizontalFlex';
11+
import { BorderBox, BorderLine } from 'react-pianist/BorderBox';
12+
import { Button } from 'react-pianist/Button';
13+
14+
import { push as routingPushAction } from '../../redux/routing';
15+
import setTitle from '../../lib/setTitle';
16+
import * as i18n from '../../i18n/zh-cn';
17+
18+
class PianistDemo extends Component {
19+
20+
static propTypes = {
21+
routingPush: PropTypes.func.isRequired,
22+
params: PropTypes.object.isRequired,
23+
};
24+
25+
constructor(props) {
26+
super(props);
27+
this.getToIndex = ::this.getToIndex;
28+
this.getNavigationItemStyle = ::this.getNavigationItemStyle;
29+
this.navigate = ::this.navigate;
30+
}
31+
32+
componentDidMount() {
33+
setTitle(i18n.$SOMEONE_S_HOME('react-pianist'));
34+
}
35+
36+
getToIndex() {
37+
const {
38+
routingPush,
39+
} = this.props;
40+
routingPush('/');
41+
}
42+
43+
getNavigationItemStyle = (currentIndex) => {
44+
const {
45+
params: { index },
46+
} = this.props;
47+
return {
48+
textAlign: 'center',
49+
lineHeight: '50px',
50+
color: index === currentIndex ? '#f63' : '#333',
51+
};
52+
};
53+
54+
navigate(index) {
55+
const {
56+
routingPush,
57+
} = this.props;
58+
return () => {
59+
routingPush(`/demo/${index}`);
60+
};
61+
}
62+
63+
render() {
64+
return (
65+
<div className="page-wrapper">
66+
<VerticalFlexBox
67+
style={{
68+
width: '100%',
69+
height: '100%',
70+
position: 'absolute',
71+
}}
72+
>
73+
<VerticalFlexItem flex={1}>
74+
<Button onClick={this.getToIndex}>go to index</Button>
75+
<div>
76+
{Math.random()}
77+
</div>
78+
</VerticalFlexItem>
79+
<VerticalFlexItem height={50}>
80+
<BorderBox
81+
style={{
82+
backgroundColor: '#f1f1f1',
83+
}}
84+
>
85+
<BorderLine position={'top'} color={'#efefef'} />
86+
<HorizontalFlexBox>
87+
<HorizontalFlexItem
88+
flex={1}
89+
style={this.getNavigationItemStyle(1)}
90+
onClick={this.navigate(1)}
91+
>
92+
home
93+
</HorizontalFlexItem>
94+
<HorizontalFlexItem
95+
flex={1}
96+
style={this.getNavigationItemStyle(2)}
97+
onClick={this.navigate(2)}
98+
>
99+
contact
100+
</HorizontalFlexItem>
101+
<HorizontalFlexItem
102+
flex={1}
103+
style={this.getNavigationItemStyle(3)}
104+
onClick={this.navigate(3)}
105+
>
106+
discovery
107+
</HorizontalFlexItem>
108+
<HorizontalFlexItem
109+
flex={1}
110+
style={this.getNavigationItemStyle(4)}
111+
onClick={this.navigate(4)}
112+
>
113+
me
114+
</HorizontalFlexItem>
115+
</HorizontalFlexBox>
116+
</BorderBox>
117+
</VerticalFlexItem>
118+
</VerticalFlexBox>
119+
</div>
120+
);
121+
}
122+
}
123+
124+
export default connect(null, {
125+
routingPush: routingPushAction,
126+
})(PianistDemo);

‎src/containers/common/Index.js renamed to ‎src/containers/Index/Home.js

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -15,17 +15,20 @@ import getNews from '../../api/news';
1515
import Logo from '../../components/Logo';
1616
import DemoButton from '../../components/DemoButton';
1717

18-
import i18n from '../../i18n';
18+
import i18n from '../../i18n/index';
1919
import * as errorType from '../../config/errors';
20-
import actions from '../../actions';
20+
import { setButtonDisabled, setButtonDefault } from '../../redux/button';
21+
import { appendNewsList } from '../../redux/newsList';
22+
import { push } from '../../redux/routing';
23+
import { showToast } from '../../redux/toast';
2124

2225
let newsIndex = 0;
2326

2427
const raisedButtonStyle = {
2528
padding: '0 8px',
2629
};
2730

28-
class Index extends Component {
31+
class Home extends Component {
2932

3033
static propTypes = {
3134
routingPush: PropTypes.func.isRequired,
@@ -112,9 +115,9 @@ export default connect((state) => {
112115
newsListState: state.newsList,
113116
};
114117
}, {
115-
setButtonDisabledAction: actions.button.setButtonDisabled,
116-
setButtonDefaultAction: actions.button.setButtonDefault,
117-
appendNewsListAction: actions.newsList.appendNewsList,
118-
routingPush: actions.routing.push,
119-
showToastAction: actions.toast.showToast,
120-
})(Index);
118+
setButtonDisabledAction: setButtonDisabled,
119+
setButtonDefaultAction: setButtonDefault,
120+
appendNewsListAction: appendNewsList,
121+
routingPush: push,
122+
showToastAction: showToast,
123+
})(Home);

‎src/containers/common/Base.js

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,4 @@ class Base extends Component {
5050
}
5151
}
5252

53-
export default connect(() => {
54-
return {};
55-
}, {})(Base);
53+
export default connect(null, {})(Base);

‎src/containers/common/Demo.js

Lines changed: 0 additions & 36 deletions
This file was deleted.

‎src/containers/common/NoMatch.js

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,4 @@ class NoMatch extends Component {
2929

3030
}
3131

32-
export default connect(() => {
33-
return {};
34-
}, {})(NoMatch);
32+
export default connect(null, {})(NoMatch);

‎src/containers/common/Toast.js

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,14 @@
66
import { connect } from 'react-redux';
77

88
import Toast from '../../components/Toast';
9-
import actions from '../../actions';
9+
import { hideToast } from '../../redux/toast';
1010

11-
export default connect((state) => {
11+
const mapStateToProps = (state) => {
1212
return {
1313
toastState: state.toast,
1414
};
15-
}, {
16-
hideToastAction: actions.toast.hideToast,
15+
};
16+
17+
export default connect(mapStateToProps, {
18+
hideToastAction: hideToast,
1719
})(Toast);

‎src/lib/createAction.js

Lines changed: 0 additions & 10 deletions
This file was deleted.

‎src/lib/store.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { routerMiddleware } from 'react-router-redux';
88
import { hashHistory } from 'react-router';
99
import thunk from 'redux-thunk';
1010

11-
import reducers from '../reducers';
11+
import reducers from '../redux/reducers';
1212

1313
const routing = routerMiddleware(hashHistory);
1414

@@ -19,8 +19,8 @@ const store = createStore(combineReducers(reducers), compose(
1919

2020
if (module.hot) {
2121
// Enable Webpack hot module replacement for reducers
22-
module.hot.accept('../reducers', () => {
23-
const nextRootReducer = require('../reducers').default; // eslint-disable-line global-require
22+
module.hot.accept('../redux/reducers', () => {
23+
const nextRootReducer = require('../redux/reducers').default; // eslint-disable-line global-require
2424
store.replaceReducer(combineReducers(nextRootReducer));
2525
});
2626
}

‎src/reducers/button.js

Lines changed: 0 additions & 19 deletions
This file was deleted.

‎src/redux/button.js

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
/**
2+
* @since 2016-07-31 18:40
3+
* @author vivaxy
4+
*/
5+
6+
import createReducer from '../lib/createReducer';
7+
8+
const BUTTON_DISABLED = 'BUTTON_DISABLED';
9+
const BUTTON_DEFAULT = 'BUTTON_DEFAULT';
10+
11+
const defaultState = true;
12+
13+
export default createReducer(defaultState, {
14+
[BUTTON_DISABLED]: () => {
15+
return false;
16+
},
17+
[BUTTON_DEFAULT]: () => {
18+
return true;
19+
},
20+
});
21+
22+
export const setButtonDisabled = () => {
23+
return {
24+
type: BUTTON_DISABLED,
25+
};
26+
};
27+
28+
export const setButtonDefault = () => {
29+
return {
30+
type: BUTTON_DEFAULT,
31+
};
32+
};

‎src/reducers/newsList.js renamed to ‎src/redux/newsList.js

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,19 @@
55

66
import createReducer from '../lib/createReducer';
77

8-
import * as constant from '../config/actions';
8+
const APPEND_NEWS = 'APPEND_NEWS';
99

1010
const defaultState = [];
1111

1212
export default createReducer(defaultState, {
13-
[constant.APPEND_NEWS]: (state, action) => {
13+
[APPEND_NEWS]: (state, action) => {
1414
return [...state, ...action.list];
1515
},
1616
});
17+
18+
export const appendNewsList = (list) => {
19+
return {
20+
list,
21+
type: APPEND_NEWS,
22+
};
23+
};

‎src/reducers/pagination.js renamed to ‎src/redux/pagination.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { PropTypes } from 'react';
77

88
import createReducer from '../lib/createReducer';
99

10-
import * as constant from '../config/actions';
10+
const SETUP_PAGINATION = 'SETUP_PAGINATION';
1111

1212
const defaultState = {
1313
pageIndex: 0,
@@ -18,7 +18,7 @@ const defaultState = {
1818
};
1919

2020
export default createReducer(defaultState, {
21-
[constant.SETUP_PAGINATION]: (state, action) => {
21+
[SETUP_PAGINATION]: (state, action) => {
2222
return {
2323
...state,
2424
pageSize: action.pageSize,

‎src/reducers/index.js renamed to ‎src/redux/reducers.js

File renamed without changes.

‎src/redux/routing.js

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
/**
2+
* @since 2017-04-10 09:55:20
3+
* @author vivaxy
4+
*/
5+
6+
import {
7+
push as routerPush,
8+
replace as routerReplace,
9+
go as routerGo,
10+
goBack as routerGoBack,
11+
goForward as routerGoFroward,
12+
} from 'react-router-redux';
13+
14+
export const push = (location) => {
15+
return routerPush(location);
16+
};
17+
export const replace = (location) => {
18+
return routerReplace(location);
19+
};
20+
export const go = (number) => {
21+
return routerGo(number);
22+
};
23+
export const goBack = () => {
24+
return routerGoBack();
25+
};
26+
export const goForward = () => {
27+
return routerGoFroward();
28+
};

‎src/reducers/toast.js renamed to ‎src/redux/toast.js

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,26 +5,40 @@
55

66
import createReducer from '../lib/createReducer';
77

8-
import * as actionType from '../config/actions';
8+
const SHOW_TOAST = 'SHOW_TOAST';
9+
const HIDE_TOAST = 'HIDE_TOAST';
910

1011
const defaultState = {
1112
show: false,
1213
message: '',
1314
};
1415

1516
export default createReducer(defaultState, {
16-
[actionType.SHOW_TOAST]: (state, action) => {
17+
[SHOW_TOAST]: (state, action) => {
1718
return {
1819
...state,
1920
show: true,
2021
message: action.message,
2122
};
2223
},
23-
[actionType.HIDE_TOAST]: (state) => {
24+
[HIDE_TOAST]: (state) => {
2425
return {
2526
...state,
2627
show: false,
2728
message: '',
2829
};
2930
},
3031
});
32+
33+
export const showToast = (message) => {
34+
return {
35+
message,
36+
type: SHOW_TOAST,
37+
};
38+
};
39+
40+
export const hideToast = () => {
41+
return {
42+
type: HIDE_TOAST,
43+
};
44+
};

‎src/routes/about.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55

66
import Base from '../containers/common/Base';
77
import NoMatch from '../containers/common/NoMatch';
8-
import Index from '../containers/common/Index';
9-
import Demo from '../containers/common/Demo';
8+
import Index from '../containers/Index/Home';
9+
import Demo from '../containers/Demo/PianistDemo';
1010

1111
const demoRoute = {
1212
path: 'demo/:index',

‎src/routes/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55

66
import Base from '../containers/common/Base';
77
import NoMatch from '../containers/common/NoMatch';
8-
import Index from '../containers/common/Index';
9-
import Demo from '../containers/common/Demo';
8+
import Index from '../containers/Index/Home';
9+
import Demo from '../containers/Demo/PianistDemo';
1010

1111
const demoRoute = {
1212
path: 'demo/:index',

0 commit comments

Comments
 (0)
This repository has been archived.