1
1
import React , { useState , useEffect } from "react" ;
2
2
import "./styles.css" ;
3
- import { content } from ' ./data/contract'
3
+ import { content } from " ./data/contract" ;
4
4
import { Magic } from "magic-sdk" ;
5
5
import { IconExtension } from "@magic-ext/icon" ;
6
6
import IconService from "icon-sdk-js" ;
7
7
8
8
const { IconBuilder, IconAmount, IconConverter } = IconService ;
9
9
10
- const magic = new Magic ( "pk_live_391E344C33F73CF5 " , {
10
+ const magic = new Magic ( "pk_live_FC06C7D601338A6E " , {
11
11
extensions : {
12
12
icon : new IconExtension ( {
13
- rpcUrl : "https://bicon.net.solidwallet.io/api/v3"
14
- } )
15
- }
13
+ rpcUrl : "https://bicon.net.solidwallet.io/api/v3" ,
14
+ } ) ,
15
+ } ,
16
16
} ) ;
17
17
18
18
export default function App ( ) {
@@ -25,11 +25,12 @@ export default function App() {
25
25
const [ userMetadata , setUserMetadata ] = useState ( { } ) ;
26
26
const [ txHash , setTxHash ] = useState ( "" ) ;
27
27
const [ messageTxHash , setMessageTxHash ] = useState ( "" ) ;
28
- const [ massageDestinationAddress , setMassageDestinationAddress ] = useState ( "" ) ;
28
+ const [ massageDestinationAddress , setMassageDestinationAddress ] =
29
+ useState ( "" ) ;
29
30
const [ message , setMessage ] = useState ( "" ) ;
30
31
31
32
useEffect ( ( ) => {
32
- magic . user . isLoggedIn ( ) . then ( async magicIsLoggedIn => {
33
+ magic . user . isLoggedIn ( ) . then ( async ( magicIsLoggedIn ) => {
33
34
setIsLoggedIn ( magicIsLoggedIn ) ;
34
35
if ( magicIsLoggedIn ) {
35
36
const publicAddress = await magic . icon . getAccount ( ) ;
@@ -73,23 +74,23 @@ export default function App() {
73
74
const handlerMessageTransaction = async ( ) => {
74
75
const metadata = await magic . user . getMetadata ( ) ;
75
76
const txObj = new IconBuilder . MessageTransactionBuilder ( )
76
- . from ( metadata . publicAddress )
77
- . to ( massageDestinationAddress )
78
- . stepLimit ( IconConverter . toBigNumber ( 1000000 ) . toString ( ) )
79
- . nid ( IconConverter . toBigNumber ( 3 ) . toString ( ) )
80
- . nonce ( IconConverter . toBigNumber ( 1 ) . toString ( ) )
81
- . version ( IconConverter . toBigNumber ( 3 ) . toString ( ) )
82
- . timestamp ( ( new Date ( ) ) . getTime ( ) * 1000 )
83
- . data ( IconConverter . fromUtf8 ( message ) )
84
- . build ( )
77
+ . from ( metadata . publicAddress )
78
+ . to ( massageDestinationAddress )
79
+ . stepLimit ( IconConverter . toBigNumber ( 1000000 ) . toString ( ) )
80
+ . nid ( IconConverter . toBigNumber ( 3 ) . toString ( ) )
81
+ . nonce ( IconConverter . toBigNumber ( 1 ) . toString ( ) )
82
+ . version ( IconConverter . toBigNumber ( 3 ) . toString ( ) )
83
+ . timestamp ( new Date ( ) . getTime ( ) * 1000 )
84
+ . data ( IconConverter . fromUtf8 ( message ) )
85
+ . build ( ) ;
85
86
86
- console . log ( ' txObj' , txObj ) ;
87
+ console . log ( " txObj" , txObj ) ;
87
88
88
89
const txhash = await magic . icon . sendTransaction ( txObj ) ;
89
90
90
91
setMessageTxHash ( txhash ) ;
91
92
92
- console . log ( ' transaction result' , txhash ) ;
93
+ console . log ( " transaction result" , txhash ) ;
93
94
} ;
94
95
95
96
const handleDeployContract = async ( ) => {
@@ -98,53 +99,51 @@ export default function App() {
98
99
const { DeployTransactionBuilder } = IconBuilder ;
99
100
100
101
const txObj = new DeployTransactionBuilder ( )
101
- . from ( metadata . publicAddress )
102
- . to ( ' cx0000000000000000000000000000000000000000' )
103
- . stepLimit ( IconConverter . toBigNumber ( 2100000000 ) . toString ( ) )
104
- . nid ( IconConverter . toBigNumber ( 3 ) . toString ( ) )
105
- . nonce ( IconConverter . toBigNumber ( 1 ) . toString ( ) )
106
- . version ( IconConverter . toBigNumber ( 3 ) . toString ( ) )
107
- . timestamp ( ( new Date ( ) ) . getTime ( ) * 1000 )
108
- . contentType ( ' application/zip' )
109
- . content ( `0x${ content } ` )
110
- . params ( {
111
- initialSupply : IconConverter . toHex ( ' 100000000000' ) ,
112
- decimals : IconConverter . toHex ( 18 ) ,
113
- name : ' StandardToken' ,
114
- symbol : 'ST' ,
115
- } )
116
- . build ( ) ;
102
+ . from ( metadata . publicAddress )
103
+ . to ( " cx0000000000000000000000000000000000000000" )
104
+ . stepLimit ( IconConverter . toBigNumber ( 2100000000 ) . toString ( ) )
105
+ . nid ( IconConverter . toBigNumber ( 3 ) . toString ( ) )
106
+ . nonce ( IconConverter . toBigNumber ( 1 ) . toString ( ) )
107
+ . version ( IconConverter . toBigNumber ( 3 ) . toString ( ) )
108
+ . timestamp ( new Date ( ) . getTime ( ) * 1000 )
109
+ . contentType ( " application/zip" )
110
+ . content ( `0x${ content } ` )
111
+ . params ( {
112
+ initialSupply : IconConverter . toHex ( " 100000000000" ) ,
113
+ decimals : IconConverter . toHex ( 18 ) ,
114
+ name : " StandardToken" ,
115
+ symbol : "ST" ,
116
+ } )
117
+ . build ( ) ;
117
118
118
119
const txhash = await magic . icon . sendTransaction ( txObj ) ;
119
120
120
121
setContractTxHash ( txhash ) ;
121
122
122
- console . log ( 'transaction result' , txhash ) ;
123
-
123
+ console . log ( "transaction result" , txhash ) ;
124
124
} ;
125
125
126
126
const handleContractCall = async ( ) => {
127
127
const metadata = await magic . user . getMetadata ( ) ;
128
128
129
129
const txObj = new IconBuilder . CallTransactionBuilder ( )
130
- . from ( metadata . publicAddress )
131
- . to ( ' cx568bb567298fbc60091c24080be20c1ce7751529' )
132
- . stepLimit ( IconConverter . toBigNumber ( ' 2000000' ) . toString ( ) )
133
- . nid ( IconConverter . toBigNumber ( '3' ) . toString ( ) )
134
- . nonce ( IconConverter . toBigNumber ( '1' ) . toString ( ) )
135
- . version ( IconConverter . toBigNumber ( '3' ) . toString ( ) )
136
- . timestamp ( ( new Date ( ) ) . getTime ( ) * 1000 )
137
- . method ( ' hello' )
138
- . params ( { } )
139
- . build ( ) ;
130
+ . from ( metadata . publicAddress )
131
+ . to ( " cx568bb567298fbc60091c24080be20c1ce7751529" )
132
+ . stepLimit ( IconConverter . toBigNumber ( " 2000000" ) . toString ( ) )
133
+ . nid ( IconConverter . toBigNumber ( "3" ) . toString ( ) )
134
+ . nonce ( IconConverter . toBigNumber ( "1" ) . toString ( ) )
135
+ . version ( IconConverter . toBigNumber ( "3" ) . toString ( ) )
136
+ . timestamp ( new Date ( ) . getTime ( ) * 1000 )
137
+ . method ( " hello" )
138
+ . params ( { } )
139
+ . build ( ) ;
140
140
141
- console . log ( ' txObj' , txObj ) ;
141
+ console . log ( " txObj" , txObj ) ;
142
142
143
143
const txhash = await magic . icon . sendTransaction ( txObj ) ;
144
144
145
- console . log ( 'transaction result' , txhash ) ;
146
- window . open ( `https://bicon.tracker.solidwallet.io/transaction/${ txhash } ` )
147
-
145
+ console . log ( "transaction result" , txhash ) ;
146
+ window . open ( `https://bicon.tracker.solidwallet.io/transaction/${ txhash } ` ) ;
148
147
} ;
149
148
150
149
return (
@@ -157,7 +156,7 @@ export default function App() {
157
156
name = "email"
158
157
required = "required"
159
158
placeholder = "Enter your email"
160
- onChange = { event => {
159
+ onChange = { ( event ) => {
161
160
setEmail ( event . target . value ) ;
162
161
} }
163
162
/>
@@ -203,7 +202,7 @@ export default function App() {
203
202
className = "full-width"
204
203
required = "required"
205
204
placeholder = "Destination address"
206
- onChange = { event => {
205
+ onChange = { ( event ) => {
207
206
setDestinationAddress ( event . target . value ) ;
208
207
} }
209
208
/>
@@ -213,7 +212,7 @@ export default function App() {
213
212
className = "full-width"
214
213
required = "required"
215
214
placeholder = "Amount in ICX"
216
- onChange = { event => {
215
+ onChange = { ( event ) => {
217
216
setSendICXAmount ( event . target . value ) ;
218
217
} }
219
218
/>
@@ -224,39 +223,39 @@ export default function App() {
224
223
< div className = "container" >
225
224
< h1 > Send Message Transaction</ h1 >
226
225
{ messageTxHash ? (
227
- < div >
228
- < div > Send message transaction success</ div >
229
- < div className = "info" >
230
- < a
231
- href = { `https://bicon.tracker.solidwallet.io/transaction/${ messageTxHash } ` }
232
- target = "_blank"
233
- >
234
- { messageTxHash }
235
- </ a >
236
- </ div >
226
+ < div >
227
+ < div > Send message transaction success</ div >
228
+ < div className = "info" >
229
+ < a
230
+ href = { `https://bicon.tracker.solidwallet.io/transaction/${ messageTxHash } ` }
231
+ target = "_blank"
232
+ >
233
+ { messageTxHash }
234
+ </ a >
237
235
</ div >
236
+ </ div >
238
237
) : (
239
- < div />
238
+ < div />
240
239
) }
241
240
< input
242
- type = "text"
243
- name = "destination"
244
- className = "full-width"
245
- required = "required"
246
- placeholder = "Destination address"
247
- onChange = { event => {
248
- setMassageDestinationAddress ( event . target . value ) ;
249
- } }
241
+ type = "text"
242
+ name = "destination"
243
+ className = "full-width"
244
+ required = "required"
245
+ placeholder = "Destination address"
246
+ onChange = { ( event ) => {
247
+ setMassageDestinationAddress ( event . target . value ) ;
248
+ } }
250
249
/>
251
250
< input
252
- type = "text"
253
- name = "amount"
254
- className = "full-width"
255
- required = "required"
256
- placeholder = "Message"
257
- onChange = { event => {
258
- setMessage ( event . target . value ) ;
259
- } }
251
+ type = "text"
252
+ name = "amount"
253
+ className = "full-width"
254
+ required = "required"
255
+ placeholder = "Message"
256
+ onChange = { ( event ) => {
257
+ setMessage ( event . target . value ) ;
258
+ } }
260
259
/>
261
260
< button id = "btn-send-txn" onClick = { handlerMessageTransaction } >
262
261
Send Message Transaction
0 commit comments