diff --git a/src/components/newdapp/index.js b/src/components/newdapp/index.js index 1e073a39..24773958 100644 --- a/src/components/newdapp/index.js +++ b/src/components/newdapp/index.js @@ -16,38 +16,39 @@ import { h, Component } from 'preact'; import Proptypes from 'prop-types'; -import Step1 from './step1'; -import Step2 from './step2'; +import SelectedTemplate from './selectTemplate'; +import ProjectDetails from './projectDetails'; import Templates from '../templates'; export default class NewDapp extends Component { state = { - projectInfo: null, + selectedTemplate: null, currentStep: 1, } - onStep1DoneHandle = (projectInfo) => { - this.setState({ - currentStep: 2, - projectInfo: projectInfo - }); - } - onCloseClickHandle = () => { this.closeModal(); } onTemplateSelectedHandle = (selectedTemplate) => { - var dappfile = selectedTemplate.dappfile; + this.setState({ + currentStep: 2, + selectedTemplate: selectedTemplate + }) + } + + onProjectDetailsDone = (projectInfo) => { + var dappfile = this.state.selectedTemplate.dappfile; // Make sure we include the info of the current project in the dappFile, in order to do not break anything in the app... - const project = { info: this.state.projectInfo } + const project = { info: projectInfo } dappfile.project = project; - const files = selectedTemplate.files; + const files = this.state.selectedTemplate.files; + + this.props.backend.saveProject(projectInfo.name, { dappfile: dappfile }, o => this.props.cb(o.status, o.code), true, files); - this.props.backend.saveProject(this.state.projectInfo.name, { dappfile: dappfile }, o => this.props.cb(o.status, o.code), true, files); this.closeModal(); } @@ -65,22 +66,23 @@ export default class NewDapp extends Component { let step; switch (this.state.currentStep) { case 1: - step = ; - break; - case 2: - step = ; + onBackPress={this.closeModal} + onCloseClick={this.onCloseClickHandle}/>; + break; + case 2: + step = ; break; default: - step = ; + step = ; break; } @@ -92,6 +94,7 @@ export default class NewDapp extends Component { } } + NewDapp.proptypes = { modal: Proptypes.object.isRequired, functions: Proptypes.object.isRequired, diff --git a/src/components/newdapp/step1/index.js b/src/components/newdapp/projectDetails/index.js similarity index 89% rename from src/components/newdapp/step1/index.js rename to src/components/newdapp/projectDetails/index.js index cc9263f8..0bf5233b 100644 --- a/src/components/newdapp/step1/index.js +++ b/src/components/newdapp/projectDetails/index.js @@ -20,7 +20,7 @@ import classNames from 'classnames'; import style from '../style'; import { IconClose } from '../../icons'; -export default class Step1 extends Component { +export default class ProjectDetails extends Component { constructor(props) { super(props); @@ -61,12 +61,16 @@ export default class Step1 extends Component { } if (this.validateInputs()) { - this.props.onStep1Done({ name: this.state.projectName, title: this.state.projectTitle }); + this.props.onProjectDetailsDone({ name: this.state.projectName, title: this.state.projectTitle }); } }; onCloseClickHandle = () => { - this.props.onCloseClickHandle(); + this.props.onCloseClick(); + }; + + onBackClickHandle = () => { + this.props.onBackClick(); }; handleNameChange = changeEvent => { @@ -118,8 +122,8 @@ export default class Step1 extends Component {
- - + +
@@ -127,7 +131,8 @@ export default class Step1 extends Component { } } -Step1.propTypes = { - onStep1Done: Proptypes.func.isRequired, - onCloseClickHandle: Proptypes.func.isRequired +ProjectDetails.propTypes = { + onProjectDetailsDone: Proptypes.func.isRequired, + onCloseClick: Proptypes.func.isRequired, + onBackClick: Proptypes.func.isRequired } diff --git a/src/components/newdapp/step2/index.js b/src/components/newdapp/selectTemplate/index.js similarity index 92% rename from src/components/newdapp/step2/index.js rename to src/components/newdapp/selectTemplate/index.js index 8cdffd9a..2f999b82 100644 --- a/src/components/newdapp/step2/index.js +++ b/src/components/newdapp/selectTemplate/index.js @@ -56,7 +56,7 @@ TemplateLayout.propTypes = { onTemplateSelected: Proptypes.func.isRequired } -export default class Step2 extends Component { +export default class SelectTemplate extends Component { state = { categorySelectedId: 0, @@ -67,8 +67,8 @@ export default class Step2 extends Component { this.props.onTemplateSelected(this.state.templateSelected); } - back = () => { - this.props.onBackPress(); + onCancelClickHandle = () => { + this.props.onCloseClick(); } onCategorySelected(id) { @@ -84,7 +84,7 @@ export default class Step2 extends Component { } onCloseClickHandle = () => { - this.props.onCloseClickHandle(); + this.props.onCloseClick(); }; render() { @@ -124,8 +124,8 @@ export default class Step2 extends Component {
- - + +
@@ -133,10 +133,9 @@ export default class Step2 extends Component { } } -Step2.proptypes = { +SelectTemplate.proptypes = { categories: Proptypes.array.isRequired, templates: Proptypes.array.isRequired, onTemplateSelected: Proptypes.func.isRequired, - onBackPress: Proptypes.func.isRequired, - onCloseClicked: Proptypes.func.isRequired + onCloseClick: Proptypes.func.isRequired }