ethereum-hooks 1.0.1 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +150 -47
- package/client/src/crypto_hooks/ens/useFetchAddressENSLookup.ts +3 -4
- package/client/src/crypto_hooks/ens/useFetchENSAddressLookup.ts +3 -4
- package/client/src/crypto_hooks/ens/useFetchENSIDLookup.ts +3 -4
- package/client/src/crypto_hooks/ens/useFetchENSNameLookup.ts +3 -3
- package/client/src/crypto_hooks/erc20Tokens/useFetchERC20CollectionOwners.ts +3 -2
- package/client/src/crypto_hooks/erc20Tokens/useFetchERC20CollectionTopCoins.ts +3 -2
- package/client/src/crypto_hooks/erc20Tokens/useFetchERC20CollectionTransfers.ts +3 -2
- package/client/src/crypto_hooks/erc20Tokens/useFetchERC20Holdings.ts +3 -2
- package/client/src/crypto_hooks/erc20Tokens/useFetchERC20Transfers.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721CollectionAttributes.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721CollectionData.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721CollectionExtraData.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721CollectionFloorPrice.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721CollectionMarketCap.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721CollectionSales.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721CollectionTransfers.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721CollectionTrends.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721CollectionVolume.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721Holdings.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721LookupData.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721OpenseaData.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721RarityData.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721SalesData.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721TransferLookupData.ts +3 -2
- package/client/src/crypto_hooks/erc721Tokens/useFetchERC721TransfersData.ts +3 -2
- package/client/src/crypto_hooks/gas/useFetchGasLookup.ts +3 -4
- package/client/src/crypto_hooks/prices/useFetchERC20Price.ts +3 -2
- package/client/src/crypto_hooks/prices/useFetchERC721Price.ts +3 -2
- package/client/src/crypto_hooks/prices/useFetchETHPrice.ts +3 -2
- package/client/src/crypto_hooks/prices/useFetchLayerTwoPrice.ts +3 -2
- package/package.json +5 -1
- package/server/server.ts +70 -27
- /package/server/Routes/ERC721TokensRoutes/{ERC721CollectionAttributesRoutes.ts → ERC721CollectionAttributesRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721CollectionDataRoutes.ts → ERC721CollectionDataRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721CollectionExtraDataRoutes.ts → ERC721CollectionExtraDataRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721CollectionFloorPriceRoutes.ts → ERC721CollectionFloorPriceRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721CollectionMarketCapRoutes.ts → ERC721CollectionMarketCapRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721CollectionSalesRoutes.ts → ERC721CollectionSalesRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721CollectionTransfersRoutes.ts → ERC721CollectionTransfersRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721CollectionTrendsRoutes.ts → ERC721CollectionTrendsRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721CollectionVolumeRoutes.ts → ERC721CollectionVolumeRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721HoldingsRoutes.ts → ERC721HoldingsRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721LookupDataRoutes.ts → ERC721LookupDataRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721OpenseaDataRoutes.ts → ERC721OpenseaDataRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721RarityDataRoutes.ts → ERC721RarityDataRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721SalesDataRoutes.ts → ERC721SalesDataRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721TransferLookupDataRoutes.ts → ERC721TransferLookupDataRoute.ts} +0 -0
- /package/server/Routes/ERC721TokensRoutes/{ERC721TransfersDataRoutes.ts → ERC721TransfersDataRoute.ts} +0 -0
package/README.md
CHANGED
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
# ethereum-hooks
|
|
2
|
-
|
|
2
|
+
Useful package that contains custom React hooks that can be used for rapid development while working with the Ethereum blockchain.
|
|
3
|
+
|
|
4
|
+
These hooks make use of various crypto APIs (free versions only) and save developer time by taking away the need for manual configuration and setup.
|
|
5
|
+
|
|
6
|
+
The following resources were utilized when building these client hooks:
|
|
3
7
|
|
|
4
8
|
- <a href="https://docs.alchemy.com/reference/api-overview">Alchemy</a>
|
|
5
9
|
- <a href="https://docs.blocknative.com/">Blocknative</a>
|
|
@@ -11,198 +15,297 @@ A package containing useful hooks for working with the Ethereum blockchain using
|
|
|
11
15
|
<br />
|
|
12
16
|
|
|
13
17
|
## React Hooks Client-Server Setup
|
|
14
|
-
When working with this package, you will need to implement the typical MERN design pattern
|
|
18
|
+
When working with this package, you will need to implement the typical MERN design pattern, set up <code>.env</code> variables, and set up the server to allow the client hooks to establish communication to the back-end.
|
|
15
19
|
|
|
16
20
|
<b>You will need to set the following environment variables in your <code>.env</code> file: </b>
|
|
17
21
|
|
|
18
22
|
- <code>ALCHEMY_API_KEY</code>
|
|
19
23
|
- <code>BLK_API_KEY</code>
|
|
20
|
-
- <code>
|
|
24
|
+
- <code>CLIENT_URL</code>
|
|
21
25
|
- <code>COINGECKO_API_KEY</code>
|
|
22
26
|
- <code>MORALIS_API_KEY</code>
|
|
23
27
|
- <code>OPENSEA_API_KEY</code>
|
|
24
28
|
- <code>PORT</code>
|
|
25
29
|
- <code>TRANSPOSE_API_KEY</code>
|
|
26
30
|
|
|
27
|
-
The following diagram will help you understand the
|
|
31
|
+
The following diagram will help you understand the workflow:
|
|
28
32
|
|
|
29
33
|
<img src="https://genericbucket95.s3.us-east-2.amazonaws.com/hook-server-design.png" alt="Hook Server" width="600" height="400" />
|
|
30
34
|
|
|
31
|
-
<br />
|
|
32
|
-
|
|
33
|
-
## Link to Published NPM Package
|
|
34
|
-
- <a href="https://www.npmjs.com/package/ethereum-hooks">Ethereum Hooks</a>
|
|
35
35
|
|
|
36
36
|
<br />
|
|
37
37
|
|
|
38
38
|
## Server Setup
|
|
39
39
|
|
|
40
40
|
For this part, you will need to incorporate the server object exported from the <code>server.ts</code> file inside the server directory.
|
|
41
|
-
|
|
41
|
+
|
|
42
|
+
<b>You will need to build on top of this built-in server, any additional routes and configurations as this server contains all the routes needed to effectively use the client hooks. </b>
|
|
43
|
+
|
|
44
|
+
This is how you can incorporate the built-in server for additional add-ons and configuration in a custom server file of your own:
|
|
45
|
+
|
|
46
|
+
<code>customServer.ts</code>
|
|
47
|
+
|
|
48
|
+
```javascript
|
|
49
|
+
import { server } from 'server'; // Import the built-in server
|
|
50
|
+
|
|
51
|
+
// Environment variables, PORT, and CLIENT_URL will be used by this built-in server
|
|
52
|
+
// PORT specifies the port to activate the Node server
|
|
53
|
+
// CLIENT_URL specifies the URL that is CORS enabled
|
|
54
|
+
|
|
55
|
+
// Add any additional routes you may have on top of this server, etc.
|
|
56
|
+
server.use("", "/xxx-xxxx");
|
|
57
|
+
...
|
|
58
|
+
...
|
|
59
|
+
...
|
|
60
|
+
|
|
61
|
+
|
|
62
|
+
```
|
|
42
63
|
|
|
43
64
|
<br />
|
|
44
65
|
|
|
45
66
|
## React Client Hooks
|
|
46
67
|
|
|
47
|
-
The hooks cover several areas of the Ethereum blockchain and can be used for Layer Two chains as well.
|
|
48
|
-
|
|
68
|
+
The hooks cover several areas of the Ethereum blockchain and can be used for Layer Two chains as well.
|
|
69
|
+
|
|
70
|
+
You will need to specify the <b>BACKEND URL + ENDPOINT</b> as the <b>Server URL</b> in one of the parameter values to be passed in each of the client hooks you will be using.
|
|
71
|
+
|
|
72
|
+
For local development, you will need to specify the <b>full localhost address (http://localhost:PORT/ENDPOINT)</b>.
|
|
73
|
+
|
|
74
|
+
Here is a quick example of how you can work with client hooks. The following is a code snippet for working with React.js:
|
|
75
|
+
|
|
76
|
+
<code>ENSToAddressPage.tsx</code>
|
|
77
|
+
```javascript
|
|
78
|
+
import React, { FC } from 'react';
|
|
79
|
+
import { useFetchENSAddressLookup } from '../crypto_hooks/ens/useFetchENSAddressLookup'; // Import hook
|
|
80
|
+
|
|
81
|
+
// Incorporating the ENS to Address Client Hook.. using Vitalik Buterin's address ;)
|
|
82
|
+
// Server URL + Endpoint
|
|
83
|
+
// Example uses local development
|
|
84
|
+
const ENSToAddressPage: FC = () => {
|
|
85
|
+
const addressInformation = useFetchENSAddressLookup('vitalik.eth', 'http://localhost:5000/additional-address-to-ens-information');
|
|
86
|
+
|
|
87
|
+
// Each client hook uses the useFetch custom hook
|
|
88
|
+
// It returns three states: data, error, loading
|
|
89
|
+
// We capture these states in a variable (like above) and conditionally render the component
|
|
90
|
+
if (addressInformation.loading){
|
|
91
|
+
return <div>Loading..</div>
|
|
92
|
+
}
|
|
93
|
+
else if (addressInformation.error){
|
|
94
|
+
return <div>Error loading data...</div>
|
|
95
|
+
}
|
|
96
|
+
else {
|
|
97
|
+
// Hardcoded some parts for demonstrative purposes only
|
|
98
|
+
return (
|
|
99
|
+
<div className='home-page'>
|
|
100
|
+
<table>
|
|
101
|
+
<tr>
|
|
102
|
+
<th>ENS</th>
|
|
103
|
+
<th>Address</th>
|
|
104
|
+
</tr>
|
|
105
|
+
<tr>
|
|
106
|
+
<td>vitalik.eth</td>
|
|
107
|
+
<td>{ addressInformation.data?.information }</td>
|
|
108
|
+
</tr>
|
|
109
|
+
</table>
|
|
110
|
+
</div>
|
|
111
|
+
)
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
export default ENSToAddressPage;
|
|
116
|
+
```
|
|
117
|
+
|
|
118
|
+
<br />
|
|
119
|
+
|
|
120
|
+
A list of chains supported is provided below in the <code>Types</code> section.
|
|
49
121
|
|
|
50
|
-
The following table highlights the 30 different client hooks
|
|
122
|
+
The following table highlights the <b>30 different client hooks</b> and their <b>endpoints</b>:
|
|
51
123
|
|
|
52
124
|
<table>
|
|
53
125
|
<tr>
|
|
54
126
|
<th>Category</th>
|
|
55
127
|
<th>Client Hook Name</th>
|
|
128
|
+
<th>Endpoint</th>
|
|
56
129
|
<th>Description</th>
|
|
57
130
|
<tr>
|
|
58
131
|
<tr>
|
|
59
132
|
<td>ENS</td>
|
|
60
|
-
<td><code>useFetchAddressENSLookup(address: string,
|
|
133
|
+
<td><code>useFetchAddressENSLookup(address: string, serverURL: string)</code></td>
|
|
134
|
+
<td><code>/address-to-ens-information</code></td>
|
|
61
135
|
<td>Fetch the equivalent ENS name from a given address</td>
|
|
62
136
|
</tr>
|
|
63
137
|
<tr>
|
|
64
138
|
<td>ENS</td>
|
|
65
|
-
<td><code>useFetchENSAddressLookup(ensName: string,
|
|
139
|
+
<td><code>useFetchENSAddressLookup(ensName: string, serverURL: string)</code></td>
|
|
140
|
+
<td><code>/additional-address-to-ens-information</code></td>
|
|
66
141
|
<td>Fetch the equivalent ETH address from a given ENS name</td>
|
|
67
142
|
</tr>
|
|
68
143
|
<tr>
|
|
69
144
|
<td>ENS</td>
|
|
70
|
-
<td><code>useFetchENSIDLookup(id: string,
|
|
145
|
+
<td><code>useFetchENSIDLookup(id: string, serverURL: string)</code></td>
|
|
146
|
+
<td><code>/ens-transfers-by-id</code></td>
|
|
71
147
|
<td>Fetch information of a given ENS ID</td>
|
|
72
148
|
</tr>
|
|
73
149
|
<tr>
|
|
74
150
|
<td>ENS</td>
|
|
75
|
-
<td><code>useFetchENSNameLookup(ensName: string,
|
|
151
|
+
<td><code>useFetchENSNameLookup(ensName: string, serverURL: string)</code></td>
|
|
152
|
+
<td><code>/ens-transfers-by-name</code></td>
|
|
76
153
|
<td>Fetch information of a given ENS name</td>
|
|
77
154
|
</tr>
|
|
78
155
|
<tr>
|
|
79
156
|
<td>ERC20</td>
|
|
80
|
-
<td><code>useFetchERC20CollectionOwners(contractAddress: string,
|
|
157
|
+
<td><code>useFetchERC20CollectionOwners(contractAddress: string, serverURL: string)</code></td>
|
|
158
|
+
<td><code>/erc20-collection-owners</code></td>
|
|
81
159
|
<td>Fetch list of owners of a particular ERC20 collection</td>
|
|
82
160
|
</tr>
|
|
83
161
|
<tr>
|
|
84
162
|
<td>ERC20</td>
|
|
85
|
-
<td><code>useFetchERC20CollectionTopCoins(
|
|
163
|
+
<td><code>useFetchERC20CollectionTopCoins(serverURL: string)</code></td>
|
|
164
|
+
<td><code>/erc20-top-coins</code></td>
|
|
86
165
|
<td>Fetch list of the top ERC20 collections</td>
|
|
87
166
|
</tr>
|
|
88
167
|
<tr>
|
|
89
168
|
<td>ERC20</td>
|
|
90
|
-
<td><code>useFetchERC20CollectionTransfers(contractAddress: string,
|
|
169
|
+
<td><code>useFetchERC20CollectionTransfers(contractAddress: string, serverURL: string)</code></td>
|
|
170
|
+
<td><code>/erc20-collection-transfers</code></td>
|
|
91
171
|
<td>Fetch transfer activity of a particular ERC20 collection</td>
|
|
92
172
|
</tr>
|
|
93
173
|
<tr>
|
|
94
174
|
<td>ERC20</td>
|
|
95
|
-
<td><code>useFetchERC20Holdings(contractAddress: string,
|
|
175
|
+
<td><code>useFetchERC20Holdings(contractAddress: string, serverURL: string)</code></td>
|
|
176
|
+
<td><code>/erc20-collection-holdings</code></td>
|
|
96
177
|
<td>Track wallet holdings of a particular ERC20 token activity</td>
|
|
97
178
|
</tr>
|
|
98
179
|
<tr>
|
|
99
180
|
<td>ERC20</td>
|
|
100
|
-
<td><code>useFetchERC20Transfers(contractAddress: string,
|
|
181
|
+
<td><code>useFetchERC20Transfers(contractAddress: string, serverURL: string)</code></td>
|
|
182
|
+
<td><code>/erc20-collection-transfers</code></td>
|
|
101
183
|
<td>Track the transfer activity of a particular ERC20 token in a wallet</td>
|
|
102
184
|
</tr>
|
|
103
185
|
<tr>
|
|
104
186
|
<td>ERC721</td>
|
|
105
|
-
<td><code>useFetchERC721CollectionAttributes(contractAddress: string,
|
|
187
|
+
<td><code>useFetchERC721CollectionAttributes(contractAddress: string, serverURL: string)</code></td>
|
|
188
|
+
<td><code>/erc721-collection-attributes</code></td>
|
|
106
189
|
<td>Fetch attributes of a particular ERC721 collection</td>
|
|
107
190
|
</tr>
|
|
108
191
|
<tr>
|
|
109
192
|
<td>ERC721</td>
|
|
110
|
-
<td><code>useFetchERC721CollectionData(contractAddress: string,
|
|
193
|
+
<td><code>useFetchERC721CollectionData(contractAddress: string, serverURL: string)</code></td>
|
|
194
|
+
<td><code>/erc721-collection-data</code></td>
|
|
111
195
|
<td>Fetch data of a particular ERC721 collection</td>
|
|
112
196
|
</tr>
|
|
113
197
|
<tr>
|
|
114
198
|
<td>ERC721</td>
|
|
115
|
-
<td><code>useFetchERC721CollectionExtraData(contractAddress: string,
|
|
199
|
+
<td><code>useFetchERC721CollectionExtraData(contractAddress: string, serverURL: string)</code></td>
|
|
200
|
+
<td><code>/erc721-collection-extra-data</code></td>
|
|
116
201
|
<td>Fetch extra data of a particular ERC721 collection</td>
|
|
117
202
|
</tr>
|
|
118
203
|
<tr>
|
|
119
204
|
<td>ERC721</td>
|
|
120
|
-
<td><code>useFetchERC721CollectionFloorPrice(contractAddress: string,
|
|
205
|
+
<td><code>useFetchERC721CollectionFloorPrice(contractAddress: string, serverURL: string)</code></td>
|
|
206
|
+
<td><code>/erc721-collection-floor-price</code></td>
|
|
121
207
|
<td>Fetch floor price data of a particular ERC721 collection</td>
|
|
122
208
|
</tr>
|
|
123
209
|
<tr>
|
|
124
210
|
<td>ERC721</td>
|
|
125
|
-
<td><code>useFetchERC721CollectionMarketCap(contractAddress: string, duration: 2 | 14 | 30,
|
|
211
|
+
<td><code>useFetchERC721CollectionMarketCap(contractAddress: string, duration: 2 | 14 | 30, serverURL: string)</code></td>
|
|
212
|
+
<td><code>/erc721-collection-market-cap</code></td>
|
|
126
213
|
<td>Fetch market cap data of a particular ERC721 collection</td>
|
|
127
214
|
</tr>
|
|
128
215
|
<tr>
|
|
129
216
|
<td>ERC721</td>
|
|
130
|
-
<td><code>useFetchERC721CollectionSales(contractAddress: string,
|
|
217
|
+
<td><code>useFetchERC721CollectionSales(contractAddress: string, serverURL: string)</code></td>
|
|
218
|
+
<td><code>/erc721-collection-sales</code></td>
|
|
131
219
|
<td>Fetch sales data of a particular ERC721 collection</td>
|
|
132
220
|
</tr>
|
|
133
221
|
<tr>
|
|
134
222
|
<td>ERC721</td>
|
|
135
|
-
<td><code>useFetchERC721CollectionTransfers(contractAddress: string,
|
|
223
|
+
<td><code>useFetchERC721CollectionTransfers(contractAddress: string, serverURL: string)</code></td>
|
|
224
|
+
<td><code>/erc721-collection-transfers</code></td>
|
|
136
225
|
<td>Fetch transfer activity of a particular ERC721 collection</td>
|
|
137
226
|
</tr>
|
|
138
227
|
<tr>
|
|
139
228
|
<td>ERC721</td>
|
|
140
|
-
<td><code>useFetchERC721CollectionTrends(
|
|
229
|
+
<td><code>useFetchERC721CollectionTrends(serverURL: string)</code></td>
|
|
230
|
+
<td><code>/erc721-collection-trends</code></td>
|
|
141
231
|
<td>Fetch trending ERC721 collection data</td>
|
|
142
232
|
</tr>
|
|
143
233
|
<tr>
|
|
144
234
|
<td>ERC721</td>
|
|
145
|
-
<td><code>useFetchERC721CollectionVolume(
|
|
235
|
+
<td><code>useFetchERC721CollectionVolume(serverURL: string)</code></td>
|
|
236
|
+
<td><code>/erc721-collection-volume</code></td>
|
|
146
237
|
<td>Fetch ERC721 collections by volume data</td>
|
|
147
238
|
</tr>
|
|
148
239
|
<tr>
|
|
149
240
|
<td>ERC721</td>
|
|
150
|
-
<td><code>useFetchERC721Holdings(walletAddress: string,
|
|
241
|
+
<td><code>useFetchERC721Holdings(walletAddress: string, serverURL: string)</code></td>
|
|
242
|
+
<td><code>/erc721-holdings</code></td>
|
|
151
243
|
<td>Fetch ERC721 holdings of a particular wallet</td>
|
|
152
244
|
</tr>
|
|
153
245
|
<tr>
|
|
154
246
|
<td>ERC721</td>
|
|
155
|
-
<td><code>useFetchERC721LookupData(contractAddress: string, tokenID: string,
|
|
247
|
+
<td><code>useFetchERC721LookupData(contractAddress: string, tokenID: string, serverURL: string)</code></td>
|
|
248
|
+
<td><code>/erc721-lookup-data</code></td>
|
|
156
249
|
<td>Fetch data of a particular ERC721 token</td>
|
|
157
250
|
</tr>
|
|
158
251
|
<tr>
|
|
159
252
|
<td>ERC721</td>
|
|
160
|
-
<td><code>useFetchERC721OpenseaData(contractAddress: string, tokenID: string,
|
|
253
|
+
<td><code>useFetchERC721OpenseaData(contractAddress: string, tokenID: string, serverURL: string)</code></td>
|
|
254
|
+
<td><code>/erc721-opensea-data</code></td>
|
|
161
255
|
<td>Fetch Opensea data of a particular ERC721 token</td>
|
|
162
256
|
</tr>
|
|
163
257
|
<tr>
|
|
164
258
|
<td>ERC721</td>
|
|
165
|
-
<td><code>useFetchERC721RarityData(contractAddress: string, tokenID: string,
|
|
259
|
+
<td><code>useFetchERC721RarityData(contractAddress: string, tokenID: string, serverURL: string)</code></td>
|
|
260
|
+
<td><code>/erc721-rarity-data</code></td>
|
|
166
261
|
<td>Fetch rarity data of a particular ERC721 token</td>
|
|
167
262
|
</tr>
|
|
168
263
|
<tr>
|
|
169
264
|
<td>ERC721</td>
|
|
170
|
-
<td><code>useFetchERC721SalesData(contractAddress: string, tokenID: string,
|
|
265
|
+
<td><code>useFetchERC721SalesData(contractAddress: string, tokenID: string, serverURL: string)</code></td>
|
|
266
|
+
<td><code>/erc721-sales-data</code></td>
|
|
171
267
|
<td>Fetch sales data of a particular ERC721 token</td>
|
|
172
268
|
</tr>
|
|
173
269
|
<tr>
|
|
174
270
|
<td>ERC721</td>
|
|
175
|
-
<td><code>useFetchERC721TransferLookupData(contractAddress: string, tokenID: string,
|
|
271
|
+
<td><code>useFetchERC721TransferLookupData(contractAddress: string, tokenID: string, serverURL: string)</code></td>
|
|
272
|
+
<td><code>/erc721-lookup-data</code></td>
|
|
176
273
|
<td>Fetch transfer data of a particular ERC721 token</td>
|
|
177
274
|
</tr>
|
|
178
275
|
<tr>
|
|
179
276
|
<td>ERC721</td>
|
|
180
|
-
<td><code>useFetchERC721TransfersData(walletAddress: string,
|
|
277
|
+
<td><code>useFetchERC721TransfersData(walletAddress: string, serverURL: string)</code></td>
|
|
278
|
+
<td><code>/erc721-token-transfer-lookup-data</code></td>
|
|
181
279
|
<td>Fetch ERC721 transfer activity of a particular wallet</td>
|
|
182
280
|
</tr>
|
|
183
281
|
<tr>
|
|
184
282
|
<td>Gas</td>
|
|
185
|
-
<td><code>useFetchGasLookup(
|
|
283
|
+
<td><code>useFetchGasLookup(serverURL: string)</code></td>
|
|
284
|
+
<td><code>/gas-information</code></td>
|
|
186
285
|
<td>Fetch gas information related to Ethereum or a supported layer two</td>
|
|
187
286
|
</tr>
|
|
188
287
|
<tr>
|
|
189
288
|
<td>Prices</td>
|
|
190
|
-
<td><code>useFetchERC20Price(contractAddress: string, currentPrice: boolean, duration: 2 | 14 | 30,
|
|
289
|
+
<td><code>useFetchERC20Price(contractAddress: string, currentPrice: boolean, duration: 2 | 14 | 30, serverURL: string)</code></td>
|
|
290
|
+
<td><code>/erc20-token-price</code></td>
|
|
191
291
|
<td>Fetch pricing data of a particular ERC20 collection</td>
|
|
192
292
|
</tr>
|
|
193
293
|
<tr>
|
|
194
294
|
<td>Prices</td>
|
|
195
|
-
<td><code>useFetchERC721Price(contractAddress: string, tokenID: string,
|
|
295
|
+
<td><code>useFetchERC721Price(contractAddress: string, tokenID: string, serverURL: string)</code></td>
|
|
296
|
+
<td><code>/erc721-token-price</code></td>
|
|
196
297
|
<td>Fetch pricing data of a particular ERC721 collection</td>
|
|
197
298
|
</tr>
|
|
198
299
|
<tr>
|
|
199
300
|
<td>Prices</td>
|
|
200
|
-
<td><code>useFetchETHPrice(currentPrice: boolean, duration: 2 | 14 | 30,
|
|
301
|
+
<td><code>useFetchETHPrice(currentPrice: boolean, duration: 2 | 14 | 30, serverURL: string)</code></td>
|
|
302
|
+
<td><code>/eth-price</code></td>
|
|
201
303
|
<td>Fetch Ethereum price data</td>
|
|
202
304
|
</tr>
|
|
203
305
|
<tr>
|
|
204
306
|
<td>Prices</td>
|
|
205
|
-
<td><code>useFetchLayerTwoPrice(layerTwo: LayerTwoNetworks, currentPrice: boolean, duration: 2 | 14 | 30,
|
|
307
|
+
<td><code>useFetchLayerTwoPrice(layerTwo: LayerTwoNetworks, currentPrice: boolean, duration: 2 | 14 | 30, serverURL: string)</code></td>
|
|
308
|
+
<td><code>/layer-two-prices</code></td>
|
|
206
309
|
<td>Fetch Layer Two price data</td>
|
|
207
310
|
</tr>
|
|
208
311
|
</table>
|
|
@@ -210,7 +313,7 @@ The following table highlights the 30 different client hooks:
|
|
|
210
313
|
<br />
|
|
211
314
|
|
|
212
315
|
## Custom Hooks
|
|
213
|
-
Custom hooks were
|
|
316
|
+
Custom hooks were incorporated into the main client hooks. The following table details the custom hooks used in this package:
|
|
214
317
|
|
|
215
318
|
<table>
|
|
216
319
|
<tr>
|
|
@@ -218,15 +321,15 @@ Custom hooks were used for development convenience and were fully incorporated i
|
|
|
218
321
|
<th>Function</th>
|
|
219
322
|
<tr>
|
|
220
323
|
<tr>
|
|
221
|
-
<td><code>useFetch</code></td>
|
|
222
|
-
<td>
|
|
324
|
+
<td><code>useFetch<T = any>(URL: string, options: RequestInit = {})</code></td>
|
|
325
|
+
<td>Readily fetch data using a set of defined parameters</td>
|
|
223
326
|
</tr>
|
|
224
327
|
</table>
|
|
225
328
|
|
|
226
329
|
<br />
|
|
227
330
|
|
|
228
331
|
## Types
|
|
229
|
-
Custom data types were developed for fetch
|
|
332
|
+
Custom data types were developed for monitoring data fetch status and defining a set of available layer two networks:
|
|
230
333
|
|
|
231
334
|
<table>
|
|
232
335
|
<tr>
|
|
@@ -235,7 +338,7 @@ Custom data types were developed for fetch state and defining a set of available
|
|
|
235
338
|
<tr>
|
|
236
339
|
<tr>
|
|
237
340
|
<td><code>FetchStateType</code></td>
|
|
238
|
-
<td>
|
|
341
|
+
<td>Readily fetch data and track its state using a type with a set of defined states: <code>{ data: T | null, error: boolean, loading: boolean }</code></td>
|
|
239
342
|
</tr>
|
|
240
343
|
<tr>
|
|
241
344
|
<td><code>LayerTwoType</code></td>
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching Address to ENS Custom hook
|
|
4
|
-
export const useFetchAddressENSLookup = (address: string,
|
|
5
|
-
const URL = `http://localhost:${port}/address-to-ens-information`; // Define the API endpoint
|
|
6
|
-
|
|
4
|
+
export const useFetchAddressENSLookup = (address: string, serverURL: string) => {
|
|
7
5
|
const options = {
|
|
8
6
|
method: 'POST',
|
|
9
7
|
body: JSON.stringify({ address }),
|
|
@@ -12,7 +10,8 @@ export const useFetchAddressENSLookup = (address: string, port: number) => {
|
|
|
12
10
|
}
|
|
13
11
|
};
|
|
14
12
|
|
|
15
|
-
|
|
13
|
+
// ENDPOINT - /address-to-ens-information
|
|
14
|
+
const state = useFetch(serverURL, options); // Use the custom hook to fetch data
|
|
16
15
|
|
|
17
16
|
return state; // Return the state from the custom hook
|
|
18
17
|
}
|
|
@@ -2,9 +2,7 @@ import axios from "axios";
|
|
|
2
2
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
3
3
|
|
|
4
4
|
// Fetching ENS to Address Custom hook
|
|
5
|
-
export const useFetchENSAddressLookup = (ensName: string,
|
|
6
|
-
const URL = `http://localhost:${port}/additional-address-to-ens-information`; // Define the API endpoint
|
|
7
|
-
|
|
5
|
+
export const useFetchENSAddressLookup = (ensName: string, serverURL: string) => {
|
|
8
6
|
const options = {
|
|
9
7
|
method: 'POST',
|
|
10
8
|
body: JSON.stringify({ ensName }),
|
|
@@ -13,7 +11,8 @@ export const useFetchENSAddressLookup = (ensName: string, port: number) => {
|
|
|
13
11
|
}
|
|
14
12
|
};
|
|
15
13
|
|
|
16
|
-
|
|
14
|
+
// ENDPOINT - /additional-address-to-ens-information
|
|
15
|
+
const state = useFetch(serverURL, options); // Use the custom hook to fetch data
|
|
17
16
|
|
|
18
17
|
return state; // Return the state from the custom hook
|
|
19
18
|
}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetch ENS ID lookups
|
|
4
|
-
export const useFetchENSIDLookup = (id: string,
|
|
5
|
-
const URL = `https://localhost:${port}/ens-transfers-by-id`; // Define the API endpoint
|
|
6
|
-
|
|
4
|
+
export const useFetchENSIDLookup = (id: string, serverURL: string) => {
|
|
7
5
|
const options = {
|
|
8
6
|
method: 'POST',
|
|
9
7
|
body: JSON.stringify({ id }),
|
|
@@ -12,7 +10,8 @@ export const useFetchENSIDLookup = (id: string, port: number) => {
|
|
|
12
10
|
}
|
|
13
11
|
};
|
|
14
12
|
|
|
15
|
-
|
|
13
|
+
// ENDPOINT - /ens-transfers-by-id
|
|
14
|
+
const state = useFetch(serverURL, options); // Use the custom hook to fetch data
|
|
16
15
|
|
|
17
16
|
return state; // Return the state from the custom hook
|
|
18
17
|
}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetch ENS Name lookups
|
|
4
|
-
export const useFetchENSNameLookup = (ensName: string,
|
|
5
|
-
const URL = `https://localhost:${port}/ens-transfers-by-name`; // Define the API endpoint
|
|
4
|
+
export const useFetchENSNameLookup = (ensName: string, serverURL: string) => {
|
|
6
5
|
|
|
7
6
|
const options = {
|
|
8
7
|
method: 'POST',
|
|
@@ -12,7 +11,8 @@ export const useFetchENSNameLookup = (ensName: string, port: number) => {
|
|
|
12
11
|
}
|
|
13
12
|
};
|
|
14
13
|
|
|
15
|
-
|
|
14
|
+
// ENDPOINT - /ens-transfers-by-name
|
|
15
|
+
const state = useFetch(serverURL, options); // Use the custom hook to fetch data
|
|
16
16
|
|
|
17
17
|
return state; // Return the state from the custom hook
|
|
18
18
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC20 Prices Hook
|
|
4
|
-
export const useFetchERC20CollectionOwners = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC20CollectionOwners = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC20CollectionOwners = async (contractAddress: string, por
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc20-collection-owners
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC20 Collection Top Coins
|
|
4
|
-
export const useFetchERC20CollectionTopCoins = async (
|
|
4
|
+
export const useFetchERC20CollectionTopCoins = async (serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -12,7 +12,8 @@ export const useFetchERC20CollectionTopCoins = async (port: number) => {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
// Use the custom hook to fetch data
|
|
15
|
-
|
|
15
|
+
// ENDPOINT - /erc20-top-coins
|
|
16
|
+
const state = useFetch(serverURL, options);
|
|
16
17
|
|
|
17
18
|
// Return the state from the custom hook
|
|
18
19
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC20 Collection Transfers
|
|
4
|
-
export const useFetchERC20CollectionTransfers = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC20CollectionTransfers = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC20CollectionTransfers = async (contractAddress: string,
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc20-collecion-transfers
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC20 Collection Holdings
|
|
4
|
-
export const useFetchERC20Holdings = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC20Holdings = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC20Holdings = async (contractAddress: string, port: numbe
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc20-collection-holdings
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC20 Collection Transfers
|
|
4
|
-
export const useFetchERC20Transfers = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC20Transfers = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC20Transfers = async (contractAddress: string, port: numb
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc20-collection-transfers
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Collection Attributes Hook
|
|
4
|
-
export const useFetchERC721CollectionAttributes = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC721CollectionAttributes = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721CollectionAttributes = async (contractAddress: string
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-collection-attributes
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Collection Data Hook
|
|
4
|
-
export const useFetchERC721CollectionData = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC721CollectionData = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721CollectionData = async (contractAddress: string, port
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-collection-data
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Collection Data Hook
|
|
4
|
-
export const useFetchERC721CollectionExtraData = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC721CollectionExtraData = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721CollectionExtraData = async (contractAddress: string,
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - erc721-collection-extra-data
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Collection Floor Price Hook
|
|
4
|
-
export const useFetchERC721CollectionFloorPrice = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC721CollectionFloorPrice = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721CollectionFloorPrice = async (contractAddress: string
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-collection-floor-price
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Collection Market Cap Hook
|
|
4
|
-
export const useFetchERC721CollectionMarketCap = async (contractAddress: string, duration: 2 | 14 | 30,
|
|
4
|
+
export const useFetchERC721CollectionMarketCap = async (contractAddress: string, duration: 2 | 14 | 30, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721CollectionMarketCap = async (contractAddress: string,
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-collection-market-cap
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Collection Sales Hook
|
|
4
|
-
export const useFetchERC721CollectionSales = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC721CollectionSales = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721CollectionSales = async (contractAddress: string, por
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-collection-sales
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Collection Transfers Hook
|
|
4
|
-
export const useFetchERC721CollectionTransfers = async (contractAddress: string,
|
|
4
|
+
export const useFetchERC721CollectionTransfers = async (contractAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721CollectionTransfers = async (contractAddress: string,
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-collection-transfers
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Collection Trends Hook
|
|
4
|
-
export const useFetchERC721CollectionTrends = async (
|
|
4
|
+
export const useFetchERC721CollectionTrends = async (serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -12,7 +12,8 @@ export const useFetchERC721CollectionTrends = async (port: number) => {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
// Use the custom hook to fetch data
|
|
15
|
-
|
|
15
|
+
// ENDPOINT - /erc721-collection-trends
|
|
16
|
+
const state = useFetch(serverURL, options);
|
|
16
17
|
|
|
17
18
|
// Return the state from the custom hook
|
|
18
19
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Collection Volume Hook
|
|
4
|
-
export const useFetchERC721CollectionVolume = async (
|
|
4
|
+
export const useFetchERC721CollectionVolume = async (serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -12,7 +12,8 @@ export const useFetchERC721CollectionVolume = async (port: number) => {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
// Use the custom hook to fetch data
|
|
15
|
-
|
|
15
|
+
// ENDPOINT - /erc721-collection-volume
|
|
16
|
+
const state = useFetch(serverURL, options);
|
|
16
17
|
|
|
17
18
|
// Return the state from the custom hook
|
|
18
19
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Holdings hook
|
|
4
|
-
export const useFetchERC721Holdings = async (walletAddress: string,
|
|
4
|
+
export const useFetchERC721Holdings = async (walletAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721Holdings = async (walletAddress: string, port: number
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-holdings
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Lookup Data hook
|
|
4
|
-
export const useFetchERC721LookupData = async (contractAddress: string, tokenID: string,
|
|
4
|
+
export const useFetchERC721LookupData = async (contractAddress: string, tokenID: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721LookupData = async (contractAddress: string, tokenID:
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-lookup-data
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Opensea data hook
|
|
4
|
-
export const useFetchERC721OpenseaData = async (contractAddress: string, tokenID: string,
|
|
4
|
+
export const useFetchERC721OpenseaData = async (contractAddress: string, tokenID: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721OpenseaData = async (contractAddress: string, tokenID
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-opensea-data
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Rarity data hook
|
|
4
|
-
export const useFetchERC721RarityData = async (contractAddress: string, tokenID: string,
|
|
4
|
+
export const useFetchERC721RarityData = async (contractAddress: string, tokenID: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721RarityData = async (contractAddress: string, tokenID:
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-rarity-data
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Sales data hook
|
|
4
|
-
export const useFetchERC721SalesData = async (contractAddress: string, tokenID: string,
|
|
4
|
+
export const useFetchERC721SalesData = async (contractAddress: string, tokenID: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721SalesData = async (contractAddress: string, tokenID:
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-sales-data
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Transfer Lookup data hook
|
|
4
|
-
export const useFetchERC721TransferLookupData = async (contractAddress: string, tokenID: string,
|
|
4
|
+
export const useFetchERC721TransferLookupData = async (contractAddress: string, tokenID: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721TransferLookupData = async (contractAddress: string,
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-token-transfer-lookup-data
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Transfer data hook
|
|
4
|
-
export const useFetchERC721TransfersData = async (walletAddress: string,
|
|
4
|
+
export const useFetchERC721TransfersData = async (walletAddress: string, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC721TransfersData = async (walletAddress: string, port: n
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc721-wallet-transfers
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching Address to ENS Custom hook
|
|
4
|
-
export const useFetchGasLookup = (
|
|
5
|
-
const URL = `http://localhost:${port}/gas-information`; // Define the API endpoint
|
|
6
|
-
|
|
4
|
+
export const useFetchGasLookup = (serverURL: string) => {
|
|
7
5
|
const options = {
|
|
8
6
|
method: 'GET',
|
|
9
7
|
headers: {
|
|
@@ -11,7 +9,8 @@ export const useFetchGasLookup = (port: number) => {
|
|
|
11
9
|
}
|
|
12
10
|
};
|
|
13
11
|
|
|
14
|
-
|
|
12
|
+
// ENDPOINT - /gas-information
|
|
13
|
+
const state = useFetch(serverURL, options); // Use the custom hook to fetch data
|
|
15
14
|
|
|
16
15
|
return state; // Return the state from the custom hook
|
|
17
16
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC20 Prices Hook
|
|
4
|
-
export const useFetchERC20Price = async (contractAddress: string, currentPrice: boolean, duration: 2 | 14 | 30,
|
|
4
|
+
export const useFetchERC20Price = async (contractAddress: string, currentPrice: boolean, duration: 2 | 14 | 30, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchERC20Price = async (contractAddress: string, currentPrice:
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /erc20-token-price
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ERC721 Prices Hook
|
|
4
|
-
export const useFetchERC721Price = async (contractAddress: string, tokenID: number,
|
|
4
|
+
export const useFetchERC721Price = async (contractAddress: string, tokenID: number, serverURL: string) => {
|
|
5
5
|
// Set options for request
|
|
6
6
|
let options = {
|
|
7
7
|
method: 'POST',
|
|
@@ -12,7 +12,8 @@ export const useFetchERC721Price = async (contractAddress: string, tokenID: numb
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
// Use the custom hook to fetch data
|
|
15
|
-
|
|
15
|
+
// ENDPOINT - /erc721-token-price
|
|
16
|
+
const state = useFetch(serverURL, options);
|
|
16
17
|
|
|
17
18
|
// Return the state from the custom hook
|
|
18
19
|
return state;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
2
2
|
|
|
3
3
|
// Fetching ETH Prices Hook
|
|
4
|
-
export const useFetchETHPrice = async (currentPrice: boolean, duration: 2 | 14 | 30,
|
|
4
|
+
export const useFetchETHPrice = async (currentPrice: boolean, duration: 2 | 14 | 30, serverURL: string) => {
|
|
5
5
|
|
|
6
6
|
// Set options for request
|
|
7
7
|
let options = {
|
|
@@ -13,7 +13,8 @@ export const useFetchETHPrice = async (currentPrice: boolean, duration: 2 | 14 |
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
// Use the custom hook to fetch data
|
|
16
|
-
|
|
16
|
+
// ENDPOINT - /eth-price
|
|
17
|
+
const state = useFetch(serverURL, options);
|
|
17
18
|
|
|
18
19
|
// Return the state from the custom hook
|
|
19
20
|
return state;
|
|
@@ -2,7 +2,7 @@ import { LayerTwoNetworks } from "../../types/LayerTwoType";
|
|
|
2
2
|
import { useFetch } from "../../custom_hooks/useFetch";
|
|
3
3
|
|
|
4
4
|
// Fetching Layer Two Prices Hook
|
|
5
|
-
export const useFetchLayerTwoPrice = async (layerTwo: LayerTwoNetworks, currentPrice: boolean, duration: 2 | 14 | 30,
|
|
5
|
+
export const useFetchLayerTwoPrice = async (layerTwo: LayerTwoNetworks, currentPrice: boolean, duration: 2 | 14 | 30, serverURL: string) => {
|
|
6
6
|
|
|
7
7
|
// Set options for request
|
|
8
8
|
let options = {
|
|
@@ -14,7 +14,8 @@ export const useFetchLayerTwoPrice = async (layerTwo: LayerTwoNetworks, currentP
|
|
|
14
14
|
}
|
|
15
15
|
|
|
16
16
|
// Use the custom hook to fetch data
|
|
17
|
-
|
|
17
|
+
// ENDPOINT - /layer-two-prices
|
|
18
|
+
const state = useFetch(serverURL, options);
|
|
18
19
|
|
|
19
20
|
// Return the state from the custom hook
|
|
20
21
|
return state;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ethereum-hooks",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"description": "Package containing useful React hooks for working with the Ethereum Blockchain.",
|
|
5
5
|
"main": "server/server.ts",
|
|
6
6
|
"scripts": {
|
|
@@ -11,6 +11,10 @@
|
|
|
11
11
|
"build-server": "tsc -p server/tsconfig.json",
|
|
12
12
|
"test": "echo \"No tests specified\" && exit 0"
|
|
13
13
|
},
|
|
14
|
+
"repository": {
|
|
15
|
+
"type": "git",
|
|
16
|
+
"url": "https://github.com/CodingAbdullah/ethereum-hooks.git"
|
|
17
|
+
},
|
|
14
18
|
"keywords": [
|
|
15
19
|
"api",
|
|
16
20
|
"blockchain",
|
package/server/server.ts
CHANGED
|
@@ -3,26 +3,52 @@ import express from "express";
|
|
|
3
3
|
import cors, { CorsOptions } from 'cors'; // Import CorsOptions
|
|
4
4
|
|
|
5
5
|
// Route files for working with different ETH protocols
|
|
6
|
-
|
|
7
|
-
const
|
|
8
|
-
const
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
const
|
|
16
|
-
const
|
|
17
|
-
const
|
|
18
|
-
|
|
6
|
+
// ENS Routes
|
|
7
|
+
const AddressToENSRouter = require("./Routes/ENSRoutes/AddressToENSRoute");
|
|
8
|
+
const ENSIDRouter = require("./Routes/ENSRoutes/ENSIDRoute");
|
|
9
|
+
const ENSNameRouter = require("./Routes/ENSRoutes/ENSNameRoute");
|
|
10
|
+
const ENSToAddressRouter = require("./Routes/ENSRoutes/ENSToAddressRoute");
|
|
11
|
+
|
|
12
|
+
// ERC20 Token Routes
|
|
13
|
+
const ERC20CollectionOwnersRouter = require("./Routes/ERC20TokensRoutes/ERC20CollectionOwnersRoute");
|
|
14
|
+
const ERC20CollectionTopCoinsRouter = require("./Routes/ERC20TokensRoutes/ERC20CollectionTopCoinsRoute");
|
|
15
|
+
const ERC20CollectionTransfersRouter = require("./Routes/ERC20TokensRoutes/ERC20CollectionTransfersRoute");
|
|
16
|
+
const ERC20HoldingsRouter = require("./Routes/ERC20TokensRoutes/ERC20HoldingsRoute");
|
|
17
|
+
const ERC20TransfersRouter = require("./Routes/ERC20TokensRoutes/ERC20TransfersRoute");
|
|
18
|
+
|
|
19
|
+
// ERC721 Token Routes
|
|
20
|
+
const ERC721CollectionAttributesRouter = require("./Routes/ERC721TokensRoutes/ERC721CollectionAttributesRoute");
|
|
21
|
+
const ERC721CollectionDataRouter = require("./Routes/ERC721TokensRoutes/ERC721CollectionDataRoute");
|
|
22
|
+
const ERC721CollectionExtraDataRouter = require("./Routes/ERC721TokensRoutes/ERC721CollectionExtraDataRoute");
|
|
23
|
+
const ERC721CollectionFloorPriceRouter = require("./Routes/ERC721TokensRoutes/ERC721CollectionFloorPriceRoute");
|
|
24
|
+
const ERC721CollectionMarketCapRouter = require("./Routes/ERC721TokensRoutes/ERC721CollectionMarketCapRoute");
|
|
25
|
+
const ERC721CollectionSalesRouter = require("./Routes/ERC721TokensRoutes/ERC721CollectionSalesRoute");
|
|
26
|
+
const ERC721CollectionTransfersRouter = require("./Routes/ERC721TokensRoutes/ERC721CollectionTransfersRoute");
|
|
27
|
+
const ERC721CollectionTrendsRouter = require('./Routes/ERC721TokensRoutes/ERC721CollectionTrendsRoute');
|
|
28
|
+
const ERC721CollectionVolumeRouter = require("./Routes/ERC721TokensRoutes/ERC721CollectionVolumeRoute");
|
|
29
|
+
const ERC721HoldingsRouter = require("./Routes/ERC721TokensRoutes/ERC721HoldingsRoute");
|
|
30
|
+
const ERC721LookupDataRouter = require('./Routes/ERC721TokensRoutes/ERC721LookupDataRoute');
|
|
31
|
+
const ERC721OpenseaDataRouter = require('./Routes/ERC721TokensRoutes/ERC721OpenseaDataRoute');
|
|
32
|
+
const ERC721RarityDataRouter = require("./Routes/ERC721TokensRoutes/ERC721RarityDataRoute");
|
|
33
|
+
const ERC721SalesDataRouter = require("./Routes/ERC721TokensRoutes/ERC721SalesDataRoute");
|
|
34
|
+
const ERC721TransferLookupDataRouter = require("./Routes/ERC721TokensRoutes/ERC721TransferLookupDataRoute");
|
|
35
|
+
const ERC721TransfersDataRouter = require("./Routes/ERC721TokensRoutes/ERC721TransfersDataRoute");
|
|
36
|
+
|
|
37
|
+
// Gas Information Route
|
|
38
|
+
const GasLookupRouter = require("./Routes/GasRoutes/GasLookupRoute");
|
|
39
|
+
|
|
40
|
+
// Pricing Routes
|
|
41
|
+
const ERC20PriceRouter = require("./Routes/PriceRoutes/ERC20PriceRoute");
|
|
42
|
+
const ERC721PriceRouter = require('./Routes/PriceRoutes/ERC721PriceRoute');
|
|
43
|
+
const ETHPriceRouter = require("./Routes/PriceRoutes/ETHPriceRoute");
|
|
44
|
+
const LayerTwoPriceRouter = require("./Routes/PriceRoutes/LayerTwoPriceRoute");
|
|
19
45
|
|
|
20
46
|
dotenv.config({ path: '.env' });
|
|
21
47
|
const app = express();
|
|
22
48
|
|
|
23
49
|
// CORS options to allow connections from client port
|
|
24
50
|
const corsOptions: CorsOptions = {
|
|
25
|
-
origin:
|
|
51
|
+
origin: process.env.CLIENT_URL // Allow requests from this origin
|
|
26
52
|
};
|
|
27
53
|
|
|
28
54
|
// Set up middleware
|
|
@@ -34,20 +60,37 @@ app.listen(process.env.PORT || 8080, () => {
|
|
|
34
60
|
console.log("Listening on PORT " + (process.env.PORT || 8080));
|
|
35
61
|
});
|
|
36
62
|
|
|
37
|
-
// Enable
|
|
38
|
-
app.use("/",
|
|
39
|
-
app.use("/",
|
|
40
|
-
app.use("/",
|
|
41
|
-
app.use("/",
|
|
42
|
-
app.use("/",
|
|
43
|
-
app.use("/",
|
|
44
|
-
app.use("/",
|
|
63
|
+
// Enable and activate routes to be used by server
|
|
64
|
+
app.use("/", AddressToENSRouter);
|
|
65
|
+
app.use("/", ENSIDRouter);
|
|
66
|
+
app.use("/", ENSNameRouter);
|
|
67
|
+
app.use("/", ENSToAddressRouter);
|
|
68
|
+
app.use("/", ERC20CollectionOwnersRouter);
|
|
69
|
+
app.use("/", ERC20CollectionTopCoinsRouter);
|
|
70
|
+
app.use("/", ERC20CollectionTransfersRouter);
|
|
71
|
+
app.use("/", ERC20HoldingsRouter);
|
|
72
|
+
app.use("/", ERC20TransfersRouter);
|
|
73
|
+
app.use("/", ERC721CollectionAttributesRouter);
|
|
74
|
+
app.use("/", ERC721CollectionDataRouter);
|
|
75
|
+
app.use("/", ERC721CollectionExtraDataRouter);
|
|
76
|
+
app.use("/", ERC721CollectionFloorPriceRouter);
|
|
77
|
+
app.use("/", ERC721CollectionMarketCapRouter);
|
|
78
|
+
app.use("/", ERC721CollectionSalesRouter);
|
|
79
|
+
app.use("/", ERC721CollectionTransfersRouter);
|
|
80
|
+
app.use("/", ERC721CollectionTrendsRouter);
|
|
81
|
+
app.use("/", ERC721CollectionVolumeRouter);
|
|
45
82
|
app.use("/", ERC721HoldingsRouter);
|
|
46
|
-
app.use("/",
|
|
47
|
-
app.use("/",
|
|
48
|
-
app.use("/",
|
|
49
|
-
app.use("/",
|
|
50
|
-
app.use("/",
|
|
83
|
+
app.use("/", ERC721LookupDataRouter);
|
|
84
|
+
app.use("/", ERC721OpenseaDataRouter);
|
|
85
|
+
app.use("/", ERC721RarityDataRouter);
|
|
86
|
+
app.use("/", ERC721SalesDataRouter);
|
|
87
|
+
app.use("/", ERC721TransferLookupDataRouter);
|
|
88
|
+
app.use("/", ERC721TransfersDataRouter);
|
|
89
|
+
app.use("/", GasLookupRouter);
|
|
90
|
+
app.use("/", ERC20PriceRouter);
|
|
91
|
+
app.use("/", ERC721PriceRouter);
|
|
92
|
+
app.use("/", ETHPriceRouter);
|
|
93
|
+
app.use("/", LayerTwoPriceRouter);
|
|
51
94
|
|
|
52
95
|
// Export ready-made server for usage
|
|
53
96
|
export default app;
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
/package/server/Routes/ERC721TokensRoutes/{ERC721HoldingsRoutes.ts → ERC721HoldingsRoute.ts}
RENAMED
|
File without changes
|
/package/server/Routes/ERC721TokensRoutes/{ERC721LookupDataRoutes.ts → ERC721LookupDataRoute.ts}
RENAMED
|
File without changes
|
/package/server/Routes/ERC721TokensRoutes/{ERC721OpenseaDataRoutes.ts → ERC721OpenseaDataRoute.ts}
RENAMED
|
File without changes
|
/package/server/Routes/ERC721TokensRoutes/{ERC721RarityDataRoutes.ts → ERC721RarityDataRoute.ts}
RENAMED
|
File without changes
|
/package/server/Routes/ERC721TokensRoutes/{ERC721SalesDataRoutes.ts → ERC721SalesDataRoute.ts}
RENAMED
|
File without changes
|
|
File without changes
|
|
File without changes
|