add title & balance examples
This commit is contained in:
Iuri Matias
parent
460aa79c2d
commit
82f1198fc7
|
|
@ -7,7 +7,7 @@
|
|||
"react-dom": "^16.9.0",
|
||||
"react-scripts": "3.1.1",
|
||||
"rxjs": "^6.5.2",
|
||||
"web3": "^1.0.0-beta.37"
|
||||
"web3": "^1.2.1"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
|
|
|
|||
|
|
@ -25,33 +25,45 @@ class App extends React.Component {
|
|||
|
||||
const rating$ = subspace.trackEvent(Product, "Rating").pipe(map(x => parseInt(x.rating)));
|
||||
|
||||
subspace.trackProperty(Product, "products", [0]).pipe().subscribe(console.dir);
|
||||
|
||||
this.setState({
|
||||
title: subspace.trackProperty(Product, "products", [0]).pipe(map(x => x.title)),
|
||||
averageRating: rating$.pipe($average()),
|
||||
minRating: rating$.pipe($min()),
|
||||
maxRating: rating$.pipe($max())
|
||||
maxRating: rating$.pipe($max()),
|
||||
balance: subspace.trackBalance(Product.options.address)
|
||||
});
|
||||
}
|
||||
|
||||
createTrx = async () => {
|
||||
const productId = 0;
|
||||
const rating = parseInt(this.state.rating)
|
||||
window.Product = Product
|
||||
await Product.methods.rateProduct(productId, rating).send();
|
||||
rateProduct = async () => {
|
||||
await Product.methods.rateProduct(0, this.state.userRating).send();
|
||||
};
|
||||
|
||||
updateTitle = async () => {
|
||||
await Product.methods.editProduct(0, this.state.userTitle).send();
|
||||
};
|
||||
|
||||
sendFunds = async () => {
|
||||
await web3.eth.sendTransaction({value: this.state.contractFunds, to: Product.options.address});
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<button onClick={this.createTrx}>Rate Product</button>
|
||||
<input type="number" value={this.state.rating} onChange={(evt) => this.setState({rating: evt.target.value}) } />
|
||||
<button onClick={this.rateProduct}>Rate Product</button>
|
||||
<input type="number" value={this.state.userRating} onChange={(evt) => this.setState({userRating: parseInt(evt.target.value)}) } />
|
||||
|
||||
<button onClick={this.updateTitle}>Update Title</button>
|
||||
<input type="string" value={this.state.userTitle} onChange={(evt) => this.setState({userTitle: evt.target.value}) } />
|
||||
|
||||
<button onClick={this.sendFunds}>Send Funds</button>
|
||||
<input type="string" value={this.state.contractFunds} onChange={(evt) => this.setState({contractFunds: parseInt(evt.target.value)}) } />
|
||||
|
||||
<ProductComponent
|
||||
title={this.state.title}
|
||||
maxRating={this.state.maxRating}
|
||||
minRating={this.state.minRating}
|
||||
averageRating={this.state.averageRating}
|
||||
balance={this.state.balance}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,128 +1,133 @@
|
|||
import web3 from './web3';
|
||||
|
||||
const abi = [
|
||||
{
|
||||
"constant": false,
|
||||
"inputs": [
|
||||
{
|
||||
"internalType": "string",
|
||||
"name": "title",
|
||||
"type": "string"
|
||||
}
|
||||
],
|
||||
"name": "createProduct",
|
||||
"outputs": [],
|
||||
"payable": false,
|
||||
"stateMutability": "nonpayable",
|
||||
"type": "function"
|
||||
},
|
||||
{
|
||||
"constant": false,
|
||||
"inputs": [
|
||||
{
|
||||
"internalType": "uint256",
|
||||
"name": "productId",
|
||||
"type": "uint256"
|
||||
},
|
||||
{
|
||||
"internalType": "string",
|
||||
"name": "title",
|
||||
"type": "string"
|
||||
}
|
||||
],
|
||||
"name": "editProduct",
|
||||
"outputs": [],
|
||||
"payable": false,
|
||||
"stateMutability": "nonpayable",
|
||||
"type": "function"
|
||||
},
|
||||
{
|
||||
"constant": false,
|
||||
"inputs": [
|
||||
{
|
||||
"internalType": "uint256",
|
||||
"name": "productId",
|
||||
"type": "uint256"
|
||||
},
|
||||
{
|
||||
"internalType": "uint256",
|
||||
"name": "rating",
|
||||
"type": "uint256"
|
||||
}
|
||||
],
|
||||
"name": "rateProduct",
|
||||
"outputs": [],
|
||||
"payable": false,
|
||||
"stateMutability": "nonpayable",
|
||||
"type": "function"
|
||||
},
|
||||
{
|
||||
"inputs": [],
|
||||
"payable": false,
|
||||
"stateMutability": "nonpayable",
|
||||
"type": "constructor"
|
||||
},
|
||||
{
|
||||
"payable": true,
|
||||
"stateMutability": "payable",
|
||||
"type": "fallback"
|
||||
},
|
||||
{
|
||||
"anonymous": false,
|
||||
"inputs": [
|
||||
{
|
||||
"indexed": false,
|
||||
"internalType": "uint256",
|
||||
"name": "productId",
|
||||
"type": "uint256"
|
||||
}
|
||||
],
|
||||
"name": "newProduct",
|
||||
"type": "event"
|
||||
},
|
||||
{
|
||||
"anonymous": false,
|
||||
"inputs": [
|
||||
{
|
||||
"indexed": true,
|
||||
"internalType": "uint256",
|
||||
"name": "productId",
|
||||
"type": "uint256"
|
||||
},
|
||||
{
|
||||
"indexed": false,
|
||||
"internalType": "uint256",
|
||||
"name": "rating",
|
||||
"type": "uint256"
|
||||
}
|
||||
],
|
||||
"name": "Rating",
|
||||
"type": "event"
|
||||
},
|
||||
{
|
||||
"constant": true,
|
||||
"inputs": [
|
||||
{
|
||||
"internalType": "uint256",
|
||||
"name": "",
|
||||
"type": "uint256"
|
||||
}
|
||||
],
|
||||
"name": "products",
|
||||
"outputs": [
|
||||
{
|
||||
"internalType": "string",
|
||||
"name": "title",
|
||||
"type": "string"
|
||||
}
|
||||
],
|
||||
"payable": false,
|
||||
"stateMutability": "view",
|
||||
"type": "function"
|
||||
}
|
||||
{
|
||||
"constant": false,
|
||||
"inputs": [
|
||||
{
|
||||
"internalType": "string",
|
||||
"name": "title",
|
||||
"type": "string"
|
||||
}
|
||||
],
|
||||
"name": "createProduct",
|
||||
"outputs": [],
|
||||
"payable": false,
|
||||
"stateMutability": "nonpayable",
|
||||
"type": "function"
|
||||
},
|
||||
{
|
||||
"constant": false,
|
||||
"inputs": [
|
||||
{
|
||||
"internalType": "uint256",
|
||||
"name": "productId",
|
||||
"type": "uint256"
|
||||
},
|
||||
{
|
||||
"internalType": "string",
|
||||
"name": "title",
|
||||
"type": "string"
|
||||
}
|
||||
],
|
||||
"name": "editProduct",
|
||||
"outputs": [],
|
||||
"payable": false,
|
||||
"stateMutability": "nonpayable",
|
||||
"type": "function"
|
||||
},
|
||||
{
|
||||
"constant": true,
|
||||
"inputs": [
|
||||
{
|
||||
"internalType": "uint256",
|
||||
"name": "",
|
||||
"type": "uint256"
|
||||
}
|
||||
],
|
||||
"name": "products",
|
||||
"outputs": [
|
||||
{
|
||||
"internalType": "string",
|
||||
"name": "title",
|
||||
"type": "string"
|
||||
},
|
||||
{
|
||||
"internalType": "uint256",
|
||||
"name": "latestRating",
|
||||
"type": "uint256"
|
||||
}
|
||||
],
|
||||
"payable": false,
|
||||
"stateMutability": "view",
|
||||
"type": "function"
|
||||
},
|
||||
{
|
||||
"constant": false,
|
||||
"inputs": [
|
||||
{
|
||||
"internalType": "uint256",
|
||||
"name": "productId",
|
||||
"type": "uint256"
|
||||
},
|
||||
{
|
||||
"internalType": "uint256",
|
||||
"name": "rating",
|
||||
"type": "uint256"
|
||||
}
|
||||
],
|
||||
"name": "rateProduct",
|
||||
"outputs": [],
|
||||
"payable": false,
|
||||
"stateMutability": "nonpayable",
|
||||
"type": "function"
|
||||
},
|
||||
{
|
||||
"inputs": [],
|
||||
"payable": false,
|
||||
"stateMutability": "nonpayable",
|
||||
"type": "constructor"
|
||||
},
|
||||
{
|
||||
"payable": true,
|
||||
"stateMutability": "payable",
|
||||
"type": "fallback"
|
||||
},
|
||||
{
|
||||
"anonymous": false,
|
||||
"inputs": [
|
||||
{
|
||||
"indexed": false,
|
||||
"internalType": "uint256",
|
||||
"name": "productId",
|
||||
"type": "uint256"
|
||||
}
|
||||
],
|
||||
"name": "newProduct",
|
||||
"type": "event"
|
||||
},
|
||||
{
|
||||
"anonymous": false,
|
||||
"inputs": [
|
||||
{
|
||||
"indexed": true,
|
||||
"internalType": "uint256",
|
||||
"name": "productId",
|
||||
"type": "uint256"
|
||||
},
|
||||
{
|
||||
"indexed": false,
|
||||
"internalType": "uint256",
|
||||
"name": "rating",
|
||||
"type": "uint256"
|
||||
}
|
||||
],
|
||||
"name": "Rating",
|
||||
"type": "event"
|
||||
}
|
||||
];
|
||||
|
||||
const data = "0x608060405234801561001057600080fd5b506100556040518060400160405280600681526020017f6c6170746f70000000000000000000000000000000000000000000000000000081525061005a60201b60201c565b61026e565b60016000818180549050019150816100729190610193565b50600060016000805490500390506100886101bf565b6000828154811061009557fe5b90600052602060002001604051806020016040529081600082018054600181600116156101000203166002900480601f0160208091040260200160405190810160405280929190818152602001828054600181600116156101000203166002900480156101435780601f1061011857610100808354040283529160200191610143565b820191906000526020600020905b81548152906001019060200180831161012657829003601f168201915b50505050508152505090508281600001819052507f5dc23a654c93455cd36741580d5c1fafc8f35c429bb831bc768008bd655a1219826040518082815260200191505060405180910390a1505050565b8154818355818111156101ba578183600052602060002091820191016101b991906101d2565b5b505050565b6040518060200160405280606081525090565b6101fe91905b808211156101fa57600080820160006101f19190610201565b506001016101d8565b5090565b90565b50805460018160011615610100020316600290046000825580601f106102275750610246565b601f0160209004906000526020600020908101906102459190610249565b5b50565b61026b91905b8082111561026757600081600090555060010161024f565b5090565b90565b6106cb8061027d6000396000f3fe60806040526004361061003f5760003560e01c806302ec06be1461004157806311eaa75a146101095780637acc0b20146101db578063f4ef9e361461028f575b005b34801561004d57600080fd5b506101076004803603602081101561006457600080fd5b810190808035906020019064010000000081111561008157600080fd5b82018360208201111561009357600080fd5b803590602001918460018302840111640100000000831117156100b557600080fd5b91908080601f016020809104026020016040519081016040528093929190818152602001838380828437600081840152601f19601f8201169050808301925050505050505091929192905050506102d4565b005b34801561011557600080fd5b506101d96004803603604081101561012c57600080fd5b81019080803590602001909291908035906020019064010000000081111561015357600080fd5b82018360208201111561016557600080fd5b8035906020019184600183028401116401000000008311171561018757600080fd5b91908080601f016020809104026020016040519081016040528093929190818152602001838380828437600081840152601f19601f82011690508083019250505050505050919291929050505061040d565b005b3480156101e757600080fd5b50610214600480360360208110156101fe57600080fd5b8101908080359060200190929190505050610440565b6040518080602001828103825283818151815260200191508051906020019080838360005b83811015610254578082015181840152602081019050610239565b50505050905090810190601f1680156102815780820380516001836020036101000a031916815260200191505b509250505060405180910390f35b34801561029b57600080fd5b506102d2600480360360408110156102b257600080fd5b8101908080359060200190929190803590602001909291905050506104ff565b005b60016000818180549050019150816102ec919061053b565b5060006001600080549050039050610302610567565b6000828154811061030f57fe5b90600052602060002001604051806020016040529081600082018054600181600116156101000203166002900480601f0160208091040260200160405190810160405280929190818152602001828054600181600116156101000203166002900480156103bd5780601f10610392576101008083540402835291602001916103bd565b820191906000526020600020905b8154815290600101906020018083116103a057829003601f168201915b50505050508152505090508281600001819052507f5dc23a654c93455cd36741580d5c1fafc8f35c429bb831bc768008bd655a1219826040518082815260200191505060405180910390a1505050565b806000838154811061041b57fe5b90600052602060002001600001908051906020019061043b92919061057a565b505050565b6000818154811061044d57fe5b90600052602060002001600091509050806000018054600181600116156101000203166002900480601f0160208091040260200160405190810160405280929190818152602001828054600181600116156101000203166002900480156104f55780601f106104ca576101008083540402835291602001916104f5565b820191906000526020600020905b8154815290600101906020018083116104d857829003601f168201915b5050505050905081565b817ffdefdf8d82459f7b1eb157e5c44cbe6ee73d8ddd387511fe3622a3ee663b4697826040518082815260200191505060405180910390a25050565b8154818355818111156105625781836000526020600020918201910161056191906105fa565b5b505050565b6040518060200160405280606081525090565b828054600181600116156101000203166002900490600052602060002090601f016020900481019282601f106105bb57805160ff19168380011785556105e9565b828001600101855582156105e9579182015b828111156105e85782518255916020019190600101906105cd565b5b5090506105f69190610629565b5090565b61062691905b808211156106225760008082016000610619919061064e565b50600101610600565b5090565b90565b61064b91905b8082111561064757600081600090555060010161062f565b5090565b90565b50805460018160011615610100020316600290046000825580601f106106745750610693565b601f0160209004906000526020600020908101906106929190610629565b5b5056fea265627a7a723158207edf05422cf9e8fdd43b6bed8a48f8fca2f9c986b2579db7d628dca6781c5ef764736f6c634300050b0032";
|
||||
const data = "0x608060405234801561001057600080fd5b506100556040518060400160405280600681526020017f6c6170746f70000000000000000000000000000000000000000000000000000081525061005a60201b60201c565b610253565b600160008181805490500191508161007291906100fd565b5060006001600080549050039050600080828154811061008e57fe5b90600052602060002090600202019050828160000190805190602001906100b692919061012f565b50600281600101819055507f5dc23a654c93455cd36741580d5c1fafc8f35c429bb831bc768008bd655a1219826040518082815260200191505060405180910390a1505050565b81548183558181111561012a5760020281600202836000526020600020918201910161012991906101af565b5b505050565b828054600181600116156101000203166002900490600052602060002090601f016020900481019282601f1061017057805160ff191683800117855561019e565b8280016001018555821561019e579182015b8281111561019d578251825591602001919060010190610182565b5b5090506101ab91906101e6565b5090565b6101e391905b808211156101df57600080820160006101ce919061020b565b6001820160009055506002016101b5565b5090565b90565b61020891905b808211156102045760008160009055506001016101ec565b5090565b90565b50805460018160011615610100020316600290046000825580601f106102315750610250565b601f01602090049060005260206000209081019061024f91906101e6565b5b50565b610645806102626000396000f3fe60806040526004361061003f5760003560e01c806302ec06be1461004157806311eaa75a146101095780637acc0b20146101db578063f4ef9e3614610296575b005b34801561004d57600080fd5b506101076004803603602081101561006457600080fd5b810190808035906020019064010000000081111561008157600080fd5b82018360208201111561009357600080fd5b803590602001918460018302840111640100000000831117156100b557600080fd5b91908080601f016020809104026020016040519081016040528093929190818152602001838380828437600081840152601f19601f8201169050808301925050505050505091929192905050506102db565b005b34801561011557600080fd5b506101d96004803603604081101561012c57600080fd5b81019080803590602001909291908035906020019064010000000081111561015357600080fd5b82018360208201111561016557600080fd5b8035906020019184600183028401116401000000008311171561018757600080fd5b91908080601f016020809104026020016040519081016040528093929190818152602001838380828437600081840152601f19601f82011690508083019250505050505050919291929050505061037e565b005b3480156101e757600080fd5b50610214600480360360208110156101fe57600080fd5b81019080803590602001909291905050506103b5565b6040518080602001838152602001828103825284818151815260200191508051906020019080838360005b8381101561025a57808201518184015260208101905061023f565b50505050905090810190601f1680156102875780820380516001836020036101000a031916815260200191505b50935050505060405180910390f35b3480156102a257600080fd5b506102d9600480360360408110156102b957600080fd5b81019080803590602001909291908035906020019092919050505061047e565b005b60016000818180549050019150816102f391906104ba565b5060006001600080549050039050600080828154811061030f57fe5b90600052602060002090600202019050828160000190805190602001906103379291906104ec565b50600281600101819055507f5dc23a654c93455cd36741580d5c1fafc8f35c429bb831bc768008bd655a1219826040518082815260200191505060405180910390a1505050565b806000838154811061038c57fe5b906000526020600020906002020160000190805190602001906103b09291906104ec565b505050565b600081815481106103c257fe5b9060005260206000209060020201600091509050806000018054600181600116156101000203166002900480601f01602080910402602001604051908101604052809291908181526020018280546001816001161561010002031660029004801561046e5780601f106104435761010080835404028352916020019161046e565b820191906000526020600020905b81548152906001019060200180831161045157829003601f168201915b5050505050908060010154905082565b817ffdefdf8d82459f7b1eb157e5c44cbe6ee73d8ddd387511fe3622a3ee663b4697826040518082815260200191505060405180910390a25050565b8154818355818111156104e7576002028160020283600052602060002091820191016104e6919061056c565b5b505050565b828054600181600116156101000203166002900490600052602060002090601f016020900481019282601f1061052d57805160ff191683800117855561055b565b8280016001018555821561055b579182015b8281111561055a57825182559160200191906001019061053f565b5b50905061056891906105a3565b5090565b6105a091905b8082111561059c576000808201600061058b91906105c8565b600182016000905550600201610572565b5090565b90565b6105c591905b808211156105c15760008160009055506001016105a9565b5090565b90565b50805460018160011615610100020316600290046000825580601f106105ee575061060d565b601f01602090049060005260206000209081019061060c91906105a3565b5b5056fea265627a7a723158206f33e1da3737d5722b96b323149eaa05c6eccdcb8ff4943da4758e783d210a5b64736f6c634300050b0032";
|
||||
|
||||
const MyContract = new web3.eth.Contract(abi, {data, gas: "800000"});
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from "react";
|
||||
import { observe } from "@status-im/subspace/react";
|
||||
|
||||
const ProductComponent = ({ maxRating, minRating, averageRating, title }) => {
|
||||
const ProductComponent = ({ maxRating, minRating, averageRating, title, balance }) => {
|
||||
// Handle initial state when no data is available
|
||||
if (!maxRating && !minRating && !averageRating) {
|
||||
return <p>No data</p>;
|
||||
|
|
@ -12,6 +12,7 @@ const ProductComponent = ({ maxRating, minRating, averageRating, title }) => {
|
|||
<li><b>minimum rating: </b> {minRating}</li>
|
||||
<li><b>maximum rating: </b> {maxRating}</li>
|
||||
<li><b>average rating: </b> {averageRating}</li>
|
||||
<li><b>balance in contract:</b> {balance}</li>
|
||||
</ul>;
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -10623,7 +10623,7 @@ web3-utils@1.2.1:
|
|||
underscore "1.9.1"
|
||||
utf8 "3.0.0"
|
||||
|
||||
web3@^1.0.0-beta.37:
|
||||
web3@^1.2.1:
|
||||
version "1.2.1"
|
||||
resolved "https://registry.yarnpkg.com/web3/-/web3-1.2.1.tgz#5d8158bcca47838ab8c2b784a2dee4c3ceb4179b"
|
||||
integrity sha512-nNMzeCK0agb5i/oTWNdQ1aGtwYfXzHottFP2Dz0oGIzavPMGSKyVlr8ibVb1yK5sJBjrWVnTdGaOC2zKDFuFRw==
|
||||
|
|
|
|||
Loading…
Reference in New Issue