From 1211eb6f7efebdb3f47cc53511a0adb75b9bfd3b Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Wed, 20 Oct 2021 06:15:37 -0300
Subject: [PATCH 01/62] Enable gzip on production image

---
 nginx.conf | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/nginx.conf b/nginx.conf
index 932cfeb..78f630e 100644
--- a/nginx.conf
+++ b/nginx.conf
@@ -2,6 +2,9 @@ server {
     listen       80;
     server_name  localhost;
 
+    gzip on;
+    gzip_types application/javascript text/css;
+
     #access_log  /var/log/nginx/host.access.log  main;
 
     location /static {

From 7dac2e179e4f3285d015420316f896e585f85267 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Wed, 20 Oct 2021 11:34:35 -0300
Subject: [PATCH 02/62] Change nginx configdir layout

---
 Dockerfile                              | 2 +-
 nginx.conf => nginx/conf.d/default.conf | 0
 package.json                            | 4 ++--
 3 files changed, 3 insertions(+), 3 deletions(-)
 rename nginx.conf => nginx/conf.d/default.conf (100%)

diff --git a/Dockerfile b/Dockerfile
index e113ddb..1ceb407 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -28,7 +28,7 @@ RUN apk add jq
 COPY --from=topic0builder /topic0 /usr/share/nginx/html/topic0/
 COPY --from=fourbytesbuilder /signatures /usr/share/nginx/html/signatures/
 COPY --from=logobuilder /assets /usr/share/nginx/html/assets/
-COPY nginx.conf /etc/nginx/conf.d/default.conf
+COPY nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf
 COPY --from=builder /otterscan-build/build /usr/share/nginx/html/
 COPY --from=builder /otterscan-build/run-nginx.sh /
 WORKDIR /
diff --git a/nginx.conf b/nginx/conf.d/default.conf
similarity index 100%
rename from nginx.conf
rename to nginx/conf.d/default.conf
diff --git a/package.json b/package.json
index 3b0c375..71e9d47 100644
--- a/package.json
+++ b/package.json
@@ -52,8 +52,8 @@
     "test": "craco test",
     "eject": "react-scripts eject",
     "source-map-explorer": "source-map-explorer build/static/js/*.js",
-    "assets-start": "docker run --rm -p 3001:80 --name otterscan-assets -d -v$(pwd)/4bytes/signatures:/usr/share/nginx/html/signatures/ -v$(pwd)/trustwallet/blockchains/ethereum/assets:/usr/share/nginx/html/assets -v$(pwd)/topic0/with_parameter_names:/usr/share/nginx/html/topic0/ -v$(pwd)/nginx.conf:/etc/nginx/conf.d/default.conf nginx:1.21.1-alpine",
-    "assets-start-with-param-names": "docker run --rm -p 3001:80 --name otterscan-assets -d -v$(pwd)/4bytes/with_parameter_names:/usr/share/nginx/html/signatures/ -v$(pwd)/trustwallet/blockchains/ethereum/assets:/usr/share/nginx/html/assets -v$(pwd)/topic0/with_parameter_names:/usr/share/nginx/html/topic0/ -v$(pwd)/nginx.conf:/etc/nginx/conf.d/default.conf nginx:1.21.1-alpine",
+    "assets-start": "docker run --rm -p 3001:80 --name otterscan-assets -d -v$(pwd)/4bytes/signatures:/usr/share/nginx/html/signatures/ -v$(pwd)/trustwallet/blockchains/ethereum/assets:/usr/share/nginx/html/assets -v$(pwd)/topic0/with_parameter_names:/usr/share/nginx/html/topic0/ -v$(pwd)/nginx/conf.d/default.conf:/etc/nginx/conf.d/default.conf nginx:1.21.1-alpine",
+    "assets-start-with-param-names": "docker run --rm -p 3001:80 --name otterscan-assets -d -v$(pwd)/4bytes/with_parameter_names:/usr/share/nginx/html/signatures/ -v$(pwd)/trustwallet/blockchains/ethereum/assets:/usr/share/nginx/html/assets -v$(pwd)/topic0/with_parameter_names:/usr/share/nginx/html/topic0/ -v$(pwd)/nginx/conf.d/default.conf:/etc/nginx/conf.d/default.conf nginx:1.21.1-alpine",
     "assets-stop": "docker stop otterscan-assets",
     "docker-build": "DOCKER_BUILDKIT=1 docker build -t otterscan -f Dockerfile .",
     "docker-start": "docker run --rm -p 5000:80 --name otterscan -d otterscan",

From 656fbdcc8003c91e4631a63af1a8370eb3d5c5b0 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Wed, 20 Oct 2021 11:45:58 -0300
Subject: [PATCH 03/62] Externalize default nginx.conf from docker image to
 allow further customization

---
 Dockerfile       |  1 +
 nginx/nginx.conf | 31 +++++++++++++++++++++++++++++++
 package.json     |  4 ++--
 3 files changed, 34 insertions(+), 2 deletions(-)
 create mode 100644 nginx/nginx.conf

diff --git a/Dockerfile b/Dockerfile
index 1ceb407..8f44312 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -29,6 +29,7 @@ COPY --from=topic0builder /topic0 /usr/share/nginx/html/topic0/
 COPY --from=fourbytesbuilder /signatures /usr/share/nginx/html/signatures/
 COPY --from=logobuilder /assets /usr/share/nginx/html/assets/
 COPY nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf
+COPY nginx/nginx.conf /etc/nginx/nginx.conf
 COPY --from=builder /otterscan-build/build /usr/share/nginx/html/
 COPY --from=builder /otterscan-build/run-nginx.sh /
 WORKDIR /
diff --git a/nginx/nginx.conf b/nginx/nginx.conf
new file mode 100644
index 0000000..876db0f
--- /dev/null
+++ b/nginx/nginx.conf
@@ -0,0 +1,31 @@
+user  nginx;
+worker_processes  auto;
+
+error_log  /var/log/nginx/error.log notice;
+pid        /var/run/nginx.pid;
+
+
+events {
+    worker_connections  1024;
+}
+
+
+http {
+    include       /etc/nginx/mime.types;
+    default_type  application/octet-stream;
+
+    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
+                      '$status $body_bytes_sent "$http_referer" '
+                      '"$http_user_agent" "$http_x_forwarded_for"';
+
+    access_log  /var/log/nginx/access.log  main;
+
+    sendfile        on;
+    #tcp_nopush     on;
+
+    keepalive_timeout  65;
+
+    #gzip  on;
+
+    include /etc/nginx/conf.d/*.conf;
+}
diff --git a/package.json b/package.json
index 71e9d47..c47808d 100644
--- a/package.json
+++ b/package.json
@@ -52,8 +52,8 @@
     "test": "craco test",
     "eject": "react-scripts eject",
     "source-map-explorer": "source-map-explorer build/static/js/*.js",
-    "assets-start": "docker run --rm -p 3001:80 --name otterscan-assets -d -v$(pwd)/4bytes/signatures:/usr/share/nginx/html/signatures/ -v$(pwd)/trustwallet/blockchains/ethereum/assets:/usr/share/nginx/html/assets -v$(pwd)/topic0/with_parameter_names:/usr/share/nginx/html/topic0/ -v$(pwd)/nginx/conf.d/default.conf:/etc/nginx/conf.d/default.conf nginx:1.21.1-alpine",
-    "assets-start-with-param-names": "docker run --rm -p 3001:80 --name otterscan-assets -d -v$(pwd)/4bytes/with_parameter_names:/usr/share/nginx/html/signatures/ -v$(pwd)/trustwallet/blockchains/ethereum/assets:/usr/share/nginx/html/assets -v$(pwd)/topic0/with_parameter_names:/usr/share/nginx/html/topic0/ -v$(pwd)/nginx/conf.d/default.conf:/etc/nginx/conf.d/default.conf nginx:1.21.1-alpine",
+    "assets-start": "docker run --rm -p 3001:80 --name otterscan-assets -d -v$(pwd)/4bytes/signatures:/usr/share/nginx/html/signatures/ -v$(pwd)/trustwallet/blockchains/ethereum/assets:/usr/share/nginx/html/assets -v$(pwd)/topic0/with_parameter_names:/usr/share/nginx/html/topic0/ -v$(pwd)/nginx/nginx.conf:/etc/nginx/nginx.conf -v$(pwd)/nginx/conf.d/default.conf:/etc/nginx/conf.d/default.conf nginx:1.21.1-alpine",
+    "assets-start-with-param-names": "docker run --rm -p 3001:80 --name otterscan-assets -d -v$(pwd)/4bytes/with_parameter_names:/usr/share/nginx/html/signatures/ -v$(pwd)/trustwallet/blockchains/ethereum/assets:/usr/share/nginx/html/assets -v$(pwd)/topic0/with_parameter_names:/usr/share/nginx/html/topic0/ -v$(pwd)/nginx/nginx.conf:/etc/nginx/nginx.conf -v$(pwd)/nginx/conf.d/default.conf:/etc/nginx/conf.d/default.conf nginx:1.21.1-alpine",
     "assets-stop": "docker stop otterscan-assets",
     "docker-build": "DOCKER_BUILDKIT=1 docker build -t otterscan -f Dockerfile .",
     "docker-start": "docker run --rm -p 5000:80 --name otterscan -d otterscan",

From a8a174928829e528ab21783f372e86cee63e0993 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Wed, 20 Oct 2021 15:44:27 -0300
Subject: [PATCH 04/62] Enable gzip/brotli precompressed artifacts in the
 production docker image

---
 Dockerfile                | 65 +++++++++++++++++++++++++++++++++++++--
 nginx/conf.d/default.conf |  5 +--
 nginx/nginx.conf          |  1 +
 package-lock.json         | 38 +++++++++++++++++++++++
 package.json              |  3 +-
 5 files changed, 107 insertions(+), 5 deletions(-)

diff --git a/Dockerfile b/Dockerfile
index 8f44312..aec42e4 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -23,8 +23,69 @@ FROM alpine:3.14.0 AS topic0builder
 WORKDIR /topic0
 COPY topic0/with_parameter_names /topic0/
 
-FROM nginx:1.21.1-alpine
-RUN apk add jq
+# Add brotli module to official nginx image
+# Based on: https://github.com/nginxinc/docker-nginx/tree/master/modules
+FROM nginx:1.21.3-alpine as nginxbuilder
+
+RUN set -ex \
+    && apk update \
+    && apk add linux-headers openssl-dev pcre-dev zlib-dev openssl abuild \
+               musl-dev libxslt libxml2-utils make mercurial gcc unzip git \
+               xz g++ coreutils \
+    # allow abuild as a root user \
+    && printf "#!/bin/sh\\nSETFATTR=true /usr/bin/abuild -F \"\$@\"\\n" > /usr/local/bin/abuild \
+    && chmod +x /usr/local/bin/abuild \
+    && hg clone -r ${NGINX_VERSION}-${PKG_RELEASE} https://hg.nginx.org/pkg-oss/ \
+    && cd pkg-oss \
+    && mkdir /tmp/packages \
+    && for module in "brotli"; do \
+        echo "Building $module for nginx-$NGINX_VERSION"; \
+        if [ -d /modules/$module ]; then \
+            echo "Building $module from user-supplied sources"; \
+            # check if module sources file is there and not empty
+            if [ ! -s /modules/$module/source ]; then \
+                echo "No source file for $module in modules/$module/source, exiting"; \
+                exit 1; \
+            fi; \
+            # some modules require build dependencies
+            if [ -f /modules/$module/build-deps ]; then \
+                echo "Installing $module build dependencies"; \
+                apk update && apk add $(cat /modules/$module/build-deps | xargs); \
+            fi; \
+            # if a module has a build dependency that is not in a distro, provide a
+            # shell script to fetch/build/install those
+            # note that shared libraries produced as a result of this script will
+            # not be copied from the builder image to the main one so build static
+            if [ -x /modules/$module/prebuild ]; then \
+                echo "Running prebuild script for $module"; \
+                /modules/$module/prebuild; \
+            fi; \
+            /pkg-oss/build_module.sh -v $NGINX_VERSION -f -y -o /tmp/packages -n $module $(cat /modules/$module/source); \
+            BUILT_MODULES="$BUILT_MODULES $(echo $module | tr '[A-Z]' '[a-z]' | tr -d '[/_\-\.\t ]')"; \
+        elif make -C /pkg-oss/alpine list | grep -E "^$module\s+\d+" > /dev/null; then \
+            echo "Building $module from pkg-oss sources"; \
+            cd /pkg-oss/alpine; \
+            make abuild-module-$module BASE_VERSION=$NGINX_VERSION NGINX_VERSION=$NGINX_VERSION; \
+            apk add $(. ./abuild-module-$module/APKBUILD; echo $makedepends;); \
+            make module-$module BASE_VERSION=$NGINX_VERSION NGINX_VERSION=$NGINX_VERSION; \
+            find ~/packages -type f -name "*.apk" -exec mv -v {} /tmp/packages/ \;; \
+            BUILT_MODULES="$BUILT_MODULES $module"; \
+        else \
+            echo "Don't know how to build $module module, exiting"; \
+            exit 1; \
+        fi; \
+    done \
+    && echo "BUILT_MODULES=\"$BUILT_MODULES\"" > /tmp/packages/modules.env
+
+FROM nginx:1.21.3-alpine
+COPY --from=nginxbuilder /tmp/packages /tmp/packages
+RUN set -ex \
+    && . /tmp/packages/modules.env \
+    && for module in $BUILT_MODULES; do \
+           apk add --no-cache --allow-untrusted /tmp/packages/nginx-module-${module}-${NGINX_VERSION}*.apk; \
+       done \
+    && rm -rf /tmp/packages
+RUN apk update && apk add jq
 COPY --from=topic0builder /topic0 /usr/share/nginx/html/topic0/
 COPY --from=fourbytesbuilder /signatures /usr/share/nginx/html/signatures/
 COPY --from=logobuilder /assets /usr/share/nginx/html/assets/
diff --git a/nginx/conf.d/default.conf b/nginx/conf.d/default.conf
index 78f630e..b5d141b 100644
--- a/nginx/conf.d/default.conf
+++ b/nginx/conf.d/default.conf
@@ -2,8 +2,7 @@ server {
     listen       80;
     server_name  localhost;
 
-    gzip on;
-    gzip_types application/javascript text/css;
+    gzip_static on;
 
     #access_log  /var/log/nginx/host.access.log  main;
 
@@ -118,6 +117,8 @@ server {
         root   /usr/share/nginx/html;
         index  index.html;
         try_files $uri /index.html;
+
+        brotli_static on;
     }
 
     #error_page  404              /404.html;
diff --git a/nginx/nginx.conf b/nginx/nginx.conf
index 876db0f..7364514 100644
--- a/nginx/nginx.conf
+++ b/nginx/nginx.conf
@@ -4,6 +4,7 @@ worker_processes  auto;
 error_log  /var/log/nginx/error.log notice;
 pid        /var/run/nginx.pid;
 
+load_module modules/ngx_http_brotli_static_module.so;
 
 events {
     worker_connections  1024;
diff --git a/package-lock.json b/package-lock.json
index 178efba..380547a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -53,6 +53,7 @@
       },
       "devDependencies": {
         "autoprefixer": "^9.8.8",
+        "compress-create-react-app": "^1.1.3",
         "postcss": "^7.0.39",
         "source-map-explorer": "^2.5.2",
         "tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.2.6"
@@ -3910,6 +3911,15 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/app-root-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/app-root-path/-/app-root-path-3.0.0.tgz",
+      "integrity": "sha512-qMcx+Gy2UZynHjOHOIXPNvpf+9cjvk3cWrBBK7zg4gH9+clobJRb9NGzcT7mQTcV/6Gm/1WelUtqxVXnNlrwcw==",
+      "dev": true,
+      "engines": {
+        "node": ">= 6.0.0"
+      }
+    },
     "node_modules/aproba": {
       "version": "1.2.0",
       "license": "ISC"
@@ -5969,6 +5979,19 @@
         "arity-n": "^1.0.4"
       }
     },
+    "node_modules/compress-create-react-app": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/compress-create-react-app/-/compress-create-react-app-1.1.3.tgz",
+      "integrity": "sha512-3HCWi9q7TqxBvklmJY/Pm96Fs8wqEXxduW3LGlK0PUYuezZwKkjB454GjyGhjKmxKpl91Q9b2+ZjXeKdNOIhlA==",
+      "dev": true,
+      "dependencies": {
+        "app-root-path": "^3.0.0"
+      },
+      "bin": {
+        "compress-cra": "index.js",
+        "compress-create-react-app": "index.js"
+      }
+    },
     "node_modules/compressible": {
       "version": "2.0.18",
       "license": "MIT",
@@ -22192,6 +22215,12 @@
         }
       }
     },
+    "app-root-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/app-root-path/-/app-root-path-3.0.0.tgz",
+      "integrity": "sha512-qMcx+Gy2UZynHjOHOIXPNvpf+9cjvk3cWrBBK7zg4gH9+clobJRb9NGzcT7mQTcV/6Gm/1WelUtqxVXnNlrwcw==",
+      "dev": true
+    },
     "aproba": {
       "version": "1.2.0"
     },
@@ -23645,6 +23674,15 @@
         "arity-n": "^1.0.4"
       }
     },
+    "compress-create-react-app": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/compress-create-react-app/-/compress-create-react-app-1.1.3.tgz",
+      "integrity": "sha512-3HCWi9q7TqxBvklmJY/Pm96Fs8wqEXxduW3LGlK0PUYuezZwKkjB454GjyGhjKmxKpl91Q9b2+ZjXeKdNOIhlA==",
+      "dev": true,
+      "requires": {
+        "app-root-path": "^3.0.0"
+      }
+    },
     "compressible": {
       "version": "2.0.18",
       "requires": {
diff --git a/package.json b/package.json
index c47808d..152fe75 100644
--- a/package.json
+++ b/package.json
@@ -48,7 +48,7 @@
   },
   "scripts": {
     "start": "craco start",
-    "build": "craco build",
+    "build": "craco build && compress-cra",
     "test": "craco test",
     "eject": "react-scripts eject",
     "source-map-explorer": "source-map-explorer build/static/js/*.js",
@@ -79,6 +79,7 @@
   },
   "devDependencies": {
     "autoprefixer": "^9.8.8",
+    "compress-create-react-app": "^1.1.3",
     "postcss": "^7.0.39",
     "source-map-explorer": "^2.5.2",
     "tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.2.6"

From d3c8e3c1123afc8c9b15df31c66c6a4c28b9b4b3 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Wed, 20 Oct 2021 18:53:48 +0000
Subject: [PATCH 05/62] Bump @types/react-dom from 17.0.9 to 17.0.10 (#100)

---
 package-lock.json | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 380547a..b0591a9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -29,7 +29,7 @@
         "@types/node": "^14.17.5",
         "@types/react": "^17.0.30",
         "@types/react-blockies": "^1.4.1",
-        "@types/react-dom": "^17.0.9",
+        "@types/react-dom": "^17.0.10",
         "@types/react-highlight": "^0.12.5",
         "@types/react-router-dom": "^5.3.1",
         "@types/react-syntax-highlighter": "^13.5.2",
@@ -3109,9 +3109,9 @@
       }
     },
     "node_modules/@types/react-dom": {
-      "version": "17.0.9",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.9.tgz",
-      "integrity": "sha512-wIvGxLfgpVDSAMH5utdL9Ngm5Owu0VsGmldro3ORLXV8CShrL8awVj06NuEXFQ5xyaYfdca7Sgbk/50Ri1GdPg==",
+      "version": "17.0.10",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.10.tgz",
+      "integrity": "sha512-8oz3NAUId2z/zQdFI09IMhQPNgIbiP8Lslhv39DIDamr846/0spjZK0vnrMak0iB8EKb9QFTTIdg2Wj2zH5a3g==",
       "dependencies": {
         "@types/react": "*"
       }
@@ -21660,9 +21660,9 @@
       }
     },
     "@types/react-dom": {
-      "version": "17.0.9",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.9.tgz",
-      "integrity": "sha512-wIvGxLfgpVDSAMH5utdL9Ngm5Owu0VsGmldro3ORLXV8CShrL8awVj06NuEXFQ5xyaYfdca7Sgbk/50Ri1GdPg==",
+      "version": "17.0.10",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.10.tgz",
+      "integrity": "sha512-8oz3NAUId2z/zQdFI09IMhQPNgIbiP8Lslhv39DIDamr846/0spjZK0vnrMak0iB8EKb9QFTTIdg2Wj2zH5a3g==",
       "requires": {
         "@types/react": "*"
       }
diff --git a/package.json b/package.json
index 152fe75..ace8c5b 100644
--- a/package.json
+++ b/package.json
@@ -24,7 +24,7 @@
     "@types/node": "^14.17.5",
     "@types/react": "^17.0.30",
     "@types/react-blockies": "^1.4.1",
-    "@types/react-dom": "^17.0.9",
+    "@types/react-dom": "^17.0.10",
     "@types/react-highlight": "^0.12.5",
     "@types/react-router-dom": "^5.3.1",
     "@types/react-syntax-highlighter": "^13.5.2",

From b6bc6498f9ffd7f16f96f98e79ab4440bf20f1ff Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Wed, 20 Oct 2021 18:55:14 +0000
Subject: [PATCH 06/62] Bump react-chartjs-2 from 3.0.5 to 3.1.1 (#98)

---
 package-lock.json | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index b0591a9..8800b07 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -39,7 +39,7 @@
         "query-string": "^7.0.1",
         "react": "^17.0.2",
         "react-blockies": "^1.4.1",
-        "react-chartjs-2": "^3.0.5",
+        "react-chartjs-2": "^3.1.1",
         "react-dom": "^17.0.2",
         "react-error-boundary": "^3.1.3",
         "react-image": "^4.0.3",
@@ -14409,9 +14409,9 @@
       }
     },
     "node_modules/react-chartjs-2": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.0.5.tgz",
-      "integrity": "sha512-fYr4E82agaZi9IFMe5GtOZ6WE/HWdxy/KywLNOzXsqgPkD2oo1IlrQLKMLUki/2UXko3p95TR2L8Q2rEss/opQ==",
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.1.1.tgz",
+      "integrity": "sha512-6CTAXsQbxTuTS9rOjgNWsLygAir9+IXC2B9O3TlgO0qSeBqyMxd4qTMW0HBZ0Id18nYUR+nCou3JHUyyst6BFw==",
       "dependencies": {
         "lodash": "^4.17.19"
       },
@@ -29262,9 +29262,9 @@
       }
     },
     "react-chartjs-2": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.0.5.tgz",
-      "integrity": "sha512-fYr4E82agaZi9IFMe5GtOZ6WE/HWdxy/KywLNOzXsqgPkD2oo1IlrQLKMLUki/2UXko3p95TR2L8Q2rEss/opQ==",
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.1.1.tgz",
+      "integrity": "sha512-6CTAXsQbxTuTS9rOjgNWsLygAir9+IXC2B9O3TlgO0qSeBqyMxd4qTMW0HBZ0Id18nYUR+nCou3JHUyyst6BFw==",
       "requires": {
         "lodash": "^4.17.19"
       }
diff --git a/package.json b/package.json
index ace8c5b..0c91d4f 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
     "query-string": "^7.0.1",
     "react": "^17.0.2",
     "react-blockies": "^1.4.1",
-    "react-chartjs-2": "^3.0.5",
+    "react-chartjs-2": "^3.1.1",
     "react-dom": "^17.0.2",
     "react-error-boundary": "^3.1.3",
     "react-image": "^4.0.3",

From b21c10ab0bb46f404c2183624b3b0831c5c749df Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Wed, 20 Oct 2021 16:10:00 -0300
Subject: [PATCH 07/62] Fix typings after react-chart-js upgrade

---
 src/special/london/chart.ts | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/special/london/chart.ts b/src/special/london/chart.ts
index 8c57fdf..cb64508 100644
--- a/src/special/london/chart.ts
+++ b/src/special/london/chart.ts
@@ -2,7 +2,7 @@ import { commify } from "@ethersproject/units";
 import { ChartData, ChartOptions } from "chart.js";
 import { ExtendedBlock } from "../../useErigonHooks";
 
-export const burntFeesChartOptions: ChartOptions = {
+export const burntFeesChartOptions: ChartOptions<"line"> = {
   animation: false,
   plugins: {
     legend: {
@@ -45,7 +45,9 @@ export const burntFeesChartOptions: ChartOptions = {
   },
 };
 
-export const burntFeesChartData = (blocks: ExtendedBlock[]): ChartData => ({
+export const burntFeesChartData = (
+  blocks: ExtendedBlock[]
+): ChartData<"line"> => ({
   labels: blocks.map((b) => b.number.toString()).reverse(),
   datasets: [
     {
@@ -68,7 +70,7 @@ export const burntFeesChartData = (blocks: ExtendedBlock[]): ChartData => ({
   ],
 });
 
-export const gasChartOptions: ChartOptions = {
+export const gasChartOptions: ChartOptions<"line"> = {
   animation: false,
   interaction: {
     mode: "index",
@@ -112,7 +114,7 @@ export const gasChartOptions: ChartOptions = {
   },
 };
 
-export const gasChartData = (blocks: ExtendedBlock[]): ChartData => ({
+export const gasChartData = (blocks: ExtendedBlock[]): ChartData<"line"> => ({
   labels: blocks.map((b) => b.number.toString()).reverse(),
   datasets: [
     {
@@ -148,7 +150,7 @@ export const gasChartData = (blocks: ExtendedBlock[]): ChartData => ({
       borderColor: "#B91C1CF0",
       tension: 0.2,
       pointStyle: "crossRot",
-      radius: 5,
+      pointRadius: 5,
     },
     {
       label: "Base fee (wei)",

From 1bdae1569a2a0a0e6c809bf013b612fd246eedba Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Wed, 20 Oct 2021 19:23:10 -0300
Subject: [PATCH 08/62] Allow highlight.js tree shaking; reduced production
 bundle size

---
 src/address/ABI.tsx      |  7 +------
 src/address/Contract.tsx |  7 +------
 src/highlight-init.ts    | 14 ++++++++++++++
 3 files changed, 16 insertions(+), 12 deletions(-)
 create mode 100644 src/highlight-init.ts

diff --git a/src/address/ABI.tsx b/src/address/ABI.tsx
index 7190f4e..a714367 100644
--- a/src/address/ABI.tsx
+++ b/src/address/ABI.tsx
@@ -1,10 +1,5 @@
 import React from "react";
-import { Light as SyntaxHighlighter } from "react-syntax-highlighter";
-import hljs from "highlight.js";
-import docco from "react-syntax-highlighter/dist/esm/styles/hljs/docco";
-
-import hljsDefineSolidity from "highlightjs-solidity";
-hljsDefineSolidity(hljs);
+import { SyntaxHighlighter, docco } from "../highlight-init";
 
 type ABIProps = {
   abi: any[];
diff --git a/src/address/Contract.tsx b/src/address/Contract.tsx
index 7ddfe56..5432f51 100644
--- a/src/address/Contract.tsx
+++ b/src/address/Contract.tsx
@@ -1,12 +1,7 @@
 import React from "react";
-import { Light as SyntaxHighlighter } from "react-syntax-highlighter";
-import hljs from "highlight.js";
-import docco from "react-syntax-highlighter/dist/esm/styles/hljs/docco";
+import { SyntaxHighlighter, docco } from "../highlight-init";
 import { useContract } from "../useSourcify";
-
-import hljsDefineSolidity from "highlightjs-solidity";
 import { useAppConfigContext } from "../useAppConfig";
-hljsDefineSolidity(hljs);
 
 type ContractProps = {
   checksummedAddress: string;
diff --git a/src/highlight-init.ts b/src/highlight-init.ts
new file mode 100644
index 0000000..f8318eb
--- /dev/null
+++ b/src/highlight-init.ts
@@ -0,0 +1,14 @@
+import { Light as SyntaxHighlighter } from "react-syntax-highlighter";
+
+// @ts-ignore
+import hljs from "highlight.js/lib/core";
+
+// @ts-ignore
+import json from "highlight.js/lib/languages/json";
+import docco from "react-syntax-highlighter/dist/esm/styles/hljs/docco";
+
+import hljsDefineSolidity from "highlightjs-solidity";
+hljsDefineSolidity(hljs);
+hljs.registerLanguage("json", json);
+
+export { SyntaxHighlighter, docco };

From a6b0201f44a722f031d6aad654338a02ba2d6309 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Thu, 21 Oct 2021 04:10:49 -0300
Subject: [PATCH 09/62] Lazy load CameraScanner component

---
 src/Home.tsx  | 3 ++-
 src/Title.tsx | 3 ++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/Home.tsx b/src/Home.tsx
index 650c86c..04824ce 100644
--- a/src/Home.tsx
+++ b/src/Home.tsx
@@ -5,12 +5,13 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faBurn } from "@fortawesome/free-solid-svg-icons/faBurn";
 import { faQrcode } from "@fortawesome/free-solid-svg-icons/faQrcode";
 import Logo from "./Logo";
-import CameraScanner from "./search/CameraScanner";
 import Timestamp from "./components/Timestamp";
 import { RuntimeContext } from "./useRuntime";
 import { useLatestBlock } from "./useLatestBlock";
 import { blockURL } from "./url";
 
+const CameraScanner = React.lazy(() => import("./search/CameraScanner"));
+
 const Home: React.FC = () => {
   const { provider } = useContext(RuntimeContext);
   const [search, setSearch] = useState<string>();
diff --git a/src/Title.tsx b/src/Title.tsx
index e4c5f47..e132443 100644
--- a/src/Title.tsx
+++ b/src/Title.tsx
@@ -4,10 +4,11 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faQrcode } from "@fortawesome/free-solid-svg-icons/faQrcode";
 import useKeyboardShortcut from "use-keyboard-shortcut";
 import PriceBox from "./PriceBox";
-import CameraScanner from "./search/CameraScanner";
 import SourcifyMenu from "./SourcifyMenu";
 import { RuntimeContext } from "./useRuntime";
 
+const CameraScanner = React.lazy(() => import("./search/CameraScanner"));
+
 const Title: React.FC = () => {
   const { provider } = useContext(RuntimeContext);
   const [search, setSearch] = useState<string>();

From 3ff4b0e65e7f12dd314e015eb095dd754fa8b643 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Thu, 21 Oct 2021 04:31:37 -0300
Subject: [PATCH 10/62] Lazy load London dashboard

---
 src/App.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/App.tsx b/src/App.tsx
index 648c58f..e11a960 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -5,7 +5,6 @@ import Home from "./Home";
 import Search from "./Search";
 import Title from "./Title";
 import ConnectionErrorPanel from "./ConnectionErrorPanel";
-import London from "./special/london/London";
 import Footer from "./Footer";
 import { ConnectionStatus } from "./types";
 import { RuntimeContext, useRuntime } from "./useRuntime";
@@ -16,6 +15,7 @@ const Block = React.lazy(() => import("./Block"));
 const BlockTransactions = React.lazy(() => import("./BlockTransactions"));
 const AddressTransactions = React.lazy(() => import("./AddressTransactions"));
 const Transaction = React.lazy(() => import("./Transaction"));
+const London = React.lazy(() => import("./special/london/London"));
 
 const App = () => {
   const runtime = useRuntime();

From 1d044cee85ab43ef826a4297bcdbfb1b0f2dc0a9 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Thu, 21 Oct 2021 18:25:57 -0300
Subject: [PATCH 11/62] Using import for image

---
 src/AddressTransactions.tsx  |   3 ++-
 src/Logo.tsx                 |   3 ++-
 src/Title.tsx                |   3 ++-
 {public => src}/otter.jpg    | Bin
 {public => src}/sourcify.svg |   0
 5 files changed, 6 insertions(+), 3 deletions(-)
 rename {public => src}/otter.jpg (100%)
 rename {public => src}/sourcify.svg (100%)

diff --git a/src/AddressTransactions.tsx b/src/AddressTransactions.tsx
index 6baead0..53f92bf 100644
--- a/src/AddressTransactions.tsx
+++ b/src/AddressTransactions.tsx
@@ -32,6 +32,7 @@ import { SelectionContext, useSelection } from "./useSelection";
 import { useMultipleETHUSDOracle } from "./usePriceOracle";
 import { useAppConfigContext } from "./useAppConfig";
 import { useSourcify } from "./useSourcify";
+import SourcifyLogo from "./sourcify.svg";
 
 type BlockParams = {
   addressOrName: string;
@@ -240,7 +241,7 @@ const AddressTransactions: React.FC = () => {
                     ) : (
                       <span className="self-center text-green-500">
                         <img
-                          src="/sourcify.svg"
+                          src={SourcifyLogo}
                           alt="Sourcify logo"
                           title="Verified by Sourcify"
                           width={16}
diff --git a/src/Logo.tsx b/src/Logo.tsx
index 905ee2c..eb31768 100644
--- a/src/Logo.tsx
+++ b/src/Logo.tsx
@@ -1,10 +1,11 @@
 import React from "react";
+import Otter from "./otter.jpg";
 
 const Logo: React.FC = () => (
   <div className="mx-auto mb-16 text-6xl text-link-blue font-title font-bold cursor-default flex items-center space-x-4">
     <img
       className="rounded-full"
-      src="/otter.jpg"
+      src={Otter}
       width={96}
       height={96}
       alt="An otter scanning"
diff --git a/src/Title.tsx b/src/Title.tsx
index e132443..e1e9b8e 100644
--- a/src/Title.tsx
+++ b/src/Title.tsx
@@ -6,6 +6,7 @@ import useKeyboardShortcut from "use-keyboard-shortcut";
 import PriceBox from "./PriceBox";
 import SourcifyMenu from "./SourcifyMenu";
 import { RuntimeContext } from "./useRuntime";
+import Otter from "./otter.jpg";
 
 const CameraScanner = React.lazy(() => import("./search/CameraScanner"));
 
@@ -44,7 +45,7 @@ const Title: React.FC = () => {
           <div className="text-2xl text-link-blue font-title font-bold flex items-center space-x-2">
             <img
               className="rounded-full"
-              src="/otter.jpg"
+              src={Otter}
               width={32}
               height={32}
               alt="An otter scanning"
diff --git a/public/otter.jpg b/src/otter.jpg
similarity index 100%
rename from public/otter.jpg
rename to src/otter.jpg
diff --git a/public/sourcify.svg b/src/sourcify.svg
similarity index 100%
rename from public/sourcify.svg
rename to src/sourcify.svg

From a6109754b419d4160ef6ec890ea74835dbc6b039 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Fri, 22 Oct 2021 09:29:54 -0300
Subject: [PATCH 12/62] Fix home screen flickering

---
 src/Home.tsx | 15 ++++++++++-----
 src/Logo.tsx |  2 +-
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/Home.tsx b/src/Home.tsx
index 04824ce..dc79748 100644
--- a/src/Home.tsx
+++ b/src/Home.tsx
@@ -38,9 +38,11 @@ const Home: React.FC = () => {
   document.title = "Home | Otterscan";
 
   return (
-    <div className="m-auto">
+    <div className="mx-auto flex flex-col h-full">
       {isScanning && <CameraScanner turnOffScan={() => setScanning(false)} />}
-      <Logo />
+      <div className="m-5 mb-10 flex items-end flex-grow max-h-72">
+        <Logo />
+      </div>
       <form
         className="flex flex-col"
         onSubmit={handleSubmit}
@@ -71,7 +73,9 @@ const Home: React.FC = () => {
         >
           Search
         </button>
-        <div className="mx-auto mt-5 mb-5 text-lg text-link-blue hover:text-link-blue-hover font-bold">
+      </form>
+      <div className="mx-auto h-32">
+        <div className="text-lg text-link-blue hover:text-link-blue-hover font-bold">
           <NavLink to="/special/london">
             <div className="flex space-x-2 items-baseline text-orange-500 hover:text-orange-700 hover:underline">
               <span>
@@ -86,14 +90,15 @@ const Home: React.FC = () => {
         </div>
         {latestBlock && (
           <NavLink
-            className="mx-auto flex flex-col items-center space-y-1 mt-5 text-sm text-gray-500 hover:text-link-blue"
+            className="flex flex-col items-center space-y-1 mt-5 text-sm text-gray-500 hover:text-link-blue"
             to={blockURL(latestBlock.number)}
           >
             <div>Latest block: {commify(latestBlock.number)}</div>
             <Timestamp value={latestBlock.timestamp} />
           </NavLink>
         )}
-      </form>
+      </div>
+      <div className="flex-grow pb-5"></div>
     </div>
   );
 };
diff --git a/src/Logo.tsx b/src/Logo.tsx
index eb31768..3671e42 100644
--- a/src/Logo.tsx
+++ b/src/Logo.tsx
@@ -2,7 +2,7 @@ import React from "react";
 import Otter from "./otter.jpg";
 
 const Logo: React.FC = () => (
-  <div className="mx-auto mb-16 text-6xl text-link-blue font-title font-bold cursor-default flex items-center space-x-4">
+  <div className="mx-auto text-6xl text-link-blue font-title font-bold cursor-default flex items-center space-x-4">
     <img
       className="rounded-full"
       src={Otter}

From f62f41759f4a2bcb49e7c8c4737ee8170d1d4154 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Fri, 22 Oct 2021 15:08:46 -0300
Subject: [PATCH 13/62] Fix missing bottom padding grow

---
 src/App.tsx           | 28 +++++++++++++---------------
 src/StandardFrame.tsx |  2 +-
 2 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index e11a960..9c7c1fe 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -53,21 +53,19 @@ const App = () => {
                 </Route>
                 <Route>
                   <AppConfigContext.Provider value={appConfig}>
-                    <div className="mb-auto">
-                      <Title />
-                      <Route path="/block/:blockNumberOrHash" exact>
-                        <Block />
-                      </Route>
-                      <Route path="/block/:blockNumber/txs" exact>
-                        <BlockTransactions />
-                      </Route>
-                      <Route path="/tx/:txhash">
-                        <Transaction />
-                      </Route>
-                      <Route path="/address/:addressOrName/:direction?">
-                        <AddressTransactions />
-                      </Route>
-                    </div>
+                    <Title />
+                    <Route path="/block/:blockNumberOrHash" exact>
+                      <Block />
+                    </Route>
+                    <Route path="/block/:blockNumber/txs" exact>
+                      <BlockTransactions />
+                    </Route>
+                    <Route path="/tx/:txhash">
+                      <Transaction />
+                    </Route>
+                    <Route path="/address/:addressOrName/:direction?">
+                      <AddressTransactions />
+                    </Route>
                   </AppConfigContext.Provider>
                 </Route>
               </Switch>
diff --git a/src/StandardFrame.tsx b/src/StandardFrame.tsx
index 65fc076..10b5fe8 100644
--- a/src/StandardFrame.tsx
+++ b/src/StandardFrame.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 
 const StandardFrame: React.FC = ({ children }) => (
-  <div className="bg-gray-100 px-9 pt-3 pb-12">{children}</div>
+  <div className="flex-grow bg-gray-100 px-9 pt-3 pb-12">{children}</div>
 );
 
 export default StandardFrame;

From c1725e5dea5819a9274de68d9211d7229acc2132 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Fri, 22 Oct 2021 18:15:51 +0000
Subject: [PATCH 14/62] Bump @types/react from 17.0.30 to 17.0.31 (#101)

---
 package-lock.json | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 8800b07..1a17bb1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,7 +27,7 @@
         "@testing-library/user-event": "^12.1.10",
         "@types/jest": "^26.0.24",
         "@types/node": "^14.17.5",
-        "@types/react": "^17.0.30",
+        "@types/react": "^17.0.31",
         "@types/react-blockies": "^1.4.1",
         "@types/react-dom": "^17.0.10",
         "@types/react-highlight": "^0.12.5",
@@ -3091,9 +3091,9 @@
       "license": "MIT"
     },
     "node_modules/@types/react": {
-      "version": "17.0.30",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.30.tgz",
-      "integrity": "sha512-3Dt/A8gd3TCXi2aRe84y7cK1K8G+N9CZRDG8kDGguOKa0kf/ZkSwTmVIDPsm/KbQOVMaDJXwhBtuOXxqwdpWVg==",
+      "version": "17.0.31",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.31.tgz",
+      "integrity": "sha512-MQSR5EL4JZtdWRvqDgz9kXhSDDoy2zMTYyg7UhP+FZ5ttUOocWyxiqFJiI57sUG0BtaEX7WDXYQlkCYkb3X9vQ==",
       "dependencies": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
@@ -21642,9 +21642,9 @@
       "version": "1.5.4"
     },
     "@types/react": {
-      "version": "17.0.30",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.30.tgz",
-      "integrity": "sha512-3Dt/A8gd3TCXi2aRe84y7cK1K8G+N9CZRDG8kDGguOKa0kf/ZkSwTmVIDPsm/KbQOVMaDJXwhBtuOXxqwdpWVg==",
+      "version": "17.0.31",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.31.tgz",
+      "integrity": "sha512-MQSR5EL4JZtdWRvqDgz9kXhSDDoy2zMTYyg7UhP+FZ5ttUOocWyxiqFJiI57sUG0BtaEX7WDXYQlkCYkb3X9vQ==",
       "requires": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
diff --git a/package.json b/package.json
index 0c91d4f..2cdf8e7 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
     "@testing-library/user-event": "^12.1.10",
     "@types/jest": "^26.0.24",
     "@types/node": "^14.17.5",
-    "@types/react": "^17.0.30",
+    "@types/react": "^17.0.31",
     "@types/react-blockies": "^1.4.1",
     "@types/react-dom": "^17.0.10",
     "@types/react-highlight": "^0.12.5",

From f459f4c20cb3b556fd27e4b3c7d5aebc3adbdba0 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Fri, 22 Oct 2021 18:23:35 +0000
Subject: [PATCH 15/62] Bump react-chartjs-2 from 3.1.1 to 3.2.0 (#102)

---
 package-lock.json | 21 ++++++++-------------
 package.json      |  2 +-
 2 files changed, 9 insertions(+), 14 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 1a17bb1..e796d9d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -39,7 +39,7 @@
         "query-string": "^7.0.1",
         "react": "^17.0.2",
         "react-blockies": "^1.4.1",
-        "react-chartjs-2": "^3.1.1",
+        "react-chartjs-2": "^3.2.0",
         "react-dom": "^17.0.2",
         "react-error-boundary": "^3.1.3",
         "react-image": "^4.0.3",
@@ -14409,12 +14409,9 @@
       }
     },
     "node_modules/react-chartjs-2": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.1.1.tgz",
-      "integrity": "sha512-6CTAXsQbxTuTS9rOjgNWsLygAir9+IXC2B9O3TlgO0qSeBqyMxd4qTMW0HBZ0Id18nYUR+nCou3JHUyyst6BFw==",
-      "dependencies": {
-        "lodash": "^4.17.19"
-      },
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.2.0.tgz",
+      "integrity": "sha512-UFedkfhOriqyslqYMrdK225TdxFq6YSmGJVQplLC37eoKBfbpkJHxVq+SPMpoVY2oV9fx33RrD4Obv0wKZtclw==",
       "peerDependencies": {
         "chart.js": "^3.5.0",
         "react": "^16.8.0 || ^17.0.0"
@@ -29262,12 +29259,10 @@
       }
     },
     "react-chartjs-2": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.1.1.tgz",
-      "integrity": "sha512-6CTAXsQbxTuTS9rOjgNWsLygAir9+IXC2B9O3TlgO0qSeBqyMxd4qTMW0HBZ0Id18nYUR+nCou3JHUyyst6BFw==",
-      "requires": {
-        "lodash": "^4.17.19"
-      }
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.2.0.tgz",
+      "integrity": "sha512-UFedkfhOriqyslqYMrdK225TdxFq6YSmGJVQplLC37eoKBfbpkJHxVq+SPMpoVY2oV9fx33RrD4Obv0wKZtclw==",
+      "requires": {}
     },
     "react-dev-utils": {
       "version": "11.0.4",
diff --git a/package.json b/package.json
index 2cdf8e7..ff9c698 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
     "query-string": "^7.0.1",
     "react": "^17.0.2",
     "react-blockies": "^1.4.1",
-    "react-chartjs-2": "^3.1.1",
+    "react-chartjs-2": "^3.2.0",
     "react-dom": "^17.0.2",
     "react-error-boundary": "^3.1.3",
     "react-image": "^4.0.3",

From e99e5c35eacd12b9abd269f7f872f30c2f9b5144 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Fri, 22 Oct 2021 15:50:31 -0300
Subject: [PATCH 16/62] Add memoization

---
 src/components/AddressHighlighter.tsx | 17 ++++++++++-------
 src/useSelection.ts                   | 26 ++++++++++++++++----------
 2 files changed, 26 insertions(+), 17 deletions(-)

diff --git a/src/components/AddressHighlighter.tsx b/src/components/AddressHighlighter.tsx
index 1b7df0d..e8078d6 100644
--- a/src/components/AddressHighlighter.tsx
+++ b/src/components/AddressHighlighter.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useMemo } from "react";
 import { useSelectionContext } from "../useSelection";
 
 type AddressHighlighterProps = React.PropsWithChildren<{
@@ -10,12 +10,15 @@ const AddressHighlighter: React.FC<AddressHighlighterProps> = ({
   children,
 }) => {
   const [selection, setSelection] = useSelectionContext();
-  const select = () => {
-    setSelection({ type: "address", content: address });
-  };
-  const deselect = () => {
-    setSelection(null);
-  };
+  const [select, deselect] = useMemo(() => {
+    const _select = () => {
+      setSelection({ type: "address", content: address });
+    };
+    const _deselect = () => {
+      setSelection(null);
+    };
+    return [_select, _deselect];
+  }, [setSelection, address]);
 
   return (
     <div
diff --git a/src/useSelection.ts b/src/useSelection.ts
index b34dc81..03a2a92 100644
--- a/src/useSelection.ts
+++ b/src/useSelection.ts
@@ -1,23 +1,29 @@
-import React, { useState, useContext } from "react";
+import {
+  Dispatch,
+  SetStateAction,
+  createContext,
+  useState,
+  useContext,
+} from "react";
 
 export type Selection = {
   type: "address" | "value";
   content: string;
 };
 
+type OptionalSelection = Selection | null;
+
 export const useSelection = (): [
-  Selection | null,
-  React.Dispatch<React.SetStateAction<Selection | null>>
+  OptionalSelection,
+  Dispatch<SetStateAction<OptionalSelection>>
 ] => {
-  const [selection, setSelection] = useState<Selection | null>(null);
-  return [selection, setSelection];
+  return useState<OptionalSelection>(null);
 };
 
-export const SelectionContext = React.createContext<
-  ReturnType<typeof useSelection>
->(null!);
+export const SelectionContext = createContext<ReturnType<typeof useSelection>>(
+  null!
+);
 
 export const useSelectionContext = () => {
-  const ctx = useContext(SelectionContext);
-  return ctx;
+  return useContext(SelectionContext);
 };

From 4671197846ace482b7ac966599037ba086d93f8f Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Fri, 22 Oct 2021 15:59:45 -0300
Subject: [PATCH 17/62] Remove Sourcify integration method: local snapshot

---
 src/SourcifyMenu.tsx | 8 --------
 src/url.ts           | 7 ++-----
 2 files changed, 2 insertions(+), 13 deletions(-)

diff --git a/src/SourcifyMenu.tsx b/src/SourcifyMenu.tsx
index 36f43a5..7c614f0 100644
--- a/src/SourcifyMenu.tsx
+++ b/src/SourcifyMenu.tsx
@@ -30,14 +30,6 @@ const SourcifyMenu: React.FC = () => {
           >
             Sourcify Servers
           </SourcifyMenuItem>
-          <SourcifyMenuItem
-            checked={sourcifySource === SourcifySource.CUSTOM_SNAPSHOT_SERVER}
-            onClick={() =>
-              setSourcifySource(SourcifySource.CUSTOM_SNAPSHOT_SERVER)
-            }
-          >
-            Local Snapshot
-          </SourcifyMenuItem>
         </Menu.Items>
       </div>
     </Menu>
diff --git a/src/url.ts b/src/url.ts
index a229fd1..4639738 100644
--- a/src/url.ts
+++ b/src/url.ts
@@ -23,16 +23,12 @@ export enum SourcifySource {
 
   // Centralized Sourcify servers
   CENTRAL_SERVER,
-
-  // Snapshot server
-  CUSTOM_SNAPSHOT_SERVER,
 }
 
 const sourcifyIPNS =
   "k51qzi5uqu5dll0ocge71eudqnrgnogmbr37gsgl12uubsinphjoknl6bbi41p";
 const defaultIpfsGatewayPrefix = `https://ipfs.io/ipns/${sourcifyIPNS}`;
 const sourcifyHttpRepoPrefix = `https://repo.sourcify.dev`;
-const snapshotPrefix = "http://localhost:3006";
 
 const resolveSourcifySource = (source: SourcifySource) => {
   if (source === SourcifySource.IPFS_IPNS) {
@@ -41,7 +37,8 @@ const resolveSourcifySource = (source: SourcifySource) => {
   if (source === SourcifySource.CENTRAL_SERVER) {
     return sourcifyHttpRepoPrefix;
   }
-  return snapshotPrefix;
+
+  throw new Error(`Unknown Sourcify intergration source code: ${source}`);
 };
 
 export const sourcifyMetadata = (

From 6cc7804da862d5f00b5365d97a4e2612a427377f Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Fri, 22 Oct 2021 19:41:43 +0000
Subject: [PATCH 18/62] Bump ethers from 5.4.7 to 5.5.1 (#99)

---
 package-lock.json | 1112 +++++++++++++++++++++++----------------------
 package.json      |    2 +-
 2 files changed, 558 insertions(+), 556 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e796d9d..44aa612 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -34,7 +34,7 @@
         "@types/react-router-dom": "^5.3.1",
         "@types/react-syntax-highlighter": "^13.5.2",
         "chart.js": "^3.5.1",
-        "ethers": "^5.4.7",
+        "ethers": "^5.5.1",
         "highlightjs-solidity": "^2.0.1",
         "query-string": "^7.0.1",
         "react": "^17.0.2",
@@ -1325,9 +1325,9 @@
       }
     },
     "node_modules/@ethersproject/abi": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/abi/-/abi-5.4.1.tgz",
-      "integrity": "sha512-9mhbjUk76BiSluiiW4BaYyI58KSbDMMQpCLdsAR+RsT2GyATiNYxVv+pGWRrekmsIdY3I+hOqsYQSTkc8L/mcg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/abi/-/abi-5.5.0.tgz",
+      "integrity": "sha512-loW7I4AohP5KycATvc0MgujU6JyCHPqHdeoo9z3Nr9xEiNioxa65ccdm1+fsoJhkuhdRtfcL8cfyGamz2AxZ5w==",
       "funding": [
         {
           "type": "individual",
@@ -1339,21 +1339,21 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/hash": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/hash": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/abstract-provider": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/abstract-provider/-/abstract-provider-5.4.1.tgz",
-      "integrity": "sha512-3EedfKI3LVpjSKgAxoUaI+gB27frKsxzm+r21w9G60Ugk+3wVLQwhi1LsEJAKNV7WoZc8CIpNrATlL1QFABjtQ==",
+      "version": "5.5.1",
+      "resolved": "https://registry.npmjs.org/@ethersproject/abstract-provider/-/abstract-provider-5.5.1.tgz",
+      "integrity": "sha512-m+MA/ful6eKbxpr99xUYeRvLkfnlqzrF8SZ46d/xFB1A7ZVknYc/sXJG0RcufF52Qn2jeFj1hhcoQ7IXjNKUqg==",
       "funding": [
         {
           "type": "individual",
@@ -1365,19 +1365,19 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/networks": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
-        "@ethersproject/web": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/networks": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
+        "@ethersproject/web": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/abstract-signer": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/abstract-signer/-/abstract-signer-5.4.1.tgz",
-      "integrity": "sha512-SkkFL5HVq1k4/25dM+NWP9MILgohJCgGv5xT5AcRruGz4ILpfHeBtO/y6j+Z3UN/PAjDeb4P7E51Yh8wcGNLGA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/abstract-signer/-/abstract-signer-5.5.0.tgz",
+      "integrity": "sha512-lj//7r250MXVLKI7sVarXAbZXbv9P50lgmJQGr2/is82EwEb8r7HrxsmMqAjTsztMYy7ohrIhGMIml+Gx4D3mA==",
       "funding": [
         {
           "type": "individual",
@@ -1389,17 +1389,17 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/abstract-provider": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0"
+        "@ethersproject/abstract-provider": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/address": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/address/-/address-5.4.0.tgz",
-      "integrity": "sha512-SD0VgOEkcACEG/C6xavlU1Hy3m5DGSXW3CUHkaaEHbAPPsgi0coP5oNPsxau8eTlZOk/bpa/hKeCNoK5IzVI2Q==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/address/-/address-5.5.0.tgz",
+      "integrity": "sha512-l4Nj0eWlTUh6ro5IbPTgbpT4wRbdH5l8CQf7icF7sb/SI3Nhd9Y9HzhonTSTi6CefI0necIw7LJqQPopPLZyWw==",
       "funding": [
         {
           "type": "individual",
@@ -1411,17 +1411,17 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/rlp": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/rlp": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/base64": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/base64/-/base64-5.4.0.tgz",
-      "integrity": "sha512-CjQw6E17QDSSC5jiM9YpF7N1aSCHmYGMt9bWD8PWv6YPMxjsys2/Q8xLrROKI3IWJ7sFfZ8B3flKDTM5wlWuZQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/base64/-/base64-5.5.0.tgz",
+      "integrity": "sha512-tdayUKhU1ljrlHzEWbStXazDpsx4eg1dBXUSI6+mHlYklOXoXF6lZvw8tnD6oVaWfnMxAgRSKROg3cVKtCcppA==",
       "funding": [
         {
           "type": "individual",
@@ -1433,13 +1433,13 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/basex": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/basex/-/basex-5.4.0.tgz",
-      "integrity": "sha512-J07+QCVJ7np2bcpxydFVf/CuYo9mZ7T73Pe7KQY4c1lRlrixMeblauMxHXD0MPwFmUHZIILDNViVkykFBZylbg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/basex/-/basex-5.5.0.tgz",
+      "integrity": "sha512-ZIodwhHpVJ0Y3hUCfUucmxKsWQA5TMnavp5j/UOuDdzZWzJlRmuOjcTMIGgHCYuZmHt36BfiSyQPSRskPxbfaQ==",
       "funding": [
         {
           "type": "individual",
@@ -1451,14 +1451,14 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/bignumber": {
-      "version": "5.4.2",
-      "resolved": "https://registry.npmjs.org/@ethersproject/bignumber/-/bignumber-5.4.2.tgz",
-      "integrity": "sha512-oIBDhsKy5bs7j36JlaTzFgNPaZjiNDOXsdSgSpXRucUl+UA6L/1YLlFeI3cPAoodcenzF4nxNPV13pcy7XbWjA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/bignumber/-/bignumber-5.5.0.tgz",
+      "integrity": "sha512-6Xytlwvy6Rn3U3gKEc1vP7nR92frHkv6wtVr95LFR3jREXiCPzdWxKQ1cx4JGQBXxcguAwjA8murlYN2TSiEbg==",
       "funding": [
         {
           "type": "individual",
@@ -1470,15 +1470,15 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
         "bn.js": "^4.11.9"
       }
     },
     "node_modules/@ethersproject/bytes": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/bytes/-/bytes-5.4.0.tgz",
-      "integrity": "sha512-H60ceqgTHbhzOj4uRc/83SCN9d+BSUnOkrr2intevqdtEMO1JFVZ1XL84OEZV+QjV36OaZYxtnt4lGmxcGsPfA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/bytes/-/bytes-5.5.0.tgz",
+      "integrity": "sha512-ABvc7BHWhZU9PNM/tANm/Qx4ostPGadAuQzWTr3doklZOhDlmcBqclrQe/ZXUIj3K8wC28oYeuRa+A37tX9kog==",
       "funding": [
         {
           "type": "individual",
@@ -1490,13 +1490,13 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/constants": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/constants/-/constants-5.4.0.tgz",
-      "integrity": "sha512-tzjn6S7sj9+DIIeKTJLjK9WGN2Tj0P++Z8ONEIlZjyoTkBuODN+0VfhAyYksKi43l1Sx9tX2VlFfzjfmr5Wl3Q==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/constants/-/constants-5.5.0.tgz",
+      "integrity": "sha512-2MsRRVChkvMWR+GyMGY4N1sAX9Mt3J9KykCsgUFd/1mwS0UH1qw+Bv9k1UJb3X3YJYFco9H20pjSlOIfCG5HYQ==",
       "funding": [
         {
           "type": "individual",
@@ -1508,13 +1508,13 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bignumber": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/contracts": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/contracts/-/contracts-5.4.1.tgz",
-      "integrity": "sha512-m+z2ZgPy4pyR15Je//dUaymRUZq5MtDajF6GwFbGAVmKz/RF+DNIPwF0k5qEcL3wPGVqUjFg2/krlCRVTU4T5w==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/contracts/-/contracts-5.5.0.tgz",
+      "integrity": "sha512-2viY7NzyvJkh+Ug17v7g3/IJC8HqZBDcOjYARZLdzRxrfGlRgmYgl6xPRKVbEzy1dWKw/iv7chDcS83pg6cLxg==",
       "funding": [
         {
           "type": "individual",
@@ -1526,22 +1526,22 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/abi": "^5.4.0",
-        "@ethersproject/abstract-provider": "^5.4.0",
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0"
+        "@ethersproject/abi": "^5.5.0",
+        "@ethersproject/abstract-provider": "^5.5.0",
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/hash": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/hash/-/hash-5.4.0.tgz",
-      "integrity": "sha512-xymAM9tmikKgbktOCjW60Z5sdouiIIurkZUr9oW5NOex5uwxrbsYG09kb5bMcNjlVeJD3yPivTNzViIs1GCbqA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/hash/-/hash-5.5.0.tgz",
+      "integrity": "sha512-dnGVpK1WtBjmnp3mUT0PlU2MpapnwWI0PibldQEq1408tQBAbZpPidkWoVVuNMOl/lISO3+4hXZWCL3YV7qzfg==",
       "funding": [
         {
           "type": "individual",
@@ -1553,20 +1553,20 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/hdnode": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/hdnode/-/hdnode-5.4.0.tgz",
-      "integrity": "sha512-pKxdS0KAaeVGfZPp1KOiDLB0jba11tG6OP1u11QnYfb7pXn6IZx0xceqWRr6ygke8+Kw74IpOoSi7/DwANhy8Q==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/hdnode/-/hdnode-5.5.0.tgz",
+      "integrity": "sha512-mcSOo9zeUg1L0CoJH7zmxwUG5ggQHU1UrRf8jyTYy6HxdZV+r0PBoL1bxr+JHIPXRzS6u/UW4mEn43y0tmyF8Q==",
       "funding": [
         {
           "type": "individual",
@@ -1578,24 +1578,24 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/basex": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/pbkdf2": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/sha2": "^5.4.0",
-        "@ethersproject/signing-key": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
-        "@ethersproject/wordlists": "^5.4.0"
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/basex": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/pbkdf2": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/sha2": "^5.5.0",
+        "@ethersproject/signing-key": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
+        "@ethersproject/wordlists": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/json-wallets": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/json-wallets/-/json-wallets-5.4.0.tgz",
-      "integrity": "sha512-igWcu3fx4aiczrzEHwG1xJZo9l1cFfQOWzTqwRw/xcvxTk58q4f9M7cjh51EKphMHvrJtcezJ1gf1q1AUOfEQQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/json-wallets/-/json-wallets-5.5.0.tgz",
+      "integrity": "sha512-9lA21XQnCdcS72xlBn1jfQdj2A1VUxZzOzi9UkNdnokNKke/9Ya2xA9aIK1SC3PQyBDLt4C+dfps7ULpkvKikQ==",
       "funding": [
         {
           "type": "individual",
@@ -1607,25 +1607,25 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/hdnode": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/pbkdf2": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/random": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/hdnode": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/pbkdf2": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/random": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
         "aes-js": "3.0.0",
         "scrypt-js": "3.0.1"
       }
     },
     "node_modules/@ethersproject/keccak256": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/keccak256/-/keccak256-5.4.0.tgz",
-      "integrity": "sha512-FBI1plWet+dPUvAzPAeHzRKiPpETQzqSUWR1wXJGHVWi4i8bOSrpC3NwpkPjgeXG7MnugVc1B42VbfnQikyC/A==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/keccak256/-/keccak256-5.5.0.tgz",
+      "integrity": "sha512-5VoFCTjo2rYbBe1l2f4mccaRFN/4VQEYFwwn04aJV2h7qf4ZvI2wFxUE1XOX+snbwCLRzIeikOqtAoPwMza9kg==",
       "funding": [
         {
           "type": "individual",
@@ -1637,14 +1637,14 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "js-sha3": "0.5.7"
+        "@ethersproject/bytes": "^5.5.0",
+        "js-sha3": "0.8.0"
       }
     },
     "node_modules/@ethersproject/logger": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/logger/-/logger-5.4.1.tgz",
-      "integrity": "sha512-DZ+bRinnYLPw1yAC64oRl0QyVZj43QeHIhVKfD/+YwSz4wsv1pfwb5SOFjz+r710YEWzU6LrhuSjpSO+6PeE4A==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/logger/-/logger-5.5.0.tgz",
+      "integrity": "sha512-rIY/6WPm7T8n3qS2vuHTUBPdXHl+rGxWxW5okDfo9J4Z0+gRRZT0msvUdIJkE4/HS29GUMziwGaaKO2bWONBrg==",
       "funding": [
         {
           "type": "individual",
@@ -1657,9 +1657,9 @@
       ]
     },
     "node_modules/@ethersproject/networks": {
-      "version": "5.4.2",
-      "resolved": "https://registry.npmjs.org/@ethersproject/networks/-/networks-5.4.2.tgz",
-      "integrity": "sha512-eekOhvJyBnuibfJnhtK46b8HimBc5+4gqpvd1/H9LEl7Q7/qhsIhM81dI9Fcnjpk3jB1aTy6bj0hz3cifhNeYw==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/networks/-/networks-5.5.0.tgz",
+      "integrity": "sha512-KWfP3xOnJeF89Uf/FCJdV1a2aDJe5XTN2N52p4fcQ34QhDqQFkgQKZ39VGtiqUgHcLI8DfT0l9azC3KFTunqtA==",
       "funding": [
         {
           "type": "individual",
@@ -1671,13 +1671,13 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/pbkdf2": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/pbkdf2/-/pbkdf2-5.4.0.tgz",
-      "integrity": "sha512-x94aIv6tiA04g6BnazZSLoRXqyusawRyZWlUhKip2jvoLpzJuLb//KtMM6PEovE47pMbW+Qe1uw+68ameJjB7g==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/pbkdf2/-/pbkdf2-5.5.0.tgz",
+      "integrity": "sha512-SaDvQFvXPnz1QGpzr6/HToLifftSXGoXrbpZ6BvoZhmx4bNLHrxDe8MZisuecyOziP1aVEwzC2Hasj+86TgWVg==",
       "funding": [
         {
           "type": "individual",
@@ -1689,14 +1689,14 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/sha2": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/sha2": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/properties": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/properties/-/properties-5.4.1.tgz",
-      "integrity": "sha512-cyCGlF8wWlIZyizsj2PpbJ9I7rIlUAfnHYwy/T90pdkSn/NFTa5YWZx2wTJBe9V7dD65dcrrEMisCRUJiq6n3w==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/properties/-/properties-5.5.0.tgz",
+      "integrity": "sha512-l3zRQg3JkD8EL3CPjNK5g7kMx4qSwiR60/uk5IVjd3oq1MZR5qUg40CNOoEJoX5wc3DyY5bt9EbMk86C7x0DNA==",
       "funding": [
         {
           "type": "individual",
@@ -1708,13 +1708,13 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/providers": {
-      "version": "5.4.5",
-      "resolved": "https://registry.npmjs.org/@ethersproject/providers/-/providers-5.4.5.tgz",
-      "integrity": "sha512-1GkrvkiAw3Fj28cwi1Sqm8ED1RtERtpdXmRfwIBGmqBSN5MoeRUHuwHPppMtbPayPgpFcvD7/Gdc9doO5fGYgw==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/providers/-/providers-5.5.0.tgz",
+      "integrity": "sha512-xqMbDnS/FPy+J/9mBLKddzyLLAQFjrVff5g00efqxPzcAwXiR+SiCGVy6eJ5iAIirBOATjx7QLhDNPGV+AEQsw==",
       "funding": [
         {
           "type": "individual",
@@ -1726,23 +1726,23 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/abstract-provider": "^5.4.0",
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/basex": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/hash": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/networks": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/random": "^5.4.0",
-        "@ethersproject/rlp": "^5.4.0",
-        "@ethersproject/sha2": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
-        "@ethersproject/web": "^5.4.0",
+        "@ethersproject/abstract-provider": "^5.5.0",
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/basex": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/hash": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/networks": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/random": "^5.5.0",
+        "@ethersproject/rlp": "^5.5.0",
+        "@ethersproject/sha2": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
+        "@ethersproject/web": "^5.5.0",
         "bech32": "1.1.4",
         "ws": "7.4.6"
       }
@@ -1768,9 +1768,9 @@
       }
     },
     "node_modules/@ethersproject/random": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/random/-/random-5.4.0.tgz",
-      "integrity": "sha512-pnpWNQlf0VAZDEOVp1rsYQosmv2o0ITS/PecNw+mS2/btF8eYdspkN0vIXrCMtkX09EAh9bdk8GoXmFXM1eAKw==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/random/-/random-5.5.0.tgz",
+      "integrity": "sha512-egGYZwZ/YIFKMHcoBUo8t3a8Hb/TKYX8BCBoLjudVCZh892welR3jOxgOmb48xznc9bTcMm7Tpwc1gHC1PFNFQ==",
       "funding": [
         {
           "type": "individual",
@@ -1782,14 +1782,14 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/rlp": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/rlp/-/rlp-5.4.0.tgz",
-      "integrity": "sha512-0I7MZKfi+T5+G8atId9QaQKHRvvasM/kqLyAH4XxBCBchAooH2EX5rL9kYZWwcm3awYV+XC7VF6nLhfeQFKVPg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/rlp/-/rlp-5.5.0.tgz",
+      "integrity": "sha512-hLv8XaQ8PTI9g2RHoQGf/WSxBfTB/NudRacbzdxmst5VHAqd1sMibWG7SENzT5Dj3yZ3kJYx+WiRYEcQTAkcYA==",
       "funding": [
         {
           "type": "individual",
@@ -1801,14 +1801,14 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/sha2": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/sha2/-/sha2-5.4.0.tgz",
-      "integrity": "sha512-siheo36r1WD7Cy+bDdE1BJ8y0bDtqXCOxRMzPa4bV1TGt/eTUUt03BHoJNB6reWJD8A30E/pdJ8WFkq+/uz4Gg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/sha2/-/sha2-5.5.0.tgz",
+      "integrity": "sha512-B5UBoglbCiHamRVPLA110J+2uqsifpZaTmid2/7W5rbtYVz6gus6/hSDieIU/6gaKIDcOj12WnOdiymEUHIAOA==",
       "funding": [
         {
           "type": "individual",
@@ -1820,15 +1820,15 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
         "hash.js": "1.1.7"
       }
     },
     "node_modules/@ethersproject/signing-key": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/signing-key/-/signing-key-5.4.0.tgz",
-      "integrity": "sha512-q8POUeywx6AKg2/jX9qBYZIAmKSB4ubGXdQ88l40hmATj29JnG5pp331nAWwwxPn2Qao4JpWHNZsQN+bPiSW9A==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/signing-key/-/signing-key-5.5.0.tgz",
+      "integrity": "sha512-5VmseH7qjtNmDdZBswavhotYbWB0bOwKIlOTSlX14rKn5c11QmJwGt4GHeo7NrL/Ycl7uo9AHvEqs5xZgFBTng==",
       "funding": [
         {
           "type": "individual",
@@ -1840,18 +1840,18 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
         "bn.js": "^4.11.9",
         "elliptic": "6.5.4",
         "hash.js": "1.1.7"
       }
     },
     "node_modules/@ethersproject/solidity": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/solidity/-/solidity-5.4.0.tgz",
-      "integrity": "sha512-XFQTZ7wFSHOhHcV1DpcWj7VXECEiSrBuv7JErJvB9Uo+KfCdc3QtUZV+Vjh/AAaYgezUEKbCtE6Khjm44seevQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/solidity/-/solidity-5.5.0.tgz",
+      "integrity": "sha512-9NgZs9LhGMj6aCtHXhtmFQ4AN4sth5HuFXVvAQtzmm0jpSCNOTGtrHZJAeYTh7MBjRR8brylWZxBZR9zDStXbw==",
       "funding": [
         {
           "type": "individual",
@@ -1863,17 +1863,18 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/sha2": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/sha2": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/strings": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/strings/-/strings-5.4.0.tgz",
-      "integrity": "sha512-k/9DkH5UGDhv7aReXLluFG5ExurwtIpUfnDNhQA29w896Dw3i4uDTz01Quaptbks1Uj9kI8wo9tmW73wcIEaWA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/strings/-/strings-5.5.0.tgz",
+      "integrity": "sha512-9fy3TtF5LrX/wTrBaT8FGE6TDJyVjOvXynXJz5MT5azq+E6D92zuKNx7i29sWW2FjVOaWjAsiZ1ZWznuduTIIQ==",
       "funding": [
         {
           "type": "individual",
@@ -1885,15 +1886,15 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/transactions": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/transactions/-/transactions-5.4.0.tgz",
-      "integrity": "sha512-s3EjZZt7xa4BkLknJZ98QGoIza94rVjaEed0rzZ/jB9WrIuu/1+tjvYCWzVrystXtDswy7TPBeIepyXwSYa4WQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/transactions/-/transactions-5.5.0.tgz",
+      "integrity": "sha512-9RZYSKX26KfzEd/1eqvv8pLauCKzDTub0Ko4LfIgaERvRuwyaNV78mJs7cpIgZaDl6RJui4o49lHwwCM0526zA==",
       "funding": [
         {
           "type": "individual",
@@ -1905,21 +1906,21 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/rlp": "^5.4.0",
-        "@ethersproject/signing-key": "^5.4.0"
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/rlp": "^5.5.0",
+        "@ethersproject/signing-key": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/units": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/units/-/units-5.4.0.tgz",
-      "integrity": "sha512-Z88krX40KCp+JqPCP5oPv5p750g+uU6gopDYRTBGcDvOASh6qhiEYCRatuM/suC4S2XW9Zz90QI35MfSrTIaFg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/units/-/units-5.5.0.tgz",
+      "integrity": "sha512-7+DpjiZk4v6wrikj+TCyWWa9dXLNU73tSTa7n0TSJDxkYbV3Yf1eRh9ToMLlZtuctNYu9RDNNy2USq3AdqSbag==",
       "funding": [
         {
           "type": "individual",
@@ -1931,15 +1932,15 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/wallet": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/wallet/-/wallet-5.4.0.tgz",
-      "integrity": "sha512-wU29majLjM6AjCjpat21mPPviG+EpK7wY1+jzKD0fg3ui5fgedf2zEu1RDgpfIMsfn8fJHJuzM4zXZ2+hSHaSQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/wallet/-/wallet-5.5.0.tgz",
+      "integrity": "sha512-Mlu13hIctSYaZmUOo7r2PhNSd8eaMPVXe1wxrz4w4FCE4tDYBywDH+bAR1Xz2ADyXGwqYMwstzTrtUVIsKDO0Q==",
       "funding": [
         {
           "type": "individual",
@@ -1951,27 +1952,27 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/abstract-provider": "^5.4.0",
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/hash": "^5.4.0",
-        "@ethersproject/hdnode": "^5.4.0",
-        "@ethersproject/json-wallets": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/random": "^5.4.0",
-        "@ethersproject/signing-key": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
-        "@ethersproject/wordlists": "^5.4.0"
+        "@ethersproject/abstract-provider": "^5.5.0",
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/hash": "^5.5.0",
+        "@ethersproject/hdnode": "^5.5.0",
+        "@ethersproject/json-wallets": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/random": "^5.5.0",
+        "@ethersproject/signing-key": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
+        "@ethersproject/wordlists": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/web": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/web/-/web-5.4.0.tgz",
-      "integrity": "sha512-1bUusGmcoRLYgMn6c1BLk1tOKUIFuTg8j+6N8lYlbMpDesnle+i3pGSagGNvwjaiLo4Y5gBibwctpPRmjrh4Og==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/web/-/web-5.5.0.tgz",
+      "integrity": "sha512-BEgY0eL5oH4mAo37TNYVrFeHsIXLRxggCRG/ksRIxI2X5uj5IsjGmcNiRN/VirQOlBxcUhCgHhaDLG4m6XAVoA==",
       "funding": [
         {
           "type": "individual",
@@ -1983,17 +1984,17 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/base64": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/base64": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "node_modules/@ethersproject/wordlists": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/wordlists/-/wordlists-5.4.0.tgz",
-      "integrity": "sha512-FemEkf6a+EBKEPxlzeVgUaVSodU7G0Na89jqKjmWMlDB0tomoU8RlEMgUvXyqtrg8N4cwpLh8nyRnm1Nay1isA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/wordlists/-/wordlists-5.5.0.tgz",
+      "integrity": "sha512-bL0UTReWDiaQJJYOC9sh/XcRu/9i2jMrzf8VLRmPKx58ckSlOJiohODkECCO50dtLZHcGU6MLXQ4OOrgBwP77Q==",
       "funding": [
         {
           "type": "individual",
@@ -2005,11 +2006,11 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/hash": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/hash": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "node_modules/@fontsource/fira-code": {
@@ -8148,9 +8149,9 @@
       }
     },
     "node_modules/ethers": {
-      "version": "5.4.7",
-      "resolved": "https://registry.npmjs.org/ethers/-/ethers-5.4.7.tgz",
-      "integrity": "sha512-iZc5p2nqfWK1sj8RabwsPM28cr37Bpq7ehTQ5rWExBr2Y09Sn1lDKZOED26n+TsZMye7Y6mIgQ/1cwpSD8XZew==",
+      "version": "5.5.1",
+      "resolved": "https://registry.npmjs.org/ethers/-/ethers-5.5.1.tgz",
+      "integrity": "sha512-RodEvUFZI+EmFcE6bwkuJqpCYHazdzeR1nMzg+YWQSmQEsNtfl1KHGfp/FWZYl48bI/g7cgBeP2IlPthjiVngw==",
       "funding": [
         {
           "type": "individual",
@@ -8162,36 +8163,36 @@
         }
       ],
       "dependencies": {
-        "@ethersproject/abi": "5.4.1",
-        "@ethersproject/abstract-provider": "5.4.1",
-        "@ethersproject/abstract-signer": "5.4.1",
-        "@ethersproject/address": "5.4.0",
-        "@ethersproject/base64": "5.4.0",
-        "@ethersproject/basex": "5.4.0",
-        "@ethersproject/bignumber": "5.4.2",
-        "@ethersproject/bytes": "5.4.0",
-        "@ethersproject/constants": "5.4.0",
-        "@ethersproject/contracts": "5.4.1",
-        "@ethersproject/hash": "5.4.0",
-        "@ethersproject/hdnode": "5.4.0",
-        "@ethersproject/json-wallets": "5.4.0",
-        "@ethersproject/keccak256": "5.4.0",
-        "@ethersproject/logger": "5.4.1",
-        "@ethersproject/networks": "5.4.2",
-        "@ethersproject/pbkdf2": "5.4.0",
-        "@ethersproject/properties": "5.4.1",
-        "@ethersproject/providers": "5.4.5",
-        "@ethersproject/random": "5.4.0",
-        "@ethersproject/rlp": "5.4.0",
-        "@ethersproject/sha2": "5.4.0",
-        "@ethersproject/signing-key": "5.4.0",
-        "@ethersproject/solidity": "5.4.0",
-        "@ethersproject/strings": "5.4.0",
-        "@ethersproject/transactions": "5.4.0",
-        "@ethersproject/units": "5.4.0",
-        "@ethersproject/wallet": "5.4.0",
-        "@ethersproject/web": "5.4.0",
-        "@ethersproject/wordlists": "5.4.0"
+        "@ethersproject/abi": "5.5.0",
+        "@ethersproject/abstract-provider": "5.5.1",
+        "@ethersproject/abstract-signer": "5.5.0",
+        "@ethersproject/address": "5.5.0",
+        "@ethersproject/base64": "5.5.0",
+        "@ethersproject/basex": "5.5.0",
+        "@ethersproject/bignumber": "5.5.0",
+        "@ethersproject/bytes": "5.5.0",
+        "@ethersproject/constants": "5.5.0",
+        "@ethersproject/contracts": "5.5.0",
+        "@ethersproject/hash": "5.5.0",
+        "@ethersproject/hdnode": "5.5.0",
+        "@ethersproject/json-wallets": "5.5.0",
+        "@ethersproject/keccak256": "5.5.0",
+        "@ethersproject/logger": "5.5.0",
+        "@ethersproject/networks": "5.5.0",
+        "@ethersproject/pbkdf2": "5.5.0",
+        "@ethersproject/properties": "5.5.0",
+        "@ethersproject/providers": "5.5.0",
+        "@ethersproject/random": "5.5.0",
+        "@ethersproject/rlp": "5.5.0",
+        "@ethersproject/sha2": "5.5.0",
+        "@ethersproject/signing-key": "5.5.0",
+        "@ethersproject/solidity": "5.5.0",
+        "@ethersproject/strings": "5.5.0",
+        "@ethersproject/transactions": "5.5.0",
+        "@ethersproject/units": "5.5.0",
+        "@ethersproject/wallet": "5.5.0",
+        "@ethersproject/web": "5.5.0",
+        "@ethersproject/wordlists": "5.5.0"
       }
     },
     "node_modules/eventemitter3": {
@@ -11037,9 +11038,9 @@
       }
     },
     "node_modules/js-sha3": {
-      "version": "0.5.7",
-      "resolved": "https://registry.npmjs.org/js-sha3/-/js-sha3-0.5.7.tgz",
-      "integrity": "sha1-DU/9gALVMzqrr0oj7tL2N0yfKOc="
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/js-sha3/-/js-sha3-0.8.0.tgz",
+      "integrity": "sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q=="
     },
     "node_modules/js-tokens": {
       "version": "4.0.0",
@@ -20556,234 +20557,234 @@
       }
     },
     "@ethersproject/abi": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/abi/-/abi-5.4.1.tgz",
-      "integrity": "sha512-9mhbjUk76BiSluiiW4BaYyI58KSbDMMQpCLdsAR+RsT2GyATiNYxVv+pGWRrekmsIdY3I+hOqsYQSTkc8L/mcg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/abi/-/abi-5.5.0.tgz",
+      "integrity": "sha512-loW7I4AohP5KycATvc0MgujU6JyCHPqHdeoo9z3Nr9xEiNioxa65ccdm1+fsoJhkuhdRtfcL8cfyGamz2AxZ5w==",
       "requires": {
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/hash": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/hash": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "@ethersproject/abstract-provider": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/abstract-provider/-/abstract-provider-5.4.1.tgz",
-      "integrity": "sha512-3EedfKI3LVpjSKgAxoUaI+gB27frKsxzm+r21w9G60Ugk+3wVLQwhi1LsEJAKNV7WoZc8CIpNrATlL1QFABjtQ==",
+      "version": "5.5.1",
+      "resolved": "https://registry.npmjs.org/@ethersproject/abstract-provider/-/abstract-provider-5.5.1.tgz",
+      "integrity": "sha512-m+MA/ful6eKbxpr99xUYeRvLkfnlqzrF8SZ46d/xFB1A7ZVknYc/sXJG0RcufF52Qn2jeFj1hhcoQ7IXjNKUqg==",
       "requires": {
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/networks": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
-        "@ethersproject/web": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/networks": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
+        "@ethersproject/web": "^5.5.0"
       }
     },
     "@ethersproject/abstract-signer": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/abstract-signer/-/abstract-signer-5.4.1.tgz",
-      "integrity": "sha512-SkkFL5HVq1k4/25dM+NWP9MILgohJCgGv5xT5AcRruGz4ILpfHeBtO/y6j+Z3UN/PAjDeb4P7E51Yh8wcGNLGA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/abstract-signer/-/abstract-signer-5.5.0.tgz",
+      "integrity": "sha512-lj//7r250MXVLKI7sVarXAbZXbv9P50lgmJQGr2/is82EwEb8r7HrxsmMqAjTsztMYy7ohrIhGMIml+Gx4D3mA==",
       "requires": {
-        "@ethersproject/abstract-provider": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0"
+        "@ethersproject/abstract-provider": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0"
       }
     },
     "@ethersproject/address": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/address/-/address-5.4.0.tgz",
-      "integrity": "sha512-SD0VgOEkcACEG/C6xavlU1Hy3m5DGSXW3CUHkaaEHbAPPsgi0coP5oNPsxau8eTlZOk/bpa/hKeCNoK5IzVI2Q==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/address/-/address-5.5.0.tgz",
+      "integrity": "sha512-l4Nj0eWlTUh6ro5IbPTgbpT4wRbdH5l8CQf7icF7sb/SI3Nhd9Y9HzhonTSTi6CefI0necIw7LJqQPopPLZyWw==",
       "requires": {
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/rlp": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/rlp": "^5.5.0"
       }
     },
     "@ethersproject/base64": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/base64/-/base64-5.4.0.tgz",
-      "integrity": "sha512-CjQw6E17QDSSC5jiM9YpF7N1aSCHmYGMt9bWD8PWv6YPMxjsys2/Q8xLrROKI3IWJ7sFfZ8B3flKDTM5wlWuZQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/base64/-/base64-5.5.0.tgz",
+      "integrity": "sha512-tdayUKhU1ljrlHzEWbStXazDpsx4eg1dBXUSI6+mHlYklOXoXF6lZvw8tnD6oVaWfnMxAgRSKROg3cVKtCcppA==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0"
       }
     },
     "@ethersproject/basex": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/basex/-/basex-5.4.0.tgz",
-      "integrity": "sha512-J07+QCVJ7np2bcpxydFVf/CuYo9mZ7T73Pe7KQY4c1lRlrixMeblauMxHXD0MPwFmUHZIILDNViVkykFBZylbg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/basex/-/basex-5.5.0.tgz",
+      "integrity": "sha512-ZIodwhHpVJ0Y3hUCfUucmxKsWQA5TMnavp5j/UOuDdzZWzJlRmuOjcTMIGgHCYuZmHt36BfiSyQPSRskPxbfaQ==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0"
       }
     },
     "@ethersproject/bignumber": {
-      "version": "5.4.2",
-      "resolved": "https://registry.npmjs.org/@ethersproject/bignumber/-/bignumber-5.4.2.tgz",
-      "integrity": "sha512-oIBDhsKy5bs7j36JlaTzFgNPaZjiNDOXsdSgSpXRucUl+UA6L/1YLlFeI3cPAoodcenzF4nxNPV13pcy7XbWjA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/bignumber/-/bignumber-5.5.0.tgz",
+      "integrity": "sha512-6Xytlwvy6Rn3U3gKEc1vP7nR92frHkv6wtVr95LFR3jREXiCPzdWxKQ1cx4JGQBXxcguAwjA8murlYN2TSiEbg==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
         "bn.js": "^4.11.9"
       }
     },
     "@ethersproject/bytes": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/bytes/-/bytes-5.4.0.tgz",
-      "integrity": "sha512-H60ceqgTHbhzOj4uRc/83SCN9d+BSUnOkrr2intevqdtEMO1JFVZ1XL84OEZV+QjV36OaZYxtnt4lGmxcGsPfA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/bytes/-/bytes-5.5.0.tgz",
+      "integrity": "sha512-ABvc7BHWhZU9PNM/tANm/Qx4ostPGadAuQzWTr3doklZOhDlmcBqclrQe/ZXUIj3K8wC28oYeuRa+A37tX9kog==",
       "requires": {
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "@ethersproject/constants": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/constants/-/constants-5.4.0.tgz",
-      "integrity": "sha512-tzjn6S7sj9+DIIeKTJLjK9WGN2Tj0P++Z8ONEIlZjyoTkBuODN+0VfhAyYksKi43l1Sx9tX2VlFfzjfmr5Wl3Q==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/constants/-/constants-5.5.0.tgz",
+      "integrity": "sha512-2MsRRVChkvMWR+GyMGY4N1sAX9Mt3J9KykCsgUFd/1mwS0UH1qw+Bv9k1UJb3X3YJYFco9H20pjSlOIfCG5HYQ==",
       "requires": {
-        "@ethersproject/bignumber": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0"
       }
     },
     "@ethersproject/contracts": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/contracts/-/contracts-5.4.1.tgz",
-      "integrity": "sha512-m+z2ZgPy4pyR15Je//dUaymRUZq5MtDajF6GwFbGAVmKz/RF+DNIPwF0k5qEcL3wPGVqUjFg2/krlCRVTU4T5w==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/contracts/-/contracts-5.5.0.tgz",
+      "integrity": "sha512-2viY7NzyvJkh+Ug17v7g3/IJC8HqZBDcOjYARZLdzRxrfGlRgmYgl6xPRKVbEzy1dWKw/iv7chDcS83pg6cLxg==",
       "requires": {
-        "@ethersproject/abi": "^5.4.0",
-        "@ethersproject/abstract-provider": "^5.4.0",
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0"
+        "@ethersproject/abi": "^5.5.0",
+        "@ethersproject/abstract-provider": "^5.5.0",
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0"
       }
     },
     "@ethersproject/hash": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/hash/-/hash-5.4.0.tgz",
-      "integrity": "sha512-xymAM9tmikKgbktOCjW60Z5sdouiIIurkZUr9oW5NOex5uwxrbsYG09kb5bMcNjlVeJD3yPivTNzViIs1GCbqA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/hash/-/hash-5.5.0.tgz",
+      "integrity": "sha512-dnGVpK1WtBjmnp3mUT0PlU2MpapnwWI0PibldQEq1408tQBAbZpPidkWoVVuNMOl/lISO3+4hXZWCL3YV7qzfg==",
       "requires": {
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "@ethersproject/hdnode": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/hdnode/-/hdnode-5.4.0.tgz",
-      "integrity": "sha512-pKxdS0KAaeVGfZPp1KOiDLB0jba11tG6OP1u11QnYfb7pXn6IZx0xceqWRr6ygke8+Kw74IpOoSi7/DwANhy8Q==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/hdnode/-/hdnode-5.5.0.tgz",
+      "integrity": "sha512-mcSOo9zeUg1L0CoJH7zmxwUG5ggQHU1UrRf8jyTYy6HxdZV+r0PBoL1bxr+JHIPXRzS6u/UW4mEn43y0tmyF8Q==",
       "requires": {
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/basex": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/pbkdf2": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/sha2": "^5.4.0",
-        "@ethersproject/signing-key": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
-        "@ethersproject/wordlists": "^5.4.0"
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/basex": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/pbkdf2": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/sha2": "^5.5.0",
+        "@ethersproject/signing-key": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
+        "@ethersproject/wordlists": "^5.5.0"
       }
     },
     "@ethersproject/json-wallets": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/json-wallets/-/json-wallets-5.4.0.tgz",
-      "integrity": "sha512-igWcu3fx4aiczrzEHwG1xJZo9l1cFfQOWzTqwRw/xcvxTk58q4f9M7cjh51EKphMHvrJtcezJ1gf1q1AUOfEQQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/json-wallets/-/json-wallets-5.5.0.tgz",
+      "integrity": "sha512-9lA21XQnCdcS72xlBn1jfQdj2A1VUxZzOzi9UkNdnokNKke/9Ya2xA9aIK1SC3PQyBDLt4C+dfps7ULpkvKikQ==",
       "requires": {
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/hdnode": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/pbkdf2": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/random": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/hdnode": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/pbkdf2": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/random": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
         "aes-js": "3.0.0",
         "scrypt-js": "3.0.1"
       }
     },
     "@ethersproject/keccak256": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/keccak256/-/keccak256-5.4.0.tgz",
-      "integrity": "sha512-FBI1plWet+dPUvAzPAeHzRKiPpETQzqSUWR1wXJGHVWi4i8bOSrpC3NwpkPjgeXG7MnugVc1B42VbfnQikyC/A==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/keccak256/-/keccak256-5.5.0.tgz",
+      "integrity": "sha512-5VoFCTjo2rYbBe1l2f4mccaRFN/4VQEYFwwn04aJV2h7qf4ZvI2wFxUE1XOX+snbwCLRzIeikOqtAoPwMza9kg==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "js-sha3": "0.5.7"
+        "@ethersproject/bytes": "^5.5.0",
+        "js-sha3": "0.8.0"
       }
     },
     "@ethersproject/logger": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/logger/-/logger-5.4.1.tgz",
-      "integrity": "sha512-DZ+bRinnYLPw1yAC64oRl0QyVZj43QeHIhVKfD/+YwSz4wsv1pfwb5SOFjz+r710YEWzU6LrhuSjpSO+6PeE4A=="
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/logger/-/logger-5.5.0.tgz",
+      "integrity": "sha512-rIY/6WPm7T8n3qS2vuHTUBPdXHl+rGxWxW5okDfo9J4Z0+gRRZT0msvUdIJkE4/HS29GUMziwGaaKO2bWONBrg=="
     },
     "@ethersproject/networks": {
-      "version": "5.4.2",
-      "resolved": "https://registry.npmjs.org/@ethersproject/networks/-/networks-5.4.2.tgz",
-      "integrity": "sha512-eekOhvJyBnuibfJnhtK46b8HimBc5+4gqpvd1/H9LEl7Q7/qhsIhM81dI9Fcnjpk3jB1aTy6bj0hz3cifhNeYw==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/networks/-/networks-5.5.0.tgz",
+      "integrity": "sha512-KWfP3xOnJeF89Uf/FCJdV1a2aDJe5XTN2N52p4fcQ34QhDqQFkgQKZ39VGtiqUgHcLI8DfT0l9azC3KFTunqtA==",
       "requires": {
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "@ethersproject/pbkdf2": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/pbkdf2/-/pbkdf2-5.4.0.tgz",
-      "integrity": "sha512-x94aIv6tiA04g6BnazZSLoRXqyusawRyZWlUhKip2jvoLpzJuLb//KtMM6PEovE47pMbW+Qe1uw+68ameJjB7g==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/pbkdf2/-/pbkdf2-5.5.0.tgz",
+      "integrity": "sha512-SaDvQFvXPnz1QGpzr6/HToLifftSXGoXrbpZ6BvoZhmx4bNLHrxDe8MZisuecyOziP1aVEwzC2Hasj+86TgWVg==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/sha2": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/sha2": "^5.5.0"
       }
     },
     "@ethersproject/properties": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@ethersproject/properties/-/properties-5.4.1.tgz",
-      "integrity": "sha512-cyCGlF8wWlIZyizsj2PpbJ9I7rIlUAfnHYwy/T90pdkSn/NFTa5YWZx2wTJBe9V7dD65dcrrEMisCRUJiq6n3w==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/properties/-/properties-5.5.0.tgz",
+      "integrity": "sha512-l3zRQg3JkD8EL3CPjNK5g7kMx4qSwiR60/uk5IVjd3oq1MZR5qUg40CNOoEJoX5wc3DyY5bt9EbMk86C7x0DNA==",
       "requires": {
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "@ethersproject/providers": {
-      "version": "5.4.5",
-      "resolved": "https://registry.npmjs.org/@ethersproject/providers/-/providers-5.4.5.tgz",
-      "integrity": "sha512-1GkrvkiAw3Fj28cwi1Sqm8ED1RtERtpdXmRfwIBGmqBSN5MoeRUHuwHPppMtbPayPgpFcvD7/Gdc9doO5fGYgw==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/providers/-/providers-5.5.0.tgz",
+      "integrity": "sha512-xqMbDnS/FPy+J/9mBLKddzyLLAQFjrVff5g00efqxPzcAwXiR+SiCGVy6eJ5iAIirBOATjx7QLhDNPGV+AEQsw==",
       "requires": {
-        "@ethersproject/abstract-provider": "^5.4.0",
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/basex": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/hash": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/networks": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/random": "^5.4.0",
-        "@ethersproject/rlp": "^5.4.0",
-        "@ethersproject/sha2": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
-        "@ethersproject/web": "^5.4.0",
+        "@ethersproject/abstract-provider": "^5.5.0",
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/basex": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/hash": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/networks": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/random": "^5.5.0",
+        "@ethersproject/rlp": "^5.5.0",
+        "@ethersproject/sha2": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
+        "@ethersproject/web": "^5.5.0",
         "bech32": "1.1.4",
         "ws": "7.4.6"
       },
@@ -20797,138 +20798,139 @@
       }
     },
     "@ethersproject/random": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/random/-/random-5.4.0.tgz",
-      "integrity": "sha512-pnpWNQlf0VAZDEOVp1rsYQosmv2o0ITS/PecNw+mS2/btF8eYdspkN0vIXrCMtkX09EAh9bdk8GoXmFXM1eAKw==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/random/-/random-5.5.0.tgz",
+      "integrity": "sha512-egGYZwZ/YIFKMHcoBUo8t3a8Hb/TKYX8BCBoLjudVCZh892welR3jOxgOmb48xznc9bTcMm7Tpwc1gHC1PFNFQ==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "@ethersproject/rlp": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/rlp/-/rlp-5.4.0.tgz",
-      "integrity": "sha512-0I7MZKfi+T5+G8atId9QaQKHRvvasM/kqLyAH4XxBCBchAooH2EX5rL9kYZWwcm3awYV+XC7VF6nLhfeQFKVPg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/rlp/-/rlp-5.5.0.tgz",
+      "integrity": "sha512-hLv8XaQ8PTI9g2RHoQGf/WSxBfTB/NudRacbzdxmst5VHAqd1sMibWG7SENzT5Dj3yZ3kJYx+WiRYEcQTAkcYA==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "@ethersproject/sha2": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/sha2/-/sha2-5.4.0.tgz",
-      "integrity": "sha512-siheo36r1WD7Cy+bDdE1BJ8y0bDtqXCOxRMzPa4bV1TGt/eTUUt03BHoJNB6reWJD8A30E/pdJ8WFkq+/uz4Gg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/sha2/-/sha2-5.5.0.tgz",
+      "integrity": "sha512-B5UBoglbCiHamRVPLA110J+2uqsifpZaTmid2/7W5rbtYVz6gus6/hSDieIU/6gaKIDcOj12WnOdiymEUHIAOA==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
         "hash.js": "1.1.7"
       }
     },
     "@ethersproject/signing-key": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/signing-key/-/signing-key-5.4.0.tgz",
-      "integrity": "sha512-q8POUeywx6AKg2/jX9qBYZIAmKSB4ubGXdQ88l40hmATj29JnG5pp331nAWwwxPn2Qao4JpWHNZsQN+bPiSW9A==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/signing-key/-/signing-key-5.5.0.tgz",
+      "integrity": "sha512-5VmseH7qjtNmDdZBswavhotYbWB0bOwKIlOTSlX14rKn5c11QmJwGt4GHeo7NrL/Ycl7uo9AHvEqs5xZgFBTng==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
         "bn.js": "^4.11.9",
         "elliptic": "6.5.4",
         "hash.js": "1.1.7"
       }
     },
     "@ethersproject/solidity": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/solidity/-/solidity-5.4.0.tgz",
-      "integrity": "sha512-XFQTZ7wFSHOhHcV1DpcWj7VXECEiSrBuv7JErJvB9Uo+KfCdc3QtUZV+Vjh/AAaYgezUEKbCtE6Khjm44seevQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/solidity/-/solidity-5.5.0.tgz",
+      "integrity": "sha512-9NgZs9LhGMj6aCtHXhtmFQ4AN4sth5HuFXVvAQtzmm0jpSCNOTGtrHZJAeYTh7MBjRR8brylWZxBZR9zDStXbw==",
       "requires": {
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/sha2": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/sha2": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "@ethersproject/strings": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/strings/-/strings-5.4.0.tgz",
-      "integrity": "sha512-k/9DkH5UGDhv7aReXLluFG5ExurwtIpUfnDNhQA29w896Dw3i4uDTz01Quaptbks1Uj9kI8wo9tmW73wcIEaWA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/strings/-/strings-5.5.0.tgz",
+      "integrity": "sha512-9fy3TtF5LrX/wTrBaT8FGE6TDJyVjOvXynXJz5MT5azq+E6D92zuKNx7i29sWW2FjVOaWjAsiZ1ZWznuduTIIQ==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "@ethersproject/transactions": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/transactions/-/transactions-5.4.0.tgz",
-      "integrity": "sha512-s3EjZZt7xa4BkLknJZ98QGoIza94rVjaEed0rzZ/jB9WrIuu/1+tjvYCWzVrystXtDswy7TPBeIepyXwSYa4WQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/transactions/-/transactions-5.5.0.tgz",
+      "integrity": "sha512-9RZYSKX26KfzEd/1eqvv8pLauCKzDTub0Ko4LfIgaERvRuwyaNV78mJs7cpIgZaDl6RJui4o49lHwwCM0526zA==",
       "requires": {
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/rlp": "^5.4.0",
-        "@ethersproject/signing-key": "^5.4.0"
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/rlp": "^5.5.0",
+        "@ethersproject/signing-key": "^5.5.0"
       }
     },
     "@ethersproject/units": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/units/-/units-5.4.0.tgz",
-      "integrity": "sha512-Z88krX40KCp+JqPCP5oPv5p750g+uU6gopDYRTBGcDvOASh6qhiEYCRatuM/suC4S2XW9Zz90QI35MfSrTIaFg==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/units/-/units-5.5.0.tgz",
+      "integrity": "sha512-7+DpjiZk4v6wrikj+TCyWWa9dXLNU73tSTa7n0TSJDxkYbV3Yf1eRh9ToMLlZtuctNYu9RDNNy2USq3AdqSbag==",
       "requires": {
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/constants": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0"
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/constants": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0"
       }
     },
     "@ethersproject/wallet": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/wallet/-/wallet-5.4.0.tgz",
-      "integrity": "sha512-wU29majLjM6AjCjpat21mPPviG+EpK7wY1+jzKD0fg3ui5fgedf2zEu1RDgpfIMsfn8fJHJuzM4zXZ2+hSHaSQ==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/wallet/-/wallet-5.5.0.tgz",
+      "integrity": "sha512-Mlu13hIctSYaZmUOo7r2PhNSd8eaMPVXe1wxrz4w4FCE4tDYBywDH+bAR1Xz2ADyXGwqYMwstzTrtUVIsKDO0Q==",
       "requires": {
-        "@ethersproject/abstract-provider": "^5.4.0",
-        "@ethersproject/abstract-signer": "^5.4.0",
-        "@ethersproject/address": "^5.4.0",
-        "@ethersproject/bignumber": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/hash": "^5.4.0",
-        "@ethersproject/hdnode": "^5.4.0",
-        "@ethersproject/json-wallets": "^5.4.0",
-        "@ethersproject/keccak256": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/random": "^5.4.0",
-        "@ethersproject/signing-key": "^5.4.0",
-        "@ethersproject/transactions": "^5.4.0",
-        "@ethersproject/wordlists": "^5.4.0"
+        "@ethersproject/abstract-provider": "^5.5.0",
+        "@ethersproject/abstract-signer": "^5.5.0",
+        "@ethersproject/address": "^5.5.0",
+        "@ethersproject/bignumber": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/hash": "^5.5.0",
+        "@ethersproject/hdnode": "^5.5.0",
+        "@ethersproject/json-wallets": "^5.5.0",
+        "@ethersproject/keccak256": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/random": "^5.5.0",
+        "@ethersproject/signing-key": "^5.5.0",
+        "@ethersproject/transactions": "^5.5.0",
+        "@ethersproject/wordlists": "^5.5.0"
       }
     },
     "@ethersproject/web": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/web/-/web-5.4.0.tgz",
-      "integrity": "sha512-1bUusGmcoRLYgMn6c1BLk1tOKUIFuTg8j+6N8lYlbMpDesnle+i3pGSagGNvwjaiLo4Y5gBibwctpPRmjrh4Og==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/web/-/web-5.5.0.tgz",
+      "integrity": "sha512-BEgY0eL5oH4mAo37TNYVrFeHsIXLRxggCRG/ksRIxI2X5uj5IsjGmcNiRN/VirQOlBxcUhCgHhaDLG4m6XAVoA==",
       "requires": {
-        "@ethersproject/base64": "^5.4.0",
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/base64": "^5.5.0",
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "@ethersproject/wordlists": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@ethersproject/wordlists/-/wordlists-5.4.0.tgz",
-      "integrity": "sha512-FemEkf6a+EBKEPxlzeVgUaVSodU7G0Na89jqKjmWMlDB0tomoU8RlEMgUvXyqtrg8N4cwpLh8nyRnm1Nay1isA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@ethersproject/wordlists/-/wordlists-5.5.0.tgz",
+      "integrity": "sha512-bL0UTReWDiaQJJYOC9sh/XcRu/9i2jMrzf8VLRmPKx58ckSlOJiohODkECCO50dtLZHcGU6MLXQ4OOrgBwP77Q==",
       "requires": {
-        "@ethersproject/bytes": "^5.4.0",
-        "@ethersproject/hash": "^5.4.0",
-        "@ethersproject/logger": "^5.4.0",
-        "@ethersproject/properties": "^5.4.0",
-        "@ethersproject/strings": "^5.4.0"
+        "@ethersproject/bytes": "^5.5.0",
+        "@ethersproject/hash": "^5.5.0",
+        "@ethersproject/logger": "^5.5.0",
+        "@ethersproject/properties": "^5.5.0",
+        "@ethersproject/strings": "^5.5.0"
       }
     },
     "@fontsource/fira-code": {
@@ -25078,40 +25080,40 @@
       "version": "1.8.1"
     },
     "ethers": {
-      "version": "5.4.7",
-      "resolved": "https://registry.npmjs.org/ethers/-/ethers-5.4.7.tgz",
-      "integrity": "sha512-iZc5p2nqfWK1sj8RabwsPM28cr37Bpq7ehTQ5rWExBr2Y09Sn1lDKZOED26n+TsZMye7Y6mIgQ/1cwpSD8XZew==",
+      "version": "5.5.1",
+      "resolved": "https://registry.npmjs.org/ethers/-/ethers-5.5.1.tgz",
+      "integrity": "sha512-RodEvUFZI+EmFcE6bwkuJqpCYHazdzeR1nMzg+YWQSmQEsNtfl1KHGfp/FWZYl48bI/g7cgBeP2IlPthjiVngw==",
       "requires": {
-        "@ethersproject/abi": "5.4.1",
-        "@ethersproject/abstract-provider": "5.4.1",
-        "@ethersproject/abstract-signer": "5.4.1",
-        "@ethersproject/address": "5.4.0",
-        "@ethersproject/base64": "5.4.0",
-        "@ethersproject/basex": "5.4.0",
-        "@ethersproject/bignumber": "5.4.2",
-        "@ethersproject/bytes": "5.4.0",
-        "@ethersproject/constants": "5.4.0",
-        "@ethersproject/contracts": "5.4.1",
-        "@ethersproject/hash": "5.4.0",
-        "@ethersproject/hdnode": "5.4.0",
-        "@ethersproject/json-wallets": "5.4.0",
-        "@ethersproject/keccak256": "5.4.0",
-        "@ethersproject/logger": "5.4.1",
-        "@ethersproject/networks": "5.4.2",
-        "@ethersproject/pbkdf2": "5.4.0",
-        "@ethersproject/properties": "5.4.1",
-        "@ethersproject/providers": "5.4.5",
-        "@ethersproject/random": "5.4.0",
-        "@ethersproject/rlp": "5.4.0",
-        "@ethersproject/sha2": "5.4.0",
-        "@ethersproject/signing-key": "5.4.0",
-        "@ethersproject/solidity": "5.4.0",
-        "@ethersproject/strings": "5.4.0",
-        "@ethersproject/transactions": "5.4.0",
-        "@ethersproject/units": "5.4.0",
-        "@ethersproject/wallet": "5.4.0",
-        "@ethersproject/web": "5.4.0",
-        "@ethersproject/wordlists": "5.4.0"
+        "@ethersproject/abi": "5.5.0",
+        "@ethersproject/abstract-provider": "5.5.1",
+        "@ethersproject/abstract-signer": "5.5.0",
+        "@ethersproject/address": "5.5.0",
+        "@ethersproject/base64": "5.5.0",
+        "@ethersproject/basex": "5.5.0",
+        "@ethersproject/bignumber": "5.5.0",
+        "@ethersproject/bytes": "5.5.0",
+        "@ethersproject/constants": "5.5.0",
+        "@ethersproject/contracts": "5.5.0",
+        "@ethersproject/hash": "5.5.0",
+        "@ethersproject/hdnode": "5.5.0",
+        "@ethersproject/json-wallets": "5.5.0",
+        "@ethersproject/keccak256": "5.5.0",
+        "@ethersproject/logger": "5.5.0",
+        "@ethersproject/networks": "5.5.0",
+        "@ethersproject/pbkdf2": "5.5.0",
+        "@ethersproject/properties": "5.5.0",
+        "@ethersproject/providers": "5.5.0",
+        "@ethersproject/random": "5.5.0",
+        "@ethersproject/rlp": "5.5.0",
+        "@ethersproject/sha2": "5.5.0",
+        "@ethersproject/signing-key": "5.5.0",
+        "@ethersproject/solidity": "5.5.0",
+        "@ethersproject/strings": "5.5.0",
+        "@ethersproject/transactions": "5.5.0",
+        "@ethersproject/units": "5.5.0",
+        "@ethersproject/wallet": "5.5.0",
+        "@ethersproject/web": "5.5.0",
+        "@ethersproject/wordlists": "5.5.0"
       }
     },
     "eventemitter3": {
@@ -27000,9 +27002,9 @@
       }
     },
     "js-sha3": {
-      "version": "0.5.7",
-      "resolved": "https://registry.npmjs.org/js-sha3/-/js-sha3-0.5.7.tgz",
-      "integrity": "sha1-DU/9gALVMzqrr0oj7tL2N0yfKOc="
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/js-sha3/-/js-sha3-0.8.0.tgz",
+      "integrity": "sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q=="
     },
     "js-tokens": {
       "version": "4.0.0"
diff --git a/package.json b/package.json
index ff9c698..f961a6c 100644
--- a/package.json
+++ b/package.json
@@ -29,7 +29,7 @@
     "@types/react-router-dom": "^5.3.1",
     "@types/react-syntax-highlighter": "^13.5.2",
     "chart.js": "^3.5.1",
-    "ethers": "^5.4.7",
+    "ethers": "^5.5.1",
     "highlightjs-solidity": "^2.0.1",
     "query-string": "^7.0.1",
     "react": "^17.0.2",

From 5533e7786eca173b7eb00fd5b7ec371f295b9843 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Fri, 22 Oct 2021 16:52:28 -0300
Subject: [PATCH 19/62] Fix typechecking after ethers 5.5.1 fix/improvement

---
 src/useReverseCache.ts | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/useReverseCache.ts b/src/useReverseCache.ts
index 86c6472..365888a 100644
--- a/src/useReverseCache.ts
+++ b/src/useReverseCache.ts
@@ -25,7 +25,7 @@ export const useENSCache = (
     const addresses = Array.from(addrSet);
 
     const reverseResolve = async () => {
-      const solvers: Promise<string>[] = [];
+      const solvers: Promise<string | null>[] = [];
       for (const a of addresses) {
         solvers.push(provider.lookupAddress(a));
       }
@@ -33,10 +33,11 @@ export const useENSCache = (
       const results = await Promise.all(solvers);
       const cache: ENSReverseCache = {};
       for (let i = 0; i < results.length; i++) {
-        if (results[i] === null) {
+        const r = results[i];
+        if (r === null) {
           continue;
         }
-        cache[addresses[i]] = results[i];
+        cache[addresses[i]] = r;
       }
       setReverseCache(cache);
     };

From 5e4be33121d584797d74454078bca3844daef6d1 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Fri, 22 Oct 2021 17:51:20 -0300
Subject: [PATCH 20/62] Workaround for difficult overflow on ethers 5.5.x;
 using _difficult field: BigNumber; must change wen ethers 6

---
 src/Block.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Block.tsx b/src/Block.tsx
index b63e942..df16643 100644
--- a/src/Block.tsx
+++ b/src/Block.tsx
@@ -166,7 +166,7 @@ const Block: React.FC = () => {
             <USDValue value={blockETHUSDPrice} />
           </InfoRow>
           <InfoRow title="Difficult">
-            {block.difficulty ? commify(block.difficulty) : "?"}
+            {commify(block._difficulty.toString())}
           </InfoRow>
           <InfoRow title="Total Difficult">
             {commify(block.totalDifficulty.toString())}

From 24e05e06e9eaf195f21b9895f3994d2e7e014fbc Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 24 Oct 2021 01:04:18 -0300
Subject: [PATCH 21/62] Lazy import tabs

---
 src/Transaction.tsx | 50 +++++++++++++++++++++++++++++----------------
 1 file changed, 32 insertions(+), 18 deletions(-)

diff --git a/src/Transaction.tsx b/src/Transaction.tsx
index 0edd994..a240c7e 100644
--- a/src/Transaction.tsx
+++ b/src/Transaction.tsx
@@ -5,8 +5,6 @@ import StandardFrame from "./StandardFrame";
 import StandardSubtitle from "./StandardSubtitle";
 import ContentFrame from "./ContentFrame";
 import NavTab from "./components/NavTab";
-import Details from "./transaction/Details";
-import Logs from "./transaction/Logs";
 import { RuntimeContext } from "./useRuntime";
 import { SelectionContext, useSelection } from "./useSelection";
 import { useInternalOperations, useTxData } from "./useErigonHooks";
@@ -14,6 +12,20 @@ import { useETHUSDOracle } from "./usePriceOracle";
 import { useAppConfigContext } from "./useAppConfig";
 import { useSourcify, useTransactionDescription } from "./useSourcify";
 
+const Details = React.lazy(
+  () =>
+    import(
+      /* webpackChunkName: "txdetails", webpackPrefetch: true */
+      "./transaction/Details"
+    )
+);
+const Logs = React.lazy(
+  () =>
+    import(
+      /* webpackChunkName: "txlogs", webpackPrefetch: true */ "./transaction/Logs"
+    )
+);
+
 type TransactionParams = {
   txhash: string;
 };
@@ -77,22 +89,24 @@ const Transaction: React.FC = () => {
               )}
             </Tab.List>
           </Tab.Group>
