We want users to be able to share tokens by sharing a landing page. Going forward, will add orderbook for this token (if present).
Details
Details
- Reviewers
emack - Group Reviewers
Restricted Project - Commits
- rABC3c7e1086cad6: [Cashtab] Render a token info page for any tokenId, regardless of user balance
npm test
Diff Detail
Diff Detail
- Repository
- rABC Bitcoin ABC
- Lint
Lint Not Applicable - Unit
Tests Not Applicable
Event Timeline
Comment Actions
remove debug log, do not doublecall getUncachedTokenInfo(), remove spinner that is already generated at the app component level
Comment Actions
Build Bitcoin ABC Diffs / Diff Testing (cashtab-tests) failed.
Failed tests logs:
====== CashTab Unit Tests: <Token /> For an uncached token with no balance, we show a spinner while loading the token info, then show an info screen and open agora offers ======
TestingLibraryElementError: Unable to find an element with the text: 2,999,998,798,000,000,000 (fixed). This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, script, style
<body>
<div>
<div
class="sc-cpHetk jFBcrU"
>
<div
class="Toastify"
/>
<div
class="sc-nrwXf fNiHDX"
>
<div
class="sc-eitiEO cOdCdq"
>
<div
class="sc-fKGOjr fDbWIH"
>
<img
alt="cashtab"
class="sc-jvEmr TGsLz"
src="test-file-stub"
/>
</div>
<div
class="sc-dznXNo mmyBK"
>
<select
class="sc-ekulBa kPfdXv"
data-testid="wallet-select"
id="wallets"
name="wallets"
>
<option
class="sc-ciodno bDKxBk"
value="Transaction Fixtures"
>
Transaction Fixtures
</option>
</select>
<div
class="sc-ghsgMZ eoHiwc"
>
<button
aria-label="Copy ecash:qqa9lv3kjd8vq7952p7rq0f6lkpqvlu0cydvxtd70g"
class="sc-cQFLBn jGCEIx"
>
<svg
title="copy-paste"
/>
</button>
<div
class="sc-gFaPwZ bhfoic"
>
<div
class="sc-fhYwyz kXwmEk"
>
<input
checked=""
class="sc-bMvGRv dnGmSn"
id="show-hide-balance"
name="show-hide-balance"
title="show-hide-balance"
type="checkbox"
/>
<label
class="sc-jzgbtB hsNhPD"
for="show-hide-balance"
>
<span
class="sc-gJWqzi dYGNll"
data-off=""
data-on=""
/>
<span
class="sc-rBLzX gWpmmy"
/>
</label>
</div>
</div>
</div>
</div>
<div
class="sc-dTLGrV bUlpzg"
title="Wallet Info"
>
<div
class="sc-lcpuFF hKVwNE"
title="Balance in XEC"
>
9,513.12
XEC
</div>
<div
class="sc-bqjOQT eIJVRl"
title="Balance in Local Currency"
>
$
0.29
USD
</div>
<p
class="sc-jkCMRl knQaq"
title="Price in Local Currency"
>
1
XEC
=
0.00003000
USD
</p>
</div>
<div
class="sc-iBmynh dVkwbT"
>
<div
class="sc-LKuAh cgbRuv"
>
Cachet
(
CACHET
)
</div>
<div
class="sc-kZmsYB GaVcJ"
title="Token Stats"
>
<div
class="sc-iSDuPN dDJLwR"
>
<button
class="sc-kxynE iJdosy"
>
<img
alt="icon for aed861a31b96934b88c0252ede135cb9700d7649f69191235087a3030e553cb1"
height="128"
src="https://icons.etokens.cash/128/aed861a31b96934b88c0252ede135cb9700d7649f69191235087a3030e553cb1.png"
width="128"
/>
</button>
</div>
<div
class="sc-iSDuPN dDJLwR"
>
<div
class="sc-fQejPQ dbVdh"
>
<div
class="sc-clNaTc iEsKiy"
>
Type:
</div>
<div
class="sc-iSDuPN dDJLwR"
>
<div
class="sc-chbbiW oKWgc"
>
SLP
<button
aria-label="Click for more info about this token type"
class="sc-cQFLBn jGCEIx"
>
<svg
title="More Info"
/>
</button>
</div>
</div>
</div>
<div
class="sc-fQejPQ dbVdh"
>
<div
class="sc-clNaTc iEsKiy"
>
Token Id:
</div>
<div
class="sc-iSDuPN dDJLwR"
>
<a
href="https://explorer.e.cash/tx/aed861a31b96934b88c0252ede135cb9700d7649f69191235087a3030e553cb1"
rel="noopener noreferrer"
target="_blank"
>
aed
...
cb1
</a>
</div>
<div
class="sc-iSDuPN dDJLwR"
>
<button
class="sc-cQFLBn jGCEIx"
>
<svg
title="copy-paste"
/>
</button>
</div>
</div>
<div
class="sc-fQejPQ dbVdh"
>
<div
class="sc-clNaTc iEsKiy"
>
decimals:
</div>
<div
class="sc-iSDuPN dDJLwR"
>
2
</div>
</div>
<div
class="sc-fQejPQ dbVdh"
>
<div
class="sc-clNaTc iEsKiy"
>
url:
</div>
<div
class="sc-iSDuPN sc-fZwumE ErXeE"
>
<a
href="https://cashtab.com/"
rel="noreferrer"
target="_blank"
>
cashtab.com/
</a>
</div>
</div>
<div
class="sc-fQejPQ dbVdh"
>
<div
class="sc-clNaTc iEsKiy"
>
created:
</div>
<div
class="sc-iSDuPN dDJLwR"
>
Mar 30, 2024
</div>
</div>
<div
class="sc-fQejPQ dbVdh"
>
<div
class="sc-clNaTc iEsKiy"
>
Genesis Qty:
</div>
<div
class="sc-iSDuPN dDJLwR"
>
100,000.00
</div>
</div>
<div
class="sc-fQejPQ dbVdh"
>
<div
class="sc-clNaTc iEsKiy"
>
Supply:
</div>
<div
class="sc-iSDuPN dDJLwR"
>
<div
class="sc-kAzzGY gDpRAi"
title="Loading"
>
<div />
<div />
<div />
<div />
</div>
</div>
</div>
</div>
</div>
<div
class="sc-dNLxif jPzIWB"
>
You do not hold this token.
</div>
</div>
</div>
<div
class="sc-bhlBdH fCiaoo"
>
<button
class="sc-ekkqgF hnFtzh"
>
<svg />
</button>
<button
aria-label="Send Screen"
class="sc-ekkqgF hnFtzh"
style="padding-bottom: 10px;"
>
<div
class="sc-iwsKbI cuDgAv"
>
<svg
title="tx-sent"
/>
</div>
</button>
<button
aria-label="Tokens"
class="sc-ekkqgF hnFtzh"
>
<svg
title="Tokens"
/>
</button>
<button
aria-label="Receive"
class="sc-ekkqgF hnFtzh"
>
<svg
title="tx-received"
/>
</button>
<div
class="sc-AnqlK cZeftD"
title="Show Other Screens"
>
<span
class="sc-keFjpB hNzdbz"
/>
<div
class="sc-jWojfa gZkjkh"
title="Other Screens"
>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Wallet Backup
</p>
<svg
title="wallet"
/>
</button>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Wallets
</p>
<svg
title="wallets"
/>
</button>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Listed NFTs
</p>
<svg
title="NFT"
/>
</button>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Agora
</p>
<svg
title="Meme Agora"
/>
</button>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Contacts
</p>
<svg
title="Contact List"
/>
</button>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Airdrop
</p>
<svg
title="tx-airdrop"
/>
</button>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Rewards
</p>
<svg
title="Cashtab Rewards"
/>
</button>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Swap
</p>
<svg
title="swap"
/>
</button>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Sign & Verify
</p>
<svg
class="sc-htpNat bPFBeM"
/>
</button>
<button
class="sc-kVrTmx liBJSn"
>
<p>
Settings
</p>
<svg
title="settings"
/>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
at Object.getByText (/work/cashtab/src/components/Etokens/__tests__/Token.test.js:841:20)Each failure log is accessible here:
CashTab Unit Tests: <Token /> For an uncached token with no balance, we show a spinner while loading the token info, then show an info screen and open agora offers
Comment Actions
http://localhost:3000/#/token/ just renders a blank page with the header - perhaps default to / route?.
| cashtab/src/components/Etokens/Token/index.js | ||
|---|---|---|
| 475 ↗ | (On Diff #50559) | just so I'm reading this correctly, this useEffect is triggered each time this get method is called? If so, TIL this is possible. |
| 1607–1608 ↗ | (On Diff #50559) | in this scenario the error should indicate this is an invalid token id, otherwise users will keep refresh based on the 'try again later' part of the message. |
| 1613 ↗ | (On Diff #50559) | No need to show this when there is no token context being displayed |
| 1633–1652 ↗ | (On Diff #50559) | all these linting changes again :/ |
Comment Actions
http://localhost:3000/#/token/ just renders a blank page with the header - perhaps default to / route?.
I amended so this route renders the token list.
For now, there's no way to get here except by directly typing it in.
| cashtab/src/components/Etokens/Token/index.js | ||
|---|---|---|
| 475 ↗ | (On Diff #50559) | The intent here is that we run this method
When we get a tokenId, we run this method. If we do not have the token info in cache, we get it. The expected behavior is confirmed in the tests. I added some console.log statements to make sure we are not constantly calling getUncachedTokenInfo -- since cashtabCache.tokens.get(tokenId) is an object, and it should never change after being populated, it is a stable reference. |
| 1607–1608 ↗ | (On Diff #50559) | good point. updated to render this and not even try asking chronik for this expected error. |
| 1613 ↗ | (On Diff #50559) | good point. implemented slightly differently given the above token id validation checks |
| 1633–1652 ↗ | (On Diff #50559) | yes. Unfortunately cannot totally avoid them here -- we introduce conditional rendering for the case of bad token Id or cannot get token id info this diff. So, everything is tabbed over. |