Skip to content

Commit 89047fd

Browse files
committed
refactor TopPanel
1 parent 564c686 commit 89047fd

File tree

8 files changed

+74
-84
lines changed

8 files changed

+74
-84
lines changed

lib/components/Config/index.js

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,10 @@ var TutorialConfig = (function (_super) {
7171
}
7272
}));
7373
};
74+
TutorialConfig.prototype.routeToPage = function () {
75+
this.props.tutorialInit();
76+
this.props.routeSet('page');
77+
};
7478
TutorialConfig.prototype.render = function () {
7579
var _a = this.props, pristine = _a.pristine, submitting = _a.submitting, handleSubmit = _a.handleSubmit, invalid = _a.invalid;
7680
return (React.createElement(Card_1.Card, {style: styles.card},
@@ -90,19 +94,12 @@ var TutorialConfig = (function (_super) {
9094
id: 'runner',
9195
}), tabIndex: '3'}),
9296
React.createElement(RaisedButton_1.default, {type: 'submit', style: styles.button, label: 'Save', primary: true, disabled: invalid}),
93-
React.createElement(RaisedButton_1.default, {style: styles.button, label: 'Continue', secondary: true, disabled: invalid, onTouchTap: this.props.routeToPage.bind(this)}))));
97+
React.createElement(RaisedButton_1.default, {style: styles.button, label: 'Continue', secondary: true, disabled: invalid, onTouchTap: this.routeToPage.bind(this)}))));
9498
};
9599
TutorialConfig = __decorate([
96100
react_redux_1.connect(function (state) { return ({
97101
packageJson: state.packageJson,
98-
}); }, function (dispatch) { return ({
99-
pjSave: function (pj) { dispatch(actions_1.pjSave(pj)); },
100-
pjLoad: function () { dispatch(actions_1.pjLoad()); },
101-
routeToPage: function () {
102-
dispatch(actions_1.tutorialInit());
103-
dispatch(actions_1.routeSet('page'));
104-
}
105-
}); }),
102+
}); }, { pjSave: actions_1.pjSave, pjLoad: actions_1.pjLoad, tutorialInit: actions_1.tutorialInit, routeSet: actions_1.routeSet }),
106103
__metadata('design:paramtypes', [])
107104
], TutorialConfig);
108105
return TutorialConfig;

lib/components/Publish/index.js

Lines changed: 9 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ var TutorialPublish = (function (_super) {
3939
}
4040
TutorialPublish.prototype.componentWillMount = function () {
4141
this.props.pjLoad();
42+
this.props.open;
4243
};
4344
TutorialPublish.prototype.componentDidMount = function () {
4445
var _this = this;
@@ -60,17 +61,20 @@ var TutorialPublish = (function (_super) {
6061
}
6162
};
6263
TutorialPublish.prototype.onSubmit = function (values) {
63-
var description = values.description, version = values.version, keywords = values.keywords;
64-
this.props.save(Object.assign({}, this.props.packageJson, {
65-
description: description, version: version,
66-
keywords: (keywords.length ? ', ' + keywords : '').split(', ')
64+
var description = values.description, version = values.version, author = values.author, keywords = values.keywords;
65+
this.props.pjSave(Object.assign({}, this.props.packageJson, {
66+
description: description, version: version, author: author,
6767
}));
6868
};
6969
TutorialPublish.prototype.render = function () {
7070
var _a = this.props, pristine = _a.pristine, submitting = _a.submitting, handleSubmit = _a.handleSubmit, invalid = _a.invalid;
7171
return (React.createElement(Card_1.Card, {style: styles.card},
7272
React.createElement(Card_1.CardHeader, {title: 'Tutorial Info'}),
7373
React.createElement("form", {onSubmit: handleSubmit(this.onSubmit.bind(this))},
74+
React.createElement(redux_form_1.Field, {name: 'author', component: textField_1.default.bind(null, {
75+
hintText: 'Shawn McKay <my@email.com>',
76+
floatingLabelText: 'Author <email>',
77+
}), tabIndex: '1'}),
7478
React.createElement(redux_form_1.Field, {name: 'description', component: textField_1.default.bind(null, {
7579
hintText: 'Tutorial description',
7680
floatingLabelText: 'Description',
@@ -80,21 +84,13 @@ var TutorialPublish = (function (_super) {
8084
floatingLabelText: 'Version',
8185
disabled: true,
8286
}), tabIndex: '2'}),
83-
React.createElement(redux_form_1.Field, {name: 'keywords', component: textField_1.default.bind(null, {
84-
hintText: 'coderoad, react, js, etc',
85-
floatingLabelText: 'Keywords',
86-
}), tabIndex: '3'}),
8787
React.createElement(RaisedButton_1.default, {type: 'submit', style: styles.button, label: 'Save', primary: true, disabled: invalid}),
8888
React.createElement(RaisedButton_1.default, {style: styles.button, label: 'Publish', secondary: true, disabled: invalid, onTouchTap: function () { return alert('Publish not yet implemented'); }}))));
8989
};
9090
TutorialPublish = __decorate([
9191
react_redux_1.connect(function (state) { return ({
9292
packageJson: state.packageJson,
93-
}); }, function (dispatch) { return ({
94-
pjLoad: function () { dispatch(actions_1.pjLoad()); },
95-
save: function (pj) { dispatch(actions_1.pjSave(pj)); },
96-
routeToTutorial: function () { dispatch(actions_1.routeSet('page')); }
97-
}); }),
93+
}); }, { pjLoad: actions_1.pjLoad, pjSave: actions_1.pjSave }),
9894
__metadata('design:paramtypes', [])
9995
], TutorialPublish);
10096
return TutorialPublish;

lib/components/Publish/validate.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
var debounce = require('lodash.debounce');
33
var validate = debounce(function (values) {
44
var errors = {};
5-
var requiredFields = ['description', 'version'];
5+
var requiredFields = ['description', 'version', 'author'];
66
requiredFields.forEach(function (field) {
77
if (!values[field]) {
88
errors[field] = 'Required';

lib/components/TopPanel/TopPanel.js

Lines changed: 8 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -40,28 +40,24 @@ var TopPanel = (function (_super) {
4040
function TopPanel() {
4141
_super.apply(this, arguments);
4242
}
43+
TopPanel.prototype.selectPage = function (title, index) {
44+
this.props.pageSet(index);
45+
this.props.editorMarkdownOpen(title, index);
46+
};
4347
TopPanel.prototype.render = function () {
4448
var _this = this;
45-
var _a = this.props, tutorial = _a.tutorial, pageSet = _a.pageSet, pageAdd = _a.pageAdd;
49+
var _a = this.props, tutorial = _a.tutorial, tutorialPageAdd = _a.tutorialPageAdd;
4650
if (!tutorial || !tutorial.pages) {
4751
return null;
4852
}
4953
return (React.createElement(Tabs_1.Tabs, {tabItemContainerStyle: styles.tabs, style: styles.all},
50-
tutorial.pages.map(function (page, index) {
51-
return (React.createElement(Tabs_1.Tab, {style: styles.tab, key: index, label: page.title.substring(0, 10), onClick: pageSet.bind(_this, page.title, index)}));
52-
}),
53-
React.createElement(Tabs_1.Tab, {style: Object.assign({}, styles.tab, styles.add), label: '+', onActive: pageAdd})));
54+
tutorial.pages.map(function (page, index) { return (React.createElement(Tabs_1.Tab, {style: styles.tab, key: index, label: page.title.substring(0, 10), onClick: _this.selectPage.bind(_this, page.title, index)})); }),
55+
React.createElement(Tabs_1.Tab, {style: Object.assign({}, styles.tab, styles.add), label: '+', onActive: tutorialPageAdd})));
5456
};
5557
TopPanel = __decorate([
5658
react_redux_1.connect(function (state) { return ({
5759
tutorial: state.tutorial,
58-
}); }, function (dispatch) { return ({
59-
pageSet: function (title, index) {
60-
dispatch(actions_1.pageSet(index));
61-
dispatch(actions_1.editorMarkdownOpen(title, index));
62-
},
63-
pageAdd: function () { dispatch(actions_1.tutorialPageAdd()); },
64-
}); }),
60+
}); }, { pageSet: actions_1.pageSet, editorMarkdownOpen: actions_1.editorMarkdownOpen, tutorialPageAdd: actions_1.tutorialPageAdd }),
6561
__metadata('design:paramtypes', [])
6662
], TopPanel);
6763
return TopPanel;

src/components/Config/index.tsx

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -25,19 +25,13 @@ const styles = {
2525

2626
@connect(state => ({
2727
packageJson: state.packageJson,
28-
}), dispatch => ({
29-
pjSave(pj) { dispatch(pjSave(pj)); },
30-
pjLoad() { dispatch(pjLoad()); },
31-
routeToPage() {
32-
dispatch(tutorialInit());
33-
dispatch(routeSet('page'));
34-
}
35-
}))
28+
}), {pjSave, pjLoad, tutorialInit, routeSet })
3629
class TutorialConfig extends React.Component <{
3730
packageJson?: PackageJson,
38-
pjSave?: (pj: Tutorial.PJ) => any,
39-
pjLoad?: () => any
40-
routeToPage?: () => any,
31+
pjSave?: (pj: Tutorial.PJ) => Redux.ActionCreator,
32+
pjLoad?: () => Redux.ActionCreator,
33+
tutorialInit?: () => Redux.ActionCreator,
34+
routeSet?: (route: string) => Redux.ActionCreator,
4135
pristine?: boolean, submitting?: boolean, handleSubmit?: any,
4236
language?: string, invalid?: boolean, initialize?: any
4337
}, {}> {
@@ -82,6 +76,10 @@ class TutorialConfig extends React.Component <{
8276
})
8377
);
8478
}
79+
routeToPage() {
80+
this.props.tutorialInit();
81+
this.props.routeSet('page');
82+
}
8583
render() {
8684
const {pristine, submitting, handleSubmit, invalid} = this.props;
8785
return (
@@ -132,7 +130,7 @@ class TutorialConfig extends React.Component <{
132130
label='Continue'
133131
secondary={true}
134132
disabled={invalid}
135-
onTouchTap={this.props.routeToPage.bind(this)}
133+
onTouchTap={this.routeToPage.bind(this)}
136134
/>
137135

138136
</form>

src/components/Publish/index.tsx

Lines changed: 20 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -22,19 +22,16 @@ const styles = {
2222

2323
@connect(state => ({
2424
packageJson: state.packageJson,
25-
}), dispatch => ({
26-
pjLoad() { dispatch(pjLoad()); },
27-
save(pj: Tutorial.PJ) { dispatch(pjSave(pj)); },
28-
routeToTutorial() { dispatch(routeSet('page')); }
29-
}))
25+
}), {pjLoad, pjSave})
3026
class TutorialPublish extends React.Component<{
31-
packageJson?: any, save?: any, routeToTutorial?: any,
27+
packageJson?: any, pjSave?: (pj: PackageJson) => any,
3228
pristine?: boolean, submitting?: boolean, handleSubmit?: any,
3329
invalid?: boolean, initialize?: (values: Object) => any,
3430
pjLoad?: () => any
3531
}, {}> {
3632
componentWillMount() {
3733
this.props.pjLoad();
34+
this.props.open
3835
}
3936
componentDidMount() {
4037
topElement.toggle(false);
@@ -57,14 +54,13 @@ class TutorialPublish extends React.Component<{
5754
}
5855
}
5956
onSubmit(values) {
60-
const {description, version, keywords} = values;
57+
const {description, version, author, keywords} = values;
6158
// save
62-
this.props.save(Object.assign(
59+
this.props.pjSave(Object.assign(
6360
{},
6461
this.props.packageJson,
6562
{
66-
description, version,
67-
keywords: (keywords.length ? ', ' + keywords : '').split(', ')
63+
description, version, author,
6864
}
6965
));
7066
}
@@ -76,15 +72,23 @@ class TutorialPublish extends React.Component<{
7672
title='Tutorial Info'
7773
/>
7874
<form onSubmit={handleSubmit(this.onSubmit.bind(this))}>
75+
<Field
76+
name='author'
77+
component={textField.bind(null, {
78+
hintText: 'Shawn McKay <my@email.com>',
79+
floatingLabelText: 'Author <email>',
80+
})}
81+
tabIndex='1'
82+
/>
7983

80-
<Field
84+
<Field
8185
name='description'
8286
component={textField.bind(null, {
8387
hintText: 'Tutorial description',
8488
floatingLabelText: 'Description',
8589
})}
8690
tabIndex='1'
87-
/>
91+
/>
8892

8993
<Field
9094
name='version'
@@ -94,16 +98,16 @@ class TutorialPublish extends React.Component<{
9498
disabled: true,
9599
})}
96100
tabIndex='2'
97-
/>
101+
/>
98102

99-
<Field
103+
{/*}<Field
100104
name='keywords'
101105
component={textField.bind(null, {
102-
hintText: 'coderoad, react, js, etc',
106+
hintText: 'react, js, etc',
103107
floatingLabelText: 'Keywords',
104108
})}
105109
tabIndex='3'
106-
/>
110+
/>*/}
107111

108112
<RaisedButton
109113
type='submit'

src/components/Publish/validate.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import * as debounce from 'lodash.debounce';
22

33
const validate = debounce(values => {
44
const errors: { description?: string, version?: string} = {};
5-
const requiredFields = ['description', 'version'];
5+
const requiredFields = ['description', 'version', 'author'];
66
requiredFields.forEach(field => {
77
if (!values[field]) {
88
errors[field] = 'Required';

src/components/TopPanel/TopPanel.tsx

Lines changed: 19 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -26,38 +26,37 @@ const styles = {
2626

2727
@connect(state => ({
2828
tutorial: state.tutorial,
29-
}), dispatch => ({
30-
pageSet(title: string, index: number) {
31-
dispatch(pageSet(index));
32-
dispatch(editorMarkdownOpen(title, index));
33-
},
34-
pageAdd() { dispatch(tutorialPageAdd()); },
35-
}))
29+
}), {pageSet, editorMarkdownOpen, tutorialPageAdd})
3630
export default class TopPanel extends React.Component<{
37-
tutorial?: CR.Tutorial, pageSet?: (index: number) => any, pageAdd?: () => any
31+
tutorial?: CR.Tutorial,
32+
pageSet?: (index: number) => Redux.ActionCreator,
33+
editorMarkdownOpen?: (title: string, index: number) => Redux.ActionCreator,
34+
tutorialPageAdd?: () => Redux.ActionCreator,
3835
}, {}> {
36+
selectPage(title: string, index: number) {
37+
this.props.pageSet(index);
38+
this.props.editorMarkdownOpen(title, index);
39+
}
3940
render() {
40-
const {tutorial, pageSet, pageAdd} = this.props;
41+
const {tutorial, tutorialPageAdd} = this.props;
4142

4243
// no tutorial or pages? no need for a tab bar
4344
if (!tutorial || !tutorial.pages) { return null; }
4445

4546
return (
4647
<Tabs tabItemContainerStyle={styles.tabs} style={styles.all}>
47-
{tutorial.pages.map((page: CR.Page, index) => {
48-
return (
49-
<Tab
50-
style={styles.tab}
51-
key={index}
52-
label={page.title.substring(0, 10)}
53-
onClick={pageSet.bind(this, page.title, index)}
54-
/>
55-
);
56-
})}
48+
{tutorial.pages.map((page: CR.Page, index) => (
49+
<Tab
50+
style={styles.tab}
51+
key={index}
52+
label={page.title.substring(0, 10)}
53+
onClick={this.selectPage.bind(this, page.title, index)}
54+
/>
55+
))}
5756
<Tab
5857
style={Object.assign({}, styles.tab, styles.add)}
5958
label='+'
60-
onActive={pageAdd}
59+
onActive={tutorialPageAdd}
6160
/>
6261
</Tabs>
6362
);

0 commit comments

Comments
 (0)