Skip to content
This repository has been archived by the owner on Jan 29, 2024. It is now read-only.

Commit

Permalink
add decimal option at token transfer
Browse files Browse the repository at this point in the history
  • Loading branch information
elliot committed Oct 29, 2020
1 parent 1ce2a90 commit ec4ae4e
Show file tree
Hide file tree
Showing 4 changed files with 248 additions and 139 deletions.
102 changes: 63 additions & 39 deletions src/components/SmartContractExecution.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ class SmartContractExecution extends Component {
txHash: null,
receipt: null,
error: null,
decimal: 18
}
}

Expand All @@ -26,49 +27,72 @@ class SmartContractExecution extends Component {
return null
}

handleChange = (e) => {
handleChange = e => {
this.setState({
[e.target.name]: e.target.value,
[e.target.name]: e.target.value
})
}

signTransaction = () => {
const { from, contractAddress, to, amount, gas } = this.state
const data = caver.klay.abi.encodeFunctionCall({
name: 'transfer',
type: 'function',
inputs: [{
type: 'address',
name: 'recipient',
}, {
type: 'uint256',
name: 'amount',
}],
}, [to, caver.utils.toPeb(amount, 'KLAY')])
const { from, contractAddress, to, amount, gas, decimal } = this.state
const data = caver.klay.abi.encodeFunctionCall(
{
name: 'transfer',
type: 'function',
inputs: [
{
type: 'address',
name: 'recipient'
},
{
type: 'uint256',
name: 'amount'
}
]
},
[
to,
caver.utils
.toBN(amount)
.mul(caver.utils.toBN(Number(`1e${decimal}`)))
.toString()
]
)

caver.klay.sendTransaction({
type: 'SMART_CONTRACT_EXECUTION',
from,
to: contractAddress,
data,
gas,
})
.on('transactionHash', (transactionHash) => {
caver.klay
.sendTransaction({
type: 'SMART_CONTRACT_EXECUTION',
from,
to: contractAddress,
data,
gas
})
.on('transactionHash', transactionHash => {
console.log('txHash', transactionHash)
this.setState({ txHash: transactionHash })
})
.on('receipt', (receipt) => {
.on('receipt', receipt => {
console.log('receipt', receipt)
this.setState({ receipt: JSON.stringify(receipt) })
})
.on('error', (error) => {
.on('error', error => {
console.log('error', error)
this.setState({ error: error.message })
})
}

render() {
const { from, to, amount, contractAddress, gas, txHash, receipt, error } = this.state
const {
from,
to,
amount,
contractAddress,
gas,
txHash,
receipt,
error,
decimal
} = this.state

return (
<div className="SmartContractExecution">
Expand All @@ -77,45 +101,45 @@ class SmartContractExecution extends Component {
label="From"
value={from}
onChange={this.handleChange}
placeholder="Account you logged in metamask"
placeholder="Kaikas account"
/>
<Input
name="to"
label="To"
value={to}
onChange={this.handleChange}
placeholder="Address you want to send Token"
placeholder="Address you want to send token to"
/>
<Input
name="contractAddress"
label="Contract Address (Token Address)"
label="Token Contract Address"
value={contractAddress}
onChange={this.handleChange}
placeholder="The address of the deployed smart contract"
/>
<Input
name="decimal"
label="Token Decimal"
value={decimal}
onChange={this.handleChange}
placeholder="Token's number of decimal"
/>
<Input
name="amount"
label="Amount"
value={amount}
onChange={this.handleChange}
placeholder="Amount of Eth you want to send"
placeholder="Amount of token you want to send"
/>
<Input
name="gas"
label="Gas"
value={gas}
onChange={this.handleChange}
placeholder="Gas"
/>
<Button
title="Sign Transaction"
onClick={this.signTransaction}
/>
<TxResult
txHash={txHash}
receipt={receipt}
error={error}
placeholder="Transaction gas limit"
/>
<Button title="Sign Transaction" onClick={this.signTransaction} />
<TxResult txHash={txHash} receipt={receipt} error={error} />
</div>
)
}
Expand Down
82 changes: 54 additions & 28 deletions src/components/SmartContractExecutionFD.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import Button from 'components/Button'
import Message from 'components/Message'
import FeeDelegation from 'components/FeeDelegation'


class SmartContractExecutionFD extends Component {
constructor(props) {
super(props)
Expand All @@ -17,6 +16,7 @@ class SmartContractExecutionFD extends Component {
gas: 3000000,
senderAddress: '',
senderRawTransaction: null,
decimal: 18
}
}

Expand All @@ -27,36 +27,50 @@ class SmartContractExecutionFD extends Component {
return null
}

handleChange = (e) => {
handleChange = e => {
this.setState({
[e.target.name]: e.target.value,
[e.target.name]: e.target.value
})
}

signTransaction = async () => {
const { from, to, amount, contractAddress, gas } = this.state
const { from, to, amount, contractAddress, gas, decimal } = this.state

const data = caver.klay.abi.encodeFunctionCall({
name: 'transfer',
type: 'function',
inputs: [{
type: 'address',
name: 'recipient',
}, {
type: 'uint256',
name: 'amount',
}],
}, [to, caver.utils.toPeb(amount, 'KLAY')])
const data = caver.klay.abi.encodeFunctionCall(
{
name: 'transfer',
type: 'function',
inputs: [
{
type: 'address',
name: 'recipient'
},
{
type: 'uint256',
name: 'amount'
}
]
},
[
to,
caver.utils
.toBN(amount)
.mul(caver.utils.toBN(Number(`1e${decimal}`)))
.toString()
]
)

const txData = {
type: 'FEE_DELEGATED_SMART_CONTRACT_EXECUTION',
from,
to: contractAddress,
gas,
data,
data
}

const { rawTransaction: senderRawTransaction } = await caver.klay.signTransaction(txData)
const {
rawTransaction: senderRawTransaction
} = await caver.klay.signTransaction(txData)

this.setState({
senderAddress: from,
Expand All @@ -65,49 +79,61 @@ class SmartContractExecutionFD extends Component {
}

render() {
const { from, to, amount, contractAddress, gas, senderRawTransaction } = this.state
const {
from,
to,
amount,
contractAddress,
gas,
senderRawTransaction,
decimal
} = this.state

return (
<div className="SmartContractExecutionFD">
<Input
name="from"
label="From (Sender Address)"
label="From"
value={from}
placeholder="From Address"
onChange={this.handleChange}
placeholder="Kaikas account"
/>
<Input
name="to"
label="To"
value={to}
onChange={this.handleChange}
placeholder="Address you want to send Token"
placeholder="Address you want to send token to"
/>
<Input
name="contractAddress"
label="Contract Address (Token Address)"
label="Token Contract Address"
value={contractAddress}
onChange={this.handleChange}
placeholder="The address of the deployed smart contract"
/>
<Input
name="decimal"
label="Token Decimal"
value={decimal}
onChange={this.handleChange}
placeholder="Token's number of decimal"
/>
<Input
name="amount"
label="Amount"
value={amount}
onChange={this.handleChange}
placeholder="Amount of Eth you want to send"
placeholder="Amount of token you want to send"
/>
<Input
name="gas"
label="Gas"
value={gas}
onChange={this.handleChange}
placeholder="Gas"
/>
<Button
title="Sign Transaction"
onClick={this.signTransaction}
placeholder="Transaction gas limit"
/>
<Button title="Sign Transaction" onClick={this.signTransaction} />
{senderRawTransaction && (
<Message
type="rawTransaction"
Expand Down
Loading

0 comments on commit ec4ae4e

Please sign in to comment.