Handling boolean parameters

lib/index.js

@@ -388,7 +388,7 @@ class Embark {
         engine.logger.error(err.message);
         engine.logger.debug(err.stack);
       } else {
-        engine.logger.info("Finished generating ui");
+        engine.logger.info("finished generating ui");
       }
       process.exit();
     });

lib/modules/scaffolding-react/index.js

@@ -15,7 +15,15 @@ Handlebars.registerHelper('ifview', function(stateMutability, options) {
     }
 });
 
-Handlebars.registerHelper('ifarrlengthgt', function(arr, val, options) {
+Handlebars.registerHelper('ifeq', function(elem, value, options){
+    if (elem == value) {
+        return options.fn(this);
+    } else {
+        return options.inverse(this);
+    }
+});
+
+Handlebars.registerHelper('iflengthgt', function(arr, val, options) {
     if (arr.length > val) {
         return options.fn(this);
     } else {
@@ -24,7 +32,7 @@ Handlebars.registerHelper('ifarrlengthgt', function(arr, val, options) {
 });
 
 Handlebars.registerHelper('emptyname', function(name, index) {
-    return name ? name : 'outputParam' + index;
+    return name ? name : 'output' + index;
 });
 
 
@@ -75,7 +83,7 @@ class ScaffoldingReact {
 
         this._generateFile(contract, 'dapp.js.tpl', 'js',         
         {
-            'title': contract.className + ' autogenerated UI',
+            'title': contract.className,
             'contractName': contract.className,
             'functions': contract.abiDefinition.filter(x => x.type == 'function')
         });

lib/modules/scaffolding-react/templates/dapp.js.tpl

@@ -3,7 +3,7 @@ import {{contractName}} from 'Embark/contracts/{{contractName}}';
 
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { FormGroup, ControlLabel, FormControl, Button } from 'react-bootstrap';
+import { FormGroup, ControlLabel, FormControl, Checkbox, Button } from 'react-bootstrap';
 
 
 {{#each functions}}
@@ -14,7 +14,7 @@ class {{capitalize name}}_{{@index}}_Form extends React.Component {
             {{#if inputs.length}}
             input: {
                 {{#each inputs}}
-                {{name}}: ''{{#unless @last}},{{/unless}}
+                {{name}}: {{#ifeq type 'bool'}}false{{else}}''{{/ifeq}}{{#unless @last}},{{/unless}}
                 {{/each}}
             },
             {{/if}}
@@ -26,28 +26,33 @@ class {{capitalize name}}_{{@index}}_Form extends React.Component {
     }
 
     handleChange(e, name){
-        this.state[name] = e.target.value;
+        this.state.input[name] = e.target.value;
+        this.setState(this.state);
+    }
+
+    handleCheckbox(e, name){
+        this.state.input[name] = e.target.checked;
         this.setState(this.state);
     }
 
     async handleClick(e){
         e.preventDefault();
-
-        {{#ifview stateMutability}}
         this.setState({output: null});
 
-        let result = await {{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.{{name}}{{#unless @last}}, {{/unless}}{{/each}}).call();
-        {{#ifarrlengthgt outputs 1}}
-        this.setState({output: {
+        {{#ifview stateMutability}}
+        {{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.input.{{name}}{{#unless @last}}, {{/unless}}{{/each}})
+            .call()
+            .then((result) => {
+        {{#iflengthgt outputs 1}}
+                this.setState({output: {
         {{#each outputs}}
-            {{emptyname name @index}}: result[{{@index}}]{{#unless @last}},{{/unless}}
+                    {{emptyname name @index}}: result[{{@index}}]{{#unless @last}},{{/unless}}
         {{/each}}
-        }}); 
+                }}); 
         {{else}}
-        this.setState({output: result});  
-        {{/ifarrlengthgt}} 
-
-
+                this.setState({output: result});  
+        {{/iflengthgt}} 
+            });
 
         // TODO show on screen
         {{/ifview}}
@@ -63,12 +68,18 @@ class {{capitalize name}}_{{@index}}_Form extends React.Component {
                 {{#each inputs}}
                     <FormGroup>
                         <ControlLabel>{{name}}</ControlLabel>
+                        {{#ifeq type 'bool'}}
+                        <Checkbox
+                            onClick={(e) => this.handleCheckbox(e, '{{name}}')}
+                        />
+                        {{else}}
                         <FormControl
                             type="text"
                             defaultValue={ this.state.input.{{name}} }
                             placeholder="{{type}}"
                             onChange={(e) => this.handleChange(e, '{{name}}')}
                         />
+                        {{/ifeq}}
                     </FormGroup>
                 {{/each}}      
             {{/if}}
@@ -78,15 +89,15 @@ class {{capitalize name}}_{{@index}}_Form extends React.Component {
                     this.state.output != null ?
                     <React.Fragment>
                         <h4>Results</h4>
-                        {{#ifarrlengthgt outputs 1}}
+                        {{#iflengthgt outputs 1}}
                         <ul>
                         {{#each outputs}}
                             <li>{{emptyname name @index}}: { this.state.output.{{emptyname name @index}} }</li>
                         {{/each}}
                         </ul>
                         {{else}}
-                        {this.state.output}
-                        {{/ifarrlengthgt}}
+                        {this.state.output.toString()}
+                        {{/iflengthgt}}
                     </React.Fragment>
                     : ''
                 }