-          <Switch>
-            <Route path="/tx/:txhash/" exact>
-              <Details
-                txData={txData}
-                txDesc={txDesc}
-                userDoc={metadata?.output.userdoc}
-                devDoc={metadata?.output.devdoc}
-                internalOps={internalOps}
-                sendsEthToMiner={sendsEthToMiner}
-                ethUSDPrice={blockETHUSDPrice}
-              />
-            </Route>
-            <Route path="/tx/:txhash/logs/" exact>
-              <Logs txData={txData} metadata={metadata} />
-            </Route>
-          </Switch>
+          <React.Suspense fallback={null}>
+            <Switch>
+              <Route path="/tx/:txhash/" exact>
+                <Details
+                  txData={txData}
+                  txDesc={txDesc}
+                  userDoc={metadata?.output.userdoc}
+                  devDoc={metadata?.output.devdoc}
+                  internalOps={internalOps}
+                  sendsEthToMiner={sendsEthToMiner}
+                  ethUSDPrice={blockETHUSDPrice}
+                />
+              </Route>
+              <Route path="/tx/:txhash/logs/" exact>
+                <Logs txData={txData} metadata={metadata} />
+              </Route>
+            </Switch>
+          </React.Suspense>
         </SelectionContext.Provider>
       )}
     </StandardFrame>

