Page MenuHomePhabricator
Differential D17154

[Cashtab] Convert Token, validation, and other deps to ts
ClosedPublic
Actions

Authored by bytesofman on Nov 16 2024, 15:25.

Details

Reviewers
emack
Group Reviewers
Restricted Project
Commits
rABCee9d685825f4: [Cashtab] Convert Token, validation, and other deps to ts
Summary

Convert Token screen to ts as prep for refactor to improve extensability to other token types.

Implement ts in deps important to this conversion. The Token screen is large and has lots of dependencies that needed to be typed.

  • validation
  • Inputs
  • tweaks to useWallet and Alias
  • token creation blacklist

It would be possible to split some off into separate diffs, but I think it's best to continue the "rip the bandaid off" approach of ts implementation.

Behavior is confirmed by tests. . This diff is not introducing any new functionality, only implementing typescript and patching minor type-related issues as they are uncovered.

Test Plan

npm test

Diff Detail

Repository
rABC Bitcoin ABC
Branch
token-to-ts
Lint
Lint Passed
Unit
No Test Coverage
Build Status
Buildable 31203
Build 61906: Build Diffcashtab-tests
Build 61905: arc lint + arc unit

Event Timeline

bytesofman created this revision.Nov 16 2024, 15:25
Herald added a reviewer: Restricted Project. · View Herald TranscriptNov 16 2024, 15:25
Harbormaster completed remote builds in B31176: Diff 50900.Nov 16 2024, 15:29
teamcity added a comment.Nov 16 2024, 15:29
Build Bitcoin ABC Diffs / Diff Testing (cashtab-tests) failed.

Tail of the build log:

1 moderate severity vulnerability

To address all issues, run:
  npm audit fix

Run `npm audit` for details.

> ecash-lib@0.2.1 build
> tsc && tsc -p ./tsconfig.build.json && cp -r ./src/ffi ./dist

Installing ecash-agora dependencies...
/work/modules/ecash-agora /work/modules/ecash-lib /work/modules/ecash-lib-wasm /work/modules/ecash-script /work/modules/chronik-client /work/modules/mock-chronik-client /work/modules/ecashaddrjs /work/abc-ci-builds/cashtab-tests

added 364 packages, and audited 367 packages in 2s

60 packages are looking for funding
  run `npm fund` for details

1 moderate severity vulnerability

To address all issues, run:
  npm audit fix

Run `npm audit` for details.

> ecash-agora@0.1.1 build
> tsc && tsc -p ./tsconfig.build.json

/work/cashtab /work/modules/ecash-agora /work/modules/ecash-lib /work/modules/ecash-lib-wasm /work/modules/ecash-script /work/modules/chronik-client /work/modules/mock-chronik-client /work/modules/ecashaddrjs /work/abc-ci-builds/cashtab-tests

added 1483 packages, and audited 3329 packages in 25s

323 packages are looking for funding
  run `npm fund` for details

3 vulnerabilities (2 moderate, 1 high)

To address all issues, run:
  npm audit fix

Run `npm audit` for details.

> cashtab@2.54.0 build
> node scripts/build.js

Creating an optimized production build...
Failed to compile.

TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
  Type 'undefined' is not assignable to type 'string'.
    299 |     // Check if the user has mint batons for this token
    300 |     // If they don't, disable the mint switch and label why
  > 301 |     const mintBatons = getMintBatons(wallet.state.slpUtxos, tokenId);
        |                                                             ^^^^^^^
    302 |
    303 |     // Load with QR code open if device is mobile
    304 |     const openWithScanner =


Build cashtab-tests failed with exit code 1
bytesofman updated this revision to Diff 50942.Nov 18 2024, 19:40

updating more deps and rest of token, build lint

Harbormaster completed remote builds in B31197: Diff 50942.Nov 18 2024, 19:44
teamcity added a comment.Nov 18 2024, 19:44
Build Bitcoin ABC Diffs / Diff Testing (cashtab-tests) failed.

