1
1
import { useState , useEffect , useRef } from 'react' ;
2
2
import { hardhat , polygonZkEvmTestnet } from 'viem/chains' ;
3
- import { Client , ClientOptions , createClient , storage } from '../../../src/index.js' ; // @windingtree /sdk
4
- import { RequestQuery , OfferOptions , contractsConfig , serverAddress } from '../../shared/index.js' ;
3
+ import {
4
+ Client ,
5
+ ClientOptions ,
6
+ createClient ,
7
+ storage ,
8
+ } from '../../../src/index.js' ; // @windingtree /sdk
9
+ import {
10
+ RequestQuery ,
11
+ OfferOptions ,
12
+ contractsConfig ,
13
+ serverAddress ,
14
+ } from '../../shared/index.js' ;
5
15
import { OfferData } from '../../../src/shared/types.js' ;
6
16
import { useWallet } from './providers/WalletProvider/WalletProviderContext.js' ;
7
17
import { AccountWidget } from './providers/WalletProvider/AccountWidget.js' ;
@@ -13,7 +23,8 @@ import { Offers } from './components/Offers.js';
13
23
import { Deals , DealsRegistryRecord } from './components/Deals.js' ;
14
24
15
25
/** Target chain config */
16
- const chain = import . meta. env . LOCAL_NODE === 'true' ? hardhat : polygonZkEvmTestnet ;
26
+ const chain =
27
+ import . meta. env . LOCAL_NODE === 'true' ? hardhat : polygonZkEvmTestnet ;
17
28
18
29
/** Default request expiration time */
19
30
const defaultExpire = '30s' ;
@@ -31,8 +42,12 @@ export const App = () => {
31
42
const [ selectedTab , setSelectedTab ] = useState < number > ( 0 ) ;
32
43
const [ requests , setRequests ] = useState < RequestsRegistryRecord [ ] > ( [ ] ) ;
33
44
const [ deals , setDeals ] = useState < DealsRegistryRecord [ ] > ( [ ] ) ;
34
- const [ offers , setOffers ] = useState < OfferData < RequestQuery , OfferOptions > [ ] | undefined > ( ) ;
35
- const [ offer , setOffer ] = useState < OfferData < RequestQuery , OfferOptions > | undefined > ( ) ;
45
+ const [ offers , setOffers ] = useState <
46
+ OfferData < RequestQuery , OfferOptions > [ ] | undefined
47
+ > ( ) ;
48
+ const [ offer , setOffer ] = useState <
49
+ OfferData < RequestQuery , OfferOptions > | undefined
50
+ > ( ) ;
36
51
const [ error , setError ] = useState < string | undefined > ( ) ;
37
52
38
53
/** This hook starts the client that will be available via `client.current` */
@@ -60,9 +75,12 @@ export const App = () => {
60
75
61
76
const updateDeals = ( ) => {
62
77
if ( client . current ) {
63
- client . current . deals . getAll ( ) . then ( ( newDeals ) => {
64
- setDeals ( newDeals ) ;
65
- } ) . catch ( console . error ) ;
78
+ client . current . deals
79
+ . getAll ( )
80
+ . then ( ( newDeals ) => {
81
+ setDeals ( newDeals ) ;
82
+ } )
83
+ . catch ( console . error ) ;
66
84
}
67
85
} ;
68
86
@@ -80,12 +98,18 @@ export const App = () => {
80
98
81
99
client . current . addEventListener ( 'connected' , ( ) => {
82
100
setConnected ( true ) ;
83
- console . log ( '🔗 Client connected to server at:' , new Date ( ) . toISOString ( ) ) ;
101
+ console . log (
102
+ '🔗 Client connected to server at:' ,
103
+ new Date ( ) . toISOString ( ) ,
104
+ ) ;
84
105
} ) ;
85
106
86
107
client . current . addEventListener ( 'disconnected' , ( ) => {
87
108
setConnected ( false ) ;
88
- console . log ( '🔌 Client disconnected from server at:' , new Date ( ) . toISOString ( ) ) ;
109
+ console . log (
110
+ '🔌 Client disconnected from server at:' ,
111
+ new Date ( ) . toISOString ( ) ,
112
+ ) ;
89
113
} ) ;
90
114
91
115
/** Listening for requests events and update tables */
@@ -137,15 +161,21 @@ export const App = () => {
137
161
138
162
return (
139
163
< >
140
- < div style = { { display : 'flex' , flexDirection : 'row' , alignItems : 'center' } } >
164
+ < div
165
+ style = { { display : 'flex' , flexDirection : 'row' , alignItems : 'center' } }
166
+ >
141
167
< div style = { { flex : 1 } } >
142
168
< h1 > Client</ h1 >
143
169
</ div >
144
170
< AccountWidget />
145
171
</ div >
146
172
{ client . current && < div > ✅ Client started</ div > }
147
173
{ connected && < div > ✅ Connected to the coordination server</ div > }
148
- < RequestForm connected = { connected } onSubmit = { sendRequest } defaultTopic = { defaultTopic } />
174
+ < RequestForm
175
+ connected = { connected }
176
+ onSubmit = { sendRequest }
177
+ defaultTopic = { defaultTopic }
178
+ />
149
179
< Tabs
150
180
tabs = { [
151
181
{
0 commit comments