1
- import React , { useState , useEffect } from " react" ;
2
- import useIsBrowser from '@docusaurus/useIsBrowser' ;
3
- import styles from " ./styles.module.css" ;
1
+ import React , { useState , useEffect } from ' react'
2
+ import useIsBrowser from '@docusaurus/useIsBrowser'
3
+ import styles from ' ./styles.module.css'
4
4
5
5
export default function LookupAPIPage ( ) {
6
- const isBrowser = useIsBrowser ( ) ;
7
- const networkOptions = [ " sapphire_mainnet" , " sapphire_devnet" ] ;
6
+ const isBrowser = useIsBrowser ( )
7
+ const networkOptions = [ ' sapphire_mainnet' , ' sapphire_devnet' ]
8
8
9
9
if ( ! isBrowser ) {
10
- return < div > Loading...</ div > ;
10
+ return < div > Loading...</ div >
11
11
}
12
12
13
13
const constructURL = ( ) => {
14
- const baseUrl = " https://lookup.web3auth.io/lookup" ;
15
- const queryParams = new URLSearchParams ( formData ) ;
14
+ const baseUrl = ' https://lookup.web3auth.io/lookup'
15
+ const queryParams = new URLSearchParams ( formData )
16
16
17
- const readableParams : React . ReactNode [ ] = [ ] ;
17
+ const readableParams : React . ReactNode [ ] = [ ]
18
18
queryParams . forEach ( ( value , key ) => {
19
19
readableParams . push (
20
20
< span key = { key } >
21
21
< span className = { styles . parameterKey } > { key } </ span > =
22
22
< span className = { styles . parameterValue } > { value } </ span > &
23
- </ span > ,
24
- ) ;
25
- } ) ;
23
+ </ span >
24
+ )
25
+ } )
26
26
27
27
return (
28
28
< div className = { styles . urlDisplay } >
29
29
< span className = { styles . getMethod } > GET</ span > { baseUrl } ?{ readableParams }
30
30
</ div >
31
- ) ;
32
- } ;
31
+ )
32
+ }
33
33
34
34
const [ formData , setFormData ] = useState ( {
35
- verifier : " w3a-google-demo" ,
36
- verifierId : " devrel@web3auth.io" ,
37
- web3AuthNetwork : " sapphire_mainnet" ,
35
+ verifier : ' w3a-google-demo' ,
36
+ verifierId : ' devrel@web3auth.io' ,
37
+ web3AuthNetwork : ' sapphire_mainnet' ,
38
38
clientId :
39
- " BPi5PB_UiIZ-cPz1GtV5i1I2iOSOHuimiXBI0e-Oe_u6X3oVAbCiAZOTEBtTXw4tsluTITPqA8zMsfxIKMjiqNQ" ,
40
- } ) ;
41
- const [ isLoading , setIsLoading ] = useState ( false ) ;
42
- const [ response , setResponse ] = useState < string | null > ( null ) ;
43
- const [ error , setError ] = useState ( "" ) ;
39
+ ' BPi5PB_UiIZ-cPz1GtV5i1I2iOSOHuimiXBI0e-Oe_u6X3oVAbCiAZOTEBtTXw4tsluTITPqA8zMsfxIKMjiqNQ' ,
40
+ } )
41
+ const [ isLoading , setIsLoading ] = useState ( false )
42
+ const [ response , setResponse ] = useState < string | null > ( null )
43
+ const [ error , setError ] = useState ( '' )
44
44
45
- const handleChange = ( e ) => {
46
- setFormData ( { ...formData , [ e . target . name ] : e . target . value } ) ;
47
- } ;
45
+ const handleChange = e => {
46
+ setFormData ( { ...formData , [ e . target . name ] : e . target . value } )
47
+ }
48
48
49
- const handleSubmit = async ( e ) => {
50
- e . preventDefault ( ) ;
51
- setIsLoading ( true ) ;
52
- setResponse ( null ) ;
53
- setError ( "" ) ;
49
+ const handleSubmit = async e => {
50
+ e . preventDefault ( )
51
+ setIsLoading ( true )
52
+ setResponse ( null )
53
+ setError ( '' )
54
54
55
55
try {
56
- const axios = ( await import ( " axios" ) ) . default ;
57
- const res = await axios . get ( `https://lookup.web3auth.io/lookup` , { params : formData } ) ;
58
- setResponse ( JSON . stringify ( res . data , null , 2 ) ) ;
56
+ const axios = ( await import ( ' axios' ) ) . default
57
+ const res = await axios . get ( `https://lookup.web3auth.io/lookup` , { params : formData } )
58
+ setResponse ( JSON . stringify ( res . data , null , 2 ) )
59
59
} catch ( err ) {
60
- setError ( err . message ) ;
60
+ setError ( err . message )
61
61
} finally {
62
- setIsLoading ( false ) ;
62
+ setIsLoading ( false )
63
63
}
64
- } ;
64
+ }
65
65
66
66
useEffect ( ( ) => {
67
- if ( ! isBrowser ) return ;
67
+ if ( ! isBrowser ) return
68
68
69
69
const fetchInitialData = async ( ) => {
70
- setIsLoading ( true ) ;
70
+ setIsLoading ( true )
71
71
try {
72
- const axios = ( await import ( " axios" ) ) . default ;
73
- const res = await axios . get ( `https://lookup.web3auth.io/lookup` , { params : formData } ) ;
74
- setResponse ( JSON . stringify ( res . data , null , 2 ) ) ;
72
+ const axios = ( await import ( ' axios' ) ) . default
73
+ const res = await axios . get ( `https://lookup.web3auth.io/lookup` , { params : formData } )
74
+ setResponse ( JSON . stringify ( res . data , null , 2 ) )
75
75
} catch ( err ) {
76
- setError ( err . message ) ;
76
+ setError ( err . message )
77
77
} finally {
78
- setIsLoading ( false ) ;
78
+ setIsLoading ( false )
79
79
}
80
- } ;
80
+ }
81
81
82
- fetchInitialData ( ) ;
83
- } , [ isBrowser ] ) ;
82
+ fetchInitialData ( )
83
+ } , [ isBrowser ] )
84
84
85
85
return (
86
86
< >
@@ -103,7 +103,7 @@ export default function LookupAPIPage() {
103
103
</ td >
104
104
< td >
105
105
The verifier name can be found on your Web3Auth dashboard. To learn more about
106
- verifiers, click{ " " }
106
+ verifiers, click{ ' ' }
107
107
< a href = "/docs/authentication" target = "_blank" rel = "noopener noreferrer" >
108
108
here
109
109
</ a >
@@ -124,7 +124,7 @@ export default function LookupAPIPage() {
124
124
< code > verifierId</ code >
125
125
</ td >
126
126
< td >
127
- The verifier ID value. One of the ways to get it is via the response to the{ " " }
127
+ The verifier ID value. One of the ways to get it is via the response to the{ ' ' }
128
128
< code > getUserInfo()</ code > method.
129
129
</ td >
130
130
< td >
@@ -147,9 +147,8 @@ export default function LookupAPIPage() {
147
147
name = "web3AuthNetwork"
148
148
value = { formData . web3AuthNetwork }
149
149
onChange = { handleChange }
150
- required
151
- >
152
- { networkOptions . map ( ( network ) => (
150
+ required >
151
+ { networkOptions . map ( network => (
153
152
< option key = { network } value = { network } >
154
153
{ network }
155
154
</ option >
@@ -181,7 +180,7 @@ export default function LookupAPIPage() {
181
180
</ div >
182
181
< div className = { styles . submitButtonContainer } >
183
182
< button type = "submit" className = { styles . submitButton } disabled = { isLoading } >
184
- { isLoading ? < div className = { styles . loader } > </ div > : " Submit" }
183
+ { isLoading ? < div className = { styles . loader } > </ div > : ' Submit' }
185
184
</ button >
186
185
</ div >
187
186
</ form >
@@ -193,5 +192,5 @@ export default function LookupAPIPage() {
193
192
{ error && < p className = { styles . error } > { error } </ p > }
194
193
</ div >
195
194
</ >
196
- ) ;
195
+ )
197
196
}
0 commit comments