Failed tests logs:

====== CashTab Unit Tests: <Token /> available actions rendered We can list an SLP1 fungible token ======
TestingLibraryElementError: Unable to find an element with the text: $0.00005 USD (1.67 XEC) per token. 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-dTLGrV kEpXyh"
    >
      <div
        class="Toastify"
      />
      <div
        class="sc-ivVeuv kOEcVo"
      >
        <div
          class="sc-cCbXAZ jFBlIA"
        >
          <div
            class="sc-dRCTWM hIgwZy"
          >
            <img
              alt="cashtab"
              class="sc-cgHJcJ ihxWdP"
              src="test-file-stub"
            />
          </div>
          <div
            class="sc-jWojfa dZQEwi"
          >
            <select
              class="sc-kVrTmx fHlFGj"
              data-testid="wallet-select"
              id="wallets"
              name="wallets"
            >
              <option
                class="sc-ekkqgF hVxpfX"
                value="Token Test"
              >
                Token Test
              </option>
            </select>
            <div
              class="sc-keFjpB cYnzuo"
            >
              <button
                aria-label="Copy ecash:qqq9f9z3uhpzkxrgdjkd7dxuuey7tmpmugpmnw0kue"
                class="sc-kvZOFW liNaUH"
              >
                <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-hARARD gKKngl"
            title="Wallet Info"
          >
            <div
              class="sc-fKGOjr kazeWp"
              title="Balance in XEC"
            >
              9,970.81
               
              XEC
               
            </div>
            <div
              class="sc-jvEmr cqaueG"
              title="Balance in Local Currency"
            >
              $
              0.30
               
              USD
            </div>
            <p
              class="sc-hycgNl etEPPc"
              title="Price in Local Currency"
            >
              1 
              XEC
               = 
              0.00003000
               
              USD
            </p>
          </div>
          <div
            class="sc-bNQFlB ckqUeu"
          >
            <div
              class="sc-LKuAh cgbRuv"
            >
              111.000000000
               
              Vespene Gas
               (
              VSP
              )
            </div>
            <div
              class="sc-kZmsYB HDYdn"
              title="Token Stats"
            >
              <div
                class="sc-iSDuPN dDJLwR"
              >
                <button
                  class="sc-kxynE iJdosy"
                >
                  <img
                    alt="icon for 20a0b9337a78603c6681ed2bc541593375535dcd9979196620ce71f233f2f6f8"
                    height="128"
                    src="https://icons.etokens.cash/128/20a0b9337a78603c6681ed2bc541593375535dcd9979196620ce71f233f2f6f8.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-kvZOFW liNaUH"
                      >
                        <svg
                          title="More Info"
                        />
                      </button>
                    </div>
                  </div>
  ...
    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__/TokenActions.test.js:359:20)

Each failure log is accessible here:
CashTab Unit Tests: <Token /> available actions rendered We can list an SLP1 fungible token

bytesofman updated this revision to Diff 50951.Nov 18 2024, 23:58

patch introduced format bug

Harbormaster completed remote builds in B31200: Diff 50951.Nov 19 2024, 00:01
bytesofman updated this revision to Diff 50955.Nov 19 2024, 19:10

back out unneeded dep, remove debug log, remove ambigous todo comment

bytesofman updated this revision to Diff 50956.Nov 19 2024, 19:14

back out package-lock.json changes

Harbormaster completed remote builds in B31203: Diff 50955.Nov 19 2024, 19:15
bytesofman edited the summary of this revision. (Show Details)Nov 19 2024, 19:17
Harbormaster completed remote builds in B31204: Diff 50956.Nov 19 2024, 19:19
bytesofman published this revision for review.Nov 19 2024, 19:26
emack requested changes to this revision.Nov 21 2024, 04:16
emack added a subscriber: emack.
emack added inline comments.
cashtab/src/components/Common/Inputs.tsx
159 ↗(On Diff #50956)

what's an asdf type?

320 ↗(On Diff #50956)

assuming we don't have to worry about undefined types in ts right?

This revision now requires changes to proceed.Nov 21 2024, 04:16
bytesofman marked 2 inline comments as done.Nov 21 2024, 04:55
bytesofman added inline comments.
cashtab/src/components/Common/Inputs.tsx
320 ↗(On Diff #50956)

in this case no, as this value can't be undefined. If it can be undefined, typescript won't compile.

...at least, that's the theory.

There may be edge cases here where, say, a still-JS screen in Cashtab using this ts screen perhaps does have value as possibly undefined. But, if that is the case, then this is already a problem and will be uncovered when ts gets to that screen.

This diff isn't introducing the problem.

bytesofman updated this revision to Diff 51002.Nov 21 2024, 04:56
bytesofman marked an inline comment as done.

rebase, remove garbled type comment

Harbormaster completed remote builds in B31242: Diff 51002.Nov 21 2024, 05:00
emack accepted this revision.Nov 21 2024, 05:03
This revision is now accepted and ready to land.Nov 21 2024, 05:03
Closed by commit rABCee9d685825f4: [Cashtab] Convert Token, validation, and other deps to ts (authored by bytesofman). · Explain WhyNov 21 2024, 05:08
This revision was automatically updated to reflect the committed changes.
bytesofman added a commit: rABCee9d685825f4: [Cashtab] Convert Token, validation, and other deps to ts.
bytesofman mentioned this in D17184: [Cashtab] Patch input field border css.Nov 22 2024, 14:21
bytesofman mentioned this in rABCcb04ef4d7983: [Cashtab] Patch input field border css.Nov 22 2024, 21:47

Revision Contents
Changeset List

PathSize
cashtab/
2 lines
src/
alias/
9 lines
components/
Agora/
Collection/
2 lines
OrderBook/
8 lines
Common/
Inputs.tsx
Inputs.js
327 lines
ScanQRCode.tsx
ScanQRCode.js
78 lines
Etokens/
Token/
index.tsx
index.js
463 lines
styled.ts
styled.js
245 lines
__tests__/
5 lines
config/
13 lines
tokenBlacklist.ts
tokenBlacklist.js
30 lines
slpv1/
6 lines
validation/
index.ts
index.js
398 lines
wallet/
8 lines

Diff 50955

View Options

cashtab/package-lock.json

Loading...
View Options

cashtab/src/alias/index.ts

Loading...
View Options

cashtab/src/components/Agora/Collection/index.tsx

Loading...
View Options

cashtab/src/components/Agora/OrderBook/index.tsx

Loading...
View Options

cashtab/src/components/Common/Inputs.js

Loading...
View Options

cashtab/src/components/Common/Inputs.tsx

Loading...
View Options

cashtab/src/components/Common/ScanQRCode.js

Loading...
View Options

cashtab/src/components/Common/ScanQRCode.tsx

Loading...
View Options

cashtab/src/components/Etokens/Token/index.js

Loading...
View Options

cashtab/src/components/Etokens/Token/index.tsx

Loading...
View Options

cashtab/src/components/Etokens/Token/styled.js

Loading...
View Options

cashtab/src/components/Etokens/Token/styled.ts

Loading...
View Options

cashtab/src/components/Etokens/__tests__/TokenActions.test.js

Loading...
View Options

cashtab/src/config/CashtabSettings.ts

Loading...
View Options

cashtab/src/config/tokenBlacklist.js

Loading...
View Options

cashtab/src/config/tokenBlacklist.ts

Loading...
View Options

cashtab/src/slpv1/index.ts

Loading...
View Options

cashtab/src/validation/index.js

Loading...
View Options

cashtab/src/validation/index.ts

Loading...
View Options

cashtab/src/wallet/useWallet.ts

Loading...