From 2a78834c1d7cb28e55a02083174cfa55fdd69d89 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 24 Oct 2021 01:12:05 -0300
Subject: [PATCH 22/62] Refresh tweaks

---
 src/App.tsx                   | 2 +-
 src/special/london/Blocks.tsx | 2 +-
 src/special/london/London.tsx | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 9c7c1fe..846e61f 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -30,7 +30,7 @@ const App = () => {
   }, [sourcifySource, setSourcifySource]);
 
   return (
-    <Suspense fallback={<>LOADING</>}>
+    <Suspense fallback={null}>
       {runtime.connStatus !== ConnectionStatus.CONNECTED ? (
         <ConnectionErrorPanel
           connStatus={runtime.connStatus}
diff --git a/src/special/london/Blocks.tsx b/src/special/london/Blocks.tsx
index 64fcba8..d100717 100644
--- a/src/special/london/Blocks.tsx
+++ b/src/special/london/Blocks.tsx
@@ -103,7 +103,7 @@ const Blocks: React.FC<BlocksProps> = ({ latestBlock, targetBlockNumber }) => {
   );
 
   return (
-    <div className="w-full mb-auto">
+    <div className="w-full flex-grow">
       <div className="px-9 pt-3 pb-12 divide-y-2">
         <div className="relative">
           <div className="flex justify-center items-baseline space-x-2 px-3 pb-2 text-lg text-orange-500 ">
diff --git a/src/special/london/London.tsx b/src/special/london/London.tsx
index 0663796..aba0684 100644
--- a/src/special/london/London.tsx
+++ b/src/special/london/London.tsx
@@ -9,7 +9,7 @@ const London: React.FC = () => {
   const { provider } = useContext(RuntimeContext);
   const block = useLatestBlock(provider);
   if (!provider || !block) {
-    return <></>;
+    return <div className="flex-grow"></div>;
   }
 
   // Display countdown

From 2525e9ca31062d2d61dd84c069d7836dad1a8689 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 24 Oct 2021 01:21:20 -0300
Subject: [PATCH 23/62] Add chunk names/prefetch hint

---
 src/App.tsx | 30 +++++++++++++++++++++++++-----
 1 file changed, 25 insertions(+), 5 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 846e61f..110d626 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -11,11 +11,31 @@ import { RuntimeContext, useRuntime } from "./useRuntime";
 import { AppConfig, AppConfigContext } from "./useAppConfig";
 import { SourcifySource } from "./url";
 
-const Block = React.lazy(() => import("./Block"));
-const BlockTransactions = React.lazy(() => import("./BlockTransactions"));
-const AddressTransactions = React.lazy(() => import("./AddressTransactions"));
-const Transaction = React.lazy(() => import("./Transaction"));
-const London = React.lazy(() => import("./special/london/London"));
+const Block = React.lazy(
+  () => import(/* webpackChunkName: "block", webpackPrefetch: true */ "./Block")
+);
+const BlockTransactions = React.lazy(
+  () =>
+    import(
+      /* webpackChunkName: "blocktxs", webpackPrefetch: true */ "./BlockTransactions"
+    )
+);
+const AddressTransactions = React.lazy(
+  () =>
+    import(
+      /* webpackChunkName: "address", webpackPrefetch: true */ "./AddressTransactions"
+    )
+);
+const Transaction = React.lazy(
+  () =>
+    import(/* webpackChunkName: "tx", webpackPrefetch: true */ "./Transaction")
+);
+const London = React.lazy(
+  () =>
+    import(
+      /* webpackChunkName: "london", webpackPrefetch: true */ "./special/london/London"
+    )
+);
 
 const App = () => {
   const runtime = useRuntime();

From c3351b80471a843096ac135237519a21084e4e95 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 24 Oct 2021 01:25:57 -0300
Subject: [PATCH 24/62] Fix footer@Home

---
 src/Home.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/Home.tsx b/src/Home.tsx
index dc79748..103639a 100644
--- a/src/Home.tsx
+++ b/src/Home.tsx
@@ -38,9 +38,9 @@ const Home: React.FC = () => {
   document.title = "Home | Otterscan";
 
   return (
-    <div className="mx-auto flex flex-col h-full">
+    <div className="mx-auto flex flex-col flex-grow pb-5">
       {isScanning && <CameraScanner turnOffScan={() => setScanning(false)} />}
-      <div className="m-5 mb-10 flex items-end flex-grow max-h-72">
+      <div className="m-5 mb-10 flex items-end flex-grow max-h-64">
         <Logo />
       </div>
       <form
@@ -98,7 +98,6 @@ const Home: React.FC = () => {
           </NavLink>
         )}
       </div>
-      <div className="flex-grow pb-5"></div>
     </div>
   );
 };

From 5c8003a64c05253f1a4ba157ca3f53442009d9ba Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 24 Oct 2021 05:51:05 -0300
Subject: [PATCH 25/62] Preload title font

---
 package-lock.json      | 67 ++++++++++++++++++++++++++++++++++++++++++
 package.json           |  2 ++
 src/index.tsx          | 11 +++++++
 src/react-app-env.d.ts |  2 ++
 4 files changed, 82 insertions(+)

diff --git a/package-lock.json b/package-lock.json
index 44aa612..465caa4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -30,6 +30,7 @@
         "@types/react": "^17.0.31",
         "@types/react-blockies": "^1.4.1",
         "@types/react-dom": "^17.0.10",
+        "@types/react-helmet": "^6.1.4",
         "@types/react-highlight": "^0.12.5",
         "@types/react-router-dom": "^5.3.1",
         "@types/react-syntax-highlighter": "^13.5.2",
@@ -42,6 +43,7 @@
         "react-chartjs-2": "^3.2.0",
         "react-dom": "^17.0.2",
         "react-error-boundary": "^3.1.3",
+        "react-helmet": "^6.1.0",
         "react-image": "^4.0.3",
         "react-router-dom": "^5.3.0",
         "react-scripts": "4.0.3",
@@ -3117,6 +3119,14 @@
         "@types/react": "*"
       }
     },
+    "node_modules/@types/react-helmet": {
+      "version": "6.1.4",
+      "resolved": "https://registry.npmjs.org/@types/react-helmet/-/react-helmet-6.1.4.tgz",
+      "integrity": "sha512-jyx50RNZXVaTGHY3MsoRPNpeiVk8b0XTPgD/O6KHF6COTDnG/+lRjPYvTK5nfWtR3xDOux0w6bHLAsaHo2ZLTA==",
+      "dependencies": {
+        "@types/react": "*"
+      }
+    },
     "node_modules/@types/react-highlight": {
       "version": "0.12.5",
       "resolved": "https://registry.npmjs.org/@types/react-highlight/-/react-highlight-0.12.5.tgz",
@@ -14573,6 +14583,25 @@
       "version": "6.0.9",
       "license": "MIT"
     },
+    "node_modules/react-fast-compare": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz",
+      "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA=="
+    },
+    "node_modules/react-helmet": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-6.1.0.tgz",
+      "integrity": "sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==",
+      "dependencies": {
+        "object-assign": "^4.1.1",
+        "prop-types": "^15.7.2",
+        "react-fast-compare": "^3.1.1",
+        "react-side-effect": "^2.1.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.3.0"
+      }
+    },
     "node_modules/react-image": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/react-image/-/react-image-4.0.3.tgz",
@@ -14920,6 +14949,14 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/react-side-effect": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.1.tgz",
+      "integrity": "sha512-2FoTQzRNTncBVtnzxFOk2mCpcfxQpenBMbk5kSVBg5UcPqV9fRbgY2zhb7GTWWOlpFmAxhClBDlIq8Rsubz1yQ==",
+      "peerDependencies": {
+        "react": "^16.3.0 || ^17.0.0"
+      }
+    },
     "node_modules/react-syntax-highlighter": {
       "version": "15.4.4",
       "resolved": "https://registry.npmjs.org/react-syntax-highlighter/-/react-syntax-highlighter-15.4.4.tgz",
@@ -21666,6 +21703,14 @@
         "@types/react": "*"
       }
     },
