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
- Branch
- token-landing-p1
- Lint
Lint Passed - Unit
No Test Coverage - Build Status
Buildable 30924 Build 61351: Build Diff cashtab-tests Build 61350: arc lint + arc unit
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. |