orca ui v1

[turadg]

Extracted from #10 and cleaned up to pass CI

[dckc]

I expect others with more react experience could review this more quickly. Without tests, I'd have to pore over each line.

taking myself off the reviewer list.

[Jovonni]

@turadg
LGTM.

UI launches correctly, but shows a dep issue in the logs, after yarn install, mainly with something in @noble/hashes:

Trace:

 yarn dev
Port 5173 is in use, trying another one...

  VITE v5.2.7  ready in 360 ms

  ➜  Local:   http://localhost:5174/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help
✘ [ERROR] Could not resolve "@noble/hashes/sha3"

    ../node_modules/@cosmjs/proto-signing/node_modules/@cosmjs/crypto/build/keccak.js:4:23:
      4 │ const sha3_1 = require("@noble/hashes/sha3");
        ╵                        ~~~~~~~~~~~~~~~~~~~~

  The module "./sha3.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:116:17:
      116 │       "require": "./sha3.js"
          ╵                  ~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha3" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/ripemd160"

    ../node_modules/@cosmjs/proto-signing/node_modules/@cosmjs/crypto/build/ripemd.js:4:28:
      4 │ const ripemd160_1 = require("@noble/hashes/ripemd160");
        ╵                             ~~~~~~~~~~~~~~~~~~~~~~~~~

  The module "./ripemd160.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:96:17:
      96 │       "require": "./ripemd160.js"
         ╵                  ~~~~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/ripemd160" as external to exclude it from the bundle, which
  will remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha256"

    ../node_modules/@cosmjs/proto-signing/node_modules/@cosmjs/crypto/build/sha.js:4:25:
      4 │ const sha256_1 = require("@noble/hashes/sha256");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha256.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:120:17:
      120 │       "require": "./sha256.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha256" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/ripemd160"

    ../node_modules/@cosmjs/amino/node_modules/@cosmjs/crypto/build/ripemd.js:4:28:
      4 │ const ripemd160_1 = require("@noble/hashes/ripemd160");
        ╵                             ~~~~~~~~~~~~~~~~~~~~~~~~~

  The module "./ripemd160.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:96:17:
      96 │       "require": "./ripemd160.js"
         ╵                  ~~~~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/ripemd160" as external to exclude it from the bundle, which
  will remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha3"

    ../node_modules/@cosmjs/amino/node_modules/@cosmjs/crypto/build/keccak.js:4:23:
      4 │ const sha3_1 = require("@noble/hashes/sha3");
        ╵                        ~~~~~~~~~~~~~~~~~~~~

  The module "./sha3.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:116:17:
      116 │       "require": "./sha3.js"
          ╵                  ~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha3" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha256"

    ../node_modules/@cosmjs/amino/node_modules/@cosmjs/crypto/build/sha.js:4:25:
      4 │ const sha256_1 = require("@noble/hashes/sha256");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha256.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:120:17:
      120 │       "require": "./sha256.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha256" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/@cosmjs/proto-signing/node_modules/@cosmjs/crypto/build/sha.js:5:25:
      5 │ const sha512_1 = require("@noble/hashes/sha512");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/@cosmjs/amino/node_modules/@cosmjs/crypto/build/sha.js:5:25:
      5 │ const sha512_1 = require("@noble/hashes/sha512");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/pbkdf2"

    ../node_modules/@cosmjs/proto-signing/node_modules/@cosmjs/crypto/build/pbkdf2.js:28:25:
      28 │ const pbkdf2_1 = require("@noble/hashes/pbkdf2");
         ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./pbkdf2.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:92:17:
      92 │       "require": "./pbkdf2.js"
         ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/pbkdf2" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/ripemd160"

    ../node_modules/@confio/ics23/build/ops.js:4:28:
      4 │ const ripemd160_1 = require("@noble/hashes/ripemd160");
        ╵                             ~~~~~~~~~~~~~~~~~~~~~~~~~

  The module "./ripemd160.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:96:17:
      96 │       "require": "./ripemd160.js"
         ╵                  ~~~~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/ripemd160" as external to exclude it from the bundle, which
  will remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/pbkdf2"

    ../node_modules/@cosmjs/amino/node_modules/@cosmjs/crypto/build/pbkdf2.js:28:25:
      28 │ const pbkdf2_1 = require("@noble/hashes/pbkdf2");
         ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./pbkdf2.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:92:17:
      92 │       "require": "./pbkdf2.js"
         ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/pbkdf2" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/@cosmjs/proto-signing/node_modules/@cosmjs/crypto/build/pbkdf2.js:29:25:
      29 │ const sha512_1 = require("@noble/hashes/sha512");
         ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha256"

    ../node_modules/@confio/ics23/build/ops.js:5:25:
      5 │ const sha256_1 = require("@noble/hashes/sha256");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha256.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:120:17:
      120 │       "require": "./sha256.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha256" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/@cosmjs/amino/node_modules/@cosmjs/crypto/build/pbkdf2.js:29:25:
      29 │ const sha512_1 = require("@noble/hashes/sha512");
         ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/ripemd160"

    ../node_modules/@cosmos-kit/core/node_modules/@cosmjs/crypto/build/ripemd.js:4:28:
      4 │ const ripemd160_1 = require("@noble/hashes/ripemd160");
        ╵                             ~~~~~~~~~~~~~~~~~~~~~~~~~

  The module "./ripemd160.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:96:17:
      96 │       "require": "./ripemd160.js"
         ╵                  ~~~~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/ripemd160" as external to exclude it from the bundle, which
  will remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha256"

    ../node_modules/@cosmos-kit/core/node_modules/@cosmjs/crypto/build/sha.js:4:25:
      4 │ const sha256_1 = require("@noble/hashes/sha256");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha256.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:120:17:
      120 │       "require": "./sha256.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha256" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha3"

    ../node_modules/@cosmos-kit/core/node_modules/@cosmjs/crypto/build/keccak.js:4:23:
      4 │ const sha3_1 = require("@noble/hashes/sha3");
        ╵                        ~~~~~~~~~~~~~~~~~~~~

  The module "./sha3.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:116:17:
      116 │       "require": "./sha3.js"
          ╵                  ~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha3" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/@confio/ics23/build/ops.js:6:25:
      6 │ const sha512_1 = require("@noble/hashes/sha512");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/@cosmos-kit/core/node_modules/@cosmjs/crypto/build/sha.js:5:25:
      5 │ const sha512_1 = require("@noble/hashes/sha512");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha3"

    ../node_modules/@cosmjs/stargate/node_modules/@cosmjs/crypto/build/keccak.js:4:23:
      4 │ const sha3_1 = require("@noble/hashes/sha3");
        ╵                        ~~~~~~~~~~~~~~~~~~~~

  The module "./sha3.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:116:17:
      116 │       "require": "./sha3.js"
          ╵                  ~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha3" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha256"

    ../node_modules/@cosmjs/stargate/node_modules/@cosmjs/crypto/build/sha.js:4:25:
      4 │ const sha256_1 = require("@noble/hashes/sha256");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha256.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:120:17:
      120 │       "require": "./sha256.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha256" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/ripemd160"

    ../node_modules/@cosmjs/stargate/node_modules/@cosmjs/crypto/build/ripemd.js:4:28:
      4 │ const ripemd160_1 = require("@noble/hashes/ripemd160");
        ╵                             ~~~~~~~~~~~~~~~~~~~~~~~~~

  The module "./ripemd160.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:96:17:
      96 │       "require": "./ripemd160.js"
         ╵                  ~~~~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/ripemd160" as external to exclude it from the bundle, which
  will remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/pbkdf2"

    ../node_modules/@cosmos-kit/core/node_modules/@cosmjs/crypto/build/pbkdf2.js:28:25:
      28 │ const pbkdf2_1 = require("@noble/hashes/pbkdf2");
         ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./pbkdf2.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:92:17:
      92 │       "require": "./pbkdf2.js"
         ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/pbkdf2" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/@cosmos-kit/core/node_modules/@cosmjs/crypto/build/pbkdf2.js:29:25:
      29 │ const sha512_1 = require("@noble/hashes/sha512");
         ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/@cosmjs/stargate/node_modules/@cosmjs/crypto/build/sha.js:5:25:
      5 │ const sha512_1 = require("@noble/hashes/sha512");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/pbkdf2"

    ../node_modules/@cosmjs/stargate/node_modules/@cosmjs/crypto/build/pbkdf2.js:28:25:
      28 │ const pbkdf2_1 = require("@noble/hashes/pbkdf2");
         ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./pbkdf2.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:92:17:
      92 │       "require": "./pbkdf2.js"
         ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/pbkdf2" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/@cosmjs/stargate/node_modules/@cosmjs/crypto/build/pbkdf2.js:29:25:
      29 │ const sha512_1 = require("@noble/hashes/sha512");
         ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha256"

    ../node_modules/bip39/src/index.js:3:25:
      3 │ const sha256_1 = require("@noble/hashes/sha256");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha256.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:120:17:
      120 │       "require": "./sha256.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha256" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/sha512"

    ../node_modules/bip39/src/index.js:4:25:
      4 │ const sha512_1 = require("@noble/hashes/sha512");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./sha512.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:124:17:
      124 │       "require": "./sha512.js"
          ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/sha512" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/pbkdf2"

    ../node_modules/bip39/src/index.js:5:25:
      5 │ const pbkdf2_1 = require("@noble/hashes/pbkdf2");
        ╵                          ~~~~~~~~~~~~~~~~~~~~~~

  The module "./pbkdf2.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:92:17:
      92 │       "require": "./pbkdf2.js"
         ╵                  ~~~~~~~~~~~~~

  You can mark the path "@noble/hashes/pbkdf2" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

✘ [ERROR] Could not resolve "@noble/hashes/utils"

    ../node_modules/bip39/src/index.js:6:24:
      6 │ const utils_1 = require("@noble/hashes/utils");
        ╵                         ~~~~~~~~~~~~~~~~~~~~~

  The module "./utils.js" was not found on the file system:

    ../node_modules/@noble/hashes/package.json:128:17:
      128 │       "require": "./utils.js"
          ╵                  ~~~~~~~~~~~~

  You can mark the path "@noble/hashes/utils" as external to exclude it from the bundle, which will
  remove this error and leave the unresolved path in the bundle. You can also surround this
  "require" call with a try/catch block to handle this failure at run-time instead of bundle-time.

[Jovonni]

LGTM, left comment on Dependency issues with @noble/hashes, but doesn't disturb the UI -- it just shows in yarn dev logs.

🚀

[turadg]

Dependency issues with @noble/hashes

Thanks for finding. Probably something to do with the patch. If it affects behavior I may have to fork @noble/hashes to a repo with the built artifacts. Fortunately the package author said there will be a new release around the end of the month.