+    "@types/react-helmet": {
+      "version": "6.1.4",
+      "resolved": "https://registry.npmjs.org/@types/react-helmet/-/react-helmet-6.1.4.tgz",
+      "integrity": "sha512-jyx50RNZXVaTGHY3MsoRPNpeiVk8b0XTPgD/O6KHF6COTDnG/+lRjPYvTK5nfWtR3xDOux0w6bHLAsaHo2ZLTA==",
+      "requires": {
+        "@types/react": "*"
+      }
+    },
     "@types/react-highlight": {
       "version": "0.12.5",
       "resolved": "https://registry.npmjs.org/@types/react-highlight/-/react-highlight-0.12.5.tgz",
@@ -29370,6 +29415,22 @@
     "react-error-overlay": {
       "version": "6.0.9"
     },
+    "react-fast-compare": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz",
+      "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA=="
+    },
+    "react-helmet": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-6.1.0.tgz",
+      "integrity": "sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==",
+      "requires": {
+        "object-assign": "^4.1.1",
+        "prop-types": "^15.7.2",
+        "react-fast-compare": "^3.1.1",
+        "react-side-effect": "^2.1.0"
+      }
+    },
     "react-image": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/react-image/-/react-image-4.0.3.tgz",
@@ -29614,6 +29675,12 @@
         }
       }
     },
