Skip to content

Commit decb8c3

Browse files
10xSebastian10xSebastian
committed
v4.2.1: fix solana tokens
1 parent 00e4abe commit decb8c3

File tree

6 files changed

+359
-16
lines changed

6 files changed

+359
-16
lines changed

‎demo.html‎

Lines changed: 336 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,336 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<link rel="icon" type="image/png" href="https://depay.com/favicon.png"/>
7+
<title>Development</title>
8+
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
9+
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
10+
<script crossorigin src="https://unpkg.com/@depay/web3-blockchains@5/dist/umd/index.js"></script>
11+
<script crossorigin src="https://unpkg.com/@depay/web3-constants@6/dist/umd/index.js"></script>
12+
<script src="/dist/umd/index.js"></script>
13+
<link rel="stylesheet" href="https://unpkg.com/bootstrap@5/dist/css/bootstrap.css">
14+
<style>
15+
.btn-primary {
16+
color: #fff;
17+
background-color: #ea357a !important;
18+
border: 1px solid #ea357a !important;
19+
padding: 0.35rem 1.2rem !important;
20+
box-shadow: none;
21+
outline: none;
22+
}
23+
.btn-primary:hover {
24+
background-color: #db3071 !important;
25+
}
26+
.token-image img {
27+
max-width: 80%;
28+
}
29+
30+
.Token {
31+
width: 200px;
32+
height: 200px;
33+
}
34+
</style>
35+
</head>
36+
<body style="background-color: #FAFAFA;">
37+
<div class="container py-4">
38+
39+
<div class="py-2 pb-3 text-center">
40+
<a href="https://depay.com" target="_blank">
41+
<img alt="DePay" class="navbar-logo shadow-sm" src="https://depay.com/logo.svg" style="height: 50px; width: 50px; border-radius: 999px;"/>
42+
</a>
43+
</div>
44+
45+
<div class="row px-2">
46+
47+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
48+
<div class="px-0 py-4 rounded-lg bg-white border">
49+
<div class="col px-0">
50+
<div class="overflow-auto">
51+
<h5 class="px-4 pb-4">Ethereum Token from Trustwallet</h5>
52+
<div class="px-4">
53+
<div id="ethereumTokenFromTrustwallet" class="container d-flex justify-content-center token-image pt-2"></div>
54+
</div>
55+
</div>
56+
<div class="px-4 pt-3">
57+
<script>
58+
ReactDOM.createRoot(
59+
document.getElementById('ethereumTokenFromTrustwallet')
60+
).render(
61+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'ethereum', address: '0xa0bEd124a09ac2Bd941b10349d8d224fe3c955eb' }),
62+
)
63+
</script>
64+
</div>
65+
</div>
66+
</div>
67+
</div>
68+
69+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
70+
<div class="px-0 py-4 rounded-lg bg-white border">
71+
<div class="col px-0">
72+
<div class="overflow-auto">
73+
<h5 class="px-4 pb-4">Ethereum Token from DePay API</h5>
74+
<div class="px-4">
75+
<div id="ethereumTokenFromDepayApi" class="container d-flex justify-content-center token-image pt-2"></div>
76+
</div>
77+
</div>
78+
<div class="px-4 pt-3">
79+
<script>
80+
ReactDOM.createRoot(
81+
document.getElementById('ethereumTokenFromDepayApi')
82+
).render(
83+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'ethereum', address: '0xa0bed124a09ac2Bd941b10349d8d224fe3c955eb' })
84+
)
85+
</script>
86+
</div>
87+
</div>
88+
</div>
89+
</div>
90+
91+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
92+
<div class="px-0 py-4 rounded-lg bg-white border">
93+
<div class="col px-0">
94+
<div class="overflow-auto">
95+
<h5 class="px-4 pb-4">BSC Token from Trustwallet</h5>
96+
<div class="px-4">
97+
<div id="bscTokenFromTrustwallet" class="container d-flex justify-content-center token-image pt-2"></div>
98+
</div>
99+
</div>
100+
<div class="px-4 pt-3">
101+
<script>
102+
ReactDOM.createRoot(
103+
document.getElementById('bscTokenFromTrustwallet')
104+
).render(
105+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'bsc', address: '0x0E09FaBB73Bd3Ade0a17ECC321fD13a19e81cE82' }),
106+
)
107+
</script>
108+
</div>
109+
</div>
110+
</div>
111+
</div>
112+
113+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
114+
<div class="px-0 py-4 rounded-lg bg-white border">
115+
<div class="col px-0">
116+
<div class="overflow-auto">
117+
<h5 class="px-4 pb-4">BSC Token from DePay API</h5>
118+
<div class="px-4">
119+
<div id="bscTokenFromDepayApi" class="container d-flex justify-content-center token-image pt-2"></div>
120+
</div>
121+
</div>
122+
<div class="px-4 pt-3">
123+
<script>
124+
ReactDOM.createRoot(
125+
document.getElementById('bscTokenFromDepayApi')
126+
).render(
127+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'bsc', address: '0xa0bed124a09ac2Bd941b10349d8d224fe3c955eb' })
128+
)
129+
</script>
130+
</div>
131+
</div>
132+
</div>
133+
</div>
134+
135+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
136+
<div class="px-0 py-4 rounded-lg bg-white border">
137+
<div class="col px-0">
138+
<div class="overflow-auto">
139+
<h5 class="px-4 pb-4">Polygon Token from Trustwallet</h5>
140+
<div class="px-4">
141+
<div id="polygonTokenFromTrustwallet" class="container d-flex justify-content-center token-image pt-2"></div>
142+
</div>
143+
</div>
144+
<div class="px-4 pt-3">
145+
<script>
146+
ReactDOM.createRoot(
147+
document.getElementById('polygonTokenFromTrustwallet')
148+
).render(
149+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'polygon', address: '0x831753DD7087CaC61aB5644b308642cc1c33Dc13' }),
150+
)
151+
</script>
152+
</div>
153+
</div>
154+
</div>
155+
</div>
156+
157+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
158+
<div class="px-0 py-4 rounded-lg bg-white border">
159+
<div class="col px-0">
160+
<div class="overflow-auto">
161+
<h5 class="px-4 pb-4">Polygon Token from DePay API</h5>
162+
<div class="px-4">
163+
<div id="polygonTokenFromDepayApi" class="container d-flex justify-content-center token-image pt-2"></div>
164+
</div>
165+
</div>
166+
<div class="px-4 pt-3">
167+
<script>
168+
ReactDOM.createRoot(
169+
document.getElementById('polygonTokenFromDepayApi')
170+
).render(
171+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'polygon', address: '0x831753dd7087cac61ab5644b308642cc1c33dc13' })
172+
)
173+
</script>
174+
</div>
175+
</div>
176+
</div>
177+
</div>
178+
179+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
180+
<div class="px-0 py-4 rounded-lg bg-white border">
181+
<div class="col px-0">
182+
<div class="overflow-auto">
183+
<h5 class="px-4 pb-4">Solana Token from Trustwallet</h5>
184+
<div class="px-4">
185+
<div id="solanaTokenFromTrustwallet" class="container d-flex justify-content-center token-image pt-2"></div>
186+
</div>
187+
</div>
188+
<div class="px-4 pt-3">
189+
<script>
190+
ReactDOM.createRoot(
191+
document.getElementById('solanaTokenFromTrustwallet')
192+
).render(
193+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'solana', address: 'EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v' }),
194+
)
195+
</script>
196+
</div>
197+
</div>
198+
</div>
199+
</div>
200+
201+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
202+
<div class="px-0 py-4 rounded-lg bg-white border">
203+
<div class="col px-0">
204+
<div class="overflow-auto">
205+
<h5 class="px-4 pb-4">Solana Token from DePay API</h5>
206+
<div class="px-4">
207+
<div id="solanaTokenFromDepayApi" class="container d-flex justify-content-center token-image pt-2"></div>
208+
</div>
209+
</div>
210+
<div class="px-4 pt-3">
211+
<script>
212+
ReactDOM.createRoot(
213+
document.getElementById('solanaTokenFromDepayApi')
214+
).render(
215+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'solana', address: 'epjfwdd5aufqssqem2qn1xzybapc8g4weggkzwytdt1v' })
216+
)
217+
</script>
218+
</div>
219+
</div>
220+
</div>
221+
</div>
222+
223+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
224+
<div class="px-0 py-4 rounded-lg bg-white border">
225+
<div class="col px-0">
226+
<div class="overflow-auto">
227+
<h5 class="px-4 pb-4">Token: Failed loading</h5>
228+
<div class="px-4">
229+
<div id="tokenThree" class="container d-flex justify-content-center token-image pt-2"></div>
230+
</div>
231+
</div>
232+
<div class="px-4 pt-3">
233+
<script>
234+
ReactDOM.createRoot(
235+
document.getElementById('tokenThree')
236+
).render(
237+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'ethereum', address: '0xa0bed124a09ac2Bd41b10349d8d224fe3c955eb' })
238+
)
239+
</script>
240+
</div>
241+
</div>
242+
</div>
243+
</div>
244+
245+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
246+
<div class="px-0 py-4 rounded-lg bg-white border">
247+
<div class="col px-0">
248+
<div class="overflow-auto">
249+
<h5 class="px-4 pb-4">Token: Native Ethereum</h5>
250+
<div class="px-4">
251+
<div id="tokenFour" class="container d-flex justify-content-center token-image pt-2"></div>
252+
</div>
253+
</div>
254+
<div class="px-4 pt-3">
255+
<script>
256+
ReactDOM.createRoot(
257+
document.getElementById('tokenFour')
258+
).render(
259+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'ethereum', address: '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE' })
260+
)
261+
</script>
262+
</div>
263+
</div>
264+
</div>
265+
</div>
266+
267+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
268+
<div class="px-0 py-4 rounded-lg bg-white border">
269+
<div class="col px-0">
270+
<div class="overflow-auto">
271+
<h5 class="px-4 pb-4">Token: Native BSC</h5>
272+
<div class="px-4">
273+
<div id="tokenFive" class="container d-flex justify-content-center token-image pt-2"></div>
274+
</div>
275+
</div>
276+
<div class="px-4 pt-3">
277+
<script>
278+
ReactDOM.createRoot(
279+
document.getElementById('tokenFive')
280+
).render(
281+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'bsc', address: '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE' })
282+
)
283+
</script>
284+
</div>
285+
</div>
286+
</div>
287+
</div>
288+
289+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
290+
<div class="px-0 py-4 rounded-lg bg-white border">
291+
<div class="col px-0">
292+
<div class="overflow-auto">
293+
<h5 class="px-4 pb-4">Token: Native Polygon</h5>
294+
<div class="px-4">
295+
<div id="tokenSix" class="container d-flex justify-content-center token-image pt-2"></div>
296+
</div>
297+
</div>
298+
<div class="px-4 pt-3">
299+
<script>
300+
ReactDOM.createRoot(
301+
document.getElementById('tokenSix')
302+
).render(
303+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'polygon', address: '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE' })
304+
)
305+
</script>
306+
</div>
307+
</div>
308+
</div>
309+
</div>
310+
311+
<div class="d-block d-md-inline-block p-2 col-12 col-md-4">
312+
<div class="px-0 py-4 rounded-lg bg-white border">
313+
<div class="col px-0">
314+
<div class="overflow-auto">
315+
<h5 class="px-4 pb-4">Token: Native SOL</h5>
316+
<div class="px-4">
317+
<div id="tokenSeven" class="container d-flex justify-content-center token-image pt-2"></div>
318+
</div>
319+
</div>
320+
<div class="px-4 pt-3">
321+
<script>
322+
ReactDOM.createRoot(
323+
document.getElementById('tokenSeven')
324+
).render(
325+
React.createElement(window.ReactTokenImage.TokenImage, { className:"Token", blockchain: 'solana', address: '11111111111111111111111111111111' })
326+
)
327+
</script>
328+
</div>
329+
</div>
330+
</div>
331+
</div>
332+
333+
</div>
334+
</div>
335+
</body>
336+
</html>

‎dist/esm/index.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,8 @@ let TokenImage = function(props){
3131
return 'smartchain'
3232
case 'polygon':
3333
return 'polygon'
34+
case 'solana':
35+
return 'solana'
3436
default:
3537
throw('DePayReactTokenImage: Unknown blockchain')
3638
}
@@ -52,7 +54,7 @@ let TokenImage = function(props){
5254
React.createElement('img', {
5355
className: props.className ,
5456
src: src ,
55-
onError: handleLoadError , __self: this, __source: {fileName: _jsxFileName, lineNumber: 54}}
57+
onError: handleLoadError , __self: this, __source: {fileName: _jsxFileName, lineNumber: 57}}
5658
)
5759
)
5860
};

‎dist/umd/index.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,8 @@
3737
return 'smartchain'
3838
case 'polygon':
3939
return 'polygon'
40+
case 'solana':
41+
return 'solana'
4042
default:
4143
throw('DePayReactTokenImage: Unknown blockchain')
4244
}
@@ -58,7 +60,7 @@
5860
React__default['default'].createElement('img', {
5961
className: props.className ,
6062
src: src ,
61-
onError: handleLoadError , __self: this, __source: {fileName: _jsxFileName, lineNumber: 54}}
63+
onError: handleLoadError , __self: this, __source: {fileName: _jsxFileName, lineNumber: 57}}
6264
)
6365
)
6466
};

0 commit comments

Comments
 (0)