mirror of
https://github.com/status-im/visual-identity.git
synced 2025-02-08 02:33:53 +00:00
add initial form scafold for proposal manager
This commit is contained in:
parent
eec4518aa3
commit
9e010a79c2
4
.babelrc
Normal file
4
.babelrc
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
{
|
||||||
|
"plugins": ["transform-object-rest-spread"],
|
||||||
|
"presets": ["stage-2"]
|
||||||
|
}
|
@ -4,137 +4,155 @@ import ProposalCuration from 'Embark/contracts/ProposalCuration';
|
|||||||
import SNT from 'Embark/contracts/SNT';
|
import SNT from 'Embark/contracts/SNT';
|
||||||
import React, { Component, Fragment } from 'react';
|
import React, { Component, Fragment } from 'react';
|
||||||
import { Form, FormGroup, FormControl, HelpBlock, Button, Alert } from 'react-bootstrap';
|
import { Form, FormGroup, FormControl, HelpBlock, Button, Alert } from 'react-bootstrap';
|
||||||
import web3 from "Embark/web3"
|
import web3 from "Embark/web3";
|
||||||
|
import { withFormik } from 'formik';
|
||||||
|
import FieldGroup from '../standard/FieldGroup';
|
||||||
|
|
||||||
class ProposalManager extends Component {
|
//TODO make innerform and wrap
|
||||||
|
class InnerForm extends Component {
|
||||||
|
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
this.state = {
|
this.state = {
|
||||||
submitPrice: "Loading...",
|
submitPrice: "Loading...",
|
||||||
url: "",
|
url: "",
|
||||||
title: "",
|
title: "",
|
||||||
description: "",
|
description: "",
|
||||||
canSubmit: true
|
canSubmit: true
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount(){
|
componentDidMount(){
|
||||||
this.loadPrice();
|
this.loadPrice();
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillReceiveProps(){
|
componentWillReceiveProps(){
|
||||||
this.loadPrice();
|
this.loadPrice();
|
||||||
}
|
}
|
||||||
|
|
||||||
async loadPrice(){
|
async loadPrice(){
|
||||||
__embarkContext.execWhenReady(async () => {
|
__embarkContext.execWhenReady(async () => {
|
||||||
try {
|
try {
|
||||||
let _b = await ProposalCuration.methods.getSubmitPrice(web3.eth.defaultAccount).call();
|
let _b = await ProposalCuration.methods.getSubmitPrice(web3.eth.defaultAccount).call();
|
||||||
this.setState({
|
this.setState({
|
||||||
submitPrice: _b,
|
submitPrice: _b,
|
||||||
canSubmit: true
|
canSubmit: true
|
||||||
});
|
|
||||||
} catch(err){
|
|
||||||
this.setState({
|
|
||||||
canSubmit: false,
|
|
||||||
submitPrice: "-"
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
} catch(err){
|
||||||
|
this.setState({
|
||||||
|
canSubmit: false,
|
||||||
|
submitPrice: "-"
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
async handleClick(){
|
async handleClick(){
|
||||||
let description = {
|
let description = {
|
||||||
"url": this.state.url,
|
"url": this.state.url,
|
||||||
"title": this.state.title,
|
"title": this.state.title,
|
||||||
"description": this.state.description
|
"description": this.state.description
|
||||||
};
|
};
|
||||||
|
|
||||||
EmbarkJS.Storage.saveText(JSON.stringify(description))
|
EmbarkJS.Storage.saveText(JSON.stringify(description))
|
||||||
.then(async (hash) => {
|
.then(async (hash) => {
|
||||||
let hexHash = web3.utils.toHex(hash);
|
let hexHash = web3.utils.toHex(hash);
|
||||||
|
|
||||||
let receipt = await SNT.methods.approve(
|
let receipt = await SNT.methods.approve(
|
||||||
ProposalCuration.options.address,
|
ProposalCuration.options.address,
|
||||||
this.state.submitPrice)
|
this.state.submitPrice)
|
||||||
.send({from: web3.eth.defaultAccount, gasLimit: 1000000});
|
.send({from: web3.eth.defaultAccount, gasLimit: 1000000});
|
||||||
|
|
||||||
console.log(receipt);
|
console.log(receipt);
|
||||||
|
|
||||||
receipt = await ProposalCuration.methods.submitProposal(
|
receipt = await ProposalCuration.methods.submitProposal(
|
||||||
|
"0x00",
|
||||||
|
"0x0000000000000000000000000000000000000000",
|
||||||
|
0,
|
||||||
"0x00",
|
"0x00",
|
||||||
"0x0000000000000000000000000000000000000000",
|
|
||||||
0,
|
|
||||||
"0x00",
|
|
||||||
hexHash
|
hexHash
|
||||||
)
|
)
|
||||||
.send({from: web3.eth.defaultAccount, gasLimit: 1000000});
|
.send({from: web3.eth.defaultAccount, gasLimit: 1000000});
|
||||||
|
|
||||||
console.log(receipt);
|
console.log(receipt);
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
if(err){
|
if(err){
|
||||||
// TODO show error
|
// TODO show error
|
||||||
console.log("Storage saveText Error => " + err.message);
|
console.log("Storage saveText Error => " + err.message);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
render(){
|
|
||||||
return (
|
render(){
|
||||||
<Fragment>
|
const { values, errors, touched, handleChange, handleBlur, handleSubmit, isSubmitting, setFieldValue } = this.props;
|
||||||
{
|
const { canSubmit } = this.state;
|
||||||
!this.state.canSubmit ?
|
return (
|
||||||
<Alert bsStyle="warning">
|
<Fragment>
|
||||||
Account not allowed to submit proposals
|
{canSubmit &&
|
||||||
</Alert>
|
<Alert bsStyle="warning">
|
||||||
: ''
|
Account not allowed to submit proposals
|
||||||
}
|
</Alert>
|
||||||
<h2>Add proposal</h2>
|
}
|
||||||
<p>Execute this on the console if proposal submit is not allowed</p>
|
<h2>Add proposal</h2>
|
||||||
<code>await ProposalCuration.methods.setSubmitPrice(web3.eth.defaultAccount, true, 1).send();</code>
|
<p>Execute this on the console if proposal submit is not allowed</p>
|
||||||
<h3>Price: {this.state.submitPrice}</h3>
|
<code>await ProposalCuration.methods.setSubmitPrice(web3.eth.defaultAccount, true, 1).send();</code>
|
||||||
<Form>
|
<h3>Price: {this.state.submitPrice}</h3>
|
||||||
<FormGroup>
|
<Form>
|
||||||
<label>
|
<FormGroup>
|
||||||
Title:
|
<label>
|
||||||
<FormControl
|
Title:
|
||||||
type="text"
|
<FormControl
|
||||||
defaultValue={this.state.title}
|
type="text"
|
||||||
onChange={(e) => this.setState({title: e.target.value }) } />
|
defaultValue={this.state.title}
|
||||||
</label>
|
onChange={(e) => this.setState({title: e.target.value }) } />
|
||||||
</FormGroup>
|
</label>
|
||||||
<FormGroup>
|
</FormGroup>
|
||||||
<label>
|
<FieldGroup
|
||||||
Description:
|
id="title"
|
||||||
<FormControl
|
name="title"
|
||||||
type="text"
|
type="test"
|
||||||
defaultValue={this.state.description}
|
label="Title"
|
||||||
onChange={(e) => this.setState({description: e.target.value }) } />
|
onChange={handleChange}
|
||||||
</label>
|
onBlur={handleBlur}
|
||||||
</FormGroup>
|
value={values.title}
|
||||||
<FormGroup>
|
/>
|
||||||
<label>
|
<FormGroup>
|
||||||
URL:
|
<label>
|
||||||
<FormControl
|
Description:
|
||||||
type="text"
|
<FormControl
|
||||||
defaultValue={this.state.url}
|
type="text"
|
||||||
onChange={(e) => this.setState({url: e.target.value }) } />
|
defaultValue={this.state.description}
|
||||||
</label>
|
onChange={(e) => this.setState({description: e.target.value }) } />
|
||||||
</FormGroup>
|
</label>
|
||||||
{
|
</FormGroup>
|
||||||
this.state.canSubmit ?
|
<FormGroup>
|
||||||
<FormGroup>
|
<label>
|
||||||
<Button onClick={(e) => this.handleClick(e)}>Submit</Button>
|
URL:
|
||||||
</FormGroup>
|
<FormControl
|
||||||
: ''
|
type="text"
|
||||||
}
|
defaultValue={this.state.url}
|
||||||
</Form>
|
onChange={(e) => this.setState({url: e.target.value }) } />
|
||||||
</Fragment>
|
</label>
|
||||||
)
|
</FormGroup>
|
||||||
}
|
{
|
||||||
|
this.state.canSubmit ?
|
||||||
|
<FormGroup>
|
||||||
|
<Button onClick={(e) => this.handleClick(e)}>Submit</Button>
|
||||||
|
</FormGroup>
|
||||||
|
: ''
|
||||||
|
}
|
||||||
|
</Form>
|
||||||
|
</Fragment>
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const ProposalManager = withFormik({
|
||||||
|
mapPropsToValues: props => ({ title: '' }),
|
||||||
|
validate(values) {},
|
||||||
|
handleSubmit(values, { setSubmitting}){}
|
||||||
|
})(InnerForm)
|
||||||
|
|
||||||
export default ProposalManager;
|
export default ProposalManager;
|
||||||
|
20
app/components/standard/FieldGroup.js
Normal file
20
app/components/standard/FieldGroup.js
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { FormGroup, FormControl, HelpBlock, ControlLabel, InputGroup } from 'react-bootstrap';
|
||||||
|
|
||||||
|
const FieldGroup = ({ id, label, button, error, ...props }) => (
|
||||||
|
<FormGroup controlId={id} validationState={error ? 'error' : null}>
|
||||||
|
<ControlLabel>{label}</ControlLabel>
|
||||||
|
{button
|
||||||
|
? <InputGroup>
|
||||||
|
<InputGroup.Button>
|
||||||
|
{button}
|
||||||
|
</InputGroup.Button>
|
||||||
|
<FormControl {...props} />
|
||||||
|
</InputGroup>
|
||||||
|
: <FormControl {...props} />
|
||||||
|
}
|
||||||
|
{error && <HelpBlock>{error}</HelpBlock>}
|
||||||
|
</FormGroup>
|
||||||
|
)
|
||||||
|
|
||||||
|
export default FieldGroup;
|
@ -17,6 +17,9 @@
|
|||||||
},
|
},
|
||||||
"homepage": "https://github.com/status-im/contracts#readme",
|
"homepage": "https://github.com/status-im/contracts#readme",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"babel-plugin-transform-object-rest-spread": "^6.26.0",
|
||||||
|
"babel-preset-stage-2": "^6.24.1",
|
||||||
|
"formik": "^0.11.11",
|
||||||
"jquery": "^3.3.1",
|
"jquery": "^3.3.1",
|
||||||
"react": "^16.3.2",
|
"react": "^16.3.2",
|
||||||
"react-blockies": "^1.3.0",
|
"react-blockies": "^1.3.0",
|
||||||
|
Loading…
x
Reference in New Issue
Block a user