+    "react-side-effect": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.1.tgz",
+      "integrity": "sha512-2FoTQzRNTncBVtnzxFOk2mCpcfxQpenBMbk5kSVBg5UcPqV9fRbgY2zhb7GTWWOlpFmAxhClBDlIq8Rsubz1yQ==",
+      "requires": {}
+    },
     "react-syntax-highlighter": {
       "version": "15.4.4",
       "resolved": "https://registry.npmjs.org/react-syntax-highlighter/-/react-syntax-highlighter-15.4.4.tgz",
diff --git a/package.json b/package.json
index f961a6c..0369b84 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
     "@types/react": "^17.0.31",
     "@types/react-blockies": "^1.4.1",
     "@types/react-dom": "^17.0.10",
+    "@types/react-helmet": "^6.1.4",
     "@types/react-highlight": "^0.12.5",
     "@types/react-router-dom": "^5.3.1",
     "@types/react-syntax-highlighter": "^13.5.2",
@@ -37,6 +38,7 @@
     "react-chartjs-2": "^3.2.0",
     "react-dom": "^17.0.2",
     "react-error-boundary": "^3.1.3",
+    "react-helmet": "^6.1.0",
     "react-image": "^4.0.3",
     "react-router-dom": "^5.3.0",
     "react-scripts": "4.0.3",
diff --git a/src/index.tsx b/src/index.tsx
index a1b9d79..29ad212 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,14 +1,25 @@
 import React from "react";
 import ReactDOM from "react-dom";
+import { Helmet } from "react-helmet";
 import "@fontsource/space-grotesk/index.css";
 import "@fontsource/roboto/index.css";
 import "@fontsource/roboto-mono/index.css";
+import spaceGrotesk from "@fontsource/space-grotesk/files/space-grotesk-latin-400-normal.woff2";
 import "./index.css";
 import App from "./App";
 import reportWebVitals from "./reportWebVitals";
 
 ReactDOM.render(
   <React.StrictMode>
+    <Helmet>
+      <link
+        rel="preload"
+        href={spaceGrotesk}
+        as="font"
+        type="font/woff2"
+        crossOrigin="true"
+      />
+    </Helmet>
     <App />
   </React.StrictMode>,
   document.getElementById("root")
diff --git a/src/react-app-env.d.ts b/src/react-app-env.d.ts
index 625fe40..dc08ce3 100644
--- a/src/react-app-env.d.ts
+++ b/src/react-app-env.d.ts
@@ -1,3 +1,5 @@
 /// <reference types="react-scripts" />
 declare module "use-keyboard-shortcut";
 declare module "highlightjs-solidity";
+declare module "*.woff";
+declare module "*.woff2";

From d7ba5f09fd2b69808bd3b4f19337de3acf250b12 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 24 Oct 2021 23:04:04 -0300
Subject: [PATCH 26/62] Extract ABI parent component

---
 src/address/ContractABI.tsx         | 19 +++++++++++++++++++
 src/address/Contracts.tsx           | 11 ++---------
 src/address/{ABI.tsx => RawABI.tsx} |  6 +++---
 3 files changed, 24 insertions(+), 12 deletions(-)
 create mode 100644 src/address/ContractABI.tsx
 rename src/address/{ABI.tsx => RawABI.tsx} (74%)

diff --git a/src/address/ContractABI.tsx b/src/address/ContractABI.tsx
new file mode 100644
index 0000000..2f079de
--- /dev/null
+++ b/src/address/ContractABI.tsx
@@ -0,0 +1,19 @@
+import React from "react";
+import Copy from "../components/Copy";
+import RawABI from "./RawABI";
+
+type ContractABIProps = {
+  abi: any[];
+};
+
+const ContractABI: React.FC<ContractABIProps> = ({ abi }) => (
+  <div className="mb-3">
+    <div className="flex space-x-2 text-sm border-l border-r border-t rounded-t px-2 py-1">
+      <span>ABI</span>
+      <Copy value={JSON.stringify(abi)} />
+    </div>
+    <RawABI abi={abi} />
+  </div>
+);
+
+export default React.memo(ContractABI);
diff --git a/src/address/Contracts.tsx b/src/address/Contracts.tsx
index 0745d73..dbaaf83 100644
--- a/src/address/Contracts.tsx
+++ b/src/address/Contracts.tsx
@@ -5,13 +5,12 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faChevronDown } from "@fortawesome/free-solid-svg-icons/faChevronDown";
 import ContentFrame from "../ContentFrame";
 import InfoRow from "../components/InfoRow";
-import Copy from "../components/Copy";
-import ABI from "./ABI";
 import Contract from "./Contract";
 import { RuntimeContext } from "../useRuntime";
 import { Metadata } from "../useSourcify";
 import ExternalLink from "../components/ExternalLink";
 import { openInRemixURL } from "../url";
+import ContractABI from "./ContractABI";
 
 type ContractsProps = {
   checksummedAddress: string;
@@ -70,13 +69,7 @@ const Contracts: React.FC<ContractsProps> = ({
         {rawMetadata !== undefined && rawMetadata !== null && (
           <>
             {rawMetadata.output.abi && (
-              <div className="mb-3">
-                <div className="flex space-x-2 text-sm border-l border-r border-t rounded-t px-2 py-1">
-                  <span>ABI</span>
-                  <Copy value={JSON.stringify(rawMetadata.output.abi)} />
-                </div>
-                <ABI abi={rawMetadata.output.abi} />
-              </div>
+              <ContractABI abi={rawMetadata.output.abi} />
             )}
             <div>
               <Menu>
diff --git a/src/address/ABI.tsx b/src/address/RawABI.tsx
similarity index 74%
rename from src/address/ABI.tsx
rename to src/address/RawABI.tsx
index a714367..bc07e81 100644
--- a/src/address/ABI.tsx
+++ b/src/address/RawABI.tsx
@@ -1,11 +1,11 @@
 import React from "react";
 import { SyntaxHighlighter, docco } from "../highlight-init";
 
-type ABIProps = {
+type RawABIProps = {
   abi: any[];
 };
 
-const ABI: React.FC<ABIProps> = ({ abi }) => (
+const RawABI: React.FC<RawABIProps> = ({ abi }) => (
   <SyntaxHighlighter
     className="w-full h-60 border font-code text-base"
     language="json"
@@ -16,4 +16,4 @@ const ABI: React.FC<ABIProps> = ({ abi }) => (
   </SyntaxHighlighter>
 );
 
-export default React.memo(ABI);
+export default React.memo(RawABI);

From 02261f264abd36bb9d3ca78c1eec7f79e8d06e43 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 25 Oct 2021 01:29:50 -0300
Subject: [PATCH 27/62] First parsed ABI UI prototype

---
 src/address/ContractABI.tsx     | 26 ++++++++++++---
 src/address/DecodedABI.tsx      | 20 ++++++++++++
 src/address/DecodedFragment.tsx | 57 +++++++++++++++++++++++++++++++++
 3 files changed, 98 insertions(+), 5 deletions(-)
 create mode 100644 src/address/DecodedABI.tsx
 create mode 100644 src/address/DecodedFragment.tsx

diff --git a/src/address/ContractABI.tsx b/src/address/ContractABI.tsx
index 2f079de..086d92c 100644
--- a/src/address/ContractABI.tsx
+++ b/src/address/ContractABI.tsx
@@ -1,5 +1,8 @@
 import React from "react";
+import { Tab } from "@headlessui/react";
+import ModeTab from "../components/ModeTab";
 import Copy from "../components/Copy";
+import DecodedABI from "./DecodedABI";
 import RawABI from "./RawABI";
 
 type ContractABIProps = {
@@ -8,11 +11,24 @@ type ContractABIProps = {
 
 const ContractABI: React.FC<ContractABIProps> = ({ abi }) => (
   <div className="mb-3">
-    <div className="flex space-x-2 text-sm border-l border-r border-t rounded-t px-2 py-1">
-      <span>ABI</span>
-      <Copy value={JSON.stringify(abi)} />
-    </div>
-    <RawABI abi={abi} />
+    <Tab.Group>
+      <Tab.List className="flex space-x-1 mb-1">
+        <ModeTab>Decoded</ModeTab>
+        <ModeTab>Raw</ModeTab>
+      </Tab.List>
+      <Tab.Panels>
+        <Tab.Panel>
+          <DecodedABI abi={abi} />
+        </Tab.Panel>
+        <Tab.Panel>
+          <div className="flex space-x-2 text-sm border-l border-r border-t rounded-t px-2 py-1">
+            <span>ABI</span>
+            <Copy value={JSON.stringify(abi)} />
+          </div>
+          <RawABI abi={abi} />
+        </Tab.Panel>
+      </Tab.Panels>
+    </Tab.Group>
   </div>
 );
 
diff --git a/src/address/DecodedABI.tsx b/src/address/DecodedABI.tsx
new file mode 100644
index 0000000..1de994d
--- /dev/null
+++ b/src/address/DecodedABI.tsx
@@ -0,0 +1,20 @@
+import { Interface } from "@ethersproject/abi";
+import React from "react";
+import DecodedFragment from "./DecodedFragment";
+
+type DecodedABIProps = {
+  abi: any[];
+};
+
+const DecodedABI: React.FC<DecodedABIProps> = ({ abi }) => {
+  const intf = new Interface(abi);
+  return (
+    <div className="mt-3 space-y-2">
+      {intf.fragments.map((f, i) => (
+        <DecodedFragment key={i} intf={intf} fragment={f} />
+      ))}
+    </div>
+  );
+};
+
+export default React.memo(DecodedABI);
diff --git a/src/address/DecodedFragment.tsx b/src/address/DecodedFragment.tsx
new file mode 100644
index 0000000..33e694c
--- /dev/null
+++ b/src/address/DecodedFragment.tsx
@@ -0,0 +1,57 @@
+import React from "react";
+import {
+  ConstructorFragment,
+  EventFragment,
+  Fragment,
+  FunctionFragment,
+  Interface,
+} from "@ethersproject/abi";
+
+type DecodedFragmentProps = {
+  intf: Interface;
+  fragment: Fragment;
+};
+
+const DecodedFragment: React.FC<DecodedFragmentProps> = ({
+  intf,
+  fragment,
+}) => {
+  let sig: string | undefined;
+  let letter: string | undefined;
+  let letterBg: string | undefined;
+
+  if (FunctionFragment.isFunctionFragment(fragment)) {
+    sig = intf.getSighash(fragment);
+    letter = "F";
+    letterBg = "bg-purple-500";
+  } else if (EventFragment.isEventFragment(fragment)) {
+    sig = intf.getEventTopic(fragment);
+    letter = "E";
+    letterBg = "bg-green-300";
+  } else if (ConstructorFragment.isConstructorFragment(fragment)) {
+    letter = "C";
+    letterBg = "bg-blue-500";
+  }
+
+  return (
+    <div className="flex items-baseline space-x-1">
+      {letter && (
+        <span
+          className={`flex-shrink-0 text-xs font-code border border-gray-300 rounded-full w-5 h-5 self-center flex items-center justify-center text-white font-bold ${letterBg}`}
+        >
+          {letter}
+        </span>
+      )}
+      <span className="text-sm font-code whitespace-nowrap">
+        {fragment.format("full")}
+      </span>
+      {sig && (
+        <span className="text-xs border rounded-xl px-2 pt-1 font-code">
+          {sig}
+        </span>
+      )}
+    </div>
+  );
+};
+
+export default React.memo(DecodedFragment);

From 4acc8be926bd5150d40952d42c63ce8c81b229ee Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 25 Oct 2021 01:44:24 -0300
Subject: [PATCH 28/62] UI tweaks

---
 src/address/ContractABI.tsx     | 10 +++++-----
 src/address/DecodedABI.tsx      |  2 +-
 src/address/DecodedFragment.tsx |  7 ++++++-
 3 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/address/ContractABI.tsx b/src/address/ContractABI.tsx
index 086d92c..edd713c 100644
--- a/src/address/ContractABI.tsx
+++ b/src/address/ContractABI.tsx
@@ -12,7 +12,11 @@ type ContractABIProps = {
 const ContractABI: React.FC<ContractABIProps> = ({ abi }) => (
   <div className="mb-3">
     <Tab.Group>
-      <Tab.List className="flex space-x-1 mb-1">
+      <Tab.List className="flex items-baseline space-x-1 mb-1">
+        <div className="flex items-baseline space-x-2 text-sm pr-2 py-1">
+          <span>ABI</span>
+          <Copy value={JSON.stringify(abi)} />
+        </div>
         <ModeTab>Decoded</ModeTab>
         <ModeTab>Raw</ModeTab>
       </Tab.List>
@@ -21,10 +25,6 @@ const ContractABI: React.FC<ContractABIProps> = ({ abi }) => (
           <DecodedABI abi={abi} />
         </Tab.Panel>
         <Tab.Panel>
-          <div className="flex space-x-2 text-sm border-l border-r border-t rounded-t px-2 py-1">
-            <span>ABI</span>
-            <Copy value={JSON.stringify(abi)} />
-          </div>
           <RawABI abi={abi} />
         </Tab.Panel>
       </Tab.Panels>
diff --git a/src/address/DecodedABI.tsx b/src/address/DecodedABI.tsx
index 1de994d..587538a 100644
--- a/src/address/DecodedABI.tsx
+++ b/src/address/DecodedABI.tsx
@@ -9,7 +9,7 @@ type DecodedABIProps = {
 const DecodedABI: React.FC<DecodedABIProps> = ({ abi }) => {
   const intf = new Interface(abi);
   return (
-    <div className="mt-3 space-y-2">
+    <div className="border">
       {intf.fragments.map((f, i) => (
         <DecodedFragment key={i} intf={intf} fragment={f} />
       ))}
diff --git a/src/address/DecodedFragment.tsx b/src/address/DecodedFragment.tsx
index 33e694c..991865a 100644
--- a/src/address/DecodedFragment.tsx
+++ b/src/address/DecodedFragment.tsx
@@ -6,6 +6,8 @@ import {
   FunctionFragment,
   Interface,
 } from "@ethersproject/abi";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faCaretRight } from "@fortawesome/free-solid-svg-icons/faCaretRight";
 
 type DecodedFragmentProps = {
   intf: Interface;
@@ -34,7 +36,10 @@ const DecodedFragment: React.FC<DecodedFragmentProps> = ({
   }
 
   return (
-    <div className="flex items-baseline space-x-1">
+    <div className="flex items-baseline space-x-2 px-2 py-1 hover:bg-gray-100">
+      <span className="text-gray-500">
+        <FontAwesomeIcon icon={faCaretRight} size="1x" />
+      </span>
       {letter && (
         <span
           className={`flex-shrink-0 text-xs font-code border border-gray-300 rounded-full w-5 h-5 self-center flex items-center justify-center text-white font-bold ${letterBg}`}

From 01818584b72f80f79e7d0dc50113b08b65a6234c Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 25 Oct 2021 14:43:41 -0300
Subject: [PATCH 29/62] Color topic hashes/method selectors

---
 src/address/DecodedFragment.tsx | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/address/DecodedFragment.tsx b/src/address/DecodedFragment.tsx
index 991865a..211d67c 100644
--- a/src/address/DecodedFragment.tsx
+++ b/src/address/DecodedFragment.tsx
@@ -18,19 +18,26 @@ const DecodedFragment: React.FC<DecodedFragmentProps> = ({
   intf,
   fragment,
 }) => {
+  let fragmentType: "constructor" | "event" | "function" | undefined;
   let sig: string | undefined;
   let letter: string | undefined;
   let letterBg: string | undefined;
+  let hashBg: string | undefined;
 
   if (FunctionFragment.isFunctionFragment(fragment)) {
+    fragmentType = "function";
     sig = intf.getSighash(fragment);
     letter = "F";
     letterBg = "bg-purple-500";
+    hashBg = "bg-purple-50";
   } else if (EventFragment.isEventFragment(fragment)) {
+    fragmentType = "event";
     sig = intf.getEventTopic(fragment);
     letter = "E";
     letterBg = "bg-green-300";
+    hashBg = "bg-green-50";
   } else if (ConstructorFragment.isConstructorFragment(fragment)) {
+    fragmentType = "constructor";
     letter = "C";
     letterBg = "bg-blue-500";
   }
@@ -51,7 +58,16 @@ const DecodedFragment: React.FC<DecodedFragmentProps> = ({
         {fragment.format("full")}
       </span>
       {sig && (
-        <span className="text-xs border rounded-xl px-2 pt-1 font-code">
+        <span
+          className={`text-xs border rounded-xl px-2 pt-1 font-code text-gray-600 ${hashBg}`}
+          title={
+            fragmentType === "function"
+              ? "Method Selector"
+              : fragmentType === "event"
+              ? "Topic Hash"
+              : ""
+          }
+        >
           {sig}
         </span>
       )}

From 0228a6b6aeced9a08b2b09e009d41f1a0eabd473 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 25 Oct 2021 14:49:17 -0300
Subject: [PATCH 30/62] Fix overflow

---
 src/address/DecodedABI.tsx      | 2 +-
 src/address/DecodedFragment.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/address/DecodedABI.tsx b/src/address/DecodedABI.tsx
index 587538a..83faabc 100644
--- a/src/address/DecodedABI.tsx
+++ b/src/address/DecodedABI.tsx
@@ -9,7 +9,7 @@ type DecodedABIProps = {
 const DecodedABI: React.FC<DecodedABIProps> = ({ abi }) => {
   const intf = new Interface(abi);
   return (
-    <div className="border">
+    <div className="border overflow-x-auto">
       {intf.fragments.map((f, i) => (
         <DecodedFragment key={i} intf={intf} fragment={f} />
       ))}
diff --git a/src/address/DecodedFragment.tsx b/src/address/DecodedFragment.tsx
index 211d67c..ac06a16 100644
--- a/src/address/DecodedFragment.tsx
+++ b/src/address/DecodedFragment.tsx
@@ -43,7 +43,7 @@ const DecodedFragment: React.FC<DecodedFragmentProps> = ({
   }
 
   return (
-    <div className="flex items-baseline space-x-2 px-2 py-1 hover:bg-gray-100">
+    <div className="flex flex-wrap items-baseline space-x-2 px-2 py-1 hover:bg-gray-100">
       <span className="text-gray-500">
         <FontAwesomeIcon icon={faCaretRight} size="1x" />
       </span>

From b8e081996cb784e30e2e018a70dc43a8b44fc29d Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 25 Oct 2021 15:14:01 -0300
Subject: [PATCH 31/62] Replace deprecated react-helmet

---
 package-lock.json | 92 +++++++++++++++++++++++------------------------
 package.json      |  3 +-
 src/index.tsx     | 24 +++++++------
 3 files changed, 59 insertions(+), 60 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 465caa4..ac44d74 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -30,7 +30,6 @@
         "@types/react": "^17.0.31",
         "@types/react-blockies": "^1.4.1",
         "@types/react-dom": "^17.0.10",
-        "@types/react-helmet": "^6.1.4",
         "@types/react-highlight": "^0.12.5",
         "@types/react-router-dom": "^5.3.1",
         "@types/react-syntax-highlighter": "^13.5.2",
@@ -43,7 +42,7 @@
         "react-chartjs-2": "^3.2.0",
         "react-dom": "^17.0.2",
         "react-error-boundary": "^3.1.3",
-        "react-helmet": "^6.1.0",
+        "react-helmet-async": "^1.1.2",
         "react-image": "^4.0.3",
         "react-router-dom": "^5.3.0",
         "react-scripts": "4.0.3",
@@ -3119,14 +3118,6 @@
         "@types/react": "*"
       }
     },
-    "node_modules/@types/react-helmet": {
-      "version": "6.1.4",
-      "resolved": "https://registry.npmjs.org/@types/react-helmet/-/react-helmet-6.1.4.tgz",
-      "integrity": "sha512-jyx50RNZXVaTGHY3MsoRPNpeiVk8b0XTPgD/O6KHF6COTDnG/+lRjPYvTK5nfWtR3xDOux0w6bHLAsaHo2ZLTA==",
-      "dependencies": {
-        "@types/react": "*"
-      }
-    },
     "node_modules/@types/react-highlight": {
       "version": "0.12.5",
       "resolved": "https://registry.npmjs.org/@types/react-highlight/-/react-highlight-0.12.5.tgz",
@@ -9839,6 +9830,14 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/invariant": {
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
+      "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
+      "dependencies": {
+        "loose-envify": "^1.0.0"
+      }
+    },
     "node_modules/ip": {
       "version": "1.1.5",
       "license": "MIT"
@@ -14588,18 +14587,20 @@
       "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz",
       "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA=="
     },
-    "node_modules/react-helmet": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-6.1.0.tgz",
-      "integrity": "sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==",
+    "node_modules/react-helmet-async": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/react-helmet-async/-/react-helmet-async-1.1.2.tgz",
+      "integrity": "sha512-LTTzDDkyIleT/JJ6T/uqx7Y8qi1EuPPSiJawQY/nHHz0h7SPDT6HxP1YDDQx/fzcVxCqpWEEMS3QdrSrNkJYhg==",
       "dependencies": {
-        "object-assign": "^4.1.1",
+        "@babel/runtime": "^7.12.5",
+        "invariant": "^2.2.4",
         "prop-types": "^15.7.2",
-        "react-fast-compare": "^3.1.1",
-        "react-side-effect": "^2.1.0"
+        "react-fast-compare": "^3.2.0",
+        "shallowequal": "^1.1.0"
       },
       "peerDependencies": {
-        "react": ">=16.3.0"
+        "react": "^16.6.0 || ^17.0.0",
+        "react-dom": "^16.6.0 || ^17.0.0"
       }
     },
     "node_modules/react-image": {
@@ -14949,14 +14950,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/react-side-effect": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.1.tgz",
-      "integrity": "sha512-2FoTQzRNTncBVtnzxFOk2mCpcfxQpenBMbk5kSVBg5UcPqV9fRbgY2zhb7GTWWOlpFmAxhClBDlIq8Rsubz1yQ==",
-      "peerDependencies": {
-        "react": "^16.3.0 || ^17.0.0"
-      }
-    },
     "node_modules/react-syntax-highlighter": {
       "version": "15.4.4",
       "resolved": "https://registry.npmjs.org/react-syntax-highlighter/-/react-syntax-highlighter-15.4.4.tgz",
@@ -16314,6 +16307,11 @@
         "sha.js": "bin.js"
       }
     },
+    "node_modules/shallowequal": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz",
+      "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ=="
+    },
     "node_modules/shebang-command": {
       "version": "2.0.0",
       "license": "MIT",
@@ -21703,14 +21701,6 @@
         "@types/react": "*"
       }
     },
-    "@types/react-helmet": {
-      "version": "6.1.4",
-      "resolved": "https://registry.npmjs.org/@types/react-helmet/-/react-helmet-6.1.4.tgz",
-      "integrity": "sha512-jyx50RNZXVaTGHY3MsoRPNpeiVk8b0XTPgD/O6KHF6COTDnG/+lRjPYvTK5nfWtR3xDOux0w6bHLAsaHo2ZLTA==",
-      "requires": {
-        "@types/react": "*"
-      }
-    },
     "@types/react-highlight": {
       "version": "0.12.5",
       "resolved": "https://registry.npmjs.org/@types/react-highlight/-/react-highlight-0.12.5.tgz",
@@ -26271,6 +26261,14 @@
         "side-channel": "^1.0.4"
       }
     },
+    "invariant": {
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
+      "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
+      "requires": {
+        "loose-envify": "^1.0.0"
+      }
+    },
     "ip": {
       "version": "1.1.5"
     },
@@ -29420,15 +29418,16 @@
       "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz",
       "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA=="
     },
-    "react-helmet": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-6.1.0.tgz",
-      "integrity": "sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==",
+    "react-helmet-async": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/react-helmet-async/-/react-helmet-async-1.1.2.tgz",
+      "integrity": "sha512-LTTzDDkyIleT/JJ6T/uqx7Y8qi1EuPPSiJawQY/nHHz0h7SPDT6HxP1YDDQx/fzcVxCqpWEEMS3QdrSrNkJYhg==",
       "requires": {
-        "object-assign": "^4.1.1",
+        "@babel/runtime": "^7.12.5",
+        "invariant": "^2.2.4",
         "prop-types": "^15.7.2",
-        "react-fast-compare": "^3.1.1",
-        "react-side-effect": "^2.1.0"
+        "react-fast-compare": "^3.2.0",
+        "shallowequal": "^1.1.0"
       }
     },
     "react-image": {
@@ -29675,12 +29674,6 @@
         }
       }
     },
-    "react-side-effect": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.1.tgz",
-      "integrity": "sha512-2FoTQzRNTncBVtnzxFOk2mCpcfxQpenBMbk5kSVBg5UcPqV9fRbgY2zhb7GTWWOlpFmAxhClBDlIq8Rsubz1yQ==",
-      "requires": {}
-    },
     "react-syntax-highlighter": {
       "version": "15.4.4",
       "resolved": "https://registry.npmjs.org/react-syntax-highlighter/-/react-syntax-highlighter-15.4.4.tgz",
@@ -30615,6 +30608,11 @@
         "safe-buffer": "^5.0.1"
       }
     },
+    "shallowequal": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz",
+      "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ=="
+    },
     "shebang-command": {
       "version": "2.0.0",
       "requires": {
diff --git a/package.json b/package.json
index 0369b84..79b4887 100644
--- a/package.json
+++ b/package.json
@@ -25,7 +25,6 @@
     "@types/react": "^17.0.31",
     "@types/react-blockies": "^1.4.1",
     "@types/react-dom": "^17.0.10",
-    "@types/react-helmet": "^6.1.4",
     "@types/react-highlight": "^0.12.5",
     "@types/react-router-dom": "^5.3.1",
     "@types/react-syntax-highlighter": "^13.5.2",
@@ -38,7 +37,7 @@
     "react-chartjs-2": "^3.2.0",
     "react-dom": "^17.0.2",
     "react-error-boundary": "^3.1.3",
-    "react-helmet": "^6.1.0",
+    "react-helmet-async": "^1.1.2",
     "react-image": "^4.0.3",
     "react-router-dom": "^5.3.0",
     "react-scripts": "4.0.3",
diff --git a/src/index.tsx b/src/index.tsx
index 29ad212..11695da 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,6 +1,6 @@
 import React from "react";
 import ReactDOM from "react-dom";
-import { Helmet } from "react-helmet";
+import { HelmetProvider, Helmet } from "react-helmet-async";
 import "@fontsource/space-grotesk/index.css";
 import "@fontsource/roboto/index.css";
 import "@fontsource/roboto-mono/index.css";
@@ -11,16 +11,18 @@ import reportWebVitals from "./reportWebVitals";
 
 ReactDOM.render(
   <React.StrictMode>
-    <Helmet>
-      <link
-        rel="preload"
-        href={spaceGrotesk}
-        as="font"
-        type="font/woff2"
-        crossOrigin="true"
-      />
-    </Helmet>
-    <App />
+    <HelmetProvider>
+      <Helmet>
+        <link
+          rel="preload"
+          href={spaceGrotesk}
+          as="font"
+          type="font/woff2"
+          crossOrigin="true"
+        />
+      </Helmet>
+      <App />
+    </HelmetProvider>
   </React.StrictMode>,
   document.getElementById("root")
 );

From ba6ec97a111c70e65a75284a870f79ef932a7c58 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Mon, 25 Oct 2021 18:18:44 +0000
Subject: [PATCH 32/62] Bump @types/react from 17.0.31 to 17.0.32 (#103)

---
 package-lock.json | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index ac44d74..5f592a5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,7 +27,7 @@
         "@testing-library/user-event": "^12.1.10",
         "@types/jest": "^26.0.24",
         "@types/node": "^14.17.5",
-        "@types/react": "^17.0.31",
+        "@types/react": "^17.0.32",
         "@types/react-blockies": "^1.4.1",
         "@types/react-dom": "^17.0.10",
         "@types/react-highlight": "^0.12.5",
@@ -3093,9 +3093,9 @@
       "license": "MIT"
     },
     "node_modules/@types/react": {
-      "version": "17.0.31",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.31.tgz",
-      "integrity": "sha512-MQSR5EL4JZtdWRvqDgz9kXhSDDoy2zMTYyg7UhP+FZ5ttUOocWyxiqFJiI57sUG0BtaEX7WDXYQlkCYkb3X9vQ==",
+      "version": "17.0.32",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.32.tgz",
+      "integrity": "sha512-hAm1pmwA3oZWbkB985RFwNvBRMG0F3KWSiC4/hNmanigKZMiKQoH5Q6etNw8HIDztTGfvXyOjPvdNnvBUCuaPg==",
       "dependencies": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
@@ -21676,9 +21676,9 @@
       "version": "1.5.4"
     },
     "@types/react": {
-      "version": "17.0.31",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.31.tgz",
-      "integrity": "sha512-MQSR5EL4JZtdWRvqDgz9kXhSDDoy2zMTYyg7UhP+FZ5ttUOocWyxiqFJiI57sUG0BtaEX7WDXYQlkCYkb3X9vQ==",
+      "version": "17.0.32",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.32.tgz",
+      "integrity": "sha512-hAm1pmwA3oZWbkB985RFwNvBRMG0F3KWSiC4/hNmanigKZMiKQoH5Q6etNw8HIDztTGfvXyOjPvdNnvBUCuaPg==",
       "requires": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
diff --git a/package.json b/package.json
index 79b4887..77cd88e 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
     "@testing-library/user-event": "^12.1.10",
     "@types/jest": "^26.0.24",
     "@types/node": "^14.17.5",
-    "@types/react": "^17.0.31",
+    "@types/react": "^17.0.32",
     "@types/react-blockies": "^1.4.1",
     "@types/react-dom": "^17.0.10",
     "@types/react-highlight": "^0.12.5",

From bec8bf1f2cde26b16f8e21327aae4eb9366173c1 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Mon, 25 Oct 2021 18:20:35 +0000
Subject: [PATCH 33/62] Bump @craco/craco from 6.3.0 to 6.4.0 (#105)

---
 package-lock.json | 179 ++++++++++++++++++++++++++++++++++++++++++++--
 package.json      |   2 +-
 2 files changed, 173 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 5f592a5..d2b729d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,7 +11,7 @@
       "dependencies": {
         "@blackbox-vision/react-qr-reader": "^5.0.0",
         "@chainlink/contracts": "^0.2.2",
-        "@craco/craco": "^6.3.0",
+        "@craco/craco": "^6.4.0",
         "@fontsource/fira-code": "^4.5.1",
         "@fontsource/roboto": "^4.5.1",
         "@fontsource/roboto-mono": "^4.5.0",
@@ -1249,10 +1249,12 @@
       }
     },
     "node_modules/@craco/craco": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/@craco/craco/-/craco-6.3.0.tgz",
-      "integrity": "sha512-SCnfEQxT/6NAbU/3sIWw7gQXtzjjiTp/EZFdJTd8inPURILIy0YajrC2p8qBG2KhFo5cwgOrEDyaGyAFvvuyuA==",
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/@craco/craco/-/craco-6.4.0.tgz",
+      "integrity": "sha512-puLp+pSL5B2tpoIPUYlWjKd0VDBPNF16BJIKEKrwg0x/9XC/4h8XPcVGNr6pd27pj8sahiH5QUdoBxB5AE9++g==",
       "dependencies": {
+        "@endemolshinegroup/cosmiconfig-typescript-loader": "^3.0.2",
+        "cosmiconfig": "^7.0.1",
         "cross-spawn": "^7.0.0",
         "lodash": "^4.17.15",
         "semver": "^7.3.2",
@@ -1268,6 +1270,38 @@
         "react-scripts": "^4.0.0"
       }
     },
+    "node_modules/@craco/craco/node_modules/@endemolshinegroup/cosmiconfig-typescript-loader": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@endemolshinegroup/cosmiconfig-typescript-loader/-/cosmiconfig-typescript-loader-3.0.2.tgz",
+      "integrity": "sha512-QRVtqJuS1mcT56oHpVegkKBlgtWjXw/gHNWO3eL9oyB5Sc7HBoc2OLG/nYpVfT/Jejvo3NUrD0Udk7XgoyDKkA==",
+      "dependencies": {
+        "lodash.get": "^4",
+        "make-error": "^1",
+        "ts-node": "^9",
+        "tslib": "^2"
+      },
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "cosmiconfig": ">=6"
+      }
+    },
+    "node_modules/@craco/craco/node_modules/cosmiconfig": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.0.1.tgz",
+      "integrity": "sha512-a1YWNUV2HwGimB7dU2s1wUMurNKjpx60HxBB6xUM8Re+2s1g1IIfJvFR0/iCF+XHdE0GMTKTuLR32UQff4TEyQ==",
+      "dependencies": {
+        "@types/parse-json": "^4.0.0",
+        "import-fresh": "^3.2.1",
+        "parse-json": "^5.0.0",
+        "path-type": "^4.0.0",
+        "yaml": "^1.10.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/@craco/craco/node_modules/semver": {
       "version": "7.3.5",
       "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.5.tgz",
@@ -6253,6 +6287,11 @@
         "sha.js": "^2.4.8"
       }
     },
+    "node_modules/create-require": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz",
+      "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ=="
+    },
     "node_modules/cross-spawn": {
       "version": "7.0.3",
       "license": "MIT",
@@ -6985,6 +7024,14 @@
       "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==",
       "dev": true
     },
+    "node_modules/diff": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
+      "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
+      "engines": {
+        "node": ">=0.3.1"
+      }
+    },
     "node_modules/diff-sequences": {
       "version": "26.6.2",
       "license": "MIT",
@@ -11397,6 +11444,11 @@
       "version": "3.0.0",
       "license": "MIT"
     },
+    "node_modules/lodash.get": {
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
+    },
     "node_modules/lodash.memoize": {
       "version": "4.1.2",
       "license": "MIT"
@@ -11521,6 +11573,11 @@
         "semver": "bin/semver.js"
       }
     },
+    "node_modules/make-error": {
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
+      "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw=="
+    },
     "node_modules/makeerror": {
       "version": "1.0.11",
       "license": "BSD-3-Clause",
@@ -18105,6 +18162,36 @@
         "node": ">=8.0.0"
       }
     },
+    "node_modules/ts-node": {
+      "version": "9.1.1",
+      "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-9.1.1.tgz",
+      "integrity": "sha512-hPlt7ZACERQGf03M253ytLY3dHbGNGrAq9qIHWUY9XHYl1z7wYngSr3OQ5xmui8o2AaxsONxIzjafLUiWBo1Fg==",
+      "dependencies": {
+        "arg": "^4.1.0",
+        "create-require": "^1.1.0",
+        "diff": "^4.0.1",
+        "make-error": "^1.1.1",
+        "source-map-support": "^0.5.17",
+        "yn": "3.1.1"
+      },
+      "bin": {
+        "ts-node": "dist/bin.js",
+        "ts-node-script": "dist/bin-script.js",
+        "ts-node-transpile-only": "dist/bin-transpile.js",
+        "ts-script": "dist/bin-script-deprecated.js"
+      },
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "typescript": ">=2.7"
+      }
+    },
+    "node_modules/ts-node/node_modules/arg": {
+      "version": "4.1.3",
+      "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
+      "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA=="
+    },
     "node_modules/ts-pnp": {
       "version": "1.2.0",
       "license": "MIT",
@@ -19701,6 +19788,14 @@
         "node": ">=6"
       }
     },
+    "node_modules/yn": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
+      "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/yocto-queue": {
       "version": "0.1.0",
       "license": "MIT",
@@ -20542,16 +20637,41 @@
       }
     },
     "@craco/craco": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/@craco/craco/-/craco-6.3.0.tgz",
-      "integrity": "sha512-SCnfEQxT/6NAbU/3sIWw7gQXtzjjiTp/EZFdJTd8inPURILIy0YajrC2p8qBG2KhFo5cwgOrEDyaGyAFvvuyuA==",
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/@craco/craco/-/craco-6.4.0.tgz",
+      "integrity": "sha512-puLp+pSL5B2tpoIPUYlWjKd0VDBPNF16BJIKEKrwg0x/9XC/4h8XPcVGNr6pd27pj8sahiH5QUdoBxB5AE9++g==",
       "requires": {
+        "@endemolshinegroup/cosmiconfig-typescript-loader": "^3.0.2",
+        "cosmiconfig": "^7.0.1",
         "cross-spawn": "^7.0.0",
         "lodash": "^4.17.15",
         "semver": "^7.3.2",
         "webpack-merge": "^4.2.2"
       },
       "dependencies": {
+        "@endemolshinegroup/cosmiconfig-typescript-loader": {
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/@endemolshinegroup/cosmiconfig-typescript-loader/-/cosmiconfig-typescript-loader-3.0.2.tgz",
+          "integrity": "sha512-QRVtqJuS1mcT56oHpVegkKBlgtWjXw/gHNWO3eL9oyB5Sc7HBoc2OLG/nYpVfT/Jejvo3NUrD0Udk7XgoyDKkA==",
+          "requires": {
+            "lodash.get": "^4",
+            "make-error": "^1",
+            "ts-node": "^9",
+            "tslib": "^2"
+          }
+        },
+        "cosmiconfig": {
+          "version": "7.0.1",
+          "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.0.1.tgz",
+          "integrity": "sha512-a1YWNUV2HwGimB7dU2s1wUMurNKjpx60HxBB6xUM8Re+2s1g1IIfJvFR0/iCF+XHdE0GMTKTuLR32UQff4TEyQ==",
+          "requires": {
+            "@types/parse-json": "^4.0.0",
+            "import-fresh": "^3.2.1",
+            "parse-json": "^5.0.0",
+            "path-type": "^4.0.0",
+            "yaml": "^1.10.0"
+          }
+        },
         "semver": {
           "version": "7.3.5",
           "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.5.tgz",
@@ -23898,6 +24018,11 @@
         "sha.js": "^2.4.8"
       }
     },
+    "create-require": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz",
+      "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ=="
+    },
     "cross-spawn": {
       "version": "7.0.3",
       "requires": {
@@ -24377,6 +24502,11 @@
       "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==",
       "dev": true
     },
+    "diff": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
+      "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A=="
+    },
     "diff-sequences": {
       "version": "26.6.2"
     },
@@ -27271,6 +27401,11 @@
     "lodash._reinterpolate": {
       "version": "3.0.0"
     },
+    "lodash.get": {
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
+    },
     "lodash.memoize": {
       "version": "4.1.2"
     },
@@ -27355,6 +27490,11 @@
         }
       }
     },
+    "make-error": {
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
+      "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw=="
+    },
     "makeerror": {
       "version": "1.0.11",
       "requires": {
@@ -31874,6 +32014,26 @@
       "resolved": "https://registry.npmjs.org/ts-custom-error/-/ts-custom-error-3.2.0.tgz",
       "integrity": "sha512-cBvC2QjtvJ9JfWLvstVnI45Y46Y5dMxIaG1TDMGAD/R87hpvqFL+7LhvUDhnRCfOnx/xitollFWWvUKKKhbN0A=="
     },
+    "ts-node": {
+      "version": "9.1.1",
+      "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-9.1.1.tgz",
+      "integrity": "sha512-hPlt7ZACERQGf03M253ytLY3dHbGNGrAq9qIHWUY9XHYl1z7wYngSr3OQ5xmui8o2AaxsONxIzjafLUiWBo1Fg==",
+      "requires": {
+        "arg": "^4.1.0",
+        "create-require": "^1.1.0",
+        "diff": "^4.0.1",
+        "make-error": "^1.1.1",
+        "source-map-support": "^0.5.17",
+        "yn": "3.1.1"
+      },
+      "dependencies": {
+        "arg": {
+          "version": "4.1.3",
+          "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
+          "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA=="
+        }
+      }
+    },
     "ts-pnp": {
       "version": "1.2.0"
     },
@@ -32976,6 +33136,11 @@
         "decamelize": "^1.2.0"
       }
     },
+    "yn": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
+      "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q=="
+    },
     "yocto-queue": {
       "version": "0.1.0"
     }
diff --git a/package.json b/package.json
index 77cd88e..667d5dc 100644
--- a/package.json
+++ b/package.json
@@ -6,7 +6,7 @@
   "dependencies": {
     "@blackbox-vision/react-qr-reader": "^5.0.0",
     "@chainlink/contracts": "^0.2.2",
-    "@craco/craco": "^6.3.0",
+    "@craco/craco": "^6.4.0",
     "@fontsource/fira-code": "^4.5.1",
     "@fontsource/roboto": "^4.5.1",
     "@fontsource/roboto-mono": "^4.5.0",

From 7f5d0dcb9ff0e286c5ad6b4f6f6a96742a7c0f0a Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Thu, 28 Oct 2021 08:27:26 +0000
Subject: [PATCH 34/62] Bump @types/react from 17.0.32 to 17.0.33 (#107)

---
 package-lock.json | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index d2b729d..3ae9191 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,7 +27,7 @@
         "@testing-library/user-event": "^12.1.10",
         "@types/jest": "^26.0.24",
         "@types/node": "^14.17.5",
-        "@types/react": "^17.0.32",
+        "@types/react": "^17.0.33",
         "@types/react-blockies": "^1.4.1",
         "@types/react-dom": "^17.0.10",
         "@types/react-highlight": "^0.12.5",
@@ -3127,9 +3127,9 @@
       "license": "MIT"
     },
     "node_modules/@types/react": {
-      "version": "17.0.32",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.32.tgz",
-      "integrity": "sha512-hAm1pmwA3oZWbkB985RFwNvBRMG0F3KWSiC4/hNmanigKZMiKQoH5Q6etNw8HIDztTGfvXyOjPvdNnvBUCuaPg==",
+      "version": "17.0.33",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.33.tgz",
+      "integrity": "sha512-pLWntxXpDPaU+RTAuSGWGSEL2FRTNyRQOjSWDke/rxRg14ncsZvx8AKWMWZqvc1UOaJIAoObdZhAWvRaHFi5rw==",
       "dependencies": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
@@ -21796,9 +21796,9 @@
       "version": "1.5.4"
     },
     "@types/react": {
-      "version": "17.0.32",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.32.tgz",
-      "integrity": "sha512-hAm1pmwA3oZWbkB985RFwNvBRMG0F3KWSiC4/hNmanigKZMiKQoH5Q6etNw8HIDztTGfvXyOjPvdNnvBUCuaPg==",
+      "version": "17.0.33",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.33.tgz",
+      "integrity": "sha512-pLWntxXpDPaU+RTAuSGWGSEL2FRTNyRQOjSWDke/rxRg14ncsZvx8AKWMWZqvc1UOaJIAoObdZhAWvRaHFi5rw==",
       "requires": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
diff --git a/package.json b/package.json
index 667d5dc..306efd4 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
     "@testing-library/user-event": "^12.1.10",
     "@types/jest": "^26.0.24",
     "@types/node": "^14.17.5",
-    "@types/react": "^17.0.32",
+    "@types/react": "^17.0.33",
     "@types/react-blockies": "^1.4.1",
     "@types/react-dom": "^17.0.10",
     "@types/react-highlight": "^0.12.5",

From 0edabe67a781e69c797ced48591cdaa5f21c044d Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Thu, 28 Oct 2021 08:27:38 +0000
Subject: [PATCH 35/62] Bump @types/react-router-dom from 5.3.1 to 5.3.2 (#106)

---
 package-lock.json | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 3ae9191..b70448d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -31,7 +31,7 @@
         "@types/react-blockies": "^1.4.1",
         "@types/react-dom": "^17.0.10",
         "@types/react-highlight": "^0.12.5",
-        "@types/react-router-dom": "^5.3.1",
+        "@types/react-router-dom": "^5.3.2",
         "@types/react-syntax-highlighter": "^13.5.2",
         "chart.js": "^3.5.1",
         "ethers": "^5.5.1",
@@ -3170,9 +3170,9 @@
       }
     },
     "node_modules/@types/react-router-dom": {
-      "version": "5.3.1",
-      "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.1.tgz",
-      "integrity": "sha512-UvyRy73318QI83haXlaMwmklHHzV9hjl3u71MmM6wYNu0hOVk9NLTa0vGukf8zXUqnwz4O06ig876YSPpeK28A==",
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.2.tgz",
+      "integrity": "sha512-ELEYRUie2czuJzaZ5+ziIp9Hhw+juEw8b7C11YNA4QdLCVbQ3qLi2l4aq8XnlqM7V31LZX8dxUuFUCrzHm6sqQ==",
       "dependencies": {
         "@types/history": "*",
         "@types/react": "*",
@@ -21839,9 +21839,9 @@
       }
     },
     "@types/react-router-dom": {
-      "version": "5.3.1",
-      "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.1.tgz",
-      "integrity": "sha512-UvyRy73318QI83haXlaMwmklHHzV9hjl3u71MmM6wYNu0hOVk9NLTa0vGukf8zXUqnwz4O06ig876YSPpeK28A==",
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/@types/react-router-dom/-/react-router-dom-5.3.2.tgz",
+      "integrity": "sha512-ELEYRUie2czuJzaZ5+ziIp9Hhw+juEw8b7C11YNA4QdLCVbQ3qLi2l4aq8XnlqM7V31LZX8dxUuFUCrzHm6sqQ==",
       "requires": {
         "@types/history": "*",
         "@types/react": "*",
diff --git a/package.json b/package.json
index 306efd4..fbdc9a9 100644
--- a/package.json
+++ b/package.json
@@ -26,7 +26,7 @@
     "@types/react-blockies": "^1.4.1",
     "@types/react-dom": "^17.0.10",
     "@types/react-highlight": "^0.12.5",
-    "@types/react-router-dom": "^5.3.1",
+    "@types/react-router-dom": "^5.3.2",
     "@types/react-syntax-highlighter": "^13.5.2",
     "chart.js": "^3.5.1",
     "ethers": "^5.5.1",

From 75612fc3cc95f269935a17b53d7ee6e52473936c Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Thu, 28 Oct 2021 08:29:03 +0000
Subject: [PATCH 36/62] Bump react-chartjs-2 from 3.2.0 to 3.3.0 (#108)

---
 package-lock.json | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index b70448d..e441646 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -39,7 +39,7 @@
         "query-string": "^7.0.1",
         "react": "^17.0.2",
         "react-blockies": "^1.4.1",
-        "react-chartjs-2": "^3.2.0",
+        "react-chartjs-2": "^3.3.0",
         "react-dom": "^17.0.2",
         "react-error-boundary": "^3.1.3",
         "react-helmet-async": "^1.1.2",
@@ -14476,9 +14476,9 @@
       }
     },
     "node_modules/react-chartjs-2": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.2.0.tgz",
-      "integrity": "sha512-UFedkfhOriqyslqYMrdK225TdxFq6YSmGJVQplLC37eoKBfbpkJHxVq+SPMpoVY2oV9fx33RrD4Obv0wKZtclw==",
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.3.0.tgz",
+      "integrity": "sha512-4Mt0SR2aiUbWi/4762odRBYSnbNKSs4HWc0o3IW43py5bMfmfpeZU95w6mbvtuLZH/M3GsPJMU8DvDc+5U9blQ==",
       "peerDependencies": {
         "chart.js": "^3.5.0",
         "react": "^16.8.0 || ^17.0.0"
@@ -29444,9 +29444,9 @@
       }
     },
     "react-chartjs-2": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.2.0.tgz",
-      "integrity": "sha512-UFedkfhOriqyslqYMrdK225TdxFq6YSmGJVQplLC37eoKBfbpkJHxVq+SPMpoVY2oV9fx33RrD4Obv0wKZtclw==",
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-3.3.0.tgz",
+      "integrity": "sha512-4Mt0SR2aiUbWi/4762odRBYSnbNKSs4HWc0o3IW43py5bMfmfpeZU95w6mbvtuLZH/M3GsPJMU8DvDc+5U9blQ==",
       "requires": {}
     },
     "react-dev-utils": {
diff --git a/package.json b/package.json
index fbdc9a9..64fe411 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
     "query-string": "^7.0.1",
     "react": "^17.0.2",
     "react-blockies": "^1.4.1",
-    "react-chartjs-2": "^3.2.0",
+    "react-chartjs-2": "^3.3.0",
     "react-dom": "^17.0.2",
     "react-error-boundary": "^3.1.3",
     "react-helmet-async": "^1.1.2",

From 6fefb2e7f94e666ee720ec44ea4ac67cd31bc477 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 05:04:19 -0300
Subject: [PATCH 37/62] Update topic0 to 0.2.1

---
 topic0 | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/topic0 b/topic0
index 52559d5..5026a20 160000
--- a/topic0
+++ b/topic0
@@ -1 +1 @@
-Subproject commit 52559d5690d491f8191a2d3fdb3c037516adc68f
+Subproject commit 5026a20b712c1cad66878821c38e1f070e4a3799

From 19f7af84a5c8f3df70f0d0e0c67ddb07103f3423 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 21:06:11 -0300
Subject: [PATCH 38/62] Extract resolver api

---
 .../CompositeAddressResolver.ts               | 26 +++++++++++++++
 .../address-resolver/ENSAddressResolver.ts    | 15 +++++++++
 src/api/address-resolver/address-resolver.ts  |  8 +++++
 src/api/address-resolver/index.ts             | 33 +++++++++++++++++++
 src/types.ts                                  |  4 +--
 src/useReverseCache.ts                        | 16 ++-------
 6 files changed, 85 insertions(+), 17 deletions(-)
 create mode 100644 src/api/address-resolver/CompositeAddressResolver.ts
 create mode 100644 src/api/address-resolver/ENSAddressResolver.ts
 create mode 100644 src/api/address-resolver/address-resolver.ts
 create mode 100644 src/api/address-resolver/index.ts

diff --git a/src/api/address-resolver/CompositeAddressResolver.ts b/src/api/address-resolver/CompositeAddressResolver.ts
new file mode 100644
index 0000000..bee73da
--- /dev/null
+++ b/src/api/address-resolver/CompositeAddressResolver.ts
@@ -0,0 +1,26 @@
+import { BaseProvider } from "@ethersproject/providers";
+import { IAddressResolver } from "./address-resolver";
+
+export class CompositeAddressResolver implements IAddressResolver {
+  private resolvers: IAddressResolver[] = [];
+
+  addResolver(resolver: IAddressResolver) {
+    this.resolvers.push(resolver);
+  }
+
+  async resolveAddress(
+    provider: BaseProvider,
+    address: string
+  ): Promise<string | undefined> {
+    for (const r of this.resolvers) {
+      const name = r.resolveAddress(provider, address);
+      if (name !== undefined) {
+        return name;
+      }
+    }
+
+    return undefined;
+    // TODO: fallback to address itself
+    // return address;
+  }
+}
diff --git a/src/api/address-resolver/ENSAddressResolver.ts b/src/api/address-resolver/ENSAddressResolver.ts
new file mode 100644
index 0000000..ef45a64
--- /dev/null
+++ b/src/api/address-resolver/ENSAddressResolver.ts
@@ -0,0 +1,15 @@
+import { BaseProvider } from "@ethersproject/providers";
+import { IAddressResolver } from "./address-resolver";
+
+export class ENSAddressResolver implements IAddressResolver {
+  async resolveAddress(
+    provider: BaseProvider,
+    address: string
+  ): Promise<string | undefined> {
+    const name = await provider.lookupAddress(address);
+    if (name === null) {
+      return undefined;
+    }
+    return name;
+  }
+}
diff --git a/src/api/address-resolver/address-resolver.ts b/src/api/address-resolver/address-resolver.ts
new file mode 100644
index 0000000..246db34
--- /dev/null
+++ b/src/api/address-resolver/address-resolver.ts
@@ -0,0 +1,8 @@
+import { BaseProvider } from "@ethersproject/providers";
+
+export interface IAddressResolver {
+  resolveAddress(
+    provider: BaseProvider,
+    address: string
+  ): Promise<string | undefined>;
+}
diff --git a/src/api/address-resolver/index.ts b/src/api/address-resolver/index.ts
new file mode 100644
index 0000000..a9b4ff6
--- /dev/null
+++ b/src/api/address-resolver/index.ts
@@ -0,0 +1,33 @@
+import { BaseProvider } from "@ethersproject/providers";
+import { ENSReverseCache } from "../../types";
+import { IAddressResolver } from "./address-resolver";
+import { CompositeAddressResolver } from "./CompositeAddressResolver";
+import { ENSAddressResolver } from "./ENSAddressResolver";
+
+// Create and configure the main resolver
+const _mainResolver = new CompositeAddressResolver();
+_mainResolver.addResolver(new ENSAddressResolver());
+
+export const mainResolver: IAddressResolver = _mainResolver;
+
+export const batchPopulate = async (
+  provider: BaseProvider,
+  addresses: string[]
+): Promise<ENSReverseCache> => {
+  const solvers: Promise<string | undefined>[] = [];
+  for (const a of addresses) {
+    solvers.push(mainResolver.resolveAddress(provider, a));
+  }
+
+  const results = await Promise.all(solvers);
+  const cache: ENSReverseCache = {};
+  for (let i = 0; i < results.length; i++) {
+    const r = results[i];
+    if (r === undefined) {
+      continue;
+    }
+    cache[addresses[i]] = r;
+  }
+
+  return cache;
+};
diff --git a/src/types.ts b/src/types.ts
index 5904b31..76a1944 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -32,9 +32,7 @@ export type TransactionChunk = {
   lastPage: boolean;
 };
 
-export type ENSReverseCache = {
-  [address: string]: string;
-};
+export type ENSReverseCache = Record<string, string>;
 
 export type TransactionData = {
   transactionHash: string;
diff --git a/src/useReverseCache.ts b/src/useReverseCache.ts
index 365888a..fa0ca1a 100644
--- a/src/useReverseCache.ts
+++ b/src/useReverseCache.ts
@@ -1,6 +1,7 @@
 import { useState, useEffect } from "react";
 import { JsonRpcProvider } from "@ethersproject/providers";
 import { ENSReverseCache, ProcessedTransaction } from "./types";
+import { batchPopulate } from "./api/address-resolver";
 
 export const useENSCache = (
   provider?: JsonRpcProvider,
@@ -25,20 +26,7 @@ export const useENSCache = (
     const addresses = Array.from(addrSet);
 
     const reverseResolve = async () => {
-      const solvers: Promise<string | null>[] = [];
-      for (const a of addresses) {
-        solvers.push(provider.lookupAddress(a));
-      }
-
-      const results = await Promise.all(solvers);
-      const cache: ENSReverseCache = {};
-      for (let i = 0; i < results.length; i++) {
-        const r = results[i];
-        if (r === null) {
-          continue;
-        }
-        cache[addresses[i]] = r;
-      }
+      const cache = await batchPopulate(provider, addresses);
       setReverseCache(cache);
     };
     reverseResolve();

From b8eea08f4d623a944e1d5ecc3f9a205b913d1052 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 21:08:10 -0300
Subject: [PATCH 39/62] Move type

---
 src/api/address-resolver/index.ts | 3 ++-
 src/search/TransactionItem.tsx    | 3 ++-
 src/types.ts                      | 2 --
 src/useReverseCache.ts            | 4 ++--
 4 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/api/address-resolver/index.ts b/src/api/address-resolver/index.ts
index a9b4ff6..9bc5833 100644
--- a/src/api/address-resolver/index.ts
+++ b/src/api/address-resolver/index.ts
@@ -1,9 +1,10 @@
 import { BaseProvider } from "@ethersproject/providers";
-import { ENSReverseCache } from "../../types";
 import { IAddressResolver } from "./address-resolver";
 import { CompositeAddressResolver } from "./CompositeAddressResolver";
 import { ENSAddressResolver } from "./ENSAddressResolver";
 
+export type ENSReverseCache = Record<string, string>;
+
 // Create and configure the main resolver
 const _mainResolver = new CompositeAddressResolver();
 _mainResolver.addResolver(new ENSAddressResolver());
diff --git a/src/search/TransactionItem.tsx b/src/search/TransactionItem.tsx
index 76e58e7..57fb7e4 100644
--- a/src/search/TransactionItem.tsx
+++ b/src/search/TransactionItem.tsx
@@ -14,10 +14,11 @@ import TransactionDirection, {
   Flags,
 } from "../components/TransactionDirection";
 import TransactionValue from "../components/TransactionValue";
-import { ENSReverseCache, ProcessedTransaction } from "../types";
+import { ProcessedTransaction } from "../types";
 import { FeeDisplay } from "./useFeeToggler";
 import { formatValue } from "../components/formatter";
 import ETH2USDValue from "../components/ETH2USDValue";
+import { ENSReverseCache } from "../api/address-resolver";
 
 type TransactionItemProps = {
   tx: ProcessedTransaction;
diff --git a/src/types.ts b/src/types.ts
index 76a1944..12763bb 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -32,8 +32,6 @@ export type TransactionChunk = {
   lastPage: boolean;
 };
 
-export type ENSReverseCache = Record<string, string>;
-
 export type TransactionData = {
   transactionHash: string;
   from: string;
diff --git a/src/useReverseCache.ts b/src/useReverseCache.ts
index fa0ca1a..25d0774 100644
--- a/src/useReverseCache.ts
+++ b/src/useReverseCache.ts
@@ -1,7 +1,7 @@
 import { useState, useEffect } from "react";
 import { JsonRpcProvider } from "@ethersproject/providers";
-import { ENSReverseCache, ProcessedTransaction } from "./types";
-import { batchPopulate } from "./api/address-resolver";
+import { ProcessedTransaction } from "./types";
+import { batchPopulate, ENSReverseCache } from "./api/address-resolver";
 
 export const useENSCache = (
   provider?: JsonRpcProvider,

From 60ead1ba494227cebe8cfd946993a366ab5ca3d6 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 21:10:15 -0300
Subject: [PATCH 40/62] Rename type

---
 src/api/address-resolver/index.ts | 6 +++---
 src/search/TransactionItem.tsx    | 4 ++--
 src/useReverseCache.ts            | 4 ++--
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/api/address-resolver/index.ts b/src/api/address-resolver/index.ts
index 9bc5833..cc4fe1b 100644
--- a/src/api/address-resolver/index.ts
+++ b/src/api/address-resolver/index.ts
@@ -3,7 +3,7 @@ import { IAddressResolver } from "./address-resolver";
 import { CompositeAddressResolver } from "./CompositeAddressResolver";
 import { ENSAddressResolver } from "./ENSAddressResolver";
 
-export type ENSReverseCache = Record<string, string>;
+export type ResolvedAddresses = Record<string, string>;
 
 // Create and configure the main resolver
 const _mainResolver = new CompositeAddressResolver();
@@ -14,14 +14,14 @@ export const mainResolver: IAddressResolver = _mainResolver;
 export const batchPopulate = async (
   provider: BaseProvider,
   addresses: string[]
-): Promise<ENSReverseCache> => {
+): Promise<ResolvedAddresses> => {
   const solvers: Promise<string | undefined>[] = [];
   for (const a of addresses) {
     solvers.push(mainResolver.resolveAddress(provider, a));
   }
 
   const results = await Promise.all(solvers);
-  const cache: ENSReverseCache = {};
+  const cache: ResolvedAddresses = {};
   for (let i = 0; i < results.length; i++) {
     const r = results[i];
     if (r === undefined) {
diff --git a/src/search/TransactionItem.tsx b/src/search/TransactionItem.tsx
index 57fb7e4..3917e24 100644
--- a/src/search/TransactionItem.tsx
+++ b/src/search/TransactionItem.tsx
@@ -18,11 +18,11 @@ import { ProcessedTransaction } from "../types";
 import { FeeDisplay } from "./useFeeToggler";
 import { formatValue } from "../components/formatter";
 import ETH2USDValue from "../components/ETH2USDValue";
-import { ENSReverseCache } from "../api/address-resolver";
+import { ResolvedAddresses } from "../api/address-resolver";
 
 type TransactionItemProps = {
   tx: ProcessedTransaction;
-  ensCache?: ENSReverseCache;
+  ensCache?: ResolvedAddresses;
   selectedAddress?: string;
   feeDisplay: FeeDisplay;
   priceMap: Record<BlockTag, BigNumber>;
diff --git a/src/useReverseCache.ts b/src/useReverseCache.ts
index 25d0774..e931e58 100644
--- a/src/useReverseCache.ts
+++ b/src/useReverseCache.ts
@@ -1,13 +1,13 @@
 import { useState, useEffect } from "react";
 import { JsonRpcProvider } from "@ethersproject/providers";
 import { ProcessedTransaction } from "./types";
-import { batchPopulate, ENSReverseCache } from "./api/address-resolver";
+import { batchPopulate, ResolvedAddresses } from "./api/address-resolver";
 
 export const useENSCache = (
   provider?: JsonRpcProvider,
   page?: ProcessedTransaction[]
 ) => {
-  const [reverseCache, setReverseCache] = useState<ENSReverseCache>();
+  const [reverseCache, setReverseCache] = useState<ResolvedAddresses>();
 
   useEffect(() => {
     if (!provider || !page) {

From 9da41d0a2e8406563d59d2ee493556e047121e33 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 21:14:11 -0300
Subject: [PATCH 41/62] Typo fix

---
 src/components/DecoratedAddressLink.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/DecoratedAddressLink.tsx b/src/components/DecoratedAddressLink.tsx
index 0b38fab..ca42a90 100644
--- a/src/components/DecoratedAddressLink.tsx
+++ b/src/components/DecoratedAddressLink.tsx
@@ -23,7 +23,7 @@ type DecoratedAddressLinkProps = {
   tokenMeta?: TokenMeta;
 };
 
-const DecoratedAddresssLink: React.FC<DecoratedAddressLinkProps> = ({
+const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
   address,
   ensName,
   selectedAddress,
@@ -90,4 +90,4 @@ const DecoratedAddresssLink: React.FC<DecoratedAddressLinkProps> = ({
   );
 };
 
-export default React.memo(DecoratedAddresssLink);
+export default React.memo(DecoratedAddressLink);

From a0675c637780eb45c8539c467e4f5f211ec4f460 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 21:31:31 -0300
Subject: [PATCH 42/62] Use ResolvedAddresses table instead of pre-resolved
 name parameter

---
 src/AddressTransactions.tsx             |  4 +-
 src/block/BlockTransactionResults.tsx   |  4 +-
 src/components/AddressOrENSName.tsx     | 66 +++++++++++++------------
 src/components/DecoratedAddressLink.tsx |  7 +--
 src/search/TransactionItem.tsx          | 16 ++----
 5 files changed, 48 insertions(+), 49 deletions(-)

diff --git a/src/AddressTransactions.tsx b/src/AddressTransactions.tsx
index 53f92bf..3bbd6df 100644
--- a/src/AddressTransactions.tsx
+++ b/src/AddressTransactions.tsx
@@ -165,7 +165,7 @@ const AddressTransactions: React.FC = () => {
   }, [provider, checksummedAddress, params.direction, hash, controller]);
 
   const page = useMemo(() => controller?.getPage(), [controller]);
-  const reverseCache = useENSCache(provider, page);
+  const resolvedAddresses = useENSCache(provider, page);
 
   const blockTags: BlockTag[] = useMemo(() => {
     if (!page) {
@@ -283,7 +283,7 @@ const AddressTransactions: React.FC = () => {
                             <TransactionItem
                               key={tx.hash}
                               tx={tx}
-                              ensCache={reverseCache}
+                              resolvedAddresses={resolvedAddresses}
                               selectedAddress={checksummedAddress}
                               feeDisplay={feeDisplay}
                               priceMap={priceMap}
diff --git a/src/block/BlockTransactionResults.tsx b/src/block/BlockTransactionResults.tsx
index b911013..f6eb4de 100644
--- a/src/block/BlockTransactionResults.tsx
+++ b/src/block/BlockTransactionResults.tsx
@@ -29,7 +29,7 @@ const BlockTransactionResults: React.FC<BlockTransactionResultsProps> = ({
   const selectionCtx = useSelection();
   const [feeDisplay, feeDisplayToggler] = useFeeToggler();
   const { provider } = useContext(RuntimeContext);
-  const reverseCache = useENSCache(provider, page);
+  const resolvedAddresses = useENSCache(provider, page);
   const blockTags = useMemo(() => [blockTag], [blockTag]);
   const priceMap = useMultipleETHUSDOracle(provider, blockTags);
 
@@ -59,7 +59,7 @@ const BlockTransactionResults: React.FC<BlockTransactionResultsProps> = ({
             <TransactionItem
               key={tx.hash}
               tx={tx}
-              ensCache={reverseCache}
+              resolvedAddresses={resolvedAddresses}
               feeDisplay={feeDisplay}
               priceMap={priceMap}
             />
diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx
index 9cb2f9e..43d40e1 100644
--- a/src/components/AddressOrENSName.tsx
+++ b/src/components/AddressOrENSName.tsx
@@ -3,49 +3,53 @@ import Address from "./Address";
 import AddressLink from "./AddressLink";
 import ENSName from "./ENSName";
 import ENSNameLink from "./ENSNameLink";
+import { ResolvedAddresses } from "../api/address-resolver";
 
 type AddressOrENSNameProps = {
   address: string;
-  ensName?: string;
   selectedAddress?: string;
   text?: string;
   dontOverrideColors?: boolean;
+  resolvedAddresses?: ResolvedAddresses | undefined;
 };
 
 const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
   address,
-  ensName,
   selectedAddress,
   text,
   dontOverrideColors,
-}) => (
-  <>
-    {address === selectedAddress ? (
-      <>
-        {ensName ? (
-          <ENSName name={ensName} address={address} />
-        ) : (
-          <Address address={address} />
-        )}
-      </>
-    ) : (
-      <>
-        {ensName ? (
-          <ENSNameLink
-            name={ensName}
-            address={address}
-            dontOverrideColors={dontOverrideColors}
-          />
-        ) : (
-          <AddressLink
-            address={address}
-            text={text}
-            dontOverrideColors={dontOverrideColors}
-          />
-        )}
-      </>
-    )}
-  </>
-);
+  resolvedAddresses,
+}) => {
+  const name = resolvedAddresses?.[address];
+  return (
+    <>
+      {address === selectedAddress ? (
+        <>
+          {name ? (
+            <ENSName name={name} address={address} />
+          ) : (
+            <Address address={address} />
+          )}
+        </>
+      ) : (
+        <>
+          {name ? (
+            <ENSNameLink
+              name={name}
+              address={address}
+              dontOverrideColors={dontOverrideColors}
+            />
+          ) : (
+            <AddressLink
+              address={address}
+              text={text}
+              dontOverrideColors={dontOverrideColors}
+            />
+          )}
+        </>
+      )}
+    </>
+  );
+};
 
 export default React.memo(AddressOrENSName);
diff --git a/src/components/DecoratedAddressLink.tsx b/src/components/DecoratedAddressLink.tsx
index ca42a90..ee88b31 100644
--- a/src/components/DecoratedAddressLink.tsx
+++ b/src/components/DecoratedAddressLink.tsx
@@ -8,10 +8,10 @@ import { faCoins } from "@fortawesome/free-solid-svg-icons/faCoins";
 import TokenLogo from "./TokenLogo";
 import AddressOrENSName from "./AddressOrENSName";
 import { AddressContext, TokenMeta, ZERO_ADDRESS } from "../types";
+import { ResolvedAddresses } from "../api/address-resolver";
 
 type DecoratedAddressLinkProps = {
   address: string;
-  ensName?: string;
   selectedAddress?: string;
   text?: string;
   addressCtx?: AddressContext;
@@ -21,11 +21,11 @@ type DecoratedAddressLinkProps = {
   txFrom?: boolean;
   txTo?: boolean;
   tokenMeta?: TokenMeta;
+  resolvedAddresses?: ResolvedAddresses | undefined;
 };
 
 const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
   address,
-  ensName,
   selectedAddress,
   text,
   addressCtx,
@@ -35,6 +35,7 @@ const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
   txFrom,
   txTo,
   tokenMeta,
+  resolvedAddresses,
 }) => {
   const mint = addressCtx === AddressContext.FROM && address === ZERO_ADDRESS;
   const burn = addressCtx === AddressContext.TO && address === ZERO_ADDRESS;
@@ -81,10 +82,10 @@ const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
       )}
       <AddressOrENSName
         address={address}
-        ensName={ensName}
         selectedAddress={selectedAddress}
         text={text}
         dontOverrideColors={mint || burn}
+        resolvedAddresses={resolvedAddresses}
       />
     </div>
   );
diff --git a/src/search/TransactionItem.tsx b/src/search/TransactionItem.tsx
index 3917e24..f71457e 100644
--- a/src/search/TransactionItem.tsx
+++ b/src/search/TransactionItem.tsx
@@ -22,7 +22,7 @@ import { ResolvedAddresses } from "../api/address-resolver";
 
 type TransactionItemProps = {
   tx: ProcessedTransaction;
-  ensCache?: ResolvedAddresses;
+  resolvedAddresses?: ResolvedAddresses;
   selectedAddress?: string;
   feeDisplay: FeeDisplay;
   priceMap: Record<BlockTag, BigNumber>;
@@ -30,7 +30,7 @@ type TransactionItemProps = {
 
 const TransactionItem: React.FC<TransactionItemProps> = ({
   tx,
-  ensCache,
+  resolvedAddresses,
   selectedAddress,
   feeDisplay,
   priceMap,
@@ -51,12 +51,6 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
     }
   }
 
-  const ensFrom = ensCache && tx.from && ensCache[tx.from];
-  const ensTo = ensCache && tx.to && ensCache[tx.to];
-  const ensCreated =
-    ensCache &&
-    tx.createdContractAddress &&
-    ensCache[tx.createdContractAddress];
   const flash = tx.gasPrice.isZero() && tx.internalMinerInteraction;
 
   return (
@@ -88,9 +82,9 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
             <AddressHighlighter address={tx.from}>
               <DecoratedAddressLink
                 address={tx.from}
-                ensName={ensFrom}
                 selectedAddress={selectedAddress}
                 miner={tx.miner === tx.from}
+                resolvedAddresses={resolvedAddresses}
               />
             </AddressHighlighter>
           )}
@@ -108,18 +102,18 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
             <AddressHighlighter address={tx.to}>
               <DecoratedAddressLink
                 address={tx.to}
-                ensName={ensTo}
                 selectedAddress={selectedAddress}
                 miner={tx.miner === tx.to}
+                resolvedAddresses={resolvedAddresses}
               />
             </AddressHighlighter>
           ) : (
             <AddressHighlighter address={tx.createdContractAddress!}>
               <DecoratedAddressLink
                 address={tx.createdContractAddress!}
-                ensName={ensCreated}
                 selectedAddress={selectedAddress}
                 creation
+                resolvedAddresses={resolvedAddresses}
               />
             </AddressHighlighter>
           )}

From b770bb5fb5863e89e3cf154461d3c3bf1c79cb38 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 21:49:23 -0300
Subject: [PATCH 43/62] Migrate search results to page collector name hooks

---
 src/AddressTransactions.tsx           |  5 +--
 src/block/BlockTransactionResults.tsx |  5 +--
 src/useResolvedAddresses.ts           | 48 +++++++++++++++++++++++++++
 src/useReverseCache.ts                | 36 --------------------
 4 files changed, 54 insertions(+), 40 deletions(-)
 create mode 100644 src/useResolvedAddresses.ts
 delete mode 100644 src/useReverseCache.ts

diff --git a/src/AddressTransactions.tsx b/src/AddressTransactions.tsx
index 3bbd6df..9fbbec6 100644
--- a/src/AddressTransactions.tsx
+++ b/src/AddressTransactions.tsx
@@ -26,7 +26,7 @@ import PendingResults from "./search/PendingResults";
 import TransactionItem from "./search/TransactionItem";
 import { SearchController } from "./search/search";
 import { RuntimeContext } from "./useRuntime";
-import { useENSCache } from "./useReverseCache";
+import { pageCollector, useResolvedAddresses } from "./useResolvedAddresses";
 import { useFeeToggler } from "./search/useFeeToggler";
 import { SelectionContext, useSelection } from "./useSelection";
 import { useMultipleETHUSDOracle } from "./usePriceOracle";
@@ -165,7 +165,8 @@ const AddressTransactions: React.FC = () => {
   }, [provider, checksummedAddress, params.direction, hash, controller]);
 
   const page = useMemo(() => controller?.getPage(), [controller]);
-  const resolvedAddresses = useENSCache(provider, page);
+  const addrCollector = useMemo(() => pageCollector(page), [page]);
+  const resolvedAddresses = useResolvedAddresses(provider, addrCollector);
 
   const blockTags: BlockTag[] = useMemo(() => {
     if (!page) {
diff --git a/src/block/BlockTransactionResults.tsx b/src/block/BlockTransactionResults.tsx
index f6eb4de..f9cfc27 100644
--- a/src/block/BlockTransactionResults.tsx
+++ b/src/block/BlockTransactionResults.tsx
@@ -8,7 +8,7 @@ import TransactionItem from "../search/TransactionItem";
 import { useFeeToggler } from "../search/useFeeToggler";
 import { RuntimeContext } from "../useRuntime";
 import { SelectionContext, useSelection } from "../useSelection";
-import { useENSCache } from "../useReverseCache";
+import { pageCollector, useResolvedAddresses } from "../useResolvedAddresses";
 import { ProcessedTransaction } from "../types";
 import { PAGE_SIZE } from "../params";
 import { useMultipleETHUSDOracle } from "../usePriceOracle";
@@ -29,7 +29,8 @@ const BlockTransactionResults: React.FC<BlockTransactionResultsProps> = ({
   const selectionCtx = useSelection();
   const [feeDisplay, feeDisplayToggler] = useFeeToggler();
   const { provider } = useContext(RuntimeContext);
-  const resolvedAddresses = useENSCache(provider, page);
+  const addrCollector = useMemo(() => pageCollector(page), [page]);
+  const resolvedAddresses = useResolvedAddresses(provider, addrCollector);
   const blockTags = useMemo(() => [blockTag], [blockTag]);
   const priceMap = useMultipleETHUSDOracle(provider, blockTags);
 
diff --git a/src/useResolvedAddresses.ts b/src/useResolvedAddresses.ts
new file mode 100644
index 0000000..3eefdf0
--- /dev/null
+++ b/src/useResolvedAddresses.ts
@@ -0,0 +1,48 @@
+import { useState, useEffect } from "react";
+import { JsonRpcProvider } from "@ethersproject/providers";
+import { ProcessedTransaction } from "./types";
+import { batchPopulate, ResolvedAddresses } from "./api/address-resolver";
+
+export type AddressCollector = () => string[];
+
+export const pageCollector =
+  (page: ProcessedTransaction[] | undefined): AddressCollector =>
+  () => {
+    if (!page) {
+      return [];
+    }
+
+    const uniqueAddresses = new Set<string>();
+    for (const tx of page) {
+      if (tx.from) {
+        uniqueAddresses.add(tx.from);
+      }
+      if (tx.to) {
+        uniqueAddresses.add(tx.to);
+      }
+    }
+
+    return Array.from(uniqueAddresses);
+  };
+
+export const useResolvedAddresses = (
+  provider: JsonRpcProvider | undefined,
+  addrCollector: AddressCollector
+) => {
+  const [names, setNames] = useState<ResolvedAddresses>();
+
+  useEffect(() => {
+    if (!provider) {
+      return;
+    }
+
+    const populate = async () => {
+      const _addresses = addrCollector();
+      const _names = await batchPopulate(provider, _addresses);
+      setNames(_names);
+    };
+    populate();
+  }, [provider, addrCollector]);
+
+  return names;
+};
diff --git a/src/useReverseCache.ts b/src/useReverseCache.ts
deleted file mode 100644
index e931e58..0000000
--- a/src/useReverseCache.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import { useState, useEffect } from "react";
-import { JsonRpcProvider } from "@ethersproject/providers";
-import { ProcessedTransaction } from "./types";
-import { batchPopulate, ResolvedAddresses } from "./api/address-resolver";
-
-export const useENSCache = (
-  provider?: JsonRpcProvider,
-  page?: ProcessedTransaction[]
-) => {
-  const [reverseCache, setReverseCache] = useState<ResolvedAddresses>();
-
-  useEffect(() => {
-    if (!provider || !page) {
-      return;
-    }
-
-    const addrSet = new Set<string>();
-    for (const tx of page) {
-      if (tx.from) {
-        addrSet.add(tx.from);
-      }
-      if (tx.to) {
-        addrSet.add(tx.to);
-      }
-    }
-    const addresses = Array.from(addrSet);
-
-    const reverseResolve = async () => {
-      const cache = await batchPopulate(provider, addresses);
-      setReverseCache(cache);
-    };
-    reverseResolve();
-  }, [provider, page]);
-
-  return reverseCache;
-};

From 7708fa75e512c43c6aac52917d30cff084120cad Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 21:54:05 -0300
Subject: [PATCH 44/62] Remove unnecessary nested span

---
 src/components/Address.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Address.tsx b/src/components/Address.tsx
index d7694e5..62891a3 100644
--- a/src/components/Address.tsx
+++ b/src/components/Address.tsx
@@ -6,7 +6,7 @@ type AddressProps = {
 
 const Address: React.FC<AddressProps> = ({ address }) => (
   <span className="font-address text-gray-400 truncate" title={address}>
-    <span className="truncate">{address}</span>
+    {address}
   </span>
 );
 

From 8341c274f61198c956bcd86e445d0afb660c3cc1 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 21:56:32 -0300
Subject: [PATCH 45/62] Remove unnecessary React.memo

---
 src/components/Address.tsx     | 2 +-
 src/components/AddressLink.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Address.tsx b/src/components/Address.tsx
index 62891a3..478f4f6 100644
--- a/src/components/Address.tsx
+++ b/src/components/Address.tsx
@@ -10,4 +10,4 @@ const Address: React.FC<AddressProps> = ({ address }) => (
   </span>
 );
 
-export default React.memo(Address);
+export default Address;
diff --git a/src/components/AddressLink.tsx b/src/components/AddressLink.tsx
index a8fd5c3..4b6f99e 100644
--- a/src/components/AddressLink.tsx
+++ b/src/components/AddressLink.tsx
@@ -24,4 +24,4 @@ const AddressLink: React.FC<AddressLinkProps> = ({
   </NavLink>
 );
 
-export default React.memo(AddressLink);
+export default AddressLink;

From 119cb67b00237401b73cc51fbd96e164c894a313 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 22:00:03 -0300
Subject: [PATCH 46/62] Remove unnecessary nested span

---
 src/components/AddressLink.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/components/AddressLink.tsx b/src/components/AddressLink.tsx
index 4b6f99e..8353457 100644
--- a/src/components/AddressLink.tsx
+++ b/src/components/AddressLink.tsx
@@ -17,10 +17,9 @@ const AddressLink: React.FC<AddressLinkProps> = ({
       dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
     } font-address truncate`}
     to={`/address/${address}`}
+    title={text ?? address}
   >
-    <span className="truncate" title={text ?? address}>
-      {text ?? address}
-    </span>
+    {text ?? address}
   </NavLink>
 );
 

From 4c59cd188f144e3a2015e4485fa77d8cbefc029b Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 22:05:26 -0300
Subject: [PATCH 47/62] Remove redundant React.memo

---
 src/components/AddressOrENSName.tsx | 2 +-
 src/components/ENSName.tsx          | 2 +-
 src/components/ENSNameLink.tsx      | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx
index 43d40e1..23ba6cd 100644
--- a/src/components/AddressOrENSName.tsx
+++ b/src/components/AddressOrENSName.tsx
@@ -52,4 +52,4 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
   );
 };
 
-export default React.memo(AddressOrENSName);
+export default AddressOrENSName;
diff --git a/src/components/ENSName.tsx b/src/components/ENSName.tsx
index 7bc8032..95f1e1f 100644
--- a/src/components/ENSName.tsx
+++ b/src/components/ENSName.tsx
@@ -22,4 +22,4 @@ const ENSName: React.FC<ENSNameProps> = ({ name, address }) => (
   </div>
 );
 
-export default React.memo(ENSName);
+export default ENSName;
diff --git a/src/components/ENSNameLink.tsx b/src/components/ENSNameLink.tsx
index c1da646..ad5df4d 100644
--- a/src/components/ENSNameLink.tsx
+++ b/src/components/ENSNameLink.tsx
@@ -31,4 +31,4 @@ const ENSNameLink: React.FC<ENSNameLinkProps> = ({
   </NavLink>
 );
 
-export default React.memo(ENSNameLink);
+export default ENSNameLink;

From 3211befaeac1eb4f4466b93c47dfe78d8f5cc7f7 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 22:14:16 -0300
Subject: [PATCH 48/62] Remove redundant React.memo

---
 src/search/TransactionItem.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/search/TransactionItem.tsx b/src/search/TransactionItem.tsx
index f71457e..2e6132d 100644
--- a/src/search/TransactionItem.tsx
+++ b/src/search/TransactionItem.tsx
@@ -139,4 +139,4 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
   );
 };
 
-export default React.memo(TransactionItem);
+export default TransactionItem;

From 41be42d1ced1b271ea31e64b96d7f2f67f4216e0 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 22:14:37 -0300
Subject: [PATCH 49/62] Save 1 array construction

---
 src/AddressTransactions.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/AddressTransactions.tsx b/src/AddressTransactions.tsx
index 9fbbec6..19d41bb 100644
--- a/src/AddressTransactions.tsx
+++ b/src/AddressTransactions.tsx
@@ -278,9 +278,9 @@ const AddressTransactions: React.FC = () => {
                         feeDisplay={feeDisplay}
                         feeDisplayToggler={feeDisplayToggler}
                       />
-                      {controller ? (
+                      {page ? (
                         <SelectionContext.Provider value={selectionCtx}>
-                          {controller.getPage().map((tx) => (
+                          {page.map((tx) => (
                             <TransactionItem
                               key={tx.hash}
                               tx={tx}

From 7bfa479d6cc0bccff94b5565f6e0d18e2f8e5039 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sat, 30 Oct 2021 22:44:33 -0300
Subject: [PATCH 50/62] Retrofit name resolvers into transaction/* pages

---
 src/Transaction.tsx          | 16 ++++++++++++++-
 src/transaction/Details.tsx  |  6 ++++++
 src/transaction/LogEntry.tsx | 10 +++++++++-
 src/transaction/Logs.tsx     |  5 ++++-
 src/useResolvedAddresses.ts  | 38 +++++++++++++++++++++++++++++++++++-
 5 files changed, 71 insertions(+), 4 deletions(-)

diff --git a/src/Transaction.tsx b/src/Transaction.tsx
index a240c7e..7107b32 100644
--- a/src/Transaction.tsx
+++ b/src/Transaction.tsx
@@ -11,6 +11,10 @@ import { useInternalOperations, useTxData } from "./useErigonHooks";
 import { useETHUSDOracle } from "./usePriceOracle";
 import { useAppConfigContext } from "./useAppConfig";
 import { useSourcify, useTransactionDescription } from "./useSourcify";
+import {
+  transactionDataCollector,
+  useResolvedAddresses,
+} from "./useResolvedAddresses";
 
 const Details = React.lazy(
   () =>
@@ -36,6 +40,11 @@ const Transaction: React.FC = () => {
   const { txhash } = params;
 
   const txData = useTxData(provider, txhash);
+  const addrCollector = useMemo(
+    () => transactionDataCollector(txData),
+    [txData]
+  );
+  const resolvedAddresses = useResolvedAddresses(provider, addrCollector);
 
   const internalOps = useInternalOperations(provider, txData);
   const sendsEthToMiner = useMemo(() => {
@@ -100,10 +109,15 @@ const Transaction: React.FC = () => {
                   internalOps={internalOps}
                   sendsEthToMiner={sendsEthToMiner}
                   ethUSDPrice={blockETHUSDPrice}
+                  resolvedAddresses={resolvedAddresses}
                 />
               </Route>
               <Route path="/tx/:txhash/logs/" exact>
-                <Logs txData={txData} metadata={metadata} />
+                <Logs
+                  txData={txData}
+                  metadata={metadata}
+                  resolvedAddresses={resolvedAddresses}
+                />
               </Route>
             </Switch>
           </React.Suspense>
diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx
index 4746cc5..72f448a 100644
--- a/src/transaction/Details.tsx
+++ b/src/transaction/Details.tsx
@@ -38,6 +38,7 @@ import ModeTab from "../components/ModeTab";
 import DecodedParamsTable from "./decoder/DecodedParamsTable";
 import { rawInputTo4Bytes, use4Bytes } from "../use4Bytes";
 import { DevDoc, UserDoc } from "../useSourcify";
+import { ResolvedAddresses } from "../api/address-resolver";
 
 type DetailsProps = {
   txData: TransactionData;
@@ -47,6 +48,7 @@ type DetailsProps = {
   internalOps?: InternalOperation[];
   sendsEthToMiner: boolean;
   ethUSDPrice: BigNumber | undefined;
+  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const Details: React.FC<DetailsProps> = ({
@@ -57,6 +59,7 @@ const Details: React.FC<DetailsProps> = ({
   internalOps,
   sendsEthToMiner,
   ethUSDPrice,
+  resolvedAddresses,
 }) => {
   const hasEIP1559 =
     txData.confirmedData?.blockBaseFeePerGas !== undefined &&
@@ -154,6 +157,7 @@ const Details: React.FC<DetailsProps> = ({
                 address={txData.from}
                 miner={txData.from === txData.confirmedData?.miner}
                 txFrom
+                resolvedAddresses={resolvedAddresses}
               />
             </AddressHighlighter>
             <Copy value={txData.from} />
@@ -171,6 +175,7 @@ const Details: React.FC<DetailsProps> = ({
                 address={txData.to}
                 miner={txData.to === txData.confirmedData?.miner}
                 txTo
+                resolvedAddresses={resolvedAddresses}
               />
             </AddressHighlighter>
             <Copy value={txData.to} />
@@ -188,6 +193,7 @@ const Details: React.FC<DetailsProps> = ({
                 address={txData.confirmedData.createdContractAddress!}
                 creation
                 txTo
+                resolvedAddresses={resolvedAddresses}
               />
             </AddressHighlighter>
             <Copy value={txData.confirmedData.createdContractAddress!} />
diff --git a/src/transaction/LogEntry.tsx b/src/transaction/LogEntry.tsx
index 23ab883..2993e16 100644
--- a/src/transaction/LogEntry.tsx
+++ b/src/transaction/LogEntry.tsx
@@ -10,14 +10,21 @@ import DecodedParamsTable from "./decoder/DecodedParamsTable";
 import DecodedLogSignature from "./decoder/DecodedLogSignature";
 import { TransactionData } from "../types";
 import { useTopic0 } from "../useTopic0";
+import { ResolvedAddresses } from "../api/address-resolver";
 
 type LogEntryProps = {
   txData: TransactionData;
   log: Log;
   logDesc: LogDescription | null | undefined;
+  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
-const LogEntry: React.FC<LogEntryProps> = ({ txData, log, logDesc }) => {
+const LogEntry: React.FC<LogEntryProps> = ({
+  txData,
+  log,
+  logDesc,
+  resolvedAddresses,
+}) => {
   const rawTopic0 = log.topics[0];
   const topic0 = useTopic0(rawTopic0);
 
@@ -62,6 +69,7 @@ const LogEntry: React.FC<LogEntryProps> = ({ txData, log, logDesc }) => {
                   miner={log.address === txData.confirmedData?.miner}
                   txFrom={log.address === txData.from}
                   txTo={log.address === txData.to}
+                  resolvedAddresses={resolvedAddresses}
                 />
               </AddressHighlighter>
               <Copy value={log.address} />
diff --git a/src/transaction/Logs.tsx b/src/transaction/Logs.tsx
index 45fe491..1fd4207 100644
--- a/src/transaction/Logs.tsx
+++ b/src/transaction/Logs.tsx
@@ -5,13 +5,15 @@ import LogEntry from "./LogEntry";
 import { TransactionData } from "../types";
 import { useAppConfigContext } from "../useAppConfig";
 import { Metadata, useMultipleMetadata } from "../useSourcify";
+import { ResolvedAddresses } from "../api/address-resolver";
 
 type LogsProps = {
   txData: TransactionData;
   metadata: Metadata | null | undefined;
+  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
-const Logs: React.FC<LogsProps> = ({ txData, metadata }) => {
+const Logs: React.FC<LogsProps> = ({ txData, metadata, resolvedAddresses }) => {
   const baseMetadatas = useMemo((): Record<string, Metadata | null> => {
     if (!txData.to || metadata === undefined) {
       return {};
@@ -70,6 +72,7 @@ const Logs: React.FC<LogsProps> = ({ txData, metadata }) => {
                   txData={txData}
                   log={l}
                   logDesc={logDescs?.[i]}
+                  resolvedAddresses={resolvedAddresses}
                 />
               ))}
             </>
diff --git a/src/useResolvedAddresses.ts b/src/useResolvedAddresses.ts
index 3eefdf0..74042e5 100644
--- a/src/useResolvedAddresses.ts
+++ b/src/useResolvedAddresses.ts
@@ -1,6 +1,6 @@
 import { useState, useEffect } from "react";
 import { JsonRpcProvider } from "@ethersproject/providers";
-import { ProcessedTransaction } from "./types";
+import { ProcessedTransaction, TransactionData } from "./types";
 import { batchPopulate, ResolvedAddresses } from "./api/address-resolver";
 
 export type AddressCollector = () => string[];
@@ -25,6 +25,42 @@ export const pageCollector =
     return Array.from(uniqueAddresses);
   };
 
+export const transactionDataCollector =
+  (txData: TransactionData | null | undefined): AddressCollector =>
+  () => {
+    if (!txData) {
+      return [];
+    }
+
+    const uniqueAddresses = new Set<string>();
+
+    // Standard fields
+    uniqueAddresses.add(txData.from);
+    if (txData.to) {
+      uniqueAddresses.add(txData.to);
+    }
+    if (txData.confirmedData?.createdContractAddress) {
+      uniqueAddresses.add(txData.confirmedData?.createdContractAddress);
+    }
+
+    // Dig token transfers
+    for (const t of txData.tokenTransfers) {
+      uniqueAddresses.add(t.from);
+      uniqueAddresses.add(t.to);
+      uniqueAddresses.add(t.token);
+    }
+
+    // Dig log addresses
+    if (txData.confirmedData) {
+      for (const l of txData.confirmedData.logs) {
+        uniqueAddresses.add(l.address);
+        // TODO: find a way to dig over decoded address log attributes
+      }
+    }
+
+    return Array.from(uniqueAddresses);
+  };
+
 export const useResolvedAddresses = (
   provider: JsonRpcProvider | undefined,
   addrCollector: AddressCollector

From 3a0401d25eb67c3116d20a9320647c381cfc52f4 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Sun, 31 Oct 2021 01:47:18 +0000
Subject: [PATCH 51/62] Bump react-error-boundary from 3.1.3 to 3.1.4 (#109)

---
 package-lock.json | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e441646..ef51571 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -41,7 +41,7 @@
         "react-blockies": "^1.4.1",
         "react-chartjs-2": "^3.3.0",
         "react-dom": "^17.0.2",
-        "react-error-boundary": "^3.1.3",
+        "react-error-boundary": "^3.1.4",
         "react-helmet-async": "^1.1.2",
         "react-image": "^4.0.3",
         "react-router-dom": "^5.3.0",
@@ -14621,9 +14621,9 @@
       }
     },
     "node_modules/react-error-boundary": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-3.1.3.tgz",
-      "integrity": "sha512-A+F9HHy9fvt9t8SNDlonq01prnU8AmkjvGKV4kk8seB9kU3xMEO8J/PQlLVmoOIDODl5U2kufSBs4vrWIqhsAA==",
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-3.1.4.tgz",
+      "integrity": "sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==",
       "dependencies": {
         "@babel/runtime": "^7.12.5"
       },
@@ -29543,9 +29543,9 @@
       }
     },
     "react-error-boundary": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-3.1.3.tgz",
-      "integrity": "sha512-A+F9HHy9fvt9t8SNDlonq01prnU8AmkjvGKV4kk8seB9kU3xMEO8J/PQlLVmoOIDODl5U2kufSBs4vrWIqhsAA==",
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-3.1.4.tgz",
+      "integrity": "sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==",
       "requires": {
         "@babel/runtime": "^7.12.5"
       }
diff --git a/package.json b/package.json
index 64fe411..d301e67 100644
--- a/package.json
+++ b/package.json
@@ -36,7 +36,7 @@
     "react-blockies": "^1.4.1",
     "react-chartjs-2": "^3.3.0",
     "react-dom": "^17.0.2",
-    "react-error-boundary": "^3.1.3",
+    "react-error-boundary": "^3.1.4",
     "react-helmet-async": "^1.1.2",
     "react-image": "^4.0.3",
     "react-router-dom": "^5.3.0",

From 25cc823c91ba440df3d08aa1272b0d28eb532ebf Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 31 Oct 2021 02:38:41 -0300
Subject: [PATCH 52/62] Generalize resolver framework to allow tracking of the
 resolver source

---
 .../CompositeAddressResolver.ts               | 16 ++++++++-----
 .../address-resolver/ENSAddressResolver.ts    |  2 +-
 src/api/address-resolver/ERCTokenResolver.ts  | 24 +++++++++++++++++++
 src/api/address-resolver/address-resolver.ts  |  4 ++--
 src/api/address-resolver/index.ts             | 24 ++++++++++++-------
 src/components/AddressOrENSName.tsx           | 10 ++++----
 6 files changed, 57 insertions(+), 23 deletions(-)
 create mode 100644 src/api/address-resolver/ERCTokenResolver.ts

diff --git a/src/api/address-resolver/CompositeAddressResolver.ts b/src/api/address-resolver/CompositeAddressResolver.ts
index bee73da..7c11f3d 100644
--- a/src/api/address-resolver/CompositeAddressResolver.ts
+++ b/src/api/address-resolver/CompositeAddressResolver.ts
@@ -1,21 +1,25 @@
 import { BaseProvider } from "@ethersproject/providers";
 import { IAddressResolver } from "./address-resolver";
 
-export class CompositeAddressResolver implements IAddressResolver {
-  private resolvers: IAddressResolver[] = [];
+export type SelectedResolvedName<T> = [IAddressResolver<T>, T];
 
-  addResolver(resolver: IAddressResolver) {
+export class CompositeAddressResolver<T>
+  implements IAddressResolver<SelectedResolvedName<T>>
+{
+  private resolvers: IAddressResolver<T>[] = [];
+
+  addResolver(resolver: IAddressResolver<T>) {
     this.resolvers.push(resolver);
   }
 
   async resolveAddress(
     provider: BaseProvider,
     address: string
-  ): Promise<string | undefined> {
+  ): Promise<SelectedResolvedName<T> | undefined> {
     for (const r of this.resolvers) {
-      const name = r.resolveAddress(provider, address);
+      const name = await r.resolveAddress(provider, address);
       if (name !== undefined) {
-        return name;
+        return [r, name];
       }
     }
 
diff --git a/src/api/address-resolver/ENSAddressResolver.ts b/src/api/address-resolver/ENSAddressResolver.ts
index ef45a64..820a51f 100644
--- a/src/api/address-resolver/ENSAddressResolver.ts
+++ b/src/api/address-resolver/ENSAddressResolver.ts
@@ -1,7 +1,7 @@
 import { BaseProvider } from "@ethersproject/providers";
 import { IAddressResolver } from "./address-resolver";
 
-export class ENSAddressResolver implements IAddressResolver {
+export class ENSAddressResolver implements IAddressResolver<string> {
   async resolveAddress(
     provider: BaseProvider,
     address: string
diff --git a/src/api/address-resolver/ERCTokenResolver.ts b/src/api/address-resolver/ERCTokenResolver.ts
new file mode 100644
index 0000000..dc8bb74
--- /dev/null
+++ b/src/api/address-resolver/ERCTokenResolver.ts
@@ -0,0 +1,24 @@
+import { BaseProvider } from "@ethersproject/providers";
+import { Contract } from "@ethersproject/contracts";
+import { IAddressResolver } from "./address-resolver";
+import erc20 from "../../erc20.json";
+
+export class ERCTokenResolver implements IAddressResolver<string> {
+  async resolveAddress(
+    provider: BaseProvider,
+    address: string
+  ): Promise<string | undefined> {
+    const erc20Contract = new Contract(address, erc20, provider);
+    try {
+      const [name, symbol, decimals] = await Promise.all([
+        erc20Contract.name(),
+        erc20Contract.symbol(),
+        erc20Contract.decimals(),
+      ]);
+      return name;
+    } catch (err) {
+      console.warn(`Couldn't get token ${address} metadata; ignoring`, err);
+    }
+    return undefined;
+  }
+}
diff --git a/src/api/address-resolver/address-resolver.ts b/src/api/address-resolver/address-resolver.ts
index 246db34..87ed8b8 100644
--- a/src/api/address-resolver/address-resolver.ts
+++ b/src/api/address-resolver/address-resolver.ts
@@ -1,8 +1,8 @@
 import { BaseProvider } from "@ethersproject/providers";
 
-export interface IAddressResolver {
+export interface IAddressResolver<T> {
   resolveAddress(
     provider: BaseProvider,
     address: string
-  ): Promise<string | undefined>;
+  ): Promise<T | undefined>;
 }
diff --git a/src/api/address-resolver/index.ts b/src/api/address-resolver/index.ts
index cc4fe1b..dd8b549 100644
--- a/src/api/address-resolver/index.ts
+++ b/src/api/address-resolver/index.ts
@@ -1,34 +1,40 @@
 import { BaseProvider } from "@ethersproject/providers";
 import { IAddressResolver } from "./address-resolver";
-import { CompositeAddressResolver } from "./CompositeAddressResolver";
+import {
+  CompositeAddressResolver,
+  SelectedResolvedName,
+} from "./CompositeAddressResolver";
 import { ENSAddressResolver } from "./ENSAddressResolver";
 
-export type ResolvedAddresses = Record<string, string>;
+export type ResolvedAddresses = Record<string, SelectedResolvedName<string>>;
 
 // Create and configure the main resolver
-const _mainResolver = new CompositeAddressResolver();
-_mainResolver.addResolver(new ENSAddressResolver());
+export const ensResolver = new ENSAddressResolver();
 
-export const mainResolver: IAddressResolver = _mainResolver;
+const _mainResolver = new CompositeAddressResolver<string>();
+_mainResolver.addResolver(ensResolver);
+
+export const mainResolver: IAddressResolver<SelectedResolvedName<string>> =
+  _mainResolver;
 
 export const batchPopulate = async (
   provider: BaseProvider,
   addresses: string[]
 ): Promise<ResolvedAddresses> => {
-  const solvers: Promise<string | undefined>[] = [];
+  const solvers: Promise<SelectedResolvedName<string> | undefined>[] = [];
   for (const a of addresses) {
     solvers.push(mainResolver.resolveAddress(provider, a));
   }
 
   const results = await Promise.all(solvers);
-  const cache: ResolvedAddresses = {};
+  const resultMap: ResolvedAddresses = {};
   for (let i = 0; i < results.length; i++) {
     const r = results[i];
     if (r === undefined) {
       continue;
     }
-    cache[addresses[i]] = r;
+    resultMap[addresses[i]] = r;
   }
 
-  return cache;
+  return resultMap;
 };
diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx
index 23ba6cd..dd865d7 100644
--- a/src/components/AddressOrENSName.tsx
+++ b/src/components/AddressOrENSName.tsx
@@ -3,7 +3,7 @@ import Address from "./Address";
 import AddressLink from "./AddressLink";
 import ENSName from "./ENSName";
 import ENSNameLink from "./ENSNameLink";
-import { ResolvedAddresses } from "../api/address-resolver";
+import { ensResolver, ResolvedAddresses } from "../api/address-resolver";
 
 type AddressOrENSNameProps = {
   address: string;
@@ -25,17 +25,17 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
     <>
       {address === selectedAddress ? (
         <>
-          {name ? (
-            <ENSName name={name} address={address} />
+          {name?.[0] === ensResolver ? (
+            <ENSName name={name[1]} address={address} />
           ) : (
             <Address address={address} />
           )}
         </>
       ) : (
         <>
-          {name ? (
+          {name?.[0] ? (
             <ENSNameLink
-              name={name}
+              name={name[1]}
               address={address}
               dontOverrideColors={dontOverrideColors}
             />

From 887e35ce491d8f621904566a4adbd8833aff5c92 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 31 Oct 2021 03:16:03 -0300
Subject: [PATCH 53/62] Generalize plain address/ens rendering logic

---
 src/components/Address.tsx          | 13 ------
 src/components/AddressLink.tsx      | 26 ------------
 src/components/AddressOrENSName.tsx | 64 ++++++++++++++---------------
 src/components/ENSName.tsx          | 51 +++++++++++++++++++----
 src/components/ENSNameLink.tsx      | 34 ---------------
 src/components/PlainAddress.tsx     | 38 +++++++++++++++++
 6 files changed, 112 insertions(+), 114 deletions(-)
 delete mode 100644 src/components/Address.tsx
 delete mode 100644 src/components/AddressLink.tsx
 delete mode 100644 src/components/ENSNameLink.tsx
 create mode 100644 src/components/PlainAddress.tsx

diff --git a/src/components/Address.tsx b/src/components/Address.tsx
deleted file mode 100644
index 478f4f6..0000000
--- a/src/components/Address.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import React from "react";
-
-type AddressProps = {
-  address: string;
-};
-
-const Address: React.FC<AddressProps> = ({ address }) => (
-  <span className="font-address text-gray-400 truncate" title={address}>
-    {address}
-  </span>
-);
-
-export default Address;
diff --git a/src/components/AddressLink.tsx b/src/components/AddressLink.tsx
deleted file mode 100644
index 8353457..0000000
--- a/src/components/AddressLink.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from "react";
-import { NavLink } from "react-router-dom";
-
-type AddressLinkProps = {
-  address: string;
-  text?: string;
-  dontOverrideColors?: boolean;
-};
-
-const AddressLink: React.FC<AddressLinkProps> = ({
-  address,
-  text,
-  dontOverrideColors,
-}) => (
-  <NavLink
-    className={`${
-      dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
-    } font-address truncate`}
-    to={`/address/${address}`}
-    title={text ?? address}
-  >
-    {text ?? address}
-  </NavLink>
-);
-
-export default AddressLink;
diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx
index dd865d7..83fd0cd 100644
--- a/src/components/AddressOrENSName.tsx
+++ b/src/components/AddressOrENSName.tsx
@@ -1,9 +1,7 @@
 import React from "react";
-import Address from "./Address";
-import AddressLink from "./AddressLink";
-import ENSName from "./ENSName";
-import ENSNameLink from "./ENSNameLink";
 import { ensResolver, ResolvedAddresses } from "../api/address-resolver";
+import PlainAddress from "./PlainAddress";
+import ENSName from "./ENSName";
 
 type AddressOrENSNameProps = {
   address: string;
@@ -20,36 +18,34 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
   dontOverrideColors,
   resolvedAddresses,
 }) => {
-  const name = resolvedAddresses?.[address];
-  return (
-    <>
-      {address === selectedAddress ? (
-        <>
-          {name?.[0] === ensResolver ? (
-            <ENSName name={name[1]} address={address} />
-          ) : (
-            <Address address={address} />
-          )}
-        </>
-      ) : (
-        <>
-          {name?.[0] ? (
-            <ENSNameLink
-              name={name[1]}
-              address={address}
-              dontOverrideColors={dontOverrideColors}
-            />
-          ) : (
-            <AddressLink
-              address={address}
-              text={text}
-              dontOverrideColors={dontOverrideColors}
-            />
-          )}
-        </>
-      )}
-    </>
-  );
+  const resolvedAddress = resolvedAddresses?.[address];
+  const linkable = address !== selectedAddress;
+
+  if (resolvedAddress === undefined) {
+    return (
+      <PlainAddress
+        address={address}
+        text={text}
+        linkable={linkable}
+        dontOverrideColors={dontOverrideColors}
+      />
+    );
+  }
+
+  const [resolver, resolvedName] = resolvedAddress;
+  if (resolver === ensResolver) {
+    return (
+      <ENSName
+        address={address}
+        text={text}
+        linkable={linkable}
+        name={resolvedName}
+        dontOverrideColors={dontOverrideColors}
+      />
+    );
+  }
+
+  return <></>;
 };
 
 export default AddressOrENSName;
diff --git a/src/components/ENSName.tsx b/src/components/ENSName.tsx
index 95f1e1f..ac1b038 100644
--- a/src/components/ENSName.tsx
+++ b/src/components/ENSName.tsx
@@ -1,25 +1,62 @@
 import React from "react";
+import { NavLink } from "react-router-dom";
 import ENSLogo from "./ensLogo.svg";
 
 type ENSNameProps = {
   name: string;
   address: string;
+  text: string | undefined;
+  linkable: boolean;
+  dontOverrideColors?: boolean;
 };
 
-const ENSName: React.FC<ENSNameProps> = ({ name, address }) => (
-  <div
-    className="flex items-baseline space-x-1 font-sans text-gray-700 truncate"
-    title={`${name}: ${address}`}
-  >
+const ENSName: React.FC<ENSNameProps> = ({
+  name,
+  address,
+  text,
+  linkable,
+  dontOverrideColors,
+}) => {
+  if (linkable) {
+    return (
+      <NavLink
+        className={`flex items-baseline space-x-1 font-sans ${
+          dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
+        } truncate`}
+        to={`/address/${name}`}
+        title={`${name}: ${address}`}
+      >
+        <Content linkable={true} name={name} />
+      </NavLink>
+    );
+  }
+
+  return (
+    <div
+      className="flex items-baseline space-x-1 font-sans text-gray-700 truncate"
+      title={`${name}: ${address}`}
+    >
+      <Content linkable={false} name={name} />
+    </div>
+  );
+};
+
+type ContentProps = {
+  linkable: boolean;
+  name: string;
+};
+
+const Content: React.FC<ContentProps> = ({ linkable, name }) => (
+  <>
     <img
-      className="self-center filter grayscale"
+      className={`self-center ${linkable ? "" : "filter grayscale"}`}
       src={ENSLogo}
       alt="ENS Logo"
       width={12}
       height={12}
     />
     <span className="truncate">{name}</span>
-  </div>
+  </>
 );
 
 export default ENSName;
diff --git a/src/components/ENSNameLink.tsx b/src/components/ENSNameLink.tsx
deleted file mode 100644
index ad5df4d..0000000
--- a/src/components/ENSNameLink.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from "react";
-import { NavLink } from "react-router-dom";
-import ENSLogo from "./ensLogo.svg";
-
-type ENSNameLinkProps = {
-  name: string;
-  address: string;
-  dontOverrideColors?: boolean;
-};
-
-const ENSNameLink: React.FC<ENSNameLinkProps> = ({
-  name,
-  address,
-  dontOverrideColors,
-}) => (
-  <NavLink
-    className={`flex items-baseline space-x-1 font-sans ${
-      dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
-    } truncate`}
-    to={`/address/${name}`}
-    title={`${name}: ${address}`}
-  >
-    <img
-      className="self-center"
-      src={ENSLogo}
-      alt="ENS Logo"
-      width={12}
-      height={12}
-    />
-    <span className="truncate">{name}</span>
-  </NavLink>
-);
-
-export default ENSNameLink;
diff --git a/src/components/PlainAddress.tsx b/src/components/PlainAddress.tsx
new file mode 100644
index 0000000..6ebe634
--- /dev/null
+++ b/src/components/PlainAddress.tsx
@@ -0,0 +1,38 @@
+import React from "react";
+import { NavLink } from "react-router-dom";
+
+type PlainAddressProps = {
+  address: string;
+  text: string | undefined;
+  linkable: boolean;
+  dontOverrideColors: boolean | undefined;
+};
+
+const PlainAddress: React.FC<PlainAddressProps> = ({
+  address,
+  text,
+  linkable,
+  dontOverrideColors,
+}) => {
+  if (linkable) {
+    return (
+      <NavLink
+        className={`${
+          dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
+        } font-address truncate`}
+        to={`/address/${address}`}
+        title={text ?? address}
+      >
+        <>{text ?? address}</>
+      </NavLink>
+    );
+  }
+
+  return (
+    <span className="font-address text-gray-400 truncate" title={address}>
+      {address}
+    </span>
+  );
+};
+
+export default PlainAddress;

From 59ff4fd40112ac2c5274322b1085aa138d43ca1a Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 31 Oct 2021 05:10:42 -0300
Subject: [PATCH 54/62] Extract renderer interface

---
 src/api/address-resolver/address-resolver.ts |  8 ++++++++
 src/api/address-resolver/index.ts            |  9 ++++++++-
 src/components/AddressOrENSName.tsx          | 14 ++++++++------
 src/components/ENSName.tsx                   | 17 +++++++++++++++--
 4 files changed, 39 insertions(+), 9 deletions(-)

diff --git a/src/api/address-resolver/address-resolver.ts b/src/api/address-resolver/address-resolver.ts
index 87ed8b8..0527b04 100644
--- a/src/api/address-resolver/address-resolver.ts
+++ b/src/api/address-resolver/address-resolver.ts
@@ -1,3 +1,4 @@
+import React from "react";
 import { BaseProvider } from "@ethersproject/providers";
 
 export interface IAddressResolver<T> {
@@ -6,3 +7,10 @@ export interface IAddressResolver<T> {
     address: string
   ): Promise<T | undefined>;
 }
+
+export type ResolvedAddressRenderer = (
+  address: string,
+  resolvedAddress: string,
+  linkable: boolean,
+  dontOverrideColors: boolean
+) => React.ReactElement;
diff --git a/src/api/address-resolver/index.ts b/src/api/address-resolver/index.ts
index dd8b549..6db1b1e 100644
--- a/src/api/address-resolver/index.ts
+++ b/src/api/address-resolver/index.ts
@@ -1,5 +1,6 @@
 import { BaseProvider } from "@ethersproject/providers";
-import { IAddressResolver } from "./address-resolver";
+import { ensRenderer } from "../../components/ENSName";
+import { IAddressResolver, ResolvedAddressRenderer } from "./address-resolver";
 import {
   CompositeAddressResolver,
   SelectedResolvedName,
@@ -17,6 +18,12 @@ _mainResolver.addResolver(ensResolver);
 export const mainResolver: IAddressResolver<SelectedResolvedName<string>> =
   _mainResolver;
 
+export const resolverRendererRegistry = new Map<
+  IAddressResolver<string>,
+  ResolvedAddressRenderer
+>();
+resolverRendererRegistry.set(ensResolver, ensRenderer);
+
 export const batchPopulate = async (
   provider: BaseProvider,
   addresses: string[]
diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx
index 83fd0cd..b10c0eb 100644
--- a/src/components/AddressOrENSName.tsx
+++ b/src/components/AddressOrENSName.tsx
@@ -1,7 +1,9 @@
 import React from "react";
-import { ensResolver, ResolvedAddresses } from "../api/address-resolver";
+import {
+  ResolvedAddresses,
+  resolverRendererRegistry,
+} from "../api/address-resolver";
 import PlainAddress from "./PlainAddress";
-import ENSName from "./ENSName";
 
 type AddressOrENSNameProps = {
   address: string;
@@ -33,19 +35,19 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
   }
 
   const [resolver, resolvedName] = resolvedAddress;
-  if (resolver === ensResolver) {
+  const renderer = resolverRendererRegistry.get(resolver);
+  if (renderer === undefined) {
     return (
-      <ENSName
+      <PlainAddress
         address={address}
         text={text}
         linkable={linkable}
-        name={resolvedName}
         dontOverrideColors={dontOverrideColors}
       />
     );
   }
 
-  return <></>;
+  return renderer(address, resolvedName, linkable, !!dontOverrideColors);
 };
 
 export default AddressOrENSName;
diff --git a/src/components/ENSName.tsx b/src/components/ENSName.tsx
index ac1b038..05fe27c 100644
--- a/src/components/ENSName.tsx
+++ b/src/components/ENSName.tsx
@@ -1,11 +1,11 @@
 import React from "react";
 import { NavLink } from "react-router-dom";
+import { ResolvedAddressRenderer } from "../api/address-resolver/address-resolver";
 import ENSLogo from "./ensLogo.svg";
 
 type ENSNameProps = {
   name: string;
   address: string;
-  text: string | undefined;
   linkable: boolean;
   dontOverrideColors?: boolean;
 };
@@ -13,7 +13,6 @@ type ENSNameProps = {
 const ENSName: React.FC<ENSNameProps> = ({
   name,
   address,
-  text,
   linkable,
   dontOverrideColors,
 }) => {
@@ -59,4 +58,18 @@ const Content: React.FC<ContentProps> = ({ linkable, name }) => (
   </>
 );
 
+export const ensRenderer: ResolvedAddressRenderer = (
+  address,
+  resolvedAddress,
+  linkable,
+  dontOverrideColors
+) => (
+  <ENSName
+    address={address}
+    name={resolvedAddress}
+    linkable={linkable}
+    dontOverrideColors={dontOverrideColors}
+  />
+);
+
 export default ENSName;

From 099c1465b01372a16c20ed95a9854d8c957f3f8e Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 31 Oct 2021 19:51:11 -0300
Subject: [PATCH 55/62] Add ERC token address resolver

---
 .../CompositeAddressResolver.ts               |  8 +-
 src/api/address-resolver/ERCTokenResolver.ts  | 14 +++-
 src/api/address-resolver/address-resolver.ts  |  4 +-
 src/api/address-resolver/index.ts             | 17 +++--
 src/components/ENSName.tsx                    |  2 +-
 src/components/TokenLogo.tsx                  |  2 +-
 src/components/TokenName.tsx                  | 73 +++++++++++++++++++
 7 files changed, 102 insertions(+), 18 deletions(-)
 create mode 100644 src/components/TokenName.tsx

diff --git a/src/api/address-resolver/CompositeAddressResolver.ts b/src/api/address-resolver/CompositeAddressResolver.ts
index 7c11f3d..3590f3d 100644
--- a/src/api/address-resolver/CompositeAddressResolver.ts
+++ b/src/api/address-resolver/CompositeAddressResolver.ts
@@ -3,7 +3,7 @@ import { IAddressResolver } from "./address-resolver";
 
 export type SelectedResolvedName<T> = [IAddressResolver<T>, T];
 
-export class CompositeAddressResolver<T>
+export class CompositeAddressResolver<T = any>
   implements IAddressResolver<SelectedResolvedName<T>>
 {
   private resolvers: IAddressResolver<T>[] = [];
@@ -17,9 +17,9 @@ export class CompositeAddressResolver<T>
     address: string
   ): Promise<SelectedResolvedName<T> | undefined> {
     for (const r of this.resolvers) {
-      const name = await r.resolveAddress(provider, address);
-      if (name !== undefined) {
-        return [r, name];
+      const resolvedAddress = await r.resolveAddress(provider, address);
+      if (resolvedAddress !== undefined) {
+        return [r, resolvedAddress];
       }
     }
 
diff --git a/src/api/address-resolver/ERCTokenResolver.ts b/src/api/address-resolver/ERCTokenResolver.ts
index dc8bb74..02625dc 100644
--- a/src/api/address-resolver/ERCTokenResolver.ts
+++ b/src/api/address-resolver/ERCTokenResolver.ts
@@ -2,12 +2,13 @@ import { BaseProvider } from "@ethersproject/providers";
 import { Contract } from "@ethersproject/contracts";
 import { IAddressResolver } from "./address-resolver";
 import erc20 from "../../erc20.json";
+import { TokenMeta } from "../../types";
 
-export class ERCTokenResolver implements IAddressResolver<string> {
+export class ERCTokenResolver implements IAddressResolver<TokenMeta> {
   async resolveAddress(
     provider: BaseProvider,
     address: string
-  ): Promise<string | undefined> {
+  ): Promise<TokenMeta | undefined> {
     const erc20Contract = new Contract(address, erc20, provider);
     try {
       const [name, symbol, decimals] = await Promise.all([
@@ -15,9 +16,14 @@ export class ERCTokenResolver implements IAddressResolver<string> {
         erc20Contract.symbol(),
         erc20Contract.decimals(),
       ]);
-      return name;
+      return {
+        name,
+        symbol,
+        decimals,
+      };
     } catch (err) {
-      console.warn(`Couldn't get token ${address} metadata; ignoring`, err);
+      // Ignore on purpose; this indicates the probe failed and the address
+      // is not a token
     }
     return undefined;
   }
diff --git a/src/api/address-resolver/address-resolver.ts b/src/api/address-resolver/address-resolver.ts
index 0527b04..12d289e 100644
--- a/src/api/address-resolver/address-resolver.ts
+++ b/src/api/address-resolver/address-resolver.ts
@@ -8,9 +8,9 @@ export interface IAddressResolver<T> {
   ): Promise<T | undefined>;
 }
 
-export type ResolvedAddressRenderer = (
+export type ResolvedAddressRenderer<T> = (
   address: string,
-  resolvedAddress: string,
+  resolvedAddress: T,
   linkable: boolean,
   dontOverrideColors: boolean
 ) => React.ReactElement;
diff --git a/src/api/address-resolver/index.ts b/src/api/address-resolver/index.ts
index 6db1b1e..d0a0500 100644
--- a/src/api/address-resolver/index.ts
+++ b/src/api/address-resolver/index.ts
@@ -1,34 +1,39 @@
 import { BaseProvider } from "@ethersproject/providers";
 import { ensRenderer } from "../../components/ENSName";
+import { tokenRenderer } from "../../components/TokenName";
 import { IAddressResolver, ResolvedAddressRenderer } from "./address-resolver";
 import {
   CompositeAddressResolver,
   SelectedResolvedName,
 } from "./CompositeAddressResolver";
 import { ENSAddressResolver } from "./ENSAddressResolver";
+import { ERCTokenResolver } from "./ERCTokenResolver";
 
-export type ResolvedAddresses = Record<string, SelectedResolvedName<string>>;
+export type ResolvedAddresses = Record<string, SelectedResolvedName<any>>;
 
 // Create and configure the main resolver
 export const ensResolver = new ENSAddressResolver();
+export const ercTokenResolver = new ERCTokenResolver();
 
-const _mainResolver = new CompositeAddressResolver<string>();
+const _mainResolver = new CompositeAddressResolver();
 _mainResolver.addResolver(ensResolver);
+_mainResolver.addResolver(ercTokenResolver);
 
-export const mainResolver: IAddressResolver<SelectedResolvedName<string>> =
+export const mainResolver: IAddressResolver<SelectedResolvedName<any>> =
   _mainResolver;
 
 export const resolverRendererRegistry = new Map<
-  IAddressResolver<string>,
-  ResolvedAddressRenderer
+  IAddressResolver<any>,
+  ResolvedAddressRenderer<any>
 >();
 resolverRendererRegistry.set(ensResolver, ensRenderer);
+resolverRendererRegistry.set(ercTokenResolver, tokenRenderer);
 
 export const batchPopulate = async (
   provider: BaseProvider,
   addresses: string[]
 ): Promise<ResolvedAddresses> => {
-  const solvers: Promise<SelectedResolvedName<string> | undefined>[] = [];
+  const solvers: Promise<SelectedResolvedName<any> | undefined>[] = [];
   for (const a of addresses) {
     solvers.push(mainResolver.resolveAddress(provider, a));
   }
diff --git a/src/components/ENSName.tsx b/src/components/ENSName.tsx
index 05fe27c..f12f416 100644
--- a/src/components/ENSName.tsx
+++ b/src/components/ENSName.tsx
@@ -58,7 +58,7 @@ const Content: React.FC<ContentProps> = ({ linkable, name }) => (
   </>
 );
 
-export const ensRenderer: ResolvedAddressRenderer = (
+export const ensRenderer: ResolvedAddressRenderer<string> = (
   address,
   resolvedAddress,
   linkable,
diff --git a/src/components/TokenLogo.tsx b/src/components/TokenLogo.tsx
index c6f5b8b..8568a0b 100644
--- a/src/components/TokenLogo.tsx
+++ b/src/components/TokenLogo.tsx
@@ -9,7 +9,7 @@ type TokenLogoProps = {
 };
 
 const TokenLogo: React.FC<TokenLogoProps> = (props) => (
-  <Suspense fallback={<></>}>
+  <Suspense fallback={null}>
     <InternalTokenLogo {...props} />
   </Suspense>
 );
diff --git a/src/components/TokenName.tsx b/src/components/TokenName.tsx
new file mode 100644
index 0000000..7301676
--- /dev/null
+++ b/src/components/TokenName.tsx
@@ -0,0 +1,73 @@
+import React from "react";
+import { NavLink } from "react-router-dom";
+import TokenLogo from "./TokenLogo";
+import { ResolvedAddressRenderer } from "../api/address-resolver/address-resolver";
+import { TokenMeta } from "../types";
+
+type TokenNameProps = {
+  name: string;
+  address: string;
+  linkable: boolean;
+  dontOverrideColors?: boolean;
+};
+
+const TokenName: React.FC<TokenNameProps> = ({
+  name,
+  address,
+  linkable,
+  dontOverrideColors,
+}) => {
+  if (linkable) {
+    return (
+      <NavLink
+        className={`flex items-baseline space-x-1 font-sans ${
+          dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
+        } truncate`}
+        to={`/address/${name}`}
+        title={`${name}: ${address}`}
+      >
+        <Content address={address} linkable={true} name={name} />
+      </NavLink>
+    );
+  }
+
+  return (
+    <div
+      className="flex items-baseline space-x-1 font-sans text-gray-700 truncate"
+      title={`${name}: ${address}`}
+    >
+      <Content address={address} linkable={false} name={name} />
+    </div>
+  );
+};
+
+type ContentProps = {
+  address: string;
+  linkable: boolean;
+  name: string;
+};
+
+const Content: React.FC<ContentProps> = ({ address, linkable, name }) => (
+  <>
+    <div className="self-center w-5 h-5">
+      <TokenLogo address={address} name={name} />
+    </div>
+    <span className="truncate">{name}</span>
+  </>
+);
+
+export const tokenRenderer: ResolvedAddressRenderer<TokenMeta> = (
+  address,
+  resolvedAddress,
+  linkable,
+  dontOverrideColors
+) => (
+  <TokenName
+    address={address}
+    name={resolvedAddress.name}
+    linkable={linkable}
+    dontOverrideColors={dontOverrideColors}
+  />
+);
+
+export default TokenName;

From 9b2dcf0acab0a5f4204fd52ffeffff9dab36a4ca Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 31 Oct 2021 19:55:09 -0300
Subject: [PATCH 56/62] Fix token address link

---
 src/components/TokenName.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/TokenName.tsx b/src/components/TokenName.tsx
index 7301676..f57dd07 100644
--- a/src/components/TokenName.tsx
+++ b/src/components/TokenName.tsx
@@ -23,7 +23,7 @@ const TokenName: React.FC<TokenNameProps> = ({
         className={`flex items-baseline space-x-1 font-sans ${
           dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
         } truncate`}
-        to={`/address/${name}`}
+        to={`/address/${address}`}
         title={`${name}: ${address}`}
       >
         <Content address={address} linkable={true} name={name} />

From 9879290a38fb29994691770d60852086726d95ae Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 31 Oct 2021 19:59:14 -0300
Subject: [PATCH 57/62] Add symbol support

---
 src/components/TokenName.tsx | 28 ++++++++++++++++++++++------
 1 file changed, 22 insertions(+), 6 deletions(-)

diff --git a/src/components/TokenName.tsx b/src/components/TokenName.tsx
index f57dd07..0553d4a 100644
--- a/src/components/TokenName.tsx
+++ b/src/components/TokenName.tsx
@@ -6,6 +6,7 @@ import { TokenMeta } from "../types";
 
 type TokenNameProps = {
   name: string;
+  symbol: string;
   address: string;
   linkable: boolean;
   dontOverrideColors?: boolean;
@@ -13,6 +14,7 @@ type TokenNameProps = {
 
 const TokenName: React.FC<TokenNameProps> = ({
   name,
+  symbol,
   address,
   linkable,
   dontOverrideColors,
@@ -24,9 +26,14 @@ const TokenName: React.FC<TokenNameProps> = ({
           dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
         } truncate`}
         to={`/address/${address}`}
-        title={`${name}: ${address}`}
+        title={`${name} (${symbol}): ${address}`}
       >
-        <Content address={address} linkable={true} name={name} />
+        <Content
+          address={address}
+          linkable={true}
+          name={name}
+          symbol={symbol}
+        />
       </NavLink>
     );
   }
@@ -34,9 +41,9 @@ const TokenName: React.FC<TokenNameProps> = ({
   return (
     <div
       className="flex items-baseline space-x-1 font-sans text-gray-700 truncate"
-      title={`${name}: ${address}`}
+      title={`${name} (${symbol}): ${address}`}
     >
-      <Content address={address} linkable={false} name={name} />
+      <Content address={address} linkable={false} name={name} symbol={symbol} />
     </div>
   );
 };
@@ -45,14 +52,22 @@ type ContentProps = {
   address: string;
   linkable: boolean;
   name: string;
+  symbol: string;
 };
 
-const Content: React.FC<ContentProps> = ({ address, linkable, name }) => (
+const Content: React.FC<ContentProps> = ({
+  address,
+  linkable,
+  name,
+  symbol,
+}) => (
   <>
     <div className="self-center w-5 h-5">
       <TokenLogo address={address} name={name} />
     </div>
-    <span className="truncate">{name}</span>
+    <span className="truncate">
+      {name} ({symbol})
+    </span>
   </>
 );
 
@@ -65,6 +80,7 @@ export const tokenRenderer: ResolvedAddressRenderer<TokenMeta> = (
   <TokenName
     address={address}
     name={resolvedAddress.name}
+    symbol={resolvedAddress.symbol}
     linkable={linkable}
     dontOverrideColors={dontOverrideColors}
   />

From ba86907ec2083a2e3a9cb091b890e1f12daab209 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Sun, 31 Oct 2021 20:00:40 -0300
Subject: [PATCH 58/62] Add TODO

---
 src/api/address-resolver/index.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/api/address-resolver/index.ts b/src/api/address-resolver/index.ts
index d0a0500..6212653 100644
--- a/src/api/address-resolver/index.ts
+++ b/src/api/address-resolver/index.ts
@@ -29,6 +29,7 @@ export const resolverRendererRegistry = new Map<
 resolverRendererRegistry.set(ensResolver, ensRenderer);
 resolverRendererRegistry.set(ercTokenResolver, tokenRenderer);
 
+// TODO: implement progressive resolving
 export const batchPopulate = async (
   provider: BaseProvider,
   addresses: string[]

From 378d5a0c25fb0ded95dec0c53f069fdb074f110d Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 1 Nov 2021 01:32:35 -0300
Subject: [PATCH 59/62] Reorder attributes

---
 src/components/TokenName.tsx | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/components/TokenName.tsx b/src/components/TokenName.tsx
index 0553d4a..5c3e91b 100644
--- a/src/components/TokenName.tsx
+++ b/src/components/TokenName.tsx
@@ -5,17 +5,17 @@ import { ResolvedAddressRenderer } from "../api/address-resolver/address-resolve
 import { TokenMeta } from "../types";
 
 type TokenNameProps = {
+  address: string;
   name: string;
   symbol: string;
-  address: string;
   linkable: boolean;
   dontOverrideColors?: boolean;
 };
 
 const TokenName: React.FC<TokenNameProps> = ({
+  address,
   name,
   symbol,
-  address,
   linkable,
   dontOverrideColors,
 }) => {
@@ -50,19 +50,21 @@ const TokenName: React.FC<TokenNameProps> = ({
 
 type ContentProps = {
   address: string;
-  linkable: boolean;
   name: string;
   symbol: string;
+  linkable: boolean;
 };
 
 const Content: React.FC<ContentProps> = ({
   address,
-  linkable,
   name,
   symbol,
+  linkable,
 }) => (
   <>
-    <div className="self-center w-5 h-5">
+    <div
+      className={`self-center w-5 h-5 ${linkable ? "" : "filter grayscale"}`}
+    >
       <TokenLogo address={address} name={name} />
     </div>
     <span className="truncate">
@@ -73,14 +75,14 @@ const Content: React.FC<ContentProps> = ({
 
 export const tokenRenderer: ResolvedAddressRenderer<TokenMeta> = (
   address,
-  resolvedAddress,
+  tokenMeta,
   linkable,
   dontOverrideColors
 ) => (
   <TokenName
     address={address}
-    name={resolvedAddress.name}
-    symbol={resolvedAddress.symbol}
+    name={tokenMeta.name}
+    symbol={tokenMeta.symbol}
     linkable={linkable}
     dontOverrideColors={dontOverrideColors}
   />

From e22b564a71c1f3ebacf23d271f24d5bf4e67509d Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 1 Nov 2021 04:15:12 -0300
Subject: [PATCH 60/62] Add in-page cache capabilities to main resolver

---
 .../CompositeAddressResolver.ts               |  6 ++--
 src/api/address-resolver/index.ts             | 12 ++++---
 src/components/AddressOrENSName.tsx           |  2 +-
 src/useResolvedAddresses.ts                   | 32 ++++++++++++-------
 4 files changed, 31 insertions(+), 21 deletions(-)

diff --git a/src/api/address-resolver/CompositeAddressResolver.ts b/src/api/address-resolver/CompositeAddressResolver.ts
index 3590f3d..55a7318 100644
--- a/src/api/address-resolver/CompositeAddressResolver.ts
+++ b/src/api/address-resolver/CompositeAddressResolver.ts
@@ -1,7 +1,7 @@
 import { BaseProvider } from "@ethersproject/providers";
 import { IAddressResolver } from "./address-resolver";
 
-export type SelectedResolvedName<T> = [IAddressResolver<T>, T];
+export type SelectedResolvedName<T> = [IAddressResolver<T>, T] | null;
 
 export class CompositeAddressResolver<T = any>
   implements IAddressResolver<SelectedResolvedName<T>>
@@ -23,8 +23,6 @@ export class CompositeAddressResolver<T = any>
       }
     }
 
-    return undefined;
-    // TODO: fallback to address itself
-    // return address;
+    return null;
   }
 }
diff --git a/src/api/address-resolver/index.ts b/src/api/address-resolver/index.ts
index 6212653..dc72a9f 100644
--- a/src/api/address-resolver/index.ts
+++ b/src/api/address-resolver/index.ts
@@ -32,21 +32,25 @@ resolverRendererRegistry.set(ercTokenResolver, tokenRenderer);
 // TODO: implement progressive resolving
 export const batchPopulate = async (
   provider: BaseProvider,
-  addresses: string[]
+  addresses: string[],
+  currentMap: ResolvedAddresses | undefined
 ): Promise<ResolvedAddresses> => {
   const solvers: Promise<SelectedResolvedName<any> | undefined>[] = [];
-  for (const a of addresses) {
+  const unresolvedAddresses = addresses.filter(
+    (a) => currentMap?.[a] === undefined
+  );
+  for (const a of unresolvedAddresses) {
     solvers.push(mainResolver.resolveAddress(provider, a));
   }
 
+  const resultMap: ResolvedAddresses = currentMap ? { ...currentMap } : {};
   const results = await Promise.all(solvers);
-  const resultMap: ResolvedAddresses = {};
   for (let i = 0; i < results.length; i++) {
     const r = results[i];
     if (r === undefined) {
       continue;
     }
-    resultMap[addresses[i]] = r;
+    resultMap[unresolvedAddresses[i]] = r;
   }
 
   return resultMap;
diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx
index b10c0eb..9e4b65b 100644
--- a/src/components/AddressOrENSName.tsx
+++ b/src/components/AddressOrENSName.tsx
@@ -23,7 +23,7 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
   const resolvedAddress = resolvedAddresses?.[address];
   const linkable = address !== selectedAddress;
 
-  if (resolvedAddress === undefined) {
+  if (!resolvedAddress) {
     return (
       <PlainAddress
         address={address}
diff --git a/src/useResolvedAddresses.ts b/src/useResolvedAddresses.ts
index 74042e5..1936da0 100644
--- a/src/useResolvedAddresses.ts
+++ b/src/useResolvedAddresses.ts
@@ -1,4 +1,4 @@
-import { useState, useEffect } from "react";
+import { useState, useEffect, useRef } from "react";
 import { JsonRpcProvider } from "@ethersproject/providers";
 import { ProcessedTransaction, TransactionData } from "./types";
 import { batchPopulate, ResolvedAddresses } from "./api/address-resolver";
@@ -66,19 +66,27 @@ export const useResolvedAddresses = (
   addrCollector: AddressCollector
 ) => {
   const [names, setNames] = useState<ResolvedAddresses>();
-
+  const ref = useRef<ResolvedAddresses | undefined>();
   useEffect(() => {
-    if (!provider) {
-      return;
-    }
+    ref.current = names;
+  });
 
-    const populate = async () => {
-      const _addresses = addrCollector();
-      const _names = await batchPopulate(provider, _addresses);
-      setNames(_names);
-    };
-    populate();
-  }, [provider, addrCollector]);
+  useEffect(
+    () => {
+      if (!provider) {
+        return;
+      }
+
+      const populate = async () => {
+        const _addresses = addrCollector();
+        const _names = await batchPopulate(provider, _addresses, ref.current);
+        setNames(_names);
+      };
+      populate();
+    },
+    // DON'T put names variables in dependency array; this is intentional; useRef
+    [provider, addrCollector]
+  );
 
   return names;
 };

From 91a888c73b3999bb0b9049198ed94508d0d672dd Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 1 Nov 2021 04:26:19 -0300
Subject: [PATCH 61/62] Migrate remaining token decoration support to the new
 resolver framework

---
 src/TokenTransferItem.tsx               |  8 ++++----
 src/components/AddressOrENSName.tsx     |  4 ----
 src/components/DecoratedAddressLink.tsx | 13 +------------
 src/components/PlainAddress.tsx         |  6 ++----
 src/transaction/Details.tsx             |  1 +
 5 files changed, 8 insertions(+), 24 deletions(-)

diff --git a/src/TokenTransferItem.tsx b/src/TokenTransferItem.tsx
index 083f7f0..03fa198 100644
--- a/src/TokenTransferItem.tsx
+++ b/src/TokenTransferItem.tsx
@@ -11,11 +11,13 @@ import {
   TokenTransfer,
   TransactionData,
 } from "./types";
+import { ResolvedAddresses } from "./api/address-resolver";
 
 type TokenTransferItemProps = {
   t: TokenTransfer;
   txData: TransactionData;
   tokenMeta?: TokenMeta | undefined;
+  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 // TODO: handle partial
@@ -23,6 +25,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
   t,
   txData,
   tokenMeta,
+  resolvedAddresses,
 }) => (
   <div className="flex items-baseline space-x-2 px-2 py-1 truncate hover:bg-gray-100">
     <span className="text-gray-500">
@@ -64,10 +67,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
         <AddressHighlighter address={t.token}>
           <DecoratedAddressLink
             address={t.token}
-            text={
-              tokenMeta ? `${tokenMeta.name} (${tokenMeta.symbol})` : undefined
-            }
-            tokenMeta={tokenMeta}
+            resolvedAddresses={resolvedAddresses}
           />
         </AddressHighlighter>
       </div>
diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx
index 9e4b65b..62ee289 100644
--- a/src/components/AddressOrENSName.tsx
+++ b/src/components/AddressOrENSName.tsx
@@ -8,7 +8,6 @@ import PlainAddress from "./PlainAddress";
 type AddressOrENSNameProps = {
   address: string;
   selectedAddress?: string;
-  text?: string;
   dontOverrideColors?: boolean;
   resolvedAddresses?: ResolvedAddresses | undefined;
 };
@@ -16,7 +15,6 @@ type AddressOrENSNameProps = {
 const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
   address,
   selectedAddress,
-  text,
   dontOverrideColors,
   resolvedAddresses,
 }) => {
@@ -27,7 +25,6 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
     return (
       <PlainAddress
         address={address}
-        text={text}
         linkable={linkable}
         dontOverrideColors={dontOverrideColors}
       />
@@ -40,7 +37,6 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
     return (
       <PlainAddress
         address={address}
-        text={text}
         linkable={linkable}
         dontOverrideColors={dontOverrideColors}
       />
diff --git a/src/components/DecoratedAddressLink.tsx b/src/components/DecoratedAddressLink.tsx
index ee88b31..cadc77f 100644
--- a/src/components/DecoratedAddressLink.tsx
+++ b/src/components/DecoratedAddressLink.tsx
@@ -5,36 +5,31 @@ import { faBomb } from "@fortawesome/free-solid-svg-icons/faBomb";
 import { faMoneyBillAlt } from "@fortawesome/free-solid-svg-icons/faMoneyBillAlt";
 import { faBurn } from "@fortawesome/free-solid-svg-icons/faBurn";
 import { faCoins } from "@fortawesome/free-solid-svg-icons/faCoins";
-import TokenLogo from "./TokenLogo";
 import AddressOrENSName from "./AddressOrENSName";
-import { AddressContext, TokenMeta, ZERO_ADDRESS } from "../types";
+import { AddressContext, ZERO_ADDRESS } from "../types";
 import { ResolvedAddresses } from "../api/address-resolver";
 
 type DecoratedAddressLinkProps = {
   address: string;
   selectedAddress?: string;
-  text?: string;
   addressCtx?: AddressContext;
   creation?: boolean;
   miner?: boolean;
   selfDestruct?: boolean;
   txFrom?: boolean;
   txTo?: boolean;
-  tokenMeta?: TokenMeta;
   resolvedAddresses?: ResolvedAddresses | undefined;
 };
 
 const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
   address,
   selectedAddress,
-  text,
   addressCtx,
   creation,
   miner,
   selfDestruct,
   txFrom,
   txTo,
-  tokenMeta,
   resolvedAddresses,
 }) => {
   const mint = addressCtx === AddressContext.FROM && address === ZERO_ADDRESS;
@@ -75,15 +70,9 @@ const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
           <FontAwesomeIcon icon={faCoins} size="1x" />
         </span>
       )}
-      {tokenMeta && (
-        <div className="self-center">
-          <TokenLogo address={address} name={tokenMeta.name} />
-        </div>
-      )}
       <AddressOrENSName
         address={address}
         selectedAddress={selectedAddress}
-        text={text}
         dontOverrideColors={mint || burn}
         resolvedAddresses={resolvedAddresses}
       />
diff --git a/src/components/PlainAddress.tsx b/src/components/PlainAddress.tsx
index 6ebe634..fbc37ca 100644
--- a/src/components/PlainAddress.tsx
+++ b/src/components/PlainAddress.tsx
@@ -3,14 +3,12 @@ import { NavLink } from "react-router-dom";
 
 type PlainAddressProps = {
   address: string;
-  text: string | undefined;
   linkable: boolean;
   dontOverrideColors: boolean | undefined;
 };
 
 const PlainAddress: React.FC<PlainAddressProps> = ({
   address,
-  text,
   linkable,
   dontOverrideColors,
 }) => {
@@ -21,9 +19,9 @@ const PlainAddress: React.FC<PlainAddressProps> = ({
           dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
         } font-address truncate`}
         to={`/address/${address}`}
-        title={text ?? address}
+        title={address}
       >
-        <>{text ?? address}</>
+        {address}
       </NavLink>
     );
   }
diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx
index 72f448a..6286efa 100644
--- a/src/transaction/Details.tsx
+++ b/src/transaction/Details.tsx
@@ -225,6 +225,7 @@ const Details: React.FC<DetailsProps> = ({
                 t={t}
                 txData={txData}
                 tokenMeta={txData.tokenMetas[t.token]}
+                resolvedAddresses={resolvedAddresses}
               />
             ))}
           </div>

From 66be71f89d2988fb0629c622d02a681792a06ed5 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Mon, 1 Nov 2021 04:46:19 -0300
Subject: [PATCH 62/62] TODO: must finish reverse token address support on
 internal ETH transfers section

---
 src/components/InternalTransactionOperation.tsx | 10 ++++++++--
 src/components/InternalTransfer.tsx             |  3 +++
 src/transaction/Details.tsx                     |  1 +
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/InternalTransactionOperation.tsx b/src/components/InternalTransactionOperation.tsx
index 095162f..7de3bb2 100644
--- a/src/components/InternalTransactionOperation.tsx
+++ b/src/components/InternalTransactionOperation.tsx
@@ -3,17 +3,23 @@ import InternalTransfer from "./InternalTransfer";
 import InternalSelfDestruct from "./InternalSelfDestruct";
 import InternalCreate from "./InternalCreate";
 import { TransactionData, InternalOperation, OperationType } from "../types";
+import { ResolvedAddresses } from "../api/address-resolver";
 
 type InternalTransactionOperationProps = {
   txData: TransactionData;
   internalOp: InternalOperation;
+  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const InternalTransactionOperation: React.FC<InternalTransactionOperationProps> =
-  ({ txData, internalOp }) => (
+  ({ txData, internalOp, resolvedAddresses }) => (
     <>
       {internalOp.type === OperationType.TRANSFER && (
-        <InternalTransfer txData={txData} internalOp={internalOp} />
+        <InternalTransfer
+          txData={txData}
+          internalOp={internalOp}
+          resolvedAddresses={resolvedAddresses}
+        />
       )}
       {internalOp.type === OperationType.SELF_DESTRUCT && (
         <InternalSelfDestruct txData={txData} internalOp={internalOp} />
diff --git a/src/components/InternalTransfer.tsx b/src/components/InternalTransfer.tsx
index dc53d05..2958452 100644
--- a/src/components/InternalTransfer.tsx
+++ b/src/components/InternalTransfer.tsx
@@ -5,15 +5,18 @@ import { faAngleRight } from "@fortawesome/free-solid-svg-icons/faAngleRight";
 import AddressHighlighter from "./AddressHighlighter";
 import DecoratedAddressLink from "./DecoratedAddressLink";
 import { TransactionData, InternalOperation } from "../types";
+import { ResolvedAddresses } from "../api/address-resolver";
 
 type InternalTransferProps = {
   txData: TransactionData;
   internalOp: InternalOperation;
+  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const InternalTransfer: React.FC<InternalTransferProps> = ({
   txData,
   internalOp,
+  resolvedAddresses,
 }) => {
   const fromMiner =
     txData.confirmedData?.miner !== undefined &&
diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx
index 6286efa..9c9e29d 100644
--- a/src/transaction/Details.tsx
+++ b/src/transaction/Details.tsx
@@ -206,6 +206,7 @@ const Details: React.FC<DetailsProps> = ({
                 key={i}
                 txData={txData}
                 internalOp={op}
+                resolvedAddresses={resolvedAddresses}
               />
             ))}
           </div>