Skip to content

Commit 3b38923

Browse files
ShMcKShMcK
committed
working tutorialConfig form
1 parent c327175 commit 3b38923

File tree

2 files changed

+31
-37
lines changed

2 files changed

+31
-37
lines changed

‎lib/components/TutorialConfig/index.js‎

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -51,26 +51,28 @@ var TutorialConfig = (function (_super) {
5151
TutorialConfig.prototype.componentDidMount = function () {
5252
Top_1.default.toggle(false);
5353
};
54-
TutorialConfig.prototype.handleSubmit = function (e) {
55-
console.log(e);
56-
console.log(this.props.values);
54+
TutorialConfig.prototype.onSubmit = function (values) {
55+
var name = values.name, language = values.language, runner = values.runner;
56+
this.props.save(Object.assign({}, this.props.packageJson, {
57+
name: name,
58+
config: {
59+
language: language, runner: runner
60+
}
61+
}));
5762
};
5863
TutorialConfig.prototype.render = function () {
5964
var _this = this;
60-
console.log(this.props.values);
61-
var name = this.props.packageJson.name;
62-
var _a = this.props.packageJson.config, language = _a.language, runner = _a.runner;
63-
var _b = this.props, pristine = _b.pristine, submitting = _b.submitting;
64-
return (React.createElement(Card_1.Card, {style: styles.card}, React.createElement(Card_1.CardHeader, {title: 'Tutorial Configuration'}), React.createElement("form", {onSubmit: this.handleSubmit}, React.createElement(redux_form_1.Field, {name: 'name', component: function (name) { return (React.createElement(TextField_1.default, __assign({name: 'name', className: 'native-key-bindings', hintText: 'coderoad-tutorial-name', floatingLabelText: 'Tutorial Name', errorText: name.touched && name.error}, name))); }}), React.createElement("br", null), React.createElement(redux_form_1.Field, {name: 'language', component: function (props) {
65+
var _a = this.props, pristine = _a.pristine, submitting = _a.submitting, handleSubmit = _a.handleSubmit;
66+
return (React.createElement(Card_1.Card, {style: styles.card}, React.createElement(Card_1.CardHeader, {title: 'Tutorial Configuration'}), React.createElement("form", {onSubmit: handleSubmit(this.onSubmit.bind(this))}, React.createElement(redux_form_1.Field, {name: 'name', component: function (name) { return (React.createElement(TextField_1.default, __assign({className: 'native-key-bindings', hintText: 'coderoad-tutorial-name', errorText: name.touched && name.error}, name))); }}), React.createElement("br", null), React.createElement(redux_form_1.Field, {name: 'language', component: function (props) {
6567
return React.createElement("div", null, React.createElement(SelectField_1.default, __assign({value: props.value, floatingLabelText: 'Language', errorText: props.touched && props.error}, props, {onChange: function (event, index, value) { return props.onChange(value); }}), languageItems_1.default()));
6668
}}), React.createElement(redux_form_1.Field, {name: 'runner', component: function (props) {
67-
return React.createElement("div", null, React.createElement(SelectField_1.default, __assign({value: props.value, floatingLabelText: 'Test Runner', errorText: props.touched && props.error}, props, {onChange: function (event, index, value) { return props.onChange(value); }}), runnerItems_1.default(_this.props.values.language)));
68-
}}), React.createElement("br", null), React.createElement(RaisedButton_1.default, {type: 'submit', style: styles.button, label: 'Save', primary: true, disabled: pristine || submitting, onTouchTap: this.submit.bind(this)}), React.createElement(RaisedButton_1.default, {style: styles.button, label: 'Continue', secondary: true, onTouchTap: this.props.routeToPage.bind(this)}))));
69+
return React.createElement("div", null, React.createElement(SelectField_1.default, __assign({value: props.value, floatingLabelText: 'Test Runner', errorText: props.touched && props.error}, props, {onChange: function (event, index, value) { return props.onChange(value); }}), runnerItems_1.default(_this.props.language || 'JS')));
70+
}}), React.createElement("br", null), React.createElement(RaisedButton_1.default, {type: 'submit', style: styles.button, label: 'Save', primary: true, disabled: pristine || submitting}), React.createElement(RaisedButton_1.default, {style: styles.button, label: 'Continue', secondary: true, onTouchTap: this.props.routeToPage.bind(this)}))));
6971
};
7072
TutorialConfig = __decorate([
7173
react_redux_1.connect(function (state) { return ({
7274
packageJson: state.packageJson,
73-
values: formSelector(state, 'name', 'language', 'runner'),
75+
language: formSelector(state, 'language'),
7476
}); }, function (dispatch) { return ({
7577
save: function (pj) { return dispatch(actions_1.pjSave(pj)); },
7678
routeToPage: function () {

‎src/components/TutorialConfig/index.tsx‎

Lines changed: 18 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ interface ConfigForm {
3434

3535
@connect(state => ({
3636
packageJson: state.packageJson,
37-
values: formSelector(state, 'name', 'language', 'runner'),
37+
language: formSelector(state, 'language'),
3838
}), dispatch => ({
3939
save: (pj: Tutorial.PJ) => dispatch(pjSave(pj)),
4040
routeToPage: () => {
@@ -46,46 +46,39 @@ class TutorialConfig extends React.Component <{
4646
packageJson?: PackageJson,
4747
save?: (pj: Tutorial.PJ) => any,
4848
routeToPage?: () => any,
49-
pristine?: boolean, submitting?: boolean,
50-
values?: {name: string, language: string, runner: string}
49+
pristine?: boolean, submitting?: boolean, handleSubmit?: any,
50+
language?: string
5151
}, {}> {
5252
componentDidMount() {
5353
Top.toggle(false);
5454
}
55-
handleSubmit(e) {
56-
console.log(e);
57-
console.log(this.props.values);
58-
// const {name, language, runner} = this.state;
59-
// this.props.save(Object.assign(
60-
// {},
61-
// this.props.packageJson,
62-
// {
63-
// name,
64-
// config: {
65-
// language, runner
66-
// }
67-
// })
68-
// );
55+
onSubmit(values: ConfigForm) {
56+
const {name, language, runner} = values;
57+
this.props.save(Object.assign(
58+
{},
59+
this.props.packageJson,
60+
{
61+
name,
62+
config: {
63+
language, runner
64+
}
65+
})
66+
);
6967
}
7068
render() {
71-
console.log(this.props.values);
72-
const {name} = this.props.packageJson;
73-
const {language, runner} = this.props.packageJson.config;
74-
const {pristine, submitting} = this.props;
69+
const {pristine, submitting, handleSubmit} = this.props;
7570
return (
7671
<Card style={styles.card}>
7772
<CardHeader
7873
title='Tutorial Configuration'
7974
/>
80-
<form onSubmit={this.handleSubmit}>
75+
<form onSubmit={handleSubmit(this.onSubmit.bind(this))}>
8176
<Field
8277
name='name'
8378
component={name => (
8479
<TextField
85-
name='name'
8680
className='native-key-bindings'
8781
hintText='coderoad-tutorial-name'
88-
floatingLabelText='Tutorial Name'
8982
errorText={
9083
name.touched && name.error
9184
}
@@ -116,7 +109,7 @@ class TutorialConfig extends React.Component <{
116109
{...props}
117110
onChange = {(event, index, value) => props.onChange(value)}
118111
>
119-
{runnerItems(this.props.values.language)}
112+
{runnerItems(this.props.language || 'JS')}
120113
</SelectField>
121114
</div>
122115
}/>
@@ -127,7 +120,6 @@ class TutorialConfig extends React.Component <{
127120
label='Save'
128121
primary={true}
129122
disabled={pristine || submitting}
130-
onTouchTap={this.submit.bind(this)}
131123
/>
132124
<RaisedButton
133125
style={styles.button}

0 commit comments

Comments
 (0)