diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index d1cb0ba9dc..cc48cec34c 100644
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -1,6 +1,6 @@
 {
 	"name": "blockscout dev",
-	"image": "mcr.microsoft.com/devcontainers/typescript-node:18",
+	"image": "mcr.microsoft.com/devcontainers/typescript-node:20",
 	"forwardPorts": [ 3000 ],
 	"customizations": {
 		"vscode": {
diff --git a/.env.example b/.env.example
index ce97e7621c..e56bd6211b 100644
--- a/.env.example
+++ b/.env.example
@@ -4,5 +4,6 @@ NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID=xxx
 NEXT_PUBLIC_RE_CAPTCHA_APP_SITE_KEY=xxx
 NEXT_PUBLIC_GOOGLE_ANALYTICS_PROPERTY_ID=UA-XXXXXX-X
 NEXT_PUBLIC_MIXPANEL_PROJECT_TOKEN=xxx
+NEXT_PUBLIC_GROWTH_BOOK_CLIENT_KEY=xxx
 NEXT_PUBLIC_AUTH0_CLIENT_ID=xxx
 FAVICON_GENERATOR_API_KEY=xxx
diff --git a/.github/workflows/checks.yml b/.github/workflows/checks.yml
index eb0810c8f5..9496bb37e6 100644
--- a/.github/workflows/checks.yml
+++ b/.github/workflows/checks.yml
@@ -25,16 +25,16 @@ jobs:
     if: ${{ !contains(github.event.pull_request.labels.*.name, 'skip checks') && !(github.event.action == 'unlabeled' && github.event.label.name != 'skip checks') }}
     steps:
       - name: Checkout repo
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       - name: Setup node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: 18
+          node-version: 20.11.0
           cache: 'yarn'
 
       - name: Cache node_modules
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         id: cache-node-modules
         with:
           path: |
@@ -57,16 +57,16 @@ jobs:
     needs: [ code_quality ]
     steps:
       - name: Checkout repo
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       - name: Setup node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: 18
+          node-version: 20.11.0
           cache: 'yarn'
 
       - name: Cache node_modules
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         id: cache-node-modules
         with:
           path: |
@@ -94,16 +94,18 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repo
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
 
       - name: Setup node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: 18
+          node-version: 20.11.0
           cache: 'yarn'
 
       - name: Cache node_modules
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         id: cache-node-modules
         with:
           path: |
@@ -115,14 +117,61 @@ jobs:
         run: yarn --frozen-lockfile --ignore-optional
 
       - name: Run Jest
-        run: yarn test:jest
+        run: yarn test:jest ${{ github.event_name == 'pull_request' && '--changedSince=origin/main' || '' }} --passWithNoTests
+
+  pw_affected_tests:
+    name: Resolve affected Playwright tests
+    runs-on: ubuntu-latest
+    needs: [ code_quality, envs_validation ]
+    if: github.event_name == 'pull_request'
+    steps:
+      - name: Checkout repo
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20.11.0
+          cache: 'yarn'
+
+      - name: Cache node_modules
+        uses: actions/cache@v4
+        id: cache-node-modules
+        with:
+          path: |
+            node_modules
+          key: node_modules-${{ runner.os }}-${{ hashFiles('yarn.lock') }}
+      
+      - name: Install dependencies
+        if: steps.cache-node-modules.outputs.cache-hit != 'true'
+        run: yarn --frozen-lockfile --ignore-optional
+
+      - name: Install script dependencies 
+        run: cd ./deploy/tools/affected-tests && yarn --frozen-lockfile
+      
+      - name: Run script
+        run: yarn test:pw:detect-affected
+
+      - name: Upload result file
+        uses: actions/upload-artifact@v4
+        with:
+          name: playwright-affected-tests
+          path: ./playwright/affected-tests.txt
+          retention-days: 3
 
   pw_tests:
     name: 'Playwright tests / Project: ${{ matrix.project }}'
-    needs: [ code_quality, envs_validation ]
+    needs: [ code_quality, envs_validation, pw_affected_tests ]
+    if: |
+      always() &&
+      needs.code_quality.result == 'success' && 
+      needs.envs_validation.result == 'success' && 
+      (needs.pw_affected_tests.result == 'success' || needs.pw_affected_tests.result == 'skipped') 
     runs-on: ubuntu-latest
     container:
-      image: mcr.microsoft.com/playwright:v1.35.1-focal
+      image: mcr.microsoft.com/playwright:v1.41.1-focal
 
     strategy:
       fail-fast: false
@@ -134,18 +183,18 @@ jobs:
         run: apt-get update && apt-get install git-lfs
 
       - name: Checkout repo
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
         with:
           lfs: 'true'
 
       - name: Setup node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
-          node-version: 18
+          node-version: 20.11.0
           cache: 'yarn'
 
       - name: Cache node_modules
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         id: cache-node-modules
         with:
           path: |
@@ -156,15 +205,23 @@ jobs:
         if: steps.cache-node-modules.outputs.cache-hit != 'true'
         run: yarn --frozen-lockfile --ignore-optional
 
+      - name: Download affected tests list
+        if: ${{ needs.pw_affected_tests.result == 'success' }}
+        uses: actions/download-artifact@v4
+        continue-on-error: true
+        with:
+          name: playwright-affected-tests
+          path: ./playwright
+
       - name: Run PlayWright
-        run: yarn test:pw:ci
+        run: yarn test:pw:ci --affected=${{ github.event_name == 'pull_request' }} --pass-with-no-tests
         env:
           HOME: /root
           PW_PROJECT: ${{ matrix.project }}
 
       - name: Upload test results
         if: always()
-        uses: actions/upload-artifact@v3
+        uses: actions/upload-artifact@v4
         with:
           name: playwright-report-${{ matrix.project }}
           path: playwright-report
diff --git a/.github/workflows/deploy-main.yml b/.github/workflows/deploy-main.yml
index d8cf2b79b3..087934c334 100644
--- a/.github/workflows/deploy-main.yml
+++ b/.github/workflows/deploy-main.yml
@@ -4,6 +4,7 @@ on:
   push:
     branches:
       - main
+  workflow_dispatch:
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
diff --git a/.github/workflows/label-issues-in-release.yml b/.github/workflows/label-issues-in-release.yml
index 4bc9861b0d..b95fd45616 100644
--- a/.github/workflows/label-issues-in-release.yml
+++ b/.github/workflows/label-issues-in-release.yml
@@ -59,7 +59,7 @@ jobs:
         steps:
             -   name: Getting tags of the two latestest releases
                 id: tags
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     TAG: ${{ inputs.tag }}
                 with:
@@ -108,7 +108,7 @@ jobs:
             
             -   name: Looking for commits between two releases
                 id: commits
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     PREVIOUS_TAG: ${{ steps.tags.outputs.previous }}
                     LATEST_TAG: ${{ steps.tags.outputs.latest }}
@@ -137,7 +137,7 @@ jobs:
 
             -   name: Looking for issues linked to commits
                 id: linked_issues
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     COMMITS: ${{ steps.commits.outputs.result }}
                 with:
@@ -225,7 +225,7 @@ jobs:
 
             -   name: Creating label
                 id: label_creating
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     LABEL_NAME: ${{ inputs.label_name }}
                     LABEL_COLOR: ${{ inputs.label_color }}
@@ -253,7 +253,7 @@ jobs:
 
             -   name: Adding label to issues
                 id: labeling_issues
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     LABEL_NAME: ${{ inputs.label_name }}
                     ISSUES: ${{ steps.linked_issues.outputs.result }}
diff --git a/.github/workflows/pre-release.yml b/.github/workflows/pre-release.yml
index e0cb8684b8..c45cb9249d 100644
--- a/.github/workflows/pre-release.yml
+++ b/.github/workflows/pre-release.yml
@@ -32,7 +32,7 @@ jobs:
         steps:
             -   name: Determine if it is the initial version of the pre-release
                 id: is_initial
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     TAG: ${{ github.ref_name }}
                 with:
diff --git a/.github/workflows/project-management.yml b/.github/workflows/project-management.yml
index 791515b07d..ce53245267 100644
--- a/.github/workflows/project-management.yml
+++ b/.github/workflows/project-management.yml
@@ -37,7 +37,7 @@ jobs:
         steps:
             - name: Fetching issues linked to pull request
               id: linked_issues
-              uses: actions/github-script@v6
+              uses: actions/github-script@v7
               env:
                 PULL_REQUEST_NUMBER: ${{ github.event.pull_request.number }}
               with:
diff --git a/.github/workflows/publish-image.yml b/.github/workflows/publish-image.yml
index b1fdabff64..ba0382b078 100644
--- a/.github/workflows/publish-image.yml
+++ b/.github/workflows/publish-image.yml
@@ -7,12 +7,22 @@ on:
                 description: Image tags
                 required: false
                 type: string
+            platforms:
+                description: Image platforms (you can specify multiple platforms separated by comma)
+                required: false
+                type: string
+                default: linux/amd64
     workflow_call:
         inputs:
             tags:
                 description: Image tags
                 required: false
                 type: string
+            platforms:
+                description: Image platforms (you can specify multiple platforms separated by comma)
+                required: false
+                type: string
+                default: linux/amd64
 
 jobs:
     run:
@@ -20,15 +30,15 @@ jobs:
         runs-on: ubuntu-latest
         steps:
             -   name: Check out the repo
-                uses: actions/checkout@v3
+                uses: actions/checkout@v4
     
             -   name: Set up Docker Buildx
-                uses: docker/setup-buildx-action@v2
+                uses: docker/setup-buildx-action@v3
     
             # Will automatically make nice tags, see the table here https://github.com/docker/metadata-action#basic
             -   name: Docker meta
                 id: meta
-                uses: docker/metadata-action@v4
+                uses: docker/metadata-action@v5
                 with:
                     images: ghcr.io/blockscout/frontend
     
@@ -51,13 +61,14 @@ jobs:
                     echo "ref_name: $REF_NAME"
     
             -   name: Build and push
-                uses: docker/build-push-action@v3
+                uses: docker/build-push-action@v5
                 with:
                     context: .
                     file: ./Dockerfile
                     push: true
                     cache-from: type=gha
                     tags: ${{ inputs.tags || steps.meta.outputs.tags }}
+                    platforms: ${{ inputs.platforms }}
                     labels: ${{ steps.meta.outputs.labels }}
                     build-args: |
                         GIT_COMMIT_SHA=${{ env.SHORT_SHA }}
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index bbb3f07448..fb0c863799 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -12,7 +12,7 @@ jobs:
         steps:
             -   name: Remove label
                 id: tags
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     LABEL_NAME: pre-release
                 with:
@@ -78,6 +78,8 @@ jobs:
         name: Publish Docker image
         uses: './.github/workflows/publish-image.yml'
         secrets: inherit
+        with:
+            platforms: linux/amd64,linux/arm64/v8
 
     upload_source_maps:
         name: Upload source maps to Sentry
diff --git a/.github/workflows/update-project-cards.yml b/.github/workflows/update-project-cards.yml
index 98ffbed2bb..b071ba61da 100644
--- a/.github/workflows/update-project-cards.yml
+++ b/.github/workflows/update-project-cards.yml
@@ -48,7 +48,7 @@ jobs:
         steps:
             -   name: Getting project info
                 id: project_info
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     PROJECT_NAME: ${{ inputs.project_name }}
                     FIELD_NAME: ${{ inputs.field_name }}
@@ -131,7 +131,7 @@ jobs:
 
             -   name: Getting project items that linked to the issues
                 id: items
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     ISSUES: ${{ inputs.issues }}
                 with:
@@ -193,7 +193,7 @@ jobs:
 
             -   name: Updating field value of the project items
                 id: updating_items
-                uses: actions/github-script@v6
+                uses: actions/github-script@v7
                 env:
                     ITEMS: ${{ steps.items.outputs.result }}
                     PROJECT_ID: ${{ steps.project_info.outputs.id }}
diff --git a/.github/workflows/upload-source-maps.yml b/.github/workflows/upload-source-maps.yml
index 0c284672a1..55b18067fe 100644
--- a/.github/workflows/upload-source-maps.yml
+++ b/.github/workflows/upload-source-maps.yml
@@ -16,16 +16,16 @@ jobs:
         if: ${{ github.ref_type == 'tag' }}
         steps:
             - name: Checkout repo
-              uses: actions/checkout@v3
+              uses: actions/checkout@v4
 
             - name: Setup node
-              uses: actions/setup-node@v3
+              uses: actions/setup-node@v4
               with:
-                node-version: 18
+                node-version: 20.11.0
                 cache: 'yarn'
 
             - name: Cache node_modules
-              uses: actions/cache@v3
+              uses: actions/cache@v4
               id: cache-node-modules
               with:
                 path: |
diff --git a/.gitignore b/.gitignore
index f677256817..4ee6adeee0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -54,5 +54,6 @@ yarn-error.log*
 /playwright/.cache/
 /playwright/.browser/
 /playwright/envs.js
+/playwright/affected-tests.txt
 
 **.dec**
\ No newline at end of file
diff --git a/.nvmrc b/.nvmrc
index 3c032078a4..8b0beab16a 100644
--- a/.nvmrc
+++ b/.nvmrc
@@ -1 +1 @@
-18
+20.11.0
diff --git a/.vscode/tasks.json b/.vscode/tasks.json
index cd1be4e2b7..ad9f96bd7f 100644
--- a/.vscode/tasks.json
+++ b/.vscode/tasks.json
@@ -155,6 +155,27 @@
                 "instanceLimit": 1
             }
         },
+        {
+            "type": "shell",
+            "command": "yarn test:pw:detect-affected",
+            "problemMatcher": [],
+            "label": "pw: detect affected",
+            "detail": "detect PW tests affected by changes in current branch",
+            "presentation": {
+                "reveal": "always",
+                "panel": "shared",
+                "focus": true,
+                "close": false,
+                "revealProblems": "onProblem",
+            },
+            "icon": {
+                "color": "terminal.ansiBlue",
+                "id": "diff"
+            },
+            "runOptions": {
+                "instanceLimit": 1
+            },
+        },
 
         // JEST TESTS
         {
@@ -305,6 +326,7 @@
             "options": [
               "",
               "--update-snapshots",
+              "--update-snapshots --affected",
               "--ui",
             ],
             "default": ""
@@ -316,13 +338,16 @@
             "options": [
               "main",
               "main.L2",
-              "poa_core",
+              "eth",
               "eth_goerli",
               "sepolia",
-              "eth",
-              "rootstock",
               "polygon",
+              "zkevm",
+              "zksync",
               "gnosis",
+              "rootstock",
+              "stability",
+              "poa_core",
               "localhost",
             ],
             "default": "main"
diff --git a/Dockerfile b/Dockerfile
index 465491b3c4..f38d68ebaa 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -1,7 +1,7 @@
 # *****************************
 # *** STAGE 1: Dependencies ***
 # *****************************
-FROM node:18-alpine AS deps
+FROM node:20.11.0-alpine AS deps
 # Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
 RUN apk add --no-cache libc6-compat
 
@@ -10,7 +10,7 @@ RUN apk add --no-cache libc6-compat
 WORKDIR /app
 COPY package.json yarn.lock ./
 RUN apk add git
-RUN yarn --frozen-lockfile --ignore-optional
+RUN yarn --frozen-lockfile
 
 
 ### FEATURE REPORTER
@@ -30,7 +30,7 @@ RUN yarn --frozen-lockfile
 # *****************************
 # ****** STAGE 2: Build *******
 # *****************************
-FROM node:18-alpine AS builder
+FROM node:20.11.0-alpine AS builder
 RUN apk add --no-cache --upgrade libc6-compat bash
 
 # pass commit sha and git tag to the app image
@@ -78,7 +78,7 @@ RUN cd ./deploy/tools/envs-validator && yarn build
 # ******* STAGE 3: Run ********
 # *****************************
 # Production image, copy all the files and run next
-FROM node:18-alpine AS runner
+FROM node:20.11.0-alpine AS runner
 RUN apk add --no-cache --upgrade bash curl jq unzip
 
 ### APP
diff --git a/configs/app/app.ts b/configs/app/app.ts
index f1b87b601d..b0403fc673 100644
--- a/configs/app/app.ts
+++ b/configs/app/app.ts
@@ -9,7 +9,7 @@ const baseUrl = [
   appHost,
   appPort && ':' + appPort,
 ].filter(Boolean).join('');
-const isDev = getEnvValue('NODE_ENV') === 'development';
+const isDev = getEnvValue('NEXT_PUBLIC_APP_ENV') === 'development';
 
 const app = Object.freeze({
   isDev,
diff --git a/configs/app/chain.ts b/configs/app/chain.ts
index b65fbeb384..1ec156e4e0 100644
--- a/configs/app/chain.ts
+++ b/configs/app/chain.ts
@@ -8,6 +8,7 @@ const chain = Object.freeze({
   shortName: getEnvValue('NEXT_PUBLIC_NETWORK_SHORT_NAME'),
   currency: {
     name: getEnvValue('NEXT_PUBLIC_NETWORK_CURRENCY_NAME'),
+    weiName: getEnvValue('NEXT_PUBLIC_NETWORK_CURRENCY_WEI_NAME'),
     symbol: getEnvValue('NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL'),
     decimals: Number(getEnvValue('NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS')) || DEFAULT_CURRENCY_DECIMALS,
   },
diff --git a/configs/app/features/adsBanner.ts b/configs/app/features/adsBanner.ts
index 0785ab160f..f9860d1afc 100644
--- a/configs/app/features/adsBanner.ts
+++ b/configs/app/features/adsBanner.ts
@@ -1,7 +1,7 @@
 import type { Feature } from './types';
 import type { AdButlerConfig } from 'types/client/adButlerConfig';
 import { SUPPORTED_AD_BANNER_PROVIDERS } from 'types/client/adProviders';
-import type { AdBannerProviders } from 'types/client/adProviders';
+import type { AdBannerProviders, AdBannerAdditionalProviders } from 'types/client/adProviders';
 
 import { getEnvValue, parseEnvJson } from '../utils';
 
@@ -11,6 +11,8 @@ const provider: AdBannerProviders = (() => {
   return envValue && SUPPORTED_AD_BANNER_PROVIDERS.includes(envValue) ? envValue : 'slise';
 })();
 
+const additionalProvider = getEnvValue('NEXT_PUBLIC_AD_BANNER_ADDITIONAL_PROVIDER') as AdBannerAdditionalProviders;
+
 const title = 'Banner ads';
 
 type AdsBannerFeaturePayload = {
@@ -23,6 +25,15 @@ type AdsBannerFeaturePayload = {
       mobile: AdButlerConfig;
     };
   };
+} | {
+  provider: Exclude<AdBannerProviders, 'adbutler' | 'none'>;
+  additionalProvider: 'adbutler';
+  adButler: {
+    config: {
+      desktop: AdButlerConfig;
+      mobile: AdButlerConfig;
+    };
+  };
 }
 
 const config: Feature<AdsBannerFeaturePayload> = (() => {
@@ -44,6 +55,24 @@ const config: Feature<AdsBannerFeaturePayload> = (() => {
       });
     }
   } else if (provider !== 'none') {
+
+    if (additionalProvider === 'adbutler') {
+      const desktopConfig = parseEnvJson<AdButlerConfig>(getEnvValue('NEXT_PUBLIC_AD_ADBUTLER_CONFIG_DESKTOP'));
+      const mobileConfig = parseEnvJson<AdButlerConfig>(getEnvValue('NEXT_PUBLIC_AD_ADBUTLER_CONFIG_MOBILE'));
+
+      return Object.freeze({
+        title,
+        isEnabled: true,
+        provider,
+        additionalProvider,
+        adButler: {
+          config: {
+            desktop: desktopConfig,
+            mobile: mobileConfig,
+          },
+        },
+      });
+    }
     return Object.freeze({
       title,
       isEnabled: true,
diff --git a/configs/app/features/adsText.ts b/configs/app/features/adsText.ts
index b44fa59e85..82946f984f 100644
--- a/configs/app/features/adsText.ts
+++ b/configs/app/features/adsText.ts
@@ -1,12 +1,12 @@
 import type { Feature } from './types';
-import { SUPPORTED_AD_BANNER_PROVIDERS } from 'types/client/adProviders';
+import { SUPPORTED_AD_TEXT_PROVIDERS } from 'types/client/adProviders';
 import type { AdTextProviders } from 'types/client/adProviders';
 
 import { getEnvValue } from '../utils';
 
 const provider: AdTextProviders = (() => {
   const envValue = getEnvValue('NEXT_PUBLIC_AD_TEXT_PROVIDER') as AdTextProviders;
-  return envValue && SUPPORTED_AD_BANNER_PROVIDERS.includes(envValue) ? envValue : 'coinzilla';
+  return envValue && SUPPORTED_AD_TEXT_PROVIDERS.includes(envValue) ? envValue : 'coinzilla';
 })();
 
 const title = 'Text ads';
diff --git a/configs/app/features/dataAvailability.ts b/configs/app/features/dataAvailability.ts
new file mode 100644
index 0000000000..add9e5fec5
--- /dev/null
+++ b/configs/app/features/dataAvailability.ts
@@ -0,0 +1,21 @@
+import type { Feature } from './types';
+
+import { getEnvValue } from '../utils';
+
+const title = 'Data availability';
+
+const config: Feature<{ isEnabled: true }> = (() => {
+  if (getEnvValue('NEXT_PUBLIC_DATA_AVAILABILITY_ENABLED') === 'true') {
+    return Object.freeze({
+      title,
+      isEnabled: true,
+    });
+  }
+
+  return Object.freeze({
+    title,
+    isEnabled: false,
+  });
+})();
+
+export default config;
diff --git a/configs/app/features/gasTracker.ts b/configs/app/features/gasTracker.ts
new file mode 100644
index 0000000000..c20242e602
--- /dev/null
+++ b/configs/app/features/gasTracker.ts
@@ -0,0 +1,37 @@
+import type { Feature } from './types';
+import { GAS_UNITS } from 'types/client/gasTracker';
+import type { GasUnit } from 'types/client/gasTracker';
+
+import { getEnvValue, parseEnvJson } from '../utils';
+
+const isDisabled = getEnvValue('NEXT_PUBLIC_GAS_TRACKER_ENABLED') === 'false';
+
+const units = ((): Array<GasUnit> => {
+  const envValue = getEnvValue('NEXT_PUBLIC_GAS_TRACKER_UNITS');
+  if (!envValue) {
+    return [ 'usd', 'gwei' ];
+  }
+
+  const units = parseEnvJson<Array<GasUnit>>(envValue)?.filter((type) => GAS_UNITS.includes(type)) || [];
+
+  return units;
+})();
+
+const title = 'Gas tracker';
+
+const config: Feature<{ units: Array<GasUnit> }> = (() => {
+  if (!isDisabled && units.length > 0) {
+    return Object.freeze({
+      title,
+      isEnabled: true,
+      units,
+    });
+  }
+
+  return Object.freeze({
+    title,
+    isEnabled: false,
+  });
+})();
+
+export default config;
diff --git a/configs/app/features/growthBook.ts b/configs/app/features/growthBook.ts
new file mode 100644
index 0000000000..af672c5ac9
--- /dev/null
+++ b/configs/app/features/growthBook.ts
@@ -0,0 +1,24 @@
+import type { Feature } from './types';
+
+import { getEnvValue } from '../utils';
+
+const clientKey = getEnvValue('NEXT_PUBLIC_GROWTH_BOOK_CLIENT_KEY');
+
+const title = 'GrowthBook feature flagging and A/B testing';
+
+const config: Feature<{ clientKey: string }> = (() => {
+  if (clientKey) {
+    return Object.freeze({
+      title,
+      isEnabled: true,
+      clientKey,
+    });
+  }
+
+  return Object.freeze({
+    title,
+    isEnabled: false,
+  });
+})();
+
+export default config;
diff --git a/configs/app/features/index.ts b/configs/app/features/index.ts
index 0879fb17d5..fbe1a6a949 100644
--- a/configs/app/features/index.ts
+++ b/configs/app/features/index.ts
@@ -6,18 +6,25 @@ export { default as beaconChain } from './beaconChain';
 export { default as bridgedTokens } from './bridgedTokens';
 export { default as blockchainInteraction } from './blockchainInteraction';
 export { default as csvExport } from './csvExport';
+export { default as dataAvailability } from './dataAvailability';
+export { default as gasTracker } from './gasTracker';
 export { default as googleAnalytics } from './googleAnalytics';
 export { default as graphqlApiDocs } from './graphqlApiDocs';
+export { default as growthBook } from './growthBook';
 export { default as marketplace } from './marketplace';
+export { default as metasuites } from './metasuites';
 export { default as mixpanel } from './mixpanel';
+export { default as nameService } from './nameService';
 export { default as restApiDocs } from './restApiDocs';
-export { default as optimisticRollup } from './optimisticRollup';
+export { default as rollup } from './rollup';
 export { default as safe } from './safe';
 export { default as sentry } from './sentry';
 export { default as sol2uml } from './sol2uml';
 export { default as stats } from './stats';
 export { default as suave } from './suave';
+export { default as swapButton } from './swapButton';
 export { default as txInterpretation } from './txInterpretation';
-export { default as web3Wallet } from './web3Wallet';
+export { default as userOps } from './userOps';
+export { default as validators } from './validators';
 export { default as verifiedTokens } from './verifiedTokens';
-export { default as zkEvmRollup } from './zkEvmRollup';
+export { default as web3Wallet } from './web3Wallet';
diff --git a/configs/app/features/marketplace.ts b/configs/app/features/marketplace.ts
index 5ea76352f2..b136ce0d09 100644
--- a/configs/app/features/marketplace.ts
+++ b/configs/app/features/marketplace.ts
@@ -4,23 +4,51 @@ import chain from '../chain';
 import { getEnvValue, getExternalAssetFilePath } from '../utils';
 
 // config file will be downloaded at run-time and saved in the public folder
+const enabled = getEnvValue('NEXT_PUBLIC_MARKETPLACE_ENABLED');
 const configUrl = getExternalAssetFilePath('NEXT_PUBLIC_MARKETPLACE_CONFIG_URL');
 const submitFormUrl = getEnvValue('NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM');
+const suggestIdeasFormUrl = getEnvValue('NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM');
+const categoriesUrl = getExternalAssetFilePath('NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL');
+const adminServiceApiHost = getEnvValue('NEXT_PUBLIC_ADMIN_SERVICE_API_HOST');
+const securityReportsUrl = getExternalAssetFilePath('NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL');
 
 const title = 'Marketplace';
 
-const config: Feature<{ configUrl: string; submitFormUrl: string }> = (() => {
-  if (
-    chain.rpcUrl &&
-    configUrl &&
-    submitFormUrl
-  ) {
-    return Object.freeze({
-      title,
-      isEnabled: true,
-      configUrl,
-      submitFormUrl,
-    });
+const config: Feature<(
+  { configUrl: string } |
+  { api: { endpoint: string; basePath: string } }
+) & {
+  submitFormUrl: string;
+  categoriesUrl: string | undefined;
+  suggestIdeasFormUrl: string | undefined;
+  securityReportsUrl: string | undefined;
+}
+> = (() => {
+  if (enabled === 'true' && chain.rpcUrl && submitFormUrl) {
+    if (configUrl) {
+      return Object.freeze({
+        title,
+        isEnabled: true,
+        configUrl,
+        submitFormUrl,
+        categoriesUrl,
+        suggestIdeasFormUrl,
+        securityReportsUrl,
+      });
+    } else if (adminServiceApiHost) {
+      return Object.freeze({
+        title,
+        isEnabled: true,
+        submitFormUrl,
+        categoriesUrl,
+        suggestIdeasFormUrl,
+        securityReportsUrl,
+        api: {
+          endpoint: adminServiceApiHost,
+          basePath: '',
+        },
+      });
+    }
   }
 
   return Object.freeze({
diff --git a/configs/app/features/metasuites.ts b/configs/app/features/metasuites.ts
new file mode 100644
index 0000000000..333e7d5a8a
--- /dev/null
+++ b/configs/app/features/metasuites.ts
@@ -0,0 +1,21 @@
+import type { Feature } from './types';
+
+import { getEnvValue } from '../utils';
+
+const title = 'MetaSuites extension';
+
+const config: Feature<{ isEnabled: true }> = (() => {
+  if (getEnvValue('NEXT_PUBLIC_METASUITES_ENABLED') === 'true') {
+    return Object.freeze({
+      title,
+      isEnabled: true,
+    });
+  }
+
+  return Object.freeze({
+    title,
+    isEnabled: false,
+  });
+})();
+
+export default config;
diff --git a/configs/app/features/nameService.ts b/configs/app/features/nameService.ts
new file mode 100644
index 0000000000..3af536bbe2
--- /dev/null
+++ b/configs/app/features/nameService.ts
@@ -0,0 +1,27 @@
+import type { Feature } from './types';
+
+import { getEnvValue } from '../utils';
+
+const apiHost = getEnvValue('NEXT_PUBLIC_NAME_SERVICE_API_HOST');
+
+const title = 'Name service integration';
+
+const config: Feature<{ api: { endpoint: string; basePath: string } }> = (() => {
+  if (apiHost) {
+    return Object.freeze({
+      title,
+      isEnabled: true,
+      api: {
+        endpoint: apiHost,
+        basePath: '',
+      },
+    });
+  }
+
+  return Object.freeze({
+    title,
+    isEnabled: false,
+  });
+})();
+
+export default config;
diff --git a/configs/app/features/optimisticRollup.ts b/configs/app/features/optimisticRollup.ts
deleted file mode 100644
index 6b4f646d59..0000000000
--- a/configs/app/features/optimisticRollup.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import type { Feature } from './types';
-
-import { getEnvValue } from '../utils';
-
-const title = 'Rollup (L2) chain';
-
-const config: Feature<{ L1BaseUrl: string; withdrawalUrl: string }> = (() => {
-  const L1BaseUrl = getEnvValue('NEXT_PUBLIC_L1_BASE_URL');
-  const withdrawalUrl = getEnvValue('NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL');
-
-  if (
-    getEnvValue('NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK') === 'true' &&
-    L1BaseUrl &&
-    withdrawalUrl
-  ) {
-    return Object.freeze({
-      title,
-      isEnabled: true,
-      L1BaseUrl,
-      withdrawalUrl,
-    });
-  }
-
-  return Object.freeze({
-    title,
-    isEnabled: false,
-  });
-})();
-
-export default config;
diff --git a/configs/app/features/rollup.ts b/configs/app/features/rollup.ts
new file mode 100644
index 0000000000..2560734097
--- /dev/null
+++ b/configs/app/features/rollup.ts
@@ -0,0 +1,35 @@
+import type { Feature } from './types';
+import type { RollupType } from 'types/client/rollup';
+import { ROLLUP_TYPES } from 'types/client/rollup';
+
+import { getEnvValue } from '../utils';
+
+const type = (() => {
+  const envValue = getEnvValue('NEXT_PUBLIC_ROLLUP_TYPE');
+  return ROLLUP_TYPES.find((type) => type === envValue);
+})();
+
+const L1BaseUrl = getEnvValue('NEXT_PUBLIC_ROLLUP_L1_BASE_URL');
+const L2WithdrawalUrl = getEnvValue('NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL');
+
+const title = 'Rollup (L2) chain';
+
+const config: Feature<{ type: RollupType; L1BaseUrl: string; L2WithdrawalUrl?: string }> = (() => {
+
+  if (type && L1BaseUrl) {
+    return Object.freeze({
+      title,
+      isEnabled: true,
+      type,
+      L1BaseUrl,
+      L2WithdrawalUrl,
+    });
+  }
+
+  return Object.freeze({
+    title,
+    isEnabled: false,
+  });
+})();
+
+export default config;
diff --git a/configs/app/features/safe.ts b/configs/app/features/safe.ts
index bed8bf14a6..b2762a78da 100644
--- a/configs/app/features/safe.ts
+++ b/configs/app/features/safe.ts
@@ -1,35 +1,14 @@
 import type { Feature } from './types';
 
-import chain from '../chain';
-
-// https://docs.safe.global/safe-core-api/available-services
-const SAFE_API_MAP: Record<string, string> = {
-  '42161': 'https://safe-transaction-arbitrum.safe.global',
-  '1313161554': 'https://safe-transaction-aurora.safe.global',
-  '43114': 'https://safe-transaction-avalanche.safe.global',
-  '8453': 'https://safe-transaction-base.safe.global',
-  '84531': 'https://safe-transaction-base-testnet.safe.global',
-  '56': 'https://safe-transaction-bsc.safe.global',
-  '42220': 'https://safe-transaction-celo.safe.global',
-  '1': 'https://safe-transaction-mainnet.safe.global',
-  '100': 'https://safe-transaction-gnosis-chain.safe.global',
-  '5': 'https://safe-transaction-goerli.safe.global',
-  '10': 'https://safe-transaction-optimism.safe.global',
-  '137': 'https://safe-transaction-polygon.safe.global',
-};
+import { getEnvValue } from '../utils';
 
 function getApiUrl(): string | undefined {
-  if (!chain.id) {
-    return;
-  }
-
-  const apiHost = SAFE_API_MAP[chain.id];
-
-  if (!apiHost) {
+  try {
+    const envValue = getEnvValue('NEXT_PUBLIC_SAFE_TX_SERVICE_URL');
+    return new URL('/api/v1/safes', envValue).toString();
+  } catch (error) {
     return;
   }
-
-  return `${ apiHost }/api/v1/safes/`;
 }
 
 const title = 'Safe address tags';
diff --git a/configs/app/features/swapButton.ts b/configs/app/features/swapButton.ts
new file mode 100644
index 0000000000..415a4af2c9
--- /dev/null
+++ b/configs/app/features/swapButton.ts
@@ -0,0 +1,42 @@
+import type { Feature } from './types';
+
+import { getEnvValue } from '../utils';
+import marketplace from './marketplace';
+
+const value = getEnvValue('NEXT_PUBLIC_SWAP_BUTTON_URL');
+
+const title = 'Swap button';
+
+function isValidUrl(string: string) {
+  try {
+    new URL(string);
+    return true;
+  } catch (error) {
+    return false;
+  }
+}
+
+const config: Feature<{ dappId: string } | { url: string }> = (() => {
+  if (value) {
+    if (isValidUrl(value)) {
+      return Object.freeze({
+        title,
+        isEnabled: true,
+        url: value,
+      });
+    } else if (marketplace.isEnabled) {
+      return Object.freeze({
+        title,
+        isEnabled: true,
+        dappId: value,
+      });
+    }
+  }
+
+  return Object.freeze({
+    title,
+    isEnabled: false,
+  });
+})();
+
+export default config;
diff --git a/configs/app/features/userOps.ts b/configs/app/features/userOps.ts
new file mode 100644
index 0000000000..0e127f62f6
--- /dev/null
+++ b/configs/app/features/userOps.ts
@@ -0,0 +1,21 @@
+import type { Feature } from './types';
+
+import { getEnvValue } from '../utils';
+
+const title = 'User operations';
+
+const config: Feature<{ isEnabled: true }> = (() => {
+  if (getEnvValue('NEXT_PUBLIC_HAS_USER_OPS') === 'true') {
+    return Object.freeze({
+      title,
+      isEnabled: true,
+    });
+  }
+
+  return Object.freeze({
+    title,
+    isEnabled: false,
+  });
+})();
+
+export default config;
diff --git a/configs/app/features/validators.ts b/configs/app/features/validators.ts
new file mode 100644
index 0000000000..668501e28c
--- /dev/null
+++ b/configs/app/features/validators.ts
@@ -0,0 +1,29 @@
+import type { Feature } from './types';
+import { VALIDATORS_CHAIN_TYPE } from 'types/client/validators';
+import type { ValidatorsChainType } from 'types/client/validators';
+
+import { getEnvValue } from '../utils';
+
+const chainType = ((): ValidatorsChainType | undefined => {
+  const envValue = getEnvValue('NEXT_PUBLIC_VALIDATORS_CHAIN_TYPE') as ValidatorsChainType | undefined;
+  return envValue && VALIDATORS_CHAIN_TYPE.includes(envValue) ? envValue : undefined;
+})();
+
+const title = 'Validators list';
+
+const config: Feature<{ chainType: ValidatorsChainType }> = (() => {
+  if (chainType) {
+    return Object.freeze({
+      title,
+      isEnabled: true,
+      chainType,
+    });
+  }
+
+  return Object.freeze({
+    title,
+    isEnabled: false,
+  });
+})();
+
+export default config;
diff --git a/configs/app/features/zkEvmRollup.ts b/configs/app/features/zkEvmRollup.ts
deleted file mode 100644
index 7fda84b09f..0000000000
--- a/configs/app/features/zkEvmRollup.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import type { Feature } from './types';
-
-import { getEnvValue } from '../utils';
-
-const title = 'ZkEVM rollup (L2) chain';
-
-const config: Feature<{ L1BaseUrl: string; withdrawalUrl?: string }> = (() => {
-  const L1BaseUrl = getEnvValue('NEXT_PUBLIC_L1_BASE_URL');
-  const isZkEvm = getEnvValue('NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK') === 'true';
-
-  if (isZkEvm && L1BaseUrl) {
-    return Object.freeze({
-      title,
-      isEnabled: true,
-      L1BaseUrl,
-    });
-  }
-
-  return Object.freeze({
-    title,
-    isEnabled: false,
-  });
-})();
-
-export default config;
diff --git a/configs/app/ui.ts b/configs/app/ui.ts
index 9542917fe9..7f6832bf1f 100644
--- a/configs/app/ui.ts
+++ b/configs/app/ui.ts
@@ -1,3 +1,4 @@
+import type { ContractCodeIde } from 'types/client/contract';
 import { NAVIGATION_LINK_IDS, type NavItemExternal, type NavigationLinkId } from 'types/client/navigation-items';
 import type { ChainIndicatorId } from 'types/homepage';
 import type { NetworkExplorer } from 'types/networks';
@@ -48,7 +49,6 @@ const UI = Object.freeze({
       background: getEnvValue('NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND') || HOMEPAGE_PLATE_BACKGROUND_DEFAULT,
       textColor: getEnvValue('NEXT_PUBLIC_HOMEPAGE_PLATE_TEXT_COLOR') || 'white',
     },
-    showGasTracker: getEnvValue('NEXT_PUBLIC_HOMEPAGE_SHOW_GAS_TRACKER') === 'false' ? false : true,
     showAvgBlockTime: getEnvValue('NEXT_PUBLIC_HOMEPAGE_SHOW_AVG_BLOCK_TIME') === 'false' ? false : true,
   },
   views,
@@ -66,6 +66,10 @@ const UI = Object.freeze({
   explorers: {
     items: parseEnvJson<Array<NetworkExplorer>>(getEnvValue('NEXT_PUBLIC_NETWORK_EXPLORERS')) || [],
   },
+  ides: {
+    items: parseEnvJson<Array<ContractCodeIde>>(getEnvValue('NEXT_PUBLIC_CONTRACT_CODE_IDES')) || [],
+  },
+  hasContractAuditReports: getEnvValue('NEXT_PUBLIC_HAS_CONTRACT_AUDIT_REPORTS') === 'true' ? true : false,
 });
 
 export default UI;
diff --git a/configs/envs/.env.eth b/configs/envs/.env.eth
index 75ef364321..2715974d4b 100644
--- a/configs/envs/.env.eth
+++ b/configs/envs/.env.eth
@@ -29,7 +29,7 @@ NEXT_PUBLIC_FEATURED_NETWORKS=https://raw.githubusercontent.com/blockscout/front
 ##views
 NEXT_PUBLIC_VIEWS_NFT_MARKETPLACES=[{'name':'OpenSea','collection_url':'https://opensea.io/assets/ethereum/{hash}','instance_url':'https://opensea.io/assets/ethereum/{hash}/{id}','logo_url':'https://opensea.io/static/images/logos/opensea-logo.svg'},{'name':'LooksRare','collection_url':'https://looksrare.org/collections/{hash}','instance_url':'https://looksrare.org/collections/{hash}/{id}','logo_url':'https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/nft-marketplace-logos/looks-rare.png'}]
 ## misc
-NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'Etherscan','baseUrl':'https://etherscan.io/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}]
+NEXT_PUBLIC_NETWORK_EXPLORERS="[{'title':'Etherscan','logo':'https://github.com/blockscout/frontend-configs/blob/main/configs/explorer-logos/etherscan.png?raw=true','baseUrl':'https://etherscan.io/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}, {'title':'Blockchair','logo':'https://github.com/blockscout/frontend-configs/blob/main/configs/explorer-logos/blockchair.png?raw=true','baseUrl':'https://blockchair.com/','paths':{'tx':'/ethereum/transaction','address':'/ethereum/address','token':'/ethereum/erc-20/token','block':'/ethereum/block'}},{'title':'Sentio','logo':'https://github.com/blockscout/frontend-configs/blob/main/configs/explorer-logos/sentio.png?raw=true','baseUrl':'https://app.sentio.xyz/','paths':{'tx':'/tx/1','address':'/contract/1'}}, {'title':'Tenderly','logo':'https://github.com/blockscout/frontend-configs/blob/main/configs/explorer-logos/tenderly.png?raw=true','baseUrl':'https://dashboard.tenderly.co','paths':{'tx':'/tx/mainnet'}}, {'title':'0xPPL','logo':'https://github.com/blockscout/frontend-configs/blob/main/configs/explorer-logos/0xPPl.png?raw=true','baseUrl':'https://0xppl.com','paths':{'tx':'/Ethereum/tx','address':'/','token':'/c/Ethereum'}}, {'title':'3xpl','logo':'https://github.com/blockscout/frontend-configs/blob/main/configs/explorer-logos/3xpl.png?raw=true','baseUrl':'https://3xpl.com/','paths':{'tx':'/ethereum/transaction','address':'/ethereum/address'}} ]"
 
 # app features
 NEXT_PUBLIC_APP_ENV=development
@@ -38,11 +38,20 @@ NEXT_PUBLIC_HAS_BEACON_CHAIN=true
 NEXT_PUBLIC_IS_ACCOUNT_SUPPORTED=true
 NEXT_PUBLIC_AUTH_URL=http://localhost:3000
 NEXT_PUBLIC_LOGOUT_URL=https://blockscoutcom.us.auth0.com/v2/logout
-NEXT_PUBLIC_STATS_API_HOST=https://stats-eth-main.k8s.blockscout.com
+NEXT_PUBLIC_STATS_API_HOST=https://stats-eth-main.k8s-prod-1.blockscout.com
 NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.services.blockscout.com
 NEXT_PUBLIC_CONTRACT_INFO_API_HOST=https://contracts-info.services.blockscout.com
 NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://admin-rs.services.blockscout.com
 NEXT_PUBLIC_TRANSACTION_INTERPRETATION_PROVIDER=blockscout
+NEXT_PUBLIC_AD_BANNER_PROVIDER=hype
+NEXT_PUBLIC_SAFE_TX_SERVICE_URL=https://safe-transaction-mainnet.safe.global
+NEXT_PUBLIC_NAME_SERVICE_API_HOST=https://bens.services.blockscout.com
+NEXT_PUBLIC_MARKETPLACE_ENABLED=true
+NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/marketplace-categories/default.json
+NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/marketplace-categories/default.json
+NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM=https://airtable.com/appiy5yijZpMMSKjT/shr6uMGPKjj1DK7NL
+NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM=https://airtable.com/appiy5yijZpMMSKjT/pag3t82DUCyhGRZZO/form
+NEXT_PUBLIC_VIEWS_CONTRACT_SOLIDITYSCAN_ENABLED=true
 
 #meta
 NEXT_PUBLIC_OG_IMAGE_URL=https://github.com/blockscout/frontend-configs/blob/main/configs/og-images/eth.jpg?raw=true
diff --git a/configs/envs/.env.eth_goerli b/configs/envs/.env.eth_goerli
index da1fac4d97..997d31c125 100644
--- a/configs/envs/.env.eth_goerli
+++ b/configs/envs/.env.eth_goerli
@@ -33,6 +33,7 @@ NEXT_PUBLIC_NETWORK_ICON=https://raw.githubusercontent.com/blockscout/frontend-c
 NEXT_PUBLIC_VIEWS_NFT_MARKETPLACES=[{'name':'LooksRare','collection_url':'https://goerli.looksrare.org/collections/{hash}','instance_url':'https://goerli.looksrare.org/collections/{hash}/{id}','logo_url':'https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/nft-marketplace-logos/looks-rare.png'}]
 ## misc
 NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'Bitquery','baseUrl':'https://explorer.bitquery.io/','paths':{'tx':'/goerli/tx','address':'/goerli/address','token':'/goerli/token','block':'/goerli/block'}},{'title':'Etherscan','baseUrl':'https://goerli.etherscan.io/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}]
+NEXT_PUBLIC_HAS_CONTRACT_AUDIT_REPORTS=true
 
 # app features
 NEXT_PUBLIC_APP_ENV=development
@@ -46,8 +47,13 @@ NEXT_PUBLIC_STATS_API_HOST=https://stats-goerli.k8s-dev.blockscout.com
 NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.services.blockscout.com
 NEXT_PUBLIC_CONTRACT_INFO_API_HOST=https://contracts-info.services.blockscout.com
 NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://admin-rs.services.blockscout.com
+NEXT_PUBLIC_NAME_SERVICE_API_HOST=https://bens-rs-test.k8s-dev.blockscout.com
 NEXT_PUBLIC_WEB3_WALLETS=['token_pocket','metamask']
 NEXT_PUBLIC_VIEWS_CONTRACT_SOLIDITYSCAN_ENABLED='true'
+NEXT_PUBLIC_HAS_BEACON_CHAIN=true
+NEXT_PUBLIC_HAS_USER_OPS=true
+NEXT_PUBLIC_CONTRACT_CODE_IDES=[{'title':'Remix IDE','url':'https://remix.blockscout.com/?address={hash}&blockscout=eth-goerli.blockscout.com','icon_url':'https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/ide-icons/remix.png'}]
+NEXT_PUBLIC_TRANSACTION_INTERPRETATION_PROVIDER=blockscout
 
 #meta
-NEXT_PUBLIC_OG_IMAGE_URL=https://github.com/blockscout/frontend-configs/blob/main/configs/og-images/eth-goerli.png?raw=true
+NEXT_PUBLIC_OG_IMAGE_URL=https://github.com/blockscout/frontend-configs/blob/main/configs/og-images/eth-goerli.png?raw=true
\ No newline at end of file
diff --git a/configs/envs/.env.jest b/configs/envs/.env.jest
index 7a14a10b01..e1f80c7e75 100644
--- a/configs/envs/.env.jest
+++ b/configs/envs/.env.jest
@@ -25,7 +25,6 @@ NEXT_PUBLIC_API_BASE_PATH=/
 ## homepage
 NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs','coin_price','market_cap']
 NEXT_PUBLIC_HOMEPAGE_SHOW_AVG_BLOCK_TIME=true
-NEXT_PUBLIC_HOMEPAGE_SHOW_GAS_TRACKER=true
 NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND=
 ## sidebar
 NEXT_PUBLIC_NETWORK_LOGO=
@@ -44,8 +43,6 @@ NEXT_PUBLIC_APP_INSTANCE=jest
 NEXT_PUBLIC_APP_ENV=testing
 NEXT_PUBLIC_MARKETPLACE_CONFIG_URL=https://localhost:3000/marketplace-config.json
 NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM=https://localhost:3000/marketplace-submit-form
-NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK=false
-NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK=false
 NEXT_PUBLIC_IS_ACCOUNT_SUPPORTED=true
 NEXT_PUBLIC_AUTH_URL=http://localhost:3100
 NEXT_PUBLIC_LOGOUT_URL=https://blockscoutcom.us.auth0.com/v2/logout
diff --git a/configs/envs/.env.main b/configs/envs/.env.main
index 749f1ec8fd..48eee58328 100644
--- a/configs/envs/.env.main
+++ b/configs/envs/.env.main
@@ -45,9 +45,14 @@ NEXT_PUBLIC_GRAPHIQL_TRANSACTION=0xf7d4972356e6ae44ae948d0cf19ef2beaf0e574c18099
 NEXT_PUBLIC_IS_ACCOUNT_SUPPORTED=true
 NEXT_PUBLIC_AUTH_URL=http://localhost:3000
 NEXT_PUBLIC_LOGOUT_URL=https://blockscoutcom.us.auth0.com/v2/logout
+NEXT_PUBLIC_MARKETPLACE_ENABLED=true
 NEXT_PUBLIC_MARKETPLACE_CONFIG_URL=https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace/eth-goerli.json
+NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL=https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace-categories/default.json
+NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL=https://gist.githubusercontent.com/maxaleks/ce5c7e3de53e8f5b240b88265daf5839/raw/328383c958a8f7ecccf6d50c953bcdf8ab3faa0a/security_reports_goerli_test.json
 NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM=https://airtable.com/shrqUAcjgGJ4jU88C
+NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM=https://airtable.com/appiy5yijZpMMSKjT/pag3t82DUCyhGRZZO/form
 NEXT_PUBLIC_STATS_API_HOST=https://stats-goerli.k8s-dev.blockscout.com
 NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.k8s-dev.blockscout.com
 NEXT_PUBLIC_CONTRACT_INFO_API_HOST=https://contracts-info-test.k8s-dev.blockscout.com
 NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://admin-rs-test.k8s-dev.blockscout.com
+NEXT_PUBLIC_SWAP_BUTTON_URL=uniswap
diff --git a/configs/envs/.env.main.L2 b/configs/envs/.env.main.L2
index fb9359be95..e410b29b8e 100644
--- a/configs/envs/.env.main.L2
+++ b/configs/envs/.env.main.L2
@@ -47,6 +47,6 @@ NEXT_PUBLIC_LOGOUT_URL=https://blockscoutcom.us.auth0.com/v2/logout
 NEXT_PUBLIC_MARKETPLACE_CONFIG_URL=https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace/base-goerli.json
 NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM=https://airtable.com/shrqUAcjgGJ4jU88C
 NEXT_PUBLIC_STATS_API_HOST=https://stats-optimism-goerli.k8s-dev.blockscout.com
-NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK=true
-NEXT_PUBLIC_L1_BASE_URL=https://blockscout-main.k8s-dev.blockscout.com
-NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL=https://app.optimism.io/bridge/withdraw
+NEXT_PUBLIC_ROLLUP_TYPE=optimistic
+NEXT_PUBLIC_ROLLUP_L1_BASE_URL=https://blockscout-main.k8s-dev.blockscout.com
+NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL=https://app.optimism.io/bridge/withdraw
diff --git a/configs/envs/.env.optimism_goerli b/configs/envs/.env.optimism_goerli
new file mode 100644
index 0000000000..c20a941ab9
--- /dev/null
+++ b/configs/envs/.env.optimism_goerli
@@ -0,0 +1,48 @@
+# Set of ENVs for zkevm (dev only)
+# https://eth.blockscout.com/
+
+# app configuration
+NEXT_PUBLIC_APP_PROTOCOL=http
+NEXT_PUBLIC_APP_HOST=localhost
+NEXT_PUBLIC_APP_PORT=3000
+
+# blockchain parameters
+NEXT_PUBLIC_NETWORK_NAME='OP Goerli'
+NEXT_PUBLIC_NETWORK_SHORT_NAME='OP Goerli'
+NEXT_PUBLIC_NETWORK_ID=420
+NEXT_PUBLIC_NETWORK_CURRENCY_NAME=Ether
+NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=ETH
+NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS=18
+NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE=validation
+NEXT_PUBLIC_NETWORK_RPC_URL=https://goerli.optimism.io
+
+# api configuration
+NEXT_PUBLIC_API_HOST=optimism-goerli.blockscout.com
+NEXT_PUBLIC_API_PORT=80
+NEXT_PUBLIC_API_PROTOCOL=http
+NEXT_PUBLIC_API_BASE_PATH=/
+
+# ui config
+## homepage
+NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs']
+## sidebar
+NEXT_PUBLIC_FEATURED_NETWORKS=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/featured-networks/polygon-mainnet.json
+## footer
+## misc
+NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'Etherscan','baseUrl':'https://etherscan.io/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}]
+# app features
+NEXT_PUBLIC_APP_INSTANCE=local
+NEXT_PUBLIC_APP_ENV=development
+NEXT_PUBLIC_GRAPHIQL_TRANSACTION=0xf7d4972356e6ae44ae948d0cf19ef2beaf0e574c180997e969a2837da15e349d
+NEXT_PUBLIC_IS_ACCOUNT_SUPPORTED=true
+# NEXT_PUBLIC_AUTH_URL=http://localhost:3000
+NEXT_PUBLIC_API_WEBSOCKET_PROTOCOL=ws
+NEXT_PUBLIC_LOGOUT_URL=https://blockscoutcom.us.auth0.com/v2/logout
+NEXT_PUBLIC_STATS_API_HOST=https://stats-eth-main.k8s.blockscout.com
+NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.services.blockscout.com
+NEXT_PUBLIC_CONTRACT_INFO_API_HOST=https://contracts-info.services.blockscout.com
+NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://admin-rs.services.blockscout.com
+# rollup
+NEXT_PUBLIC_ROLLUP_TYPE='optimistic'
+NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL=https://app.optimism.io/bridge/withdraw
+NEXT_PUBLIC_ROLLUP_L1_BASE_URL=https://eth-goerli.blockscout.com/
\ No newline at end of file
diff --git a/configs/envs/.env.pw b/configs/envs/.env.pw
index cdd8edce29..223abf5f32 100644
--- a/configs/envs/.env.pw
+++ b/configs/envs/.env.pw
@@ -17,6 +17,7 @@ NEXT_PUBLIC_IS_TESTNET=true
 NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE=validation
 
 # api configuration
+NEXT_PUBLIC_API_PROTOCOL=http
 NEXT_PUBLIC_API_HOST=localhost
 NEXT_PUBLIC_API_PORT=3003
 NEXT_PUBLIC_API_BASE_PATH=/
@@ -25,7 +26,6 @@ NEXT_PUBLIC_API_BASE_PATH=/
 ## homepage
 NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs','coin_price','market_cap']
 NEXT_PUBLIC_HOMEPAGE_SHOW_AVG_BLOCK_TIME=true
-NEXT_PUBLIC_HOMEPAGE_SHOW_GAS_TRACKER=true
 ## sidebar
 ## footer
 NEXT_PUBLIC_GIT_TAG=v1.0.11
@@ -33,21 +33,23 @@ NEXT_PUBLIC_GIT_TAG=v1.0.11
 NEXT_PUBLIC_VIEWS_NFT_MARKETPLACES=[{'name':'OpenSea','collection_url':'https://opensea.io/assets/ethereum/{hash}','instance_url':'https://opensea.io/assets/ethereum/{hash}/{id}','logo_url':'http://localhost:3000/nft-marketplace-logo.png'},{'name':'LooksRare','collection_url':'https://looksrare.org/collections/{hash}','instance_url':'https://looksrare.org/collections/{hash}/{id}','logo_url':'http://localhost:3000/nft-marketplace-logo.png'}]
 ## misc
 NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'Bitquery','baseUrl':'https://explorer.bitquery.io/','paths':{'tx':'/goerli/tx','address':'/goerli/address','token':'/goerli/token','block':'/goerli/block'}},{'title':'Etherscan','baseUrl':'https://goerli.etherscan.io/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}]
+NEXT_PUBLIC_CONTRACT_CODE_IDES=[{'title':'Remix IDE','url':'https://remix.blockscout.com/%23address={hash}&blockscout=eth-goerli.blockscout.com'}]
 NEXT_PUBLIC_MAINTENANCE_ALERT_MESSAGE=
 
 # app features
 NEXT_PUBLIC_APP_ENV=testing
 NEXT_PUBLIC_APP_INSTANCE=pw
+NEXT_PUBLIC_MARKETPLACE_ENABLED=true
 NEXT_PUBLIC_MARKETPLACE_CONFIG_URL=https://localhost:3000/marketplace-config.json
 NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM=https://localhost:3000/marketplace-submit-form
-NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK=false
-NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK=false
+NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM=https://localhost:3000/marketplace-suggest-ideas-form
 NEXT_PUBLIC_AD_BANNER_PROVIDER=slise
 NEXT_PUBLIC_IS_ACCOUNT_SUPPORTED=true
 NEXT_PUBLIC_AUTH_URL=http://localhost:3100
 NEXT_PUBLIC_LOGOUT_URL=https://blockscoutcom.us.auth0.com/v2/logout
 NEXT_PUBLIC_AUTH0_CLIENT_ID=xxx
-NEXT_PUBLIC_STATS_API_HOST=https://localhost:3004
-NEXT_PUBLIC_CONTRACT_INFO_API_HOST=https://localhost:3005
-NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://localhost:3006
+NEXT_PUBLIC_STATS_API_HOST=http://localhost:3004
+NEXT_PUBLIC_CONTRACT_INFO_API_HOST=http://localhost:3005
+NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=http://localhost:3006
 NEXT_PUBLIC_RE_CAPTCHA_APP_SITE_KEY=xxx
+NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID=xxx
\ No newline at end of file
diff --git a/configs/envs/.env.sepolia b/configs/envs/.env.sepolia
index b54adc0775..72a98f40a4 100644
--- a/configs/envs/.env.sepolia
+++ b/configs/envs/.env.sepolia
@@ -55,6 +55,9 @@ NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://admin-rs.services.blockscout.com
 NEXT_PUBLIC_WEB3_WALLETS=['token_pocket','metamask']
 NEXT_PUBLIC_VIEWS_CONTRACT_SOLIDITYSCAN_ENABLED=true
 NEXT_PUBLIC_HAS_BEACON_CHAIN=true
+NEXT_PUBLIC_HAS_USER_OPS=true
+NEXT_PUBLIC_AD_BANNER_PROVIDER=getit
+NEXT_PUBLIC_DATA_AVAILABILITY_ENABLED=true
 
 #meta
 NEXT_PUBLIC_OG_IMAGE_URL=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/og-images/sepolia-testnet.png
diff --git a/configs/envs/.env.stability b/configs/envs/.env.stability
new file mode 100644
index 0000000000..a395322118
--- /dev/null
+++ b/configs/envs/.env.stability
@@ -0,0 +1,60 @@
+# Set of ENVs for Ethereum network explorer
+# https://eth.blockscout.com/
+
+# app configuration
+NEXT_PUBLIC_APP_PROTOCOL=http
+NEXT_PUBLIC_APP_HOST=localhost
+NEXT_PUBLIC_APP_PORT=3000
+
+# blockchain parameters
+NEXT_PUBLIC_NETWORK_NAME=Stability Testnet
+NEXT_PUBLIC_NETWORK_SHORT_NAME=Stability
+NEXT_PUBLIC_NETWORK_ID=20180427
+NEXT_PUBLIC_NETWORK_CURRENCY_NAME=FREE
+NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=FREE
+NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS=18
+NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE=validation
+NEXT_PUBLIC_NETWORK_RPC_URL=https://free.testnet.stabilityprotocol.com
+NEXT_PUBLIC_IS_TESTNET=true
+
+# api configuration
+NEXT_PUBLIC_API_HOST=stability-testnet.blockscout.com
+NEXT_PUBLIC_API_BASE_PATH=/
+
+# ui config
+## homepage
+NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs']
+NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND="rgb(255, 145, 0)"
+NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND="rgba(46, 51, 81, 1)"
+NEXT_PUBLIC_HOMEPAGE_PLATE_TEXT_COLOR="rgba(122, 235, 246, 1)"
+## sidebar
+NEXT_PUBLIC_FEATURED_NETWORKS=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/featured-networks/rsk-testnet.json
+NEXT_PUBLIC_NETWORK_LOGO=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/stability.svg
+NEXT_PUBLIC_NETWORK_LOGO_DARK=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/stability-dark.svg
+NEXT_PUBLIC_NETWORK_ICON=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/stability-short.svg
+NEXT_PUBLIC_NETWORK_ICON_DARK=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/stability-short-dark.svg
+## footer
+## views
+NEXT_PUBLIC_VIEWS_ADDRESS_HIDDEN_VIEWS="['top_accounts']"
+NEXT_PUBLIC_VIEWS_TX_HIDDEN_FIELDS="['value','fee_currency','gas_price','gas_fees','burnt_fees']"
+NEXT_PUBLIC_VIEWS_TX_ADDITIONAL_FIELDS="['fee_per_gas']"
+NEXT_PUBLIC_VIEWS_BLOCK_HIDDEN_FIELDS="['burnt_fees','total_reward']"
+## misc
+
+# app features
+NEXT_PUBLIC_APP_ENV=development
+NEXT_PUBLIC_HAS_BEACON_CHAIN=false
+NEXT_PUBLIC_STATS_API_HOST=https://stats-stability-testnet.k8s.blockscout.com
+NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.services.blockscout.com
+NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://admin-rs.services.blockscout.com
+NEXT_PUBLIC_CONTRACT_CODE_IDES="[{'title':'Remix IDE','url':'https://remix.blockscout.com/?address={hash}&blockscout={domain}','icon_url':'https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/ide-icons/remix.png'}]"
+NEXT_PUBLIC_MARKETPLACE_ENABLED=true
+NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/marketplace-categories/default.json
+NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM=https://airtable.com/shrqUAcjgGJ4jU88C
+NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM=https://airtable.com/appiy5yijZpMMSKjT/pag3t82DUCyhGRZZO/form
+NEXT_PUBLIC_CONTRACT_INFO_API_HOST=https://contracts-info.services.blockscout.com/
+NEXT_PUBLIC_GAS_TRACKER_ENABLED=false
+NEXT_PUBLIC_VALIDATORS_CHAIN_TYPE='stability'
+
+#meta
+NEXT_PUBLIC_OG_IMAGE_URL=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/og-images/stability.png
diff --git a/configs/envs/.env.zkevm b/configs/envs/.env.zkevm
index 91d7172d3f..9d1ef2487a 100644
--- a/configs/envs/.env.zkevm
+++ b/configs/envs/.env.zkevm
@@ -14,10 +14,10 @@ NEXT_PUBLIC_NETWORK_CURRENCY_NAME=Ether
 NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=ETH
 NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS=18
 NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE=validation
-NEXT_PUBLIC_NETWORK_RPC_URL=https://eth.llamarpc.com
+NEXT_PUBLIC_NETWORK_RPC_URL=https://zkevm-rpc.com
 
 # api configuration
-NEXT_PUBLIC_API_HOST=65.109.173.70
+NEXT_PUBLIC_API_HOST=zkevm.blockscout.com
 NEXT_PUBLIC_API_PORT=80
 NEXT_PUBLIC_API_PROTOCOL=http
 NEXT_PUBLIC_API_BASE_PATH=/
@@ -26,7 +26,11 @@ NEXT_PUBLIC_API_BASE_PATH=/
 ## homepage
 NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs']
 ## sidebar
-NEXT_PUBLIC_FEATURED_NETWORKS=https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/featured-networks/eth.json
+NEXT_PUBLIC_FEATURED_NETWORKS=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/featured-networks/polygon-mainnet.json
+NEXT_PUBLIC_NETWORK_LOGO=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/polygon.svg
+NEXT_PUBLIC_NETWORK_ICON=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/polygon-short.svg
+NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND='linear-gradient(122deg, rgba(162, 41, 197, 1) 0%, rgba(123, 63, 228, 1) 100%)'
+NEXT_PUBLIC_HOMEPAGE_PLATE_TEXT_COLOR='rgba(255, 255, 255, 1)'
 ## footer
 ## misc
 NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'Etherscan','baseUrl':'https://etherscan.io/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}]
@@ -34,7 +38,6 @@ NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'Etherscan','baseUrl':'https://etherscan
 NEXT_PUBLIC_APP_INSTANCE=local
 NEXT_PUBLIC_APP_ENV=development
 NEXT_PUBLIC_GRAPHIQL_TRANSACTION=0xf7d4972356e6ae44ae948d0cf19ef2beaf0e574c180997e969a2837da15e349d
-NEXT_PUBLIC_HAS_BEACON_CHAIN=true
 NEXT_PUBLIC_IS_ACCOUNT_SUPPORTED=true
 # NEXT_PUBLIC_AUTH_URL=http://localhost:3000
 NEXT_PUBLIC_API_WEBSOCKET_PROTOCOL=ws
@@ -44,5 +47,5 @@ NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.services.blockscout.com
 NEXT_PUBLIC_CONTRACT_INFO_API_HOST=https://contracts-info.services.blockscout.com
 NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://admin-rs.services.blockscout.com
 # rollup
-NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK=true
-NEXT_PUBLIC_L1_BASE_URL=http://65.109.173.70:81
+NEXT_PUBLIC_ROLLUP_TYPE=zkEvm
+NEXT_PUBLIC_ROLLUP_L1_BASE_URL=https://polygon.blockscout.com
diff --git a/configs/envs/.env.zksync b/configs/envs/.env.zksync
new file mode 100644
index 0000000000..6693f0ca4e
--- /dev/null
+++ b/configs/envs/.env.zksync
@@ -0,0 +1,59 @@
+# Set of ENVs for zkSync (dev only)
+# https://zksync.blockscout.com/
+
+# app configuration
+NEXT_PUBLIC_APP_PROTOCOL=http
+NEXT_PUBLIC_APP_HOST=localhost
+NEXT_PUBLIC_APP_PORT=3000
+
+# blockchain parameters
+NEXT_PUBLIC_NETWORK_NAME=ZkSync Era
+NEXT_PUBLIC_NETWORK_SHORT_NAME=ZkSync Era
+NEXT_PUBLIC_NETWORK_ID=324
+NEXT_PUBLIC_NETWORK_CURRENCY_NAME=Ether
+NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=ETH
+NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS=18
+NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE=validation
+NEXT_PUBLIC_NETWORK_RPC_URL=https://mainnet.era.zksync.io
+
+# api configuration
+NEXT_PUBLIC_API_HOST=zksync.blockscout.com
+NEXT_PUBLIC_API_PORT=80
+NEXT_PUBLIC_API_PROTOCOL=http
+NEXT_PUBLIC_API_BASE_PATH=/
+
+# ui config
+## homepage
+NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs']
+## sidebar
+NEXT_PUBLIC_FEATURED_NETWORKS=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/featured-networks/polygon-mainnet.json
+NEXT_PUBLIC_NETWORK_LOGO=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/zksync.svg
+NEXT_PUBLIC_NETWORK_LOGO_DARK=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/zksync-dark.svg
+NEXT_PUBLIC_NETWORK_ICON=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/zksync-short.svg
+NEXT_PUBLIC_NETWORK_ICON_DARK=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/zksync-short-dark.svg
+NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND='rgba(53, 103, 246, 1)'
+NEXT_PUBLIC_HOMEPAGE_PLATE_TEXT_COLOR='rgba(255, 255, 255, 1)'
+NEXT_PUBLIC_OTHER_LINKS=[{'url':'https://zksync.drpc.org?ref=559183','text':'Public RPC'}]
+## footer
+NEXT_PUBLIC_FOOTER_LINKS=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/footer-links/zksync.json
+## views
+NEXT_PUBLIC_VIEWS_CONTRACT_SOLIDITYSCAN_ENABLED=false
+## misc
+NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'l2scan','baseUrl':'https://zksync-era.l2scan.co/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}]
+NEXT_PUBLIC_OG_IMAGE_URL=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/og-images/zksync.png
+# app features
+NEXT_PUBLIC_APP_INSTANCE=local
+NEXT_PUBLIC_APP_ENV=development
+NEXT_PUBLIC_GRAPHIQL_TRANSACTION=0x79c7802ccdf3be5a49c47cc751aad351b0027e8275f6f54878eda50ee559a648
+NEXT_PUBLIC_IS_ACCOUNT_SUPPORTED=true
+# NEXT_PUBLIC_AUTH_URL=http://localhost:3000
+NEXT_PUBLIC_API_WEBSOCKET_PROTOCOL=ws
+NEXT_PUBLIC_LOGOUT_URL=https://zksync.us.auth0.com/v2/logout
+NEXT_PUBLIC_STATS_API_HOST=https://stats-eth-main.k8s.blockscout.com
+NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.services.blockscout.com
+NEXT_PUBLIC_CONTRACT_INFO_API_HOST=https://contracts-info.services.blockscout.com
+NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://admin-rs.services.blockscout.com
+NEXT_PUBLIC_SAFE_TX_SERVICE_URL=https://safe-transaction-zksync.safe.global
+# rollup
+NEXT_PUBLIC_ROLLUP_TYPE=zkSync
+NEXT_PUBLIC_ROLLUP_L1_BASE_URL=https://eth.blockscout.com
diff --git a/deploy/scripts/download_assets.sh b/deploy/scripts/download_assets.sh
index 93ef31f491..cc9f4a09a7 100755
--- a/deploy/scripts/download_assets.sh
+++ b/deploy/scripts/download_assets.sh
@@ -15,6 +15,8 @@ ASSETS_DIR="$1"
 # Define a list of environment variables containing URLs of external assets
 ASSETS_ENVS=(
     "NEXT_PUBLIC_MARKETPLACE_CONFIG_URL"
+    "NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL"
+    "NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL"
     "NEXT_PUBLIC_FEATURED_NETWORKS"
     "NEXT_PUBLIC_FOOTER_LINKS"
     "NEXT_PUBLIC_NETWORK_LOGO"
@@ -36,7 +38,7 @@ get_target_filename() {
     local name_prefix="${env_var#NEXT_PUBLIC_}"
     local name_suffix="${name_prefix%_URL}"
     local name_lc="$(echo "$name_suffix" | tr '[:upper:]' '[:lower:]')"
-    
+
     # Check if the URL starts with "file://"
     if [[ "$url" == file://* ]]; then
         # Extract the local file path
@@ -54,7 +56,7 @@ get_target_filename() {
 
     # Convert the extension to lowercase
     extension=$(echo "$extension" | tr '[:upper:]' '[:lower:]')
-    
+
     # Construct the custom file name
     echo "$name_lc.$extension"
 }
diff --git a/deploy/tools/affected-tests/.gitignore b/deploy/tools/affected-tests/.gitignore
new file mode 100644
index 0000000000..30bc162798
--- /dev/null
+++ b/deploy/tools/affected-tests/.gitignore
@@ -0,0 +1 @@
+/node_modules
\ No newline at end of file
diff --git a/deploy/tools/affected-tests/index.js b/deploy/tools/affected-tests/index.js
new file mode 100644
index 0000000000..f2fc450eb6
--- /dev/null
+++ b/deploy/tools/affected-tests/index.js
@@ -0,0 +1,208 @@
+/* eslint-disable no-console */
+const { execSync } = require('child_process');
+const dependencyTree = require('dependency-tree');
+const fs = require('fs');
+const path = require('path');
+
+const ROOT_DIR = path.resolve(__dirname, '../../../');
+
+const TARGET_FILE = path.resolve(ROOT_DIR, './playwright/affected-tests.txt');
+
+const NON_EXISTENT_DEPS = [];
+
+const DIRECTORIES_WITH_TESTS = [
+  path.resolve(ROOT_DIR, './ui'),
+];
+const VISITED = {};
+
+function getAllPwFilesInDirectory(directory) {
+  const files = fs.readdirSync(directory, { recursive: true });
+  return files
+    .filter((file) => file.endsWith('.pw.tsx'))
+    .map((file) => path.join(directory, file));
+}
+
+function getFileDeps(filename, changedNpmModules) {
+  return dependencyTree.toList({
+    filename,
+    directory: ROOT_DIR,
+    filter: (path) => {
+      if (path.indexOf('node_modules') === -1) {
+        return true;
+      }
+
+      if (changedNpmModules.some((module) => path.startsWith(module))) {
+        return true;
+      }
+
+      return false;
+    },
+    tsConfig: path.resolve(ROOT_DIR, './tsconfig.json'),
+    nonExistent: NON_EXISTENT_DEPS,
+    visited: VISITED,
+  });
+}
+
+async function getChangedFiles() {
+  const command = process.env.CI ?
+    `git diff --name-only origin/${ process.env.GITHUB_BASE_REF } ${ process.env.GITHUB_SHA } -- ${ ROOT_DIR }` :
+    `git diff --name-only main $(git branch --show-current) -- ${ ROOT_DIR }`;
+
+  console.log('Executing command: ', command);
+  const files = execSync(command)
+    .toString()
+    .trim()
+    .split('\n')
+    .filter(Boolean);
+
+  return files.map((file) => path.join(ROOT_DIR, file));
+}
+
+function checkChangesInChakraTheme(changedFiles) {
+  const themeDir = path.resolve(ROOT_DIR, './theme');
+  return changedFiles.some((file) => file.startsWith(themeDir));
+}
+
+function checkChangesInSvgSprite(changedFiles) {
+  const iconDir = path.resolve(ROOT_DIR, './icons');
+  const areIconsChanged = changedFiles.some((file) => file.startsWith(iconDir));
+
+  if (!areIconsChanged) {
+    return false;
+  }
+
+  const svgNamesFile = path.resolve(ROOT_DIR, './public/icons/name.d.ts');
+  const areSvgNamesChanged = changedFiles.some((file) => file === svgNamesFile);
+
+  if (!areSvgNamesChanged) {
+    // If only the icons have changed and not the names in the SVG file, we will need to run all tests.
+    // This is because we cannot correctly identify the test files that depend on these changes.
+    return true;
+  }
+
+  // If the icon names have changed, then there should be changes in the components that use them.
+  // Otherwise, typescript would complain about that.
+  return false;
+}
+
+function createTargetFile(content) {
+  fs.writeFileSync(TARGET_FILE, content);
+}
+
+function getPackageJsonUpdatedProps(packageJsonFile) {
+  const command = process.env.CI ?
+    `git diff --unified=0 origin/${ process.env.GITHUB_BASE_REF } ${ process.env.GITHUB_SHA } -- ${ packageJsonFile }` :
+    `git diff --unified=0 main $(git branch --show-current) -- ${ packageJsonFile }`;
+
+  console.log('Executing command: ', command);
+  const changedLines = execSync(command)
+    .toString()
+    .trim()
+    .split('\n')
+    .filter(Boolean)
+    .filter((line) => line.startsWith('+ ') || line.startsWith('- '));
+
+  const changedProps = [ ...new Set(
+    changedLines
+      .map((line) => line.replaceAll(' ', '').replaceAll('+', '').replaceAll('-', ''))
+      .map((line) => line.split(':')[0].replaceAll('"', '')),
+  ) ];
+
+  return changedProps;
+}
+
+function getUpdatedNpmModules(changedFiles) {
+  const packageJsonFile = path.resolve(ROOT_DIR, './package.json');
+
+  if (!changedFiles.includes(packageJsonFile)) {
+    return [];
+  }
+
+  try {
+    const packageJsonContent = JSON.parse(fs.readFileSync(packageJsonFile, 'utf-8'));
+    const usedNpmModules = [
+      ...Object.keys(packageJsonContent.dependencies || {}),
+      ...Object.keys(packageJsonContent.devDependencies || {}),
+    ];
+    const updatedProps = getPackageJsonUpdatedProps(packageJsonFile);
+
+    return updatedProps.filter((prop) => usedNpmModules.includes(prop));
+  } catch (error) {}
+}
+
+async function run() {
+  // NOTES:
+  // - The absence of TARGET_FILE implies that all tests should be run.
+  // - The empty TARGET_FILE implies that no tests should be run.
+
+  const start = Date.now();
+
+  fs.unlink(TARGET_FILE, () => {});
+
+  const changedFiles = await getChangedFiles();
+
+  if (!changedFiles.length) {
+    createTargetFile('');
+    console.log('No changed files found. Exiting...');
+    return;
+  }
+
+  console.log('Changed files in the branch: ', changedFiles);
+
+  if (checkChangesInChakraTheme(changedFiles)) {
+    console.log('Changes in Chakra theme detected. It is advisable to run all test suites. Exiting...');
+    return;
+  }
+
+  if (checkChangesInSvgSprite(changedFiles)) {
+    console.log('There are some changes in the SVG sprite that cannot be linked to a specific component. It is advisable to run all test suites. Exiting...');
+    return;
+  }
+
+  let changedNpmModules = getUpdatedNpmModules(changedFiles);
+
+  if (!changedNpmModules) {
+    console.log('Some error occurred while detecting changed NPM modules. It is advisable to run all test suites. Exiting...');
+    return;
+  }
+
+  console.log('Changed NPM modules in the branch: ', changedNpmModules);
+
+  changedNpmModules = [
+    ...changedNpmModules,
+    ...changedNpmModules.map((module) => `@types/${ module }`), // there are some deps that are resolved to .d.ts files
+  ].map((module) => path.resolve(ROOT_DIR, `./node_modules/${ module }`));
+
+  const allTestFiles = DIRECTORIES_WITH_TESTS.reduce((acc, dir) => {
+    return acc.concat(getAllPwFilesInDirectory(dir));
+  }, []);
+
+  const isDepChanged = (dep) => changedFiles.includes(dep) || changedNpmModules.some((module) => dep.startsWith(module));
+
+  const testFilesToRun = allTestFiles
+    .map((file) => ({ file, deps: getFileDeps(file, changedNpmModules) }))
+    .filter(({ deps }) => deps.some(isDepChanged));
+  const testFileNamesToRun = testFilesToRun.map(({ file }) => path.relative(ROOT_DIR, file));
+
+  if (!testFileNamesToRun.length) {
+    createTargetFile('');
+    console.log('No tests to run. Exiting...');
+    return;
+  }
+
+  createTargetFile(testFileNamesToRun.join('\n'));
+
+  const end = Date.now();
+
+  const testFilesToRunWithFilteredDeps = testFilesToRun.map(({ file, deps }) => ({
+    file,
+    deps: deps.filter(isDepChanged),
+  }));
+
+  console.log('Total time: ', ((end - start) / 1_000).toLocaleString());
+  console.log('Total test to run: ', testFileNamesToRun.length);
+  console.log('Tests to run with changed deps: ', testFilesToRunWithFilteredDeps);
+  console.log('Non existent deps: ', NON_EXISTENT_DEPS);
+}
+
+run();
diff --git a/deploy/tools/affected-tests/package.json b/deploy/tools/affected-tests/package.json
new file mode 100644
index 0000000000..bfba5734fa
--- /dev/null
+++ b/deploy/tools/affected-tests/package.json
@@ -0,0 +1,10 @@
+{
+  "name": "affected-tests",
+  "version": "1.0.0",
+  "main": "index.js",
+  "author": "Vasilii (tom) Goriunov <tom@ohhhh.me>",
+  "license": "MIT",
+  "dependencies": {
+    "dependency-tree": "10.0.9"
+  }
+}
diff --git a/deploy/tools/affected-tests/yarn.lock b/deploy/tools/affected-tests/yarn.lock
new file mode 100644
index 0000000000..e160e0a2c6
--- /dev/null
+++ b/deploy/tools/affected-tests/yarn.lock
@@ -0,0 +1,716 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+"@babel/parser@^7.21.8":
+  version "7.23.9"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.23.9.tgz#7b903b6149b0f8fa7ad564af646c4c38a77fc44b"
+  integrity sha512-9tcKgqKbs3xGJ+NtKF2ndOBBLVwPjl1SHxPQkd36r3Dlirw3xWUeGaTbqr7uGZcTaxkVNwc+03SVP7aCdWrTlA==
+
+"@dependents/detective-less@^4.1.0":
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/@dependents/detective-less/-/detective-less-4.1.0.tgz#4a979ee7a6a79eb33602862d6a1263e30f98002e"
+  integrity sha512-KrkT6qO5NxqNfy68sBl6CTSoJ4SNDIS5iQArkibhlbGU4LaDukZ3q2HIkh8aUKDio6o4itU4xDR7t82Y2eP1Bg==
+  dependencies:
+    gonzales-pe "^4.3.0"
+    node-source-walk "^6.0.1"
+
+"@nodelib/fs.scandir@2.1.5":
+  version "2.1.5"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5"
+  integrity sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==
+  dependencies:
+    "@nodelib/fs.stat" "2.0.5"
+    run-parallel "^1.1.9"
+
+"@nodelib/fs.stat@2.0.5", "@nodelib/fs.stat@^2.0.2":
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz#5bd262af94e9d25bd1e71b05deed44876a222e8b"
+  integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==
+
+"@nodelib/fs.walk@^1.2.3":
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz#e95737e8bb6746ddedf69c556953494f196fe69a"
+  integrity sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==
+  dependencies:
+    "@nodelib/fs.scandir" "2.1.5"
+    fastq "^1.6.0"
+
+"@typescript-eslint/types@5.62.0":
+  version "5.62.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-5.62.0.tgz#258607e60effa309f067608931c3df6fed41fd2f"
+  integrity sha512-87NVngcbVXUahrRTqIK27gD2t5Cu1yuCXxbLcFtCzZGlfyVWWh8mLHkoxzjsB6DDNnvdL+fW8MiwPEJyGJQDgQ==
+
+"@typescript-eslint/typescript-estree@^5.59.5":
+  version "5.62.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-5.62.0.tgz#7d17794b77fabcac615d6a48fb143330d962eb9b"
+  integrity sha512-CmcQ6uY7b9y694lKdRB8FEel7JbU/40iSAPomu++SjLMntB+2Leay2LO6i8VnJk58MtE9/nQSFIH6jpyRWyYzA==
+  dependencies:
+    "@typescript-eslint/types" "5.62.0"
+    "@typescript-eslint/visitor-keys" "5.62.0"
+    debug "^4.3.4"
+    globby "^11.1.0"
+    is-glob "^4.0.3"
+    semver "^7.3.7"
+    tsutils "^3.21.0"
+
+"@typescript-eslint/visitor-keys@5.62.0":
+  version "5.62.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-5.62.0.tgz#2174011917ce582875954ffe2f6912d5931e353e"
+  integrity sha512-07ny+LHRzQXepkGg6w0mFY41fVUNBrL2Roj/++7V1txKugfjm/Ci/qSND03r2RhlJhJYMcTn9AhhSSqQp0Ysyw==
+  dependencies:
+    "@typescript-eslint/types" "5.62.0"
+    eslint-visitor-keys "^3.3.0"
+
+app-module-path@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/app-module-path/-/app-module-path-2.2.0.tgz#641aa55dfb7d6a6f0a8141c4b9c0aa50b6c24dd5"
+  integrity sha512-gkco+qxENJV+8vFcDiiFhuoSvRXb2a/QPqpSoWhVz829VNJfOTnELbBmPmNKFxf3xdNnw4DWCkzkDaavcX/1YQ==
+
+array-union@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d"
+  integrity sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==
+
+ast-module-types@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/ast-module-types/-/ast-module-types-5.0.0.tgz#32b2b05c56067ff38e95df66f11d6afd6c9ba16b"
+  integrity sha512-JvqziE0Wc0rXQfma0HZC/aY7URXHFuZV84fJRtP8u+lhp0JYCNd5wJzVXP45t0PH0Mej3ynlzvdyITYIu0G4LQ==
+
+balanced-match@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
+  integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==
+
+brace-expansion@^1.1.7:
+  version "1.1.11"
+  resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
+  integrity sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==
+  dependencies:
+    balanced-match "^1.0.0"
+    concat-map "0.0.1"
+
+braces@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107"
+  integrity sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==
+  dependencies:
+    fill-range "^7.0.1"
+
+color-name@^1.1.4:
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
+  integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
+
+commander@^10.0.1:
+  version "10.0.1"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-10.0.1.tgz#881ee46b4f77d1c1dccc5823433aa39b022cbe06"
+  integrity sha512-y4Mg2tXshplEbSGzx7amzPwKKOCGuoSRP/CjEdwwk0FOGlUbq6lKuoyDZTNZkmxHdJtp54hdfY/JUrdL7Xfdug==
+
+concat-map@0.0.1:
+  version "0.0.1"
+  resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
+  integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==
+
+debug@^4.3.4:
+  version "4.3.4"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
+  integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
+  dependencies:
+    ms "2.1.2"
+
+dependency-tree@10.0.9:
+  version "10.0.9"
+  resolved "https://registry.yarnpkg.com/dependency-tree/-/dependency-tree-10.0.9.tgz#0c6c0dbeb0c5ec2cf83bf755f30e9cb12e7b4ac7"
+  integrity sha512-dwc59FRIsht+HfnTVM0BCjJaEWxdq2YAvEDy4/Hn6CwS3CBWMtFnL3aZGAkQn3XCYxk/YcTDE4jX2Q7bFTwCjA==
+  dependencies:
+    commander "^10.0.1"
+    filing-cabinet "^4.1.6"
+    precinct "^11.0.5"
+    typescript "^5.0.4"
+
+detective-amd@^5.0.2:
+  version "5.0.2"
+  resolved "https://registry.yarnpkg.com/detective-amd/-/detective-amd-5.0.2.tgz#579900f301c160efe037a6377ec7e937434b2793"
+  integrity sha512-XFd/VEQ76HSpym80zxM68ieB77unNuoMwopU2TFT/ErUk5n4KvUTwW4beafAVUugrjV48l4BmmR0rh2MglBaiA==
+  dependencies:
+    ast-module-types "^5.0.0"
+    escodegen "^2.0.0"
+    get-amd-module-type "^5.0.1"
+    node-source-walk "^6.0.1"
+
+detective-cjs@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/detective-cjs/-/detective-cjs-5.0.1.tgz#836ad51c6de4863efc7c419ec243694f760ff8b2"
+  integrity sha512-6nTvAZtpomyz/2pmEmGX1sXNjaqgMplhQkskq2MLrar0ZAIkHMrDhLXkRiK2mvbu9wSWr0V5/IfiTrZqAQMrmQ==
+  dependencies:
+    ast-module-types "^5.0.0"
+    node-source-walk "^6.0.0"
+
+detective-es6@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/detective-es6/-/detective-es6-4.0.1.tgz#38d5d49a6d966e992ef8f2d9bffcfe861a58a88a"
+  integrity sha512-k3Z5tB4LQ8UVHkuMrFOlvb3GgFWdJ9NqAa2YLUU/jTaWJIm+JJnEh4PsMc+6dfT223Y8ACKOaC0qcj7diIhBKw==
+  dependencies:
+    node-source-walk "^6.0.1"
+
+detective-postcss@^6.1.3:
+  version "6.1.3"
+  resolved "https://registry.yarnpkg.com/detective-postcss/-/detective-postcss-6.1.3.tgz#51a2d4419327ad85d0af071c7054c79fafca7e73"
+  integrity sha512-7BRVvE5pPEvk2ukUWNQ+H2XOq43xENWbH0LcdCE14mwgTBEAMoAx+Fc1rdp76SmyZ4Sp48HlV7VedUnP6GA1Tw==
+  dependencies:
+    is-url "^1.2.4"
+    postcss "^8.4.23"
+    postcss-values-parser "^6.0.2"
+
+detective-sass@^5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/detective-sass/-/detective-sass-5.0.3.tgz#63e54bc9b32f4bdbd9d5002308f9592a3d3a508f"
+  integrity sha512-YsYT2WuA8YIafp2RVF5CEfGhhyIVdPzlwQgxSjK+TUm3JoHP+Tcorbk3SfG0cNZ7D7+cYWa0ZBcvOaR0O8+LlA==
+  dependencies:
+    gonzales-pe "^4.3.0"
+    node-source-walk "^6.0.1"
+
+detective-scss@^4.0.3:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/detective-scss/-/detective-scss-4.0.3.tgz#79758baa0158f72bfc4481eb7e21cc3b5f1ea6eb"
+  integrity sha512-VYI6cHcD0fLokwqqPFFtDQhhSnlFWvU614J42eY6G0s8c+MBhi9QAWycLwIOGxlmD8I/XvGSOUV1kIDhJ70ZPg==
+  dependencies:
+    gonzales-pe "^4.3.0"
+    node-source-walk "^6.0.1"
+
+detective-stylus@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/detective-stylus/-/detective-stylus-4.0.0.tgz#ce97b6499becdc291de7b3c11df8c352c1eee46e"
+  integrity sha512-TfPotjhszKLgFBzBhTOxNHDsutIxx9GTWjrL5Wh7Qx/ydxKhwUrlSFeLIn+ZaHPF+h0siVBkAQSuy6CADyTxgQ==
+
+detective-typescript@^11.1.0:
+  version "11.1.0"
+  resolved "https://registry.yarnpkg.com/detective-typescript/-/detective-typescript-11.1.0.tgz#2deea5364cae1f0d9d3688bc596e662b049438cc"
+  integrity sha512-Mq8egjnW2NSCkzEb/Az15/JnBI/Ryyl6Po0Y+0mABTFvOS6DAyUGRZqz1nyhu4QJmWWe0zaGs/ITIBeWkvCkGw==
+  dependencies:
+    "@typescript-eslint/typescript-estree" "^5.59.5"
+    ast-module-types "^5.0.0"
+    node-source-walk "^6.0.1"
+    typescript "^5.0.4"
+
+dir-glob@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/dir-glob/-/dir-glob-3.0.1.tgz#56dbf73d992a4a93ba1584f4534063fd2e41717f"
+  integrity sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==
+  dependencies:
+    path-type "^4.0.0"
+
+enhanced-resolve@^5.14.1:
+  version "5.15.0"
+  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.15.0.tgz#1af946c7d93603eb88e9896cee4904dc012e9c35"
+  integrity sha512-LXYT42KJ7lpIKECr2mAXIaMldcNCh/7E0KBKOu4KSfkHmP+mZmSs+8V5gBAqisWBy0OO4W5Oyys0GO1Y8KtdKg==
+  dependencies:
+    graceful-fs "^4.2.4"
+    tapable "^2.2.0"
+
+escodegen@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-2.1.0.tgz#ba93bbb7a43986d29d6041f99f5262da773e2e17"
+  integrity sha512-2NlIDTwUWJN0mRPQOdtQBzbUHvdGY2P1VXSyU83Q3xKxM7WHX2Ql8dKq782Q9TgQUNOLEzEYu9bzLNj1q88I5w==
+  dependencies:
+    esprima "^4.0.1"
+    estraverse "^5.2.0"
+    esutils "^2.0.2"
+  optionalDependencies:
+    source-map "~0.6.1"
+
+eslint-visitor-keys@^3.3.0:
+  version "3.4.3"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz#0cd72fe8550e3c2eae156a96a4dddcd1c8ac5800"
+  integrity sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==
+
+esprima@^4.0.0, esprima@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
+  integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==
+
+estraverse@^5.2.0:
+  version "5.3.0"
+  resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.3.0.tgz#2eea5290702f26ab8fe5370370ff86c965d21123"
+  integrity sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==
+
+esutils@^2.0.2:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64"
+  integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==
+
+fast-glob@^3.2.9:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.2.tgz#a904501e57cfdd2ffcded45e99a54fef55e46129"
+  integrity sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==
+  dependencies:
+    "@nodelib/fs.stat" "^2.0.2"
+    "@nodelib/fs.walk" "^1.2.3"
+    glob-parent "^5.1.2"
+    merge2 "^1.3.0"
+    micromatch "^4.0.4"
+
+fastq@^1.6.0:
+  version "1.17.0"
+  resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.17.0.tgz#ca5e1a90b5e68f97fc8b61330d5819b82f5fab03"
+  integrity sha512-zGygtijUMT7jnk3h26kUms3BkSDp4IfIKjmnqI2tvx6nuBfiF1UqOxbnLfzdv+apBy+53oaImsKtMw/xYbW+1w==
+  dependencies:
+    reusify "^1.0.4"
+
+filing-cabinet@^4.1.6:
+  version "4.1.6"
+  resolved "https://registry.yarnpkg.com/filing-cabinet/-/filing-cabinet-4.1.6.tgz#8d6d12cf3a84365bbd94e1cbf07d71c113420dd2"
+  integrity sha512-C+HZbuQTER36sKzGtUhrAPAoK6+/PrrUhYDBQEh3kBRdsyEhkLbp1ML8S0+6e6gCUrUlid+XmubxJrhvL2g/Zw==
+  dependencies:
+    app-module-path "^2.2.0"
+    commander "^10.0.1"
+    enhanced-resolve "^5.14.1"
+    is-relative-path "^1.0.2"
+    module-definition "^5.0.1"
+    module-lookup-amd "^8.0.5"
+    resolve "^1.22.3"
+    resolve-dependency-path "^3.0.2"
+    sass-lookup "^5.0.1"
+    stylus-lookup "^5.0.1"
+    tsconfig-paths "^4.2.0"
+    typescript "^5.0.4"
+
+fill-range@^7.0.1:
+  version "7.0.1"
+  resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40"
+  integrity sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==
+  dependencies:
+    to-regex-range "^5.0.1"
+
+fs.realpath@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
+  integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
+
+function-bind@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.2.tgz#2c02d864d97f3ea6c8830c464cbd11ab6eab7a1c"
+  integrity sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==
+
+get-amd-module-type@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/get-amd-module-type/-/get-amd-module-type-5.0.1.tgz#bef38ea3674e1aa1bda9c59c8b0da598582f73f2"
+  integrity sha512-jb65zDeHyDjFR1loOVk0HQGM5WNwoGB8aLWy3LKCieMKol0/ProHkhO2X1JxojuN10vbz1qNn09MJ7tNp7qMzw==
+  dependencies:
+    ast-module-types "^5.0.0"
+    node-source-walk "^6.0.1"
+
+get-own-enumerable-property-symbols@^3.0.0:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-3.0.2.tgz#b5fde77f22cbe35f390b4e089922c50bce6ef664"
+  integrity sha512-I0UBV/XOz1XkIJHEUDMZAbzCThU/H8DxmSfmdGcKPnVhu2VfFqr34jr9777IyaTYvxjedWhqVIilEDsCdP5G6g==
+
+glob-parent@^5.1.2:
+  version "5.1.2"
+  resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-5.1.2.tgz#869832c58034fe68a4093c17dc15e8340d8401c4"
+  integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==
+  dependencies:
+    is-glob "^4.0.1"
+
+glob@^7.2.3:
+  version "7.2.3"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.3.tgz#b8df0fb802bbfa8e89bd1d938b4e16578ed44f2b"
+  integrity sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==
+  dependencies:
+    fs.realpath "^1.0.0"
+    inflight "^1.0.4"
+    inherits "2"
+    minimatch "^3.1.1"
+    once "^1.3.0"
+    path-is-absolute "^1.0.0"
+
+globby@^11.1.0:
+  version "11.1.0"
+  resolved "https://registry.yarnpkg.com/globby/-/globby-11.1.0.tgz#bd4be98bb042f83d796f7e3811991fbe82a0d34b"
+  integrity sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==
+  dependencies:
+    array-union "^2.1.0"
+    dir-glob "^3.0.1"
+    fast-glob "^3.2.9"
+    ignore "^5.2.0"
+    merge2 "^1.4.1"
+    slash "^3.0.0"
+
+gonzales-pe@^4.3.0:
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/gonzales-pe/-/gonzales-pe-4.3.0.tgz#fe9dec5f3c557eead09ff868c65826be54d067b3"
+  integrity sha512-otgSPpUmdWJ43VXyiNgEYE4luzHCL2pz4wQ0OnDluC6Eg4Ko3Vexy/SrSynglw/eR+OhkzmqFCZa/OFa/RgAOQ==
+  dependencies:
+    minimist "^1.2.5"
+
+graceful-fs@^4.2.4:
+  version "4.2.11"
+  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.11.tgz#4183e4e8bf08bb6e05bbb2f7d2e0c8f712ca40e3"
+  integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==
+
+hasown@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/hasown/-/hasown-2.0.0.tgz#f4c513d454a57b7c7e1650778de226b11700546c"
+  integrity sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==
+  dependencies:
+    function-bind "^1.1.2"
+
+ignore@^5.2.0:
+  version "5.3.1"
+  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.3.1.tgz#5073e554cd42c5b33b394375f538b8593e34d4ef"
+  integrity sha512-5Fytz/IraMjqpwfd34ke28PTVMjZjJG2MPn5t7OE4eUCUNf8BAa7b5WUS9/Qvr6mwOQS7Mk6vdsMno5he+T8Xw==
+
+inflight@^1.0.4:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9"
+  integrity sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==
+  dependencies:
+    once "^1.3.0"
+    wrappy "1"
+
+inherits@2:
+  version "2.0.4"
+  resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
+  integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
+
+is-core-module@^2.13.0:
+  version "2.13.1"
+  resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.13.1.tgz#ad0d7532c6fea9da1ebdc82742d74525c6273384"
+  integrity sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==
+  dependencies:
+    hasown "^2.0.0"
+
+is-extglob@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
+  integrity sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==
+
+is-glob@^4.0.1, is-glob@^4.0.3:
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-4.0.3.tgz#64f61e42cbbb2eec2071a9dac0b28ba1e65d5084"
+  integrity sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==
+  dependencies:
+    is-extglob "^2.1.1"
+
+is-number@^7.0.0:
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b"
+  integrity sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==
+
+is-obj@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/is-obj/-/is-obj-1.0.1.tgz#3e4729ac1f5fde025cd7d83a896dab9f4f67db0f"
+  integrity sha512-l4RyHgRqGN4Y3+9JHVrNqO+tN0rV5My76uW5/nuO4K1b6vw5G8d/cmFjP9tRfEsdhZNt0IFdZuK/c2Vr4Nb+Qg==
+
+is-regexp@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/is-regexp/-/is-regexp-1.0.0.tgz#fd2d883545c46bac5a633e7b9a09e87fa2cb5069"
+  integrity sha512-7zjFAPO4/gwyQAAgRRmqeEeyIICSdmCqa3tsVHMdBzaXXRiqopZL4Cyghg/XulGWrtABTpbnYYzzIRffLkP4oA==
+
+is-relative-path@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/is-relative-path/-/is-relative-path-1.0.2.tgz#091b46a0d67c1ed0fe85f1f8cfdde006bb251d46"
+  integrity sha512-i1h+y50g+0hRbBD+dbnInl3JlJ702aar58snAeX+MxBAPvzXGej7sYoPMhlnykabt0ZzCJNBEyzMlekuQZN7fA==
+
+is-url-superb@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/is-url-superb/-/is-url-superb-4.0.0.tgz#b54d1d2499bb16792748ac967aa3ecb41a33a8c2"
+  integrity sha512-GI+WjezhPPcbM+tqE9LnmsY5qqjwHzTvjJ36wxYX5ujNXefSUJ/T17r5bqDV8yLhcgB59KTPNOc9O9cmHTPWsA==
+
+is-url@^1.2.4:
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/is-url/-/is-url-1.2.4.tgz#04a4df46d28c4cff3d73d01ff06abeb318a1aa52"
+  integrity sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==
+
+json5@^2.2.2:
+  version "2.2.3"
+  resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.3.tgz#78cd6f1a19bdc12b73db5ad0c61efd66c1e29283"
+  integrity sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==
+
+lru-cache@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94"
+  integrity sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==
+  dependencies:
+    yallist "^4.0.0"
+
+merge2@^1.3.0, merge2@^1.4.1:
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
+  integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==
+
+micromatch@^4.0.4:
+  version "4.0.5"
+  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.5.tgz#bc8999a7cbbf77cdc89f132f6e467051b49090c6"
+  integrity sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==
+  dependencies:
+    braces "^3.0.2"
+    picomatch "^2.3.1"
+
+minimatch@^3.1.1:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.1.2.tgz#19cd194bfd3e428f049a70817c038d89ab4be35b"
+  integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==
+  dependencies:
+    brace-expansion "^1.1.7"
+
+minimist@^1.2.5, minimist@^1.2.6:
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
+  integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
+
+module-definition@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/module-definition/-/module-definition-5.0.1.tgz#62d1194e5d5ea6176b7dc7730f818f466aefa32f"
+  integrity sha512-kvw3B4G19IXk+BOXnYq/D/VeO9qfHaapMeuS7w7sNUqmGaA6hywdFHMi+VWeR9wUScXM7XjoryTffCZ5B0/8IA==
+  dependencies:
+    ast-module-types "^5.0.0"
+    node-source-walk "^6.0.1"
+
+module-lookup-amd@^8.0.5:
+  version "8.0.5"
+  resolved "https://registry.yarnpkg.com/module-lookup-amd/-/module-lookup-amd-8.0.5.tgz#aaeea41979105b49339380ca3f7d573db78c32a5"
+  integrity sha512-vc3rYLjDo5Frjox8NZpiyLXsNWJ5BWshztc/5KSOMzpg9k5cHH652YsJ7VKKmtM4SvaxuE9RkrYGhiSjH3Ehow==
+  dependencies:
+    commander "^10.0.1"
+    glob "^7.2.3"
+    requirejs "^2.3.6"
+    requirejs-config-file "^4.0.0"
+
+ms@2.1.2:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"
+  integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
+
+nanoid@^3.3.7:
+  version "3.3.7"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.7.tgz#d0c301a691bc8d54efa0a2226ccf3fe2fd656bd8"
+  integrity sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==
+
+node-source-walk@^6.0.0, node-source-walk@^6.0.1, node-source-walk@^6.0.2:
+  version "6.0.2"
+  resolved "https://registry.yarnpkg.com/node-source-walk/-/node-source-walk-6.0.2.tgz#ba81bc4bc0f6f05559b084bea10be84c3f87f211"
+  integrity sha512-jn9vOIK/nfqoFCcpK89/VCVaLg1IHE6UVfDOzvqmANaJ/rWCTEdH8RZ1V278nv2jr36BJdyQXIAavBLXpzdlag==
+  dependencies:
+    "@babel/parser" "^7.21.8"
+
+once@^1.3.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
+  integrity sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==
+  dependencies:
+    wrappy "1"
+
+path-is-absolute@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f"
+  integrity sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==
+
+path-parse@^1.0.7:
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735"
+  integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==
+
+path-type@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/path-type/-/path-type-4.0.0.tgz#84ed01c0a7ba380afe09d90a8c180dcd9d03043b"
+  integrity sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==
+
+picocolors@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
+  integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
+
+picomatch@^2.3.1:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42"
+  integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
+
+postcss-values-parser@^6.0.2:
+  version "6.0.2"
+  resolved "https://registry.yarnpkg.com/postcss-values-parser/-/postcss-values-parser-6.0.2.tgz#636edc5b86c953896f1bb0d7a7a6615df00fb76f"
+  integrity sha512-YLJpK0N1brcNJrs9WatuJFtHaV9q5aAOj+S4DI5S7jgHlRfm0PIbDCAFRYMQD5SHq7Fy6xsDhyutgS0QOAs0qw==
+  dependencies:
+    color-name "^1.1.4"
+    is-url-superb "^4.0.0"
+    quote-unquote "^1.0.0"
+
+postcss@^8.4.23:
+  version "8.4.33"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.33.tgz#1378e859c9f69bf6f638b990a0212f43e2aaa742"
+  integrity sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==
+  dependencies:
+    nanoid "^3.3.7"
+    picocolors "^1.0.0"
+    source-map-js "^1.0.2"
+
+precinct@^11.0.5:
+  version "11.0.5"
+  resolved "https://registry.yarnpkg.com/precinct/-/precinct-11.0.5.tgz#3e15b3486670806f18addb54b8533e23596399ff"
+  integrity sha512-oHSWLC8cL/0znFhvln26D14KfCQFFn4KOLSw6hmLhd+LQ2SKt9Ljm89but76Pc7flM9Ty1TnXyrA2u16MfRV3w==
+  dependencies:
+    "@dependents/detective-less" "^4.1.0"
+    commander "^10.0.1"
+    detective-amd "^5.0.2"
+    detective-cjs "^5.0.1"
+    detective-es6 "^4.0.1"
+    detective-postcss "^6.1.3"
+    detective-sass "^5.0.3"
+    detective-scss "^4.0.3"
+    detective-stylus "^4.0.0"
+    detective-typescript "^11.1.0"
+    module-definition "^5.0.1"
+    node-source-walk "^6.0.2"
+
+queue-microtask@^1.2.2:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.3.tgz#4929228bbc724dfac43e0efb058caf7b6cfb6243"
+  integrity sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==
+
+quote-unquote@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/quote-unquote/-/quote-unquote-1.0.0.tgz#67a9a77148effeaf81a4d428404a710baaac8a0b"
+  integrity sha512-twwRO/ilhlG/FIgYeKGFqyHhoEhqgnKVkcmqMKi2r524gz3ZbDTcyFt38E9xjJI2vT+KbRNHVbnJ/e0I25Azwg==
+
+requirejs-config-file@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/requirejs-config-file/-/requirejs-config-file-4.0.0.tgz#4244da5dd1f59874038cc1091d078d620abb6ebc"
+  integrity sha512-jnIre8cbWOyvr8a5F2KuqBnY+SDA4NXr/hzEZJG79Mxm2WiFQz2dzhC8ibtPJS7zkmBEl1mxSwp5HhC1W4qpxw==
+  dependencies:
+    esprima "^4.0.0"
+    stringify-object "^3.2.1"
+
+requirejs@^2.3.6:
+  version "2.3.6"
+  resolved "https://registry.yarnpkg.com/requirejs/-/requirejs-2.3.6.tgz#e5093d9601c2829251258c0b9445d4d19fa9e7c9"
+  integrity sha512-ipEzlWQe6RK3jkzikgCupiTbTvm4S0/CAU5GlgptkN5SO6F3u0UD0K18wy6ErDqiCyP4J4YYe1HuAShvsxePLg==
+
+resolve-dependency-path@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/resolve-dependency-path/-/resolve-dependency-path-3.0.2.tgz#012816717bcbe8b846835da11af9d2beb5acef50"
+  integrity sha512-Tz7zfjhLfsvR39ADOSk9us4421J/1ztVBo4rWUkF38hgHK5m0OCZ3NxFVpqHRkjctnwVa15igEUHFJp8MCS7vA==
+
+resolve@^1.22.3:
+  version "1.22.8"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.8.tgz#b6c87a9f2aa06dfab52e3d70ac8cde321fa5a48d"
+  integrity sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==
+  dependencies:
+    is-core-module "^2.13.0"
+    path-parse "^1.0.7"
+    supports-preserve-symlinks-flag "^1.0.0"
+
+reusify@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
+  integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
+
+run-parallel@^1.1.9:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.2.0.tgz#66d1368da7bdf921eb9d95bd1a9229e7f21a43ee"
+  integrity sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==
+  dependencies:
+    queue-microtask "^1.2.2"
+
+sass-lookup@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/sass-lookup/-/sass-lookup-5.0.1.tgz#1f01d7ff21e09d8c9dcf8d05b3fca28f2f96e6ed"
+  integrity sha512-t0X5PaizPc2H4+rCwszAqHZRtr4bugo4pgiCvrBFvIX0XFxnr29g77LJcpyj9A0DcKf7gXMLcgvRjsonYI6x4g==
+  dependencies:
+    commander "^10.0.1"
+
+semver@^7.3.7:
+  version "7.5.4"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.4.tgz#483986ec4ed38e1c6c48c34894a9182dbff68a6e"
+  integrity sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==
+  dependencies:
+    lru-cache "^6.0.0"
+
+slash@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/slash/-/slash-3.0.0.tgz#6539be870c165adbd5240220dbe361f1bc4d4634"
+  integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==
+
+source-map-js@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
+  integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
+
+source-map@~0.6.1:
+  version "0.6.1"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
+  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
+
+stringify-object@^3.2.1:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/stringify-object/-/stringify-object-3.3.0.tgz#703065aefca19300d3ce88af4f5b3956d7556629"
+  integrity sha512-rHqiFh1elqCQ9WPLIC8I0Q/g/wj5J1eMkyoiD6eoQApWHP0FtlK7rqnhmabL5VUY9JQCcqwwvlOaSuutekgyrw==
+  dependencies:
+    get-own-enumerable-property-symbols "^3.0.0"
+    is-obj "^1.0.1"
+    is-regexp "^1.0.0"
+
+strip-bom@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3"
+  integrity sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==
+
+stylus-lookup@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/stylus-lookup/-/stylus-lookup-5.0.1.tgz#3c4d116c3b1e8e1a8169c0d9cd20e608595560f4"
+  integrity sha512-tLtJEd5AGvnVy4f9UHQMw4bkJJtaAcmo54N+ovQBjDY3DuWyK9Eltxzr5+KG0q4ew6v2EHyuWWNnHeiw/Eo7rQ==
+  dependencies:
+    commander "^10.0.1"
+
+supports-preserve-symlinks-flag@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
+  integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==
+
+tapable@^2.2.0:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/tapable/-/tapable-2.2.1.tgz#1967a73ef4060a82f12ab96af86d52fdb76eeca0"
+  integrity sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==
+
+to-regex-range@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/to-regex-range/-/to-regex-range-5.0.1.tgz#1648c44aae7c8d988a326018ed72f5b4dd0392e4"
+  integrity sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==
+  dependencies:
+    is-number "^7.0.0"
+
+tsconfig-paths@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-4.2.0.tgz#ef78e19039133446d244beac0fd6a1632e2d107c"
+  integrity sha512-NoZ4roiN7LnbKn9QqE1amc9DJfzvZXxF4xDavcOWt1BPkdx+m+0gJuPM+S0vCe7zTJMYUP0R8pO2XMr+Y8oLIg==
+  dependencies:
+    json5 "^2.2.2"
+    minimist "^1.2.6"
+    strip-bom "^3.0.0"
+
+tslib@^1.8.1:
+  version "1.14.1"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
+  integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
+
+tsutils@^3.21.0:
+  version "3.21.0"
+  resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.21.0.tgz#b48717d394cea6c1e096983eed58e9d61715b623"
+  integrity sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==
+  dependencies:
+    tslib "^1.8.1"
+
+typescript@^5.0.4:
+  version "5.3.3"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.3.3.tgz#b3ce6ba258e72e6305ba66f5c9b452aaee3ffe37"
+  integrity sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==
+
+wrappy@1:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
+  integrity sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==
+
+yallist@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
+  integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
diff --git a/deploy/tools/envs-validator/index.ts b/deploy/tools/envs-validator/index.ts
index dc5106045b..9770ea6399 100644
--- a/deploy/tools/envs-validator/index.ts
+++ b/deploy/tools/envs-validator/index.ts
@@ -36,11 +36,15 @@ async function validateEnvs(appEnvs: Record<string, string>) {
     const envsWithJsonConfig = [
       'NEXT_PUBLIC_FEATURED_NETWORKS',
       'NEXT_PUBLIC_MARKETPLACE_CONFIG_URL',
+      'NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL',
+      'NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL',
       'NEXT_PUBLIC_FOOTER_LINKS',
     ];
 
     for await (const envName of envsWithJsonConfig) {
-      appEnvs[envName] = await(appEnvs[envName] ? getExternalJsonContent(envName) : Promise.resolve()) || '[]';
+      if (appEnvs[envName]) {
+        appEnvs[envName] = await getExternalJsonContent(envName) || '[]';
+      }
     }
 
     await schema.validate(appEnvs, { stripUnknown: false, abortEarly: false });
@@ -99,7 +103,7 @@ async function checkPlaceholdersCongruity(envsMap: Record<string, string>) {
       inconsistencies.forEach((env) => {
         console.log(`     ${ env }`);
       });
-      console.log(`   They are either deprecated or running the app with them may lead to unexpected behavior. 
+      console.log(`   They are either deprecated or running the app with them may lead to unexpected behavior.
    Please check the documentation for more details - https://github.com/blockscout/frontend/blob/main/docs/ENVS.md
       `);
       throw new Error();
diff --git a/deploy/tools/envs-validator/schema.ts b/deploy/tools/envs-validator/schema.ts
index aaab91c31d..c9e3bf5aa5 100644
--- a/deploy/tools/envs-validator/schema.ts
+++ b/deploy/tools/envs-validator/schema.ts
@@ -9,13 +9,19 @@ declare module 'yup' {
 import * as yup from 'yup';
 
 import type { AdButlerConfig } from '../../../types/client/adButlerConfig';
-import { SUPPORTED_AD_TEXT_PROVIDERS, SUPPORTED_AD_BANNER_PROVIDERS } from '../../../types/client/adProviders';
-import type { AdTextProviders, AdBannerProviders } from '../../../types/client/adProviders';
-import type { MarketplaceAppOverview } from '../../../types/client/marketplace';
+import { SUPPORTED_AD_TEXT_PROVIDERS, SUPPORTED_AD_BANNER_PROVIDERS, SUPPORTED_AD_BANNER_ADDITIONAL_PROVIDERS } from '../../../types/client/adProviders';
+import type { AdTextProviders, AdBannerProviders, AdBannerAdditionalProviders } from '../../../types/client/adProviders';
+import type { ContractCodeIde } from '../../../types/client/contract';
+import { GAS_UNITS } from '../../../types/client/gasTracker';
+import type { GasUnit } from '../../../types/client/gasTracker';
+import type { MarketplaceAppOverview, MarketplaceAppSecurityReportRaw, MarketplaceAppSecurityReport } from '../../../types/client/marketplace';
 import { NAVIGATION_LINK_IDS } from '../../../types/client/navigation-items';
 import type { NavItemExternal, NavigationLinkId } from '../../../types/client/navigation-items';
+import { ROLLUP_TYPES } from '../../../types/client/rollup';
 import type { BridgedTokenChain, TokenBridge } from '../../../types/client/token';
 import { PROVIDERS as TX_INTERPRETATION_PROVIDERS } from '../../../types/client/txInterpretation';
+import { VALIDATORS_CHAIN_TYPE } from '../../../types/client/validators';
+import type { ValidatorsChainType } from '../../../types/client/validators';
 import type { WalletType } from '../../../types/client/wallets';
 import { SUPPORTED_WALLETS } from '../../../types/client/wallets';
 import type { CustomLink, CustomLinksGroup } from '../../../types/footerLinks';
@@ -69,22 +75,124 @@ const marketplaceAppSchema: yup.ObjectSchema<MarketplaceAppOverview> = yup
     site: yup.string().test(urlTest),
     twitter: yup.string().test(urlTest),
     telegram: yup.string().test(urlTest),
-    github: yup.string().test(urlTest),
+    github: yup.lazy(value =>
+      Array.isArray(value) ?
+        yup.array().of(yup.string().required().test(urlTest)) :
+        yup.string().test(urlTest),
+    ),
+    discord: yup.string().test(urlTest),
+    internalWallet: yup.boolean(),
+    priority: yup.number(),
+  });
+
+const issueSeverityDistributionSchema: yup.ObjectSchema<MarketplaceAppSecurityReport['overallInfo']['issueSeverityDistribution']> = yup
+  .object({
+    critical: yup.number().required(),
+    gas: yup.number().required(),
+    high: yup.number().required(),
+    informational: yup.number().required(),
+    low: yup.number().required(),
+    medium: yup.number().required(),
+  });
+
+const solidityscanReportSchema: yup.ObjectSchema<MarketplaceAppSecurityReport['contractsData'][number]['solidityScanReport']> = yup
+  .object({
+    contractname: yup.string().required(),
+    scan_status: yup.string().required(),
+    scan_summary: yup
+      .object({
+        issue_severity_distribution: issueSeverityDistributionSchema.required(),
+        lines_analyzed_count: yup.number().required(),
+        scan_time_taken: yup.number().required(),
+        score: yup.string().required(),
+        score_v2: yup.string().required(),
+        threat_score: yup.string().required(),
+      })
+      .required(),
+    scanner_reference_url: yup.string().test(urlTest).required(),
+  });
+
+const contractDataSchema: yup.ObjectSchema<MarketplaceAppSecurityReport['contractsData'][number]> = yup
+  .object({
+    address: yup.string().required(),
+    isVerified: yup.boolean().required(),
+    solidityScanReport: solidityscanReportSchema.nullable().notRequired(),
+  });
+
+const chainsDataSchema = yup.lazy((objValue) => {
+  let schema = yup.object();
+  Object.keys(objValue).forEach((key) => {
+    schema = schema.shape({
+      [key]: yup.object({
+        overallInfo: yup.object({
+          verifiedNumber: yup.number().required(),
+          totalContractsNumber: yup.number().required(),
+          solidityScanContractsNumber: yup.number().required(),
+          securityScore: yup.number().required(),
+          issueSeverityDistribution: issueSeverityDistributionSchema.required(),
+        }).required(),
+        contractsData: yup.array().of(contractDataSchema).required(),
+      }),
+    });
+  });
+  return schema;
+});
+
+const securityReportSchema: yup.ObjectSchema<MarketplaceAppSecurityReportRaw> = yup
+  .object({
+    appName: yup.string().required(),
+    chainsData: chainsDataSchema,
   });
 
 const marketplaceSchema = yup
   .object()
   .shape({
+    NEXT_PUBLIC_MARKETPLACE_ENABLED: yup.boolean(),
     NEXT_PUBLIC_MARKETPLACE_CONFIG_URL: yup
       .array()
       .json()
-      .of(marketplaceAppSchema),
+      .of(marketplaceAppSchema)
+      .when('NEXT_PUBLIC_MARKETPLACE_ENABLED', {
+        is: true,
+        then: (schema) => schema,
+        // eslint-disable-next-line max-len
+        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_MARKETPLACE_CONFIG_URL cannot not be used without NEXT_PUBLIC_MARKETPLACE_ENABLED'),
+      }),
+    NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL: yup
+      .array()
+      .json()
+      .of(yup.string())
+      .when('NEXT_PUBLIC_MARKETPLACE_ENABLED', {
+        is: true,
+        then: (schema) => schema,
+        // eslint-disable-next-line max-len
+        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL cannot not be used without NEXT_PUBLIC_MARKETPLACE_ENABLED'),
+      }),
     NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM: yup
       .string()
-      .when('NEXT_PUBLIC_MARKETPLACE_CONFIG_URL', {
-        is: (value: Array<unknown>) => value.length > 0,
+      .when('NEXT_PUBLIC_MARKETPLACE_ENABLED', {
+        is: true,
         then: (schema) => schema.test(urlTest).required(),
-        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM cannot not be used without NEXT_PUBLIC_MARKETPLACE_CONFIG_URL'),
+        // eslint-disable-next-line max-len
+        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM cannot not be used without NEXT_PUBLIC_MARKETPLACE_ENABLED'),
+      }),
+    NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM: yup
+      .string()
+      .when('NEXT_PUBLIC_MARKETPLACE_ENABLED', {
+        is: true,
+        then: (schema) => schema.test(urlTest),
+        // eslint-disable-next-line max-len
+        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM cannot not be used without NEXT_PUBLIC_MARKETPLACE_ENABLED'),
+      }),
+    NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL: yup
+      .array()
+      .json()
+      .of(securityReportSchema)
+      .when('NEXT_PUBLIC_MARKETPLACE_ENABLED', {
+        is: true,
+        then: (schema) => schema,
+        // eslint-disable-next-line max-len
+        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL cannot not be used without NEXT_PUBLIC_MARKETPLACE_ENABLED'),
       }),
   });
 
@@ -107,23 +215,20 @@ const beaconChainSchema = yup
 const rollupSchema = yup
   .object()
   .shape({
-    NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK: yup.boolean(),
-    NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL: yup
+    NEXT_PUBLIC_ROLLUP_TYPE: yup.string().oneOf(ROLLUP_TYPES),
+    NEXT_PUBLIC_ROLLUP_L1_BASE_URL: yup
       .string()
-      .when('NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK', {
+      .when('NEXT_PUBLIC_ROLLUP_TYPE', {
         is: (value: string) => value,
         then: (schema) => schema.test(urlTest).required(),
-        // eslint-disable-next-line max-len
-        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL cannot not be used if NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK is not set to "true"'),
+        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_ROLLUP_L1_BASE_URL cannot not be used if NEXT_PUBLIC_ROLLUP_TYPE is not defined'),
       }),
-    NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK: yup.boolean(),
-    NEXT_PUBLIC_L1_BASE_URL: yup
+    NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL: yup
       .string()
-      .when([ 'NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK', 'NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK' ], {
-        is: (isOptimistic?: boolean, isZk?: boolean) => isOptimistic || isZk,
+      .when('NEXT_PUBLIC_ROLLUP_TYPE', {
+        is: (value: string) => value === 'optimistic',
         then: (schema) => schema.test(urlTest).required(),
-        // eslint-disable-next-line max-len
-        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_L1_BASE_URL cannot not be used if NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK or NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK is not set to "true"'),
+        otherwise: (schema) => schema.max(-1, 'NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL cannot not be used if NEXT_PUBLIC_ROLLUP_TYPE is not defined'),
       }),
   });
 
@@ -140,12 +245,23 @@ const adButlerConfigSchema = yup
         height: yup.number().positive().required(),
       })
       .required(),
+  })
+  .when('NEXT_PUBLIC_AD_BANNER_ADDITIONAL_PROVIDER', {
+    is: (value: AdBannerProviders) => value === 'adbutler',
+    then: (schema) => schema
+      .shape({
+        id: yup.string().required(),
+        width: yup.number().positive().required(),
+        height: yup.number().positive().required(),
+      })
+      .required(),
   });
 
 const adsBannerSchema = yup
   .object()
   .shape({
     NEXT_PUBLIC_AD_BANNER_PROVIDER: yup.string<AdBannerProviders>().oneOf(SUPPORTED_AD_BANNER_PROVIDERS),
+    NEXT_PUBLIC_AD_BANNER_ADDITIONAL_PROVIDER: yup.string<AdBannerAdditionalProviders>().oneOf(SUPPORTED_AD_BANNER_ADDITIONAL_PROVIDERS),
     NEXT_PUBLIC_AD_ADBUTLER_CONFIG_DESKTOP: adButlerConfigSchema,
     NEXT_PUBLIC_AD_ADBUTLER_CONFIG_MOBILE: adButlerConfigSchema,
   });
@@ -252,6 +368,7 @@ const footerLinkGroupSchema: yup.ObjectSchema<CustomLinksGroup> = yup
 const networkExplorerSchema: yup.ObjectSchema<NetworkExplorer> = yup
   .object({
     title: yup.string().required(),
+    logo: yup.string().test(urlTest),
     baseUrl: yup.string().test(urlTest).required(),
     paths: yup
       .object()
@@ -263,6 +380,13 @@ const networkExplorerSchema: yup.ObjectSchema<NetworkExplorer> = yup
       }),
   });
 
+const contractCodeIdeSchema: yup.ObjectSchema<ContractCodeIde> = yup
+  .object({
+    title: yup.string().required(),
+    url: yup.string().test(urlTest).required(),
+    icon_url: yup.string().test(urlTest).required(),
+  });
+
 const nftMarketplaceSchema: yup.ObjectSchema<NftMarketplaceItem> = yup
   .object({
     name: yup.string().required(),
@@ -330,6 +454,7 @@ const schema = yup
     NEXT_PUBLIC_NETWORK_ID: yup.number().positive().integer().required(),
     NEXT_PUBLIC_NETWORK_RPC_URL: yup.string().test(urlTest),
     NEXT_PUBLIC_NETWORK_CURRENCY_NAME: yup.string(),
+    NEXT_PUBLIC_NETWORK_CURRENCY_WEI_NAME: yup.string(),
     NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL: yup.string(),
     NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS: yup.number().integer().positive(),
     NEXT_PUBLIC_NETWORK_GOVERNANCE_TOKEN_SYMBOL: yup.string(),
@@ -352,7 +477,6 @@ const schema = yup
       .of(yup.string<ChainIndicatorId>().oneOf([ 'daily_txs', 'coin_price', 'market_cap', 'tvl' ])),
     NEXT_PUBLIC_HOMEPAGE_PLATE_TEXT_COLOR: yup.string(),
     NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND: yup.string(),
-    NEXT_PUBLIC_HOMEPAGE_SHOW_GAS_TRACKER: yup.boolean(),
     NEXT_PUBLIC_HOMEPAGE_SHOW_AVG_BLOCK_TIME: yup.boolean(),
 
     //     b. sidebar
@@ -416,6 +540,12 @@ const schema = yup
       .transform(replaceQuotes)
       .json()
       .of(networkExplorerSchema),
+    NEXT_PUBLIC_CONTRACT_CODE_IDES: yup
+      .array()
+      .transform(replaceQuotes)
+      .json()
+      .of(contractCodeIdeSchema),
+    NEXT_PUBLIC_HAS_CONTRACT_AUDIT_REPORTS: yup.boolean(),
     NEXT_PUBLIC_HIDE_INDEXING_ALERT_BLOCKS: yup.boolean(),
     NEXT_PUBLIC_HIDE_INDEXING_ALERT_INT_TXS: yup.boolean(),
     NEXT_PUBLIC_MAINTENANCE_ALERT_MESSAGE: yup.string(),
@@ -425,6 +555,7 @@ const schema = yup
     NEXT_PUBLIC_STATS_API_HOST: yup.string().test(urlTest),
     NEXT_PUBLIC_VISUALIZE_API_HOST: yup.string().test(urlTest),
     NEXT_PUBLIC_CONTRACT_INFO_API_HOST: yup.string().test(urlTest),
+    NEXT_PUBLIC_NAME_SERVICE_API_HOST: yup.string().test(urlTest),
     NEXT_PUBLIC_GRAPHIQL_TRANSACTION: yup.string().matches(regexp.HEX_REGEXP),
     NEXT_PUBLIC_WEB3_WALLETS: yup
       .mixed()
@@ -444,7 +575,15 @@ const schema = yup
     NEXT_PUBLIC_PROMOTE_BLOCKSCOUT_IN_TITLE: yup.boolean(),
     NEXT_PUBLIC_OG_DESCRIPTION: yup.string(),
     NEXT_PUBLIC_OG_IMAGE_URL: yup.string().test(urlTest),
+    NEXT_PUBLIC_SAFE_TX_SERVICE_URL: yup.string().test(urlTest),
     NEXT_PUBLIC_IS_SUAVE_CHAIN: yup.boolean(),
+    NEXT_PUBLIC_HAS_USER_OPS: yup.boolean(),
+    NEXT_PUBLIC_METASUITES_ENABLED: yup.boolean(),
+    NEXT_PUBLIC_SWAP_BUTTON_URL: yup.string(),
+    NEXT_PUBLIC_VALIDATORS_CHAIN_TYPE: yup.string<ValidatorsChainType>().oneOf(VALIDATORS_CHAIN_TYPE),
+    NEXT_PUBLIC_GAS_TRACKER_ENABLED: yup.boolean(),
+    NEXT_PUBLIC_GAS_TRACKER_UNITS: yup.array().transform(replaceQuotes).json().of(yup.string<GasUnit>().oneOf(GAS_UNITS)),
+    NEXT_PUBLIC_DATA_AVAILABILITY_ENABLED: yup.boolean(),
 
     // 6. External services envs
     NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID: yup.string(),
@@ -455,6 +594,7 @@ const schema = yup
     NEXT_PUBLIC_ALGOLIA_APP_ID: yup.string(),
     NEXT_PUBLIC_ALGOLIA_API_KEY: yup.string(),
     NEXT_PUBLIC_ALGOLIA_INDEX_NAME: yup.string(),
+    NEXT_PUBLIC_GROWTH_BOOK_CLIENT_KEY: yup.string(),
 
     // Misc
     NEXT_PUBLIC_USE_NEXT_JS_PROXY: yup.boolean(),
diff --git a/deploy/tools/envs-validator/test/.env.adbutler_add b/deploy/tools/envs-validator/test/.env.adbutler_add
new file mode 100644
index 0000000000..7f1968e4bb
--- /dev/null
+++ b/deploy/tools/envs-validator/test/.env.adbutler_add
@@ -0,0 +1,4 @@
+NEXT_PUBLIC_AD_BANNER_PROVIDER='slise'
+NEXT_PUBLIC_AD_BANNER_ADDITIONAL_PROVIDER='adbutler'
+NEXT_PUBLIC_AD_ADBUTLER_CONFIG_DESKTOP={'id':'123456','width':'728','height':'90'}
+NEXT_PUBLIC_AD_ADBUTLER_CONFIG_MOBILE={'id':'654321','width':'300','height':'100'}
\ No newline at end of file
diff --git a/deploy/tools/envs-validator/test/.env.base b/deploy/tools/envs-validator/test/.env.base
index 578d5f91f6..559c63fc79 100644
--- a/deploy/tools/envs-validator/test/.env.base
+++ b/deploy/tools/envs-validator/test/.env.base
@@ -9,7 +9,9 @@ NEXT_PUBLIC_APP_PORT=3000
 NEXT_PUBLIC_APP_PROTOCOL=http
 NEXT_PUBLIC_BRIDGED_TOKENS_CHAINS=[{'id':'1','title':'Ethereum','short_title':'ETH','base_url':'https://example.com'}]
 NEXT_PUBLIC_BRIDGED_TOKENS_BRIDGES=[{'type':'omni','title':'OmniBridge','short_title':'OMNI'}]
+NEXT_PUBLIC_CONTRACT_CODE_IDES=[{'title':'Remix IDE','url':'https://remix.blockscout.com/?address={hash}&blockscout={domain}','icon_url':'https://example.com/icon.svg'}]
 NEXT_PUBLIC_CONTRACT_INFO_API_HOST=https://example.com
+NEXT_PUBLIC_DATA_AVAILABILITY_ENABLED=true
 NEXT_PUBLIC_FEATURED_NETWORKS=https://example.com
 NEXT_PUBLIC_FOOTER_LINKS=https://example.com
 NEXT_PUBLIC_GRAPHIQL_TRANSACTION=0xf7d4972356e6ae44ae948d0cf19ef2beaf0e574c180997e969a2837da15e349d
@@ -18,12 +20,12 @@ NEXT_PUBLIC_HIDE_INDEXING_ALERT_INT_TXS=false
 NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs']
 NEXT_PUBLIC_HOMEPAGE_PLATE_TEXT_COLOR='#fff'
 NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND='rgb(255, 145, 0)'
-NEXT_PUBLIC_HOMEPAGE_SHOW_GAS_TRACKER=true
 NEXT_PUBLIC_HOMEPAGE_SHOW_AVG_BLOCK_TIME=true
+NEXT_PUBLIC_GAS_TRACKER_ENABLED=true
+NEXT_PUBLIC_GAS_TRACKER_UNITS=['gwei']
 NEXT_PUBLIC_IS_TESTNET=true
-NEXT_PUBLIC_MARKETPLACE_CONFIG_URL=https://example.com
-NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM=https://example.com
 NEXT_PUBLIC_MAINTENANCE_ALERT_MESSAGE='<a href="#">Hello</a>'
+NEXT_PUBLIC_METASUITES_ENABLED=true
 NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS=18
 NEXT_PUBLIC_NETWORK_CURRENCY_NAME=Ether
 NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=ETH
@@ -40,6 +42,7 @@ NEXT_PUBLIC_OG_DESCRIPTION='Hello world!'
 NEXT_PUBLIC_OG_IMAGE_URL=https://example.com/image.png
 NEXT_PUBLIC_OTHER_LINKS=[{'url':'https://blockscout.com','text':'Blockscout'}]
 NEXT_PUBLIC_PROMOTE_BLOCKSCOUT_IN_TITLE=true
+NEXT_PUBLIC_SAFE_TX_SERVICE_URL=https://safe-transaction-mainnet.safe.global
 NEXT_PUBLIC_STATS_API_HOST=https://example.com
 NEXT_PUBLIC_USE_NEXT_JS_PROXY=false
 NEXT_PUBLIC_VIEWS_ADDRESS_IDENTICON_TYPE=gradient_avatar
@@ -50,4 +53,6 @@ NEXT_PUBLIC_VIEWS_TX_ADDITIONAL_FIELDS=['fee_per_gas']
 NEXT_PUBLIC_VIEWS_TX_HIDDEN_FIELDS=['value','fee_currency','gas_price','tx_fee','gas_fees','burnt_fees']
 NEXT_PUBLIC_VISUALIZE_API_HOST=https://example.com
 NEXT_PUBLIC_WEB3_DISABLE_ADD_TOKEN_TO_WALLET=false
-NEXT_PUBLIC_WEB3_WALLETS=['coinbase','metamask','token_pocket']
\ No newline at end of file
+NEXT_PUBLIC_WEB3_WALLETS=['coinbase','metamask','token_pocket']
+NEXT_PUBLIC_SWAP_BUTTON_URL=uniswap
+NEXT_PUBLIC_VALIDATORS_CHAIN_TYPE=stability
\ No newline at end of file
diff --git a/deploy/tools/envs-validator/test/.env.marketplace b/deploy/tools/envs-validator/test/.env.marketplace
new file mode 100644
index 0000000000..eaf12c6dc9
--- /dev/null
+++ b/deploy/tools/envs-validator/test/.env.marketplace
@@ -0,0 +1,7 @@
+NEXT_PUBLIC_MARKETPLACE_ENABLED=true
+NEXT_PUBLIC_MARKETPLACE_CONFIG_URL=https://example.com
+NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL=https://example.com
+NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM=https://example.com
+NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM=https://example.com
+NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL=https://example.com
+NEXT_PUBLIC_ADMIN_SERVICE_API_HOST=https://example.com
diff --git a/deploy/tools/envs-validator/test/.env.rollup b/deploy/tools/envs-validator/test/.env.rollup
index 8534221d99..1cb3e1af88 100644
--- a/deploy/tools/envs-validator/test/.env.rollup
+++ b/deploy/tools/envs-validator/test/.env.rollup
@@ -1,3 +1,3 @@
-NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK=true
-NEXT_PUBLIC_L1_BASE_URL=https://example.com
-NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL=https://example.com
\ No newline at end of file
+NEXT_PUBLIC_ROLLUP_TYPE=optimistic
+NEXT_PUBLIC_ROLLUP_L1_BASE_URL=https://example.com
+NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL=https://example.com
\ No newline at end of file
diff --git a/deploy/tools/envs-validator/test/assets/marketplace_categories.json b/deploy/tools/envs-validator/test/assets/marketplace_categories.json
new file mode 100644
index 0000000000..15b31a5557
--- /dev/null
+++ b/deploy/tools/envs-validator/test/assets/marketplace_categories.json
@@ -0,0 +1,5 @@
+[
+  "Swaps",
+  "Bridges",
+  "NFT"
+]
diff --git a/deploy/tools/envs-validator/test/assets/marketplace_security_reports.json b/deploy/tools/envs-validator/test/assets/marketplace_security_reports.json
new file mode 100644
index 0000000000..cf0f481ae3
--- /dev/null
+++ b/deploy/tools/envs-validator/test/assets/marketplace_security_reports.json
@@ -0,0 +1,1073 @@
+[
+  {
+    "appName": "paraswap",
+    "doc": "https://developers.paraswap.network/smart-contracts",
+    "chainsData": {
+      "1": {
+        "overallInfo": {
+          "verifiedNumber": 4,
+          "totalContractsNumber": 4,
+          "solidityScanContractsNumber": 4,
+          "securityScore": 77.41749999999999,
+          "issueSeverityDistribution": {
+            "critical": 5,
+            "gas": 58,
+            "high": 9,
+            "informational": 27,
+            "low": 41,
+            "medium": 5
+          }
+        },
+        "contractsData": [
+          {
+            "address": "0xDEF171Fe48CF0115B1d80b88dc8eAB59176FEe57",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xDEF171Fe48CF0115B1d80b88dc8eAB59176FEe57",
+              "contract_chain": "optimism",
+              "contract_platform": "blockscout",
+              "contract_url": "https://optimism.blockscout.com/address/0xDEF171Fe48CF0115B1d80b88dc8eAB59176FEe57",
+              "contractname": "AugustusSwapper",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xDEF171Fe48CF0115B1d80b88dc8eAB59176FEe57/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 8,
+                  "high": 4,
+                  "informational": 7,
+                  "low": 8,
+                  "medium": 1
+                },
+                "lines_analyzed_count": 180,
+                "scan_time_taken": 1,
+                "score": "3.61",
+                "score_v2": "72.22",
+                "threat_score": "73.68"
+              }
+            }
+          },
+          {
+            "address": "0x216b4b4ba9f3e719726886d34a177484278bfcae",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x216b4b4ba9f3e719726886d34a177484278bfcae",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0x216b4b4ba9f3e719726886d34a177484278bfcae",
+              "contractname": "TokenTransferProxy",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x216b4b4ba9f3e719726886d34a177484278bfcae/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 1,
+                  "gas": 29,
+                  "high": 5,
+                  "informational": 14,
+                  "low": 21,
+                  "medium": 3
+                },
+                "lines_analyzed_count": 553,
+                "scan_time_taken": 1,
+                "score": "3.92",
+                "score_v2": "78.48",
+                "threat_score": "78.95"
+              }
+            }
+          },
+          {
+            "address": "0xa68bEA62Dc4034A689AA0F58A76681433caCa663",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xa68bEA62Dc4034A689AA0F58A76681433caCa663",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0xa68bEA62Dc4034A689AA0F58A76681433caCa663",
+              "contractname": "AugustusRegistry",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xa68bEA62Dc4034A689AA0F58A76681433caCa663/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 3,
+                  "high": 0,
+                  "informational": 5,
+                  "low": 4,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 103,
+                "scan_time_taken": 0,
+                "score": "4.22",
+                "score_v2": "84.47",
+                "threat_score": "88.89"
+              }
+            }
+          },
+          {
+            "address": "0xeF13101C5bbD737cFb2bF00Bbd38c626AD6952F7",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xeF13101C5bbD737cFb2bF00Bbd38c626AD6952F7",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0xeF13101C5bbD737cFb2bF00Bbd38c626AD6952F7",
+              "contractname": "FeeClaimer",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xeF13101C5bbD737cFb2bF00Bbd38c626AD6952F7/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 18,
+                  "high": 0,
+                  "informational": 1,
+                  "low": 8,
+                  "medium": 1
+                },
+                "lines_analyzed_count": 149,
+                "scan_time_taken": 0,
+                "score": "3.72",
+                "score_v2": "74.50",
+                "threat_score": "94.74"
+              }
+            }
+          }
+        ]
+      },
+      "10": {
+        "overallInfo": {
+          "verifiedNumber": 3,
+          "totalContractsNumber": 4,
+          "solidityScanContractsNumber": 3,
+          "securityScore": 75.44333333333333,
+          "issueSeverityDistribution": {
+            "critical": 4,
+            "gas": 29,
+            "high": 4,
+            "informational": 20,
+            "low": 20,
+            "medium": 2
+          }
+        },
+        "contractsData": [
+          {
+            "address": "0xDEF171Fe48CF0115B1d80b88dc8eAB59176FEe57",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xDEF171Fe48CF0115B1d80b88dc8eAB59176FEe57",
+              "contract_chain": "optimism",
+              "contract_platform": "blockscout",
+              "contract_url": "https://optimism.blockscout.com/address/0xDEF171Fe48CF0115B1d80b88dc8eAB59176FEe57",
+              "contractname": "AugustusSwapper",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xDEF171Fe48CF0115B1d80b88dc8eAB59176FEe57/blockscout/optimism?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 8,
+                  "high": 4,
+                  "informational": 7,
+                  "low": 8,
+                  "medium": 1
+                },
+                "lines_analyzed_count": 180,
+                "scan_time_taken": 1,
+                "score": "3.61",
+                "score_v2": "72.22",
+                "threat_score": "73.68"
+              }
+            }
+          },
+          {
+            "address": "0x216B4B4Ba9F3e719726886d34a177484278Bfcae",
+            "isVerified": false,
+            "solidityScanReport": null
+          },
+          {
+            "address": "0x6e7bE86000dF697facF4396efD2aE2C322165dC3",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x6e7bE86000dF697facF4396efD2aE2C322165dC3",
+              "contract_chain": "optimism",
+              "contract_platform": "blockscout",
+              "contract_url": "https://optimism.blockscout.com/address/0x6e7bE86000dF697facF4396efD2aE2C322165dC3",
+              "contractname": "AugustusRegistry",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x6e7bE86000dF697facF4396efD2aE2C322165dC3/blockscout/optimism?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 3,
+                  "high": 0,
+                  "informational": 5,
+                  "low": 4,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 102,
+                "scan_time_taken": 0,
+                "score": "4.22",
+                "score_v2": "84.31",
+                "threat_score": "88.89"
+              }
+            }
+          },
+          {
+            "address": "0xA7465CCD97899edcf11C56D2d26B49125674e45F",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xA7465CCD97899edcf11C56D2d26B49125674e45F",
+              "contract_chain": "optimism",
+              "contract_platform": "blockscout",
+              "contract_url": "https://optimism.blockscout.com/address/0xA7465CCD97899edcf11C56D2d26B49125674e45F",
+              "contractname": "FeeClaimer",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xA7465CCD97899edcf11C56D2d26B49125674e45F/blockscout/optimism?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 18,
+                  "high": 0,
+                  "informational": 8,
+                  "low": 8,
+                  "medium": 1
+                },
+                "lines_analyzed_count": 149,
+                "scan_time_taken": 1,
+                "score": "3.49",
+                "score_v2": "69.80",
+                "threat_score": "94.74"
+              }
+            }
+          }
+        ]
+      },
+      "8453": {
+        "overallInfo": {
+          "verifiedNumber": 1,
+          "totalContractsNumber": 4,
+          "solidityScanContractsNumber": 1,
+          "securityScore": 73.33,
+          "issueSeverityDistribution": {
+            "critical": 4,
+            "gas": 8,
+            "high": 4,
+            "informational": 5,
+            "low": 8,
+            "medium": 1
+          }
+        },
+        "contractsData": [
+          {
+            "address": "0x59C7C832e96D2568bea6db468C1aAdcbbDa08A52",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x59C7C832e96D2568bea6db468C1aAdcbbDa08A52",
+              "contract_chain": "base",
+              "contract_platform": "blockscout",
+              "contract_url": "https://base.blockscout.com/address/0x59C7C832e96D2568bea6db468C1aAdcbbDa08A52",
+              "contractname": "AugustusSwapper",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x59C7C832e96D2568bea6db468C1aAdcbbDa08A52/blockscout/base?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 8,
+                  "high": 4,
+                  "informational": 5,
+                  "low": 8,
+                  "medium": 1
+                },
+                "lines_analyzed_count": 180,
+                "scan_time_taken": 1,
+                "score": "3.67",
+                "score_v2": "73.33",
+                "threat_score": "73.68"
+              }
+            }
+          },
+          {
+            "address": "0x93aAAe79a53759cD164340E4C8766E4Db5331cD7",
+            "isVerified": false,
+            "solidityScanReport": null
+          },
+          {
+            "address": "0x7e31b336f9e8ba52ba3c4ac861b033ba90900bb3",
+            "isVerified": false,
+            "solidityScanReport": null
+          },
+          {
+            "address": "0x9aaB4B24541af30fD72784ED98D8756ac0eFb3C7",
+            "isVerified": false,
+            "solidityScanReport": null
+          }
+        ]
+      }
+    }
+  },
+  {
+    "appName": "mean-finance",
+    "doc": "https://docs.mean.finance/guides/smart-contract-registry",
+    "chainsData": {
+      "1": {
+        "overallInfo": {
+          "verifiedNumber": 4,
+          "totalContractsNumber": 6,
+          "solidityScanContractsNumber": 4,
+          "securityScore": 61.36750000000001,
+          "issueSeverityDistribution": {
+            "critical": 6,
+            "gas": 25,
+            "high": 1,
+            "informational": 10,
+            "low": 20,
+            "medium": 3
+          }
+        },
+        "contractsData": [
+          {
+            "address": "0xA5AdC5484f9997fBF7D405b9AA62A7d88883C345",
+            "isVerified": false,
+            "solidityScanReport": null
+          },
+          {
+            "address": "0x20bdAE1413659f47416f769a4B27044946bc9923",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x20bdAE1413659f47416f769a4B27044946bc9923",
+              "contract_chain": "optimism",
+              "contract_platform": "blockscout",
+              "contract_url": "https://optimism.blockscout.com/address/0x20bdAE1413659f47416f769a4B27044946bc9923",
+              "contractname": "DCAPermissionsManager",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x20bdAE1413659f47416f769a4B27044946bc9923/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 2,
+                  "gas": 22,
+                  "high": 0,
+                  "informational": 8,
+                  "low": 11,
+                  "medium": 3
+                },
+                "lines_analyzed_count": 314,
+                "scan_time_taken": 1,
+                "score": "3.87",
+                "score_v2": "77.39",
+                "threat_score": "88.89"
+              }
+            }
+          },
+          {
+            "address": "0xDf0dbc66f85979a1d54671c4D9e439F306Be27EE",
+            "isVerified": false,
+            "solidityScanReport": null
+          },
+          {
+            "address": "0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b",
+              "contractname": "DCAHubPositionDescriptor",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 1,
+                  "informational": 2,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 280,
+                "scan_time_taken": 1,
+                "score": "4.77",
+                "score_v2": "95.36",
+                "threat_score": "100.00"
+              }
+            }
+          },
+          {
+            "address": "0x49c590F6a2dfB0f809E82B9e2BF788C0Dd1c31f9",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x49c590F6a2dfB0f809E82B9e2BF788C0Dd1c31f9",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0x49c590F6a2dfB0f809E82B9e2BF788C0Dd1c31f9",
+              "contractname": "DCAHubCompanion",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x49c590F6a2dfB0f809E82B9e2BF788C0Dd1c31f9/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 0,
+                  "informational": 0,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 11,
+                "scan_time_taken": 0,
+                "score": "1.82",
+                "score_v2": "36.36",
+                "threat_score": "100.00"
+              }
+            }
+          },
+          {
+            "address": "0x5ad2fED59E8DF461c6164c31B4267Efb7cBaF9C0",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x5ad2fED59E8DF461c6164c31B4267Efb7cBaF9C0",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0x5ad2fED59E8DF461c6164c31B4267Efb7cBaF9C0",
+              "contractname": "DCAHubCompanion",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x5ad2fED59E8DF461c6164c31B4267Efb7cBaF9C0/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 0,
+                  "informational": 0,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 11,
+                "scan_time_taken": 0,
+                "score": "1.82",
+                "score_v2": "36.36",
+                "threat_score": "100.00"
+              }
+            }
+          }
+        ]
+      },
+      "10": {
+        "overallInfo": {
+          "verifiedNumber": 5,
+          "totalContractsNumber": 6,
+          "solidityScanContractsNumber": 5,
+          "securityScore": 66.986,
+          "issueSeverityDistribution": {
+            "critical": 6,
+            "gas": 26,
+            "high": 1,
+            "informational": 10,
+            "low": 23,
+            "medium": 3
+          }
+        },
+        "contractsData": [
+          {
+            "address": "0xA5AdC5484f9997fBF7D405b9AA62A7d88883C345",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xA5AdC5484f9997fBF7D405b9AA62A7d88883C345",
+              "contract_chain": "optimism",
+              "contract_platform": "blockscout",
+              "contract_url": "https://optimism.blockscout.com/address/0xA5AdC5484f9997fBF7D405b9AA62A7d88883C345",
+              "contractname": "DCAHub",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xA5AdC5484f9997fBF7D405b9AA62A7d88883C345/blockscout/optimism?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 0,
+                  "informational": 0,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 23,
+                "scan_time_taken": 0,
+                "score": "3.48",
+                "score_v2": "69.57",
+                "threat_score": "94.44"
+              }
+            }
+          },
+          {
+            "address": "0x20bdAE1413659f47416f769a4B27044946bc9923",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x20bdAE1413659f47416f769a4B27044946bc9923",
+              "contract_chain": "optimism",
+              "contract_platform": "blockscout",
+              "contract_url": "https://optimism.blockscout.com/address/0x20bdAE1413659f47416f769a4B27044946bc9923",
+              "contractname": "DCAPermissionsManager",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x20bdAE1413659f47416f769a4B27044946bc9923/blockscout/optimism?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 2,
+                  "gas": 22,
+                  "high": 0,
+                  "informational": 8,
+                  "low": 11,
+                  "medium": 3
+                },
+                "lines_analyzed_count": 314,
+                "scan_time_taken": 1,
+                "score": "3.87",
+                "score_v2": "77.39",
+                "threat_score": "88.89"
+              }
+            }
+          },
+          {
+            "address": "0xDf0dbc66f85979a1d54671c4D9e439F306Be27EE",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xDf0dbc66f85979a1d54671c4D9e439F306Be27EE",
+              "contract_chain": "optimism",
+              "contract_platform": "blockscout",
+              "contract_url": "https://optimism.blockscout.com/address/0xDf0dbc66f85979a1d54671c4D9e439F306Be27EE",
+              "contractname": "DCAHubCompanion",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xDf0dbc66f85979a1d54671c4D9e439F306Be27EE/blockscout/optimism?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 0,
+                  "informational": 0,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 16,
+                "scan_time_taken": 0,
+                "score": "2.81",
+                "score_v2": "56.25",
+                "threat_score": "100.00"
+              }
+            }
+          },
+          {
+            "address": "0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b",
+              "contractname": "DCAHubPositionDescriptor",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b/blockscout/optimism?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 1,
+                  "informational": 2,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 280,
+                "scan_time_taken": 1,
+                "score": "4.77",
+                "score_v2": "95.36",
+                "threat_score": "100.00"
+              }
+            }
+          },
+          {
+            "address": "0x49c590F6a2dfB0f809E82B9e2BF788C0Dd1c31f9",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x49c590F6a2dfB0f809E82B9e2BF788C0Dd1c31f9",
+              "contract_chain": "optimism",
+              "contract_platform": "blockscout",
+              "contract_url": "https://optimism.blockscout.com/address/0x49c590F6a2dfB0f809E82B9e2BF788C0Dd1c31f9",
+              "contractname": "DCAHubCompanion",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x49c590F6a2dfB0f809E82B9e2BF788C0Dd1c31f9/blockscout/optimism?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 0,
+                  "informational": 0,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 11,
+                "scan_time_taken": 0,
+                "score": "1.82",
+                "score_v2": "36.36",
+                "threat_score": "100.00"
+              }
+            }
+          },
+          {
+            "address": "0x5ad2fED59E8DF461c6164c31B4267Efb7cBaF9C0",
+            "isVerified": false,
+            "solidityScanReport": null
+          }
+        ]
+      },
+      "8453": {
+        "overallInfo": {
+          "verifiedNumber": 4,
+          "totalContractsNumber": 6,
+          "solidityScanContractsNumber": 4,
+          "securityScore": 74.88,
+          "issueSeverityDistribution": {
+            "critical": 6,
+            "gas": 25,
+            "high": 1,
+            "informational": 7,
+            "low": 20,
+            "medium": 3
+          }
+        },
+        "contractsData": [
+          {
+            "address": "0xA5AdC5484f9997fBF7D405b9AA62A7d88883C345",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xA5AdC5484f9997fBF7D405b9AA62A7d88883C345",
+              "contract_chain": "base",
+              "contract_platform": "blockscout",
+              "contract_url": "https://base.blockscout.com/address/0xA5AdC5484f9997fBF7D405b9AA62A7d88883C345",
+              "contractname": "DCAHub",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xA5AdC5484f9997fBF7D405b9AA62A7d88883C345/blockscout/base?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 0,
+                  "informational": 0,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 23,
+                "scan_time_taken": 0,
+                "score": "3.48",
+                "score_v2": "69.57",
+                "threat_score": "94.44"
+              }
+            }
+          },
+          {
+            "address": "0x20bdAE1413659f47416f769a4B27044946bc9923",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x20bdAE1413659f47416f769a4B27044946bc9923",
+              "contract_chain": "base",
+              "contract_platform": "blockscout",
+              "contract_url": "https://base.blockscout.com/address/0x20bdAE1413659f47416f769a4B27044946bc9923",
+              "contractname": "DCAPermissionsManager",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x20bdAE1413659f47416f769a4B27044946bc9923/blockscout/base?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 2,
+                  "gas": 22,
+                  "high": 0,
+                  "informational": 5,
+                  "low": 11,
+                  "medium": 3
+                },
+                "lines_analyzed_count": 314,
+                "scan_time_taken": 1,
+                "score": "3.92",
+                "score_v2": "78.34",
+                "threat_score": "88.89"
+              }
+            }
+          },
+          {
+            "address": "0xDf0dbc66f85979a1d54671c4D9e439F306Be27EE",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xDf0dbc66f85979a1d54671c4D9e439F306Be27EE",
+              "contract_chain": "base",
+              "contract_platform": "blockscout",
+              "contract_url": "https://base.blockscout.com/address/0xDf0dbc66f85979a1d54671c4D9e439F306Be27EE",
+              "contractname": "DCAHubCompanion",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xDf0dbc66f85979a1d54671c4D9e439F306Be27EE/blockscout/base?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 0,
+                  "informational": 0,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 16,
+                "scan_time_taken": 0,
+                "score": "2.81",
+                "score_v2": "56.25",
+                "threat_score": "100.00"
+              }
+            }
+          },
+          {
+            "address": "0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b",
+              "contractname": "DCAHubPositionDescriptor",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x4ACd4BC402bc8e6BA8aBDdcA639d8011ef0b8a4b/blockscout/base?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 1,
+                  "high": 1,
+                  "informational": 2,
+                  "low": 3,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 280,
+                "scan_time_taken": 1,
+                "score": "4.77",
+                "score_v2": "95.36",
+                "threat_score": "100.00"
+              }
+            }
+          },
+          {
+            "address": "0x49c590F6a2dfB0f809E82B9e2BF788C0Dd1c31f9",
+            "isVerified": false,
+            "solidityScanReport": null
+          },
+          {
+            "address": "0x5ad2fED59E8DF461c6164c31B4267Efb7cBaF9C0",
+            "isVerified": false,
+            "solidityScanReport": null
+          }
+        ]
+      }
+    }
+  },
+  {
+    "appName": "cow-swap",
+    "doc": "https://docs.cow.fi/cow-protocol/reference/contracts/core#deployments",
+    "chainsData": {
+      "1": {
+        "overallInfo": {
+          "verifiedNumber": 3,
+          "totalContractsNumber": 3,
+          "solidityScanContractsNumber": 3,
+          "securityScore": 87.60000000000001,
+          "issueSeverityDistribution": {
+            "critical": 4,
+            "gas": 18,
+            "high": 0,
+            "informational": 13,
+            "low": 14,
+            "medium": 3
+          }
+        },
+        "contractsData": [
+          {
+            "address": "0x9008D19f58AAbD9eD0D60971565AA8510560ab41",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x9008D19f58AAbD9eD0D60971565AA8510560ab41",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0x9008D19f58AAbD9eD0D60971565AA8510560ab41",
+              "contractname": "GPv2Settlement",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x9008D19f58AAbD9eD0D60971565AA8510560ab41/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 16,
+                  "high": 0,
+                  "informational": 7,
+                  "low": 5,
+                  "medium": 3
+                },
+                "lines_analyzed_count": 493,
+                "scan_time_taken": 1,
+                "score": "4.57",
+                "score_v2": "91.48",
+                "threat_score": "94.74"
+              }
+            }
+          },
+          {
+            "address": "0x2c4c28DDBdAc9C5E7055b4C863b72eA0149D8aFE",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x2c4c28DDBdAc9C5E7055b4C863b72eA0149D8aFE",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0x2c4c28DDBdAc9C5E7055b4C863b72eA0149D8aFE",
+              "contractname": "EIP173Proxy",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x2c4c28DDBdAc9C5E7055b4C863b72eA0149D8aFE/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 0,
+                  "high": 0,
+                  "informational": 4,
+                  "low": 5,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 94,
+                "scan_time_taken": 0,
+                "score": "4.26",
+                "score_v2": "85.11",
+                "threat_score": "88.89"
+              }
+            }
+          },
+          {
+            "address": "0xC92E8bdf79f0507f65a392b0ab4667716BFE0110",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xC92E8bdf79f0507f65a392b0ab4667716BFE0110",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0xC92E8bdf79f0507f65a392b0ab4667716BFE0110",
+              "contractname": "GPv2VaultRelayer",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xC92E8bdf79f0507f65a392b0ab4667716BFE0110/blockscout/eth?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 2,
+                  "high": 0,
+                  "informational": 2,
+                  "low": 4,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 87,
+                "scan_time_taken": 0,
+                "score": "4.31",
+                "score_v2": "86.21",
+                "threat_score": "94.74"
+              }
+            }
+          }
+        ]
+      },
+      "100": {
+        "overallInfo": {
+          "verifiedNumber": 3,
+          "totalContractsNumber": 3,
+          "solidityScanContractsNumber": 3,
+          "securityScore": 87.60000000000001,
+          "issueSeverityDistribution": {
+            "critical": 4,
+            "gas": 18,
+            "high": 0,
+            "informational": 13,
+            "low": 14,
+            "medium": 3
+          }
+        },
+        "contractsData": [
+          {
+            "address": "0x9008D19f58AAbD9eD0D60971565AA8510560ab41",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x9008D19f58AAbD9eD0D60971565AA8510560ab41",
+              "contract_chain": "gnosis",
+              "contract_platform": "blockscout",
+              "contract_url": "https://gnosis.blockscout.com/address/0x9008D19f58AAbD9eD0D60971565AA8510560ab41",
+              "contractname": "GPv2Settlement",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x9008D19f58AAbD9eD0D60971565AA8510560ab41/blockscout/gnosis?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 16,
+                  "high": 0,
+                  "informational": 7,
+                  "low": 5,
+                  "medium": 3
+                },
+                "lines_analyzed_count": 493,
+                "scan_time_taken": 1,
+                "score": "4.57",
+                "score_v2": "91.48",
+                "threat_score": "94.74"
+              }
+            }
+          },
+          {
+            "address": "0x2c4c28DDBdAc9C5E7055b4C863b72eA0149D8aFE",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0x2c4c28DDBdAc9C5E7055b4C863b72eA0149D8aFE",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0x2c4c28DDBdAc9C5E7055b4C863b72eA0149D8aFE",
+              "contractname": "EIP173Proxy",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0x2c4c28DDBdAc9C5E7055b4C863b72eA0149D8aFE/blockscout/gnosis?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 0,
+                  "high": 0,
+                  "informational": 4,
+                  "low": 5,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 94,
+                "scan_time_taken": 0,
+                "score": "4.26",
+                "score_v2": "85.11",
+                "threat_score": "88.89"
+              }
+            }
+          },
+          {
+            "address": "0xC92E8bdf79f0507f65a392b0ab4667716BFE0110",
+            "isVerified": true,
+            "solidityScanReport": {
+              "connection_id": "",
+              "contract_address": "0xC92E8bdf79f0507f65a392b0ab4667716BFE0110",
+              "contract_chain": "eth",
+              "contract_platform": "blockscout",
+              "contract_url": "https://eth.blockscout.com/address/0xC92E8bdf79f0507f65a392b0ab4667716BFE0110",
+              "contractname": "GPv2VaultRelayer",
+              "is_quick_scan": true,
+              "node_reference_id": null,
+              "request_type": "threat_scan",
+              "scanner_reference_url": "https://solidityscan.com/quickscan/0xC92E8bdf79f0507f65a392b0ab4667716BFE0110/blockscout/gnosis?ref=blockscout",
+              "scan_status": "scan_done",
+              "scan_summary": {
+                "issue_severity_distribution": {
+                  "critical": 0,
+                  "gas": 2,
+                  "high": 0,
+                  "informational": 2,
+                  "low": 4,
+                  "medium": 0
+                },
+                "lines_analyzed_count": 87,
+                "scan_time_taken": 0,
+                "score": "4.31",
+                "score_v2": "86.21",
+                "threat_score": "94.74"
+              }
+            }
+          }
+        ]
+      }
+    }
+  }
+]
diff --git a/deploy/values/l2-optimism-goerli/values.yaml b/deploy/values/l2-optimism-goerli/values.yaml
index 1d695580d4..afd8dcc1a0 100644
--- a/deploy/values/l2-optimism-goerli/values.yaml
+++ b/deploy/values/l2-optimism-goerli/values.yaml
@@ -179,9 +179,12 @@ frontend:
     NEXT_PUBLIC_NETWORK_LOGO: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/base.svg
     NEXT_PUBLIC_NETWORK_ICON: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/base.svg
     NEXT_PUBLIC_FEATURED_NETWORKS: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/featured-networks/base-goerli.json
+    NEXT_PUBLIC_MARKETPLACE_ENABLED: true
     NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM: https://airtable.com/shrqUAcjgGJ4jU88C
+    NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM: https://airtable.com/appiy5yijZpMMSKjT/pag3t82DUCyhGRZZO/form
     NEXT_PUBLIC_LOGOUT_URL: https://blockscoutcom.us.auth0.com/v2/logout
     NEXT_PUBLIC_MARKETPLACE_CONFIG_URL: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace/base-goerli.json
+    NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace-categories/default.json
     NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND: "linear-gradient(136.9deg,rgb(107 94 236) 1.5%,rgb(0 82 255) 56.84%,rgb(82 62 231) 98.54%)"
     NEXT_PUBLIC_NETWORK_RPC_URL: https://goerli.optimism.io
     NEXT_PUBLIC_WEB3_WALLETS: "['coinbase']"
@@ -190,10 +193,11 @@ frontend:
     NEXT_PUBLIC_VISUALIZE_API_HOST: https://visualizer-test.k8s-dev.blockscout.com
     NEXT_PUBLIC_CONTRACT_INFO_API_HOST: https://contracts-info-test.k8s-dev.blockscout.com
     NEXT_PUBLIC_ADMIN_SERVICE_API_HOST: https://admin-rs-test.k8s-dev.blockscout.com
-    NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK: "true"
-    NEXT_PUBLIC_L1_BASE_URL: https://eth-goerli.blockscout.com/
-    NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL: https://app.optimism.io/bridge/withdraw
+    NEXT_PUBLIC_ROLLUP_TYPE: optimistic
+    NEXT_PUBLIC_ROLLUP_L1_BASE_URL: https://eth-goerli.blockscout.com/
+    NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL: https://app.optimism.io/bridge/withdraw
     NEXT_PUBLIC_GRAPHIQL_TRANSACTION: 0x4a0ed8ddf751a7cb5297f827699117b0f6d21a0b2907594d300dc9fed75c7e62
+    NEXT_PUBLIC_SWAP_BUTTON_URL: sushiswap
   envFromSecret:
     NEXT_PUBLIC_AUTH0_CLIENT_ID: ref+vault://deployment-values/blockscout/dev/front-main?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_AUTH0_CLIENT_ID
     NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID: ref+vault://deployment-values/blockscout/dev/front-main?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID
diff --git a/deploy/values/main/values.yaml b/deploy/values/main/values.yaml
index 65f36f4dcd..493941ad0a 100644
--- a/deploy/values/main/values.yaml
+++ b/deploy/values/main/values.yaml
@@ -78,7 +78,9 @@ blockscout:
     INDEXER_DISABLE_EMPTY_BLOCKS_SANITIZER: 'true'
     INDEXER_DISABLE_PENDING_TRANSACTIONS_FETCHER: 'true'
     INDEXER_RECEIPTS_BATCH_SIZE: 50
-    INDEXER_COIN_BALANCES_BATCH_SIZE: 50
+    INDEXER_COIN_BALANCES_BATCH_SIZE: 10
+    INDEXER_TOKEN_BALANCES_BATCH_SIZE: 15
+    INDEXER_TOKEN_BALANCES_CONCURRENCY: 4
     DISABLE_EXCHANGE_RATES: 'true'
     DISABLE_INDEXER: 'false'
     FIRST_BLOCK: '8739119'
@@ -146,20 +148,26 @@ frontend:
     NEXT_PUBLIC_NETWORK_ICON: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/goerli.svg
 
     NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE: validation
+    NEXT_PUBLIC_MARKETPLACE_ENABLED: true
     NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM: https://airtable.com/shrqUAcjgGJ4jU88C
+    NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM: https://airtable.com/appiy5yijZpMMSKjT/pag3t82DUCyhGRZZO/form
     NEXT_PUBLIC_APP_ENV: development
     NEXT_PUBLIC_APP_INSTANCE: main
     NEXT_PUBLIC_STATS_API_HOST: https://stats-test.k8s-dev.blockscout.com/
     NEXT_PUBLIC_VISUALIZE_API_HOST: http://visualizer-svc.visualizer-testing.svc.cluster.local/
     NEXT_PUBLIC_CONTRACT_INFO_API_HOST: https://contracts-info-test.k8s-dev.blockscout.com
     NEXT_PUBLIC_ADMIN_SERVICE_API_HOST: https://admin-rs-test.k8s-dev.blockscout.com
+    NEXT_PUBLIC_NAME_SERVICE_API_HOST: https://bens-rs-test.k8s-dev.blockscout.com
     NEXT_PUBLIC_LOGOUT_URL: https://blockscoutcom.us.auth0.com/v2/logout
     NEXT_PUBLIC_NETWORK_RPC_URL: https://rpc.ankr.com/eth_goerli
     NEXT_PUBLIC_HOMEPAGE_CHARTS: "['daily_txs','coin_price','market_cap']"
     NEXT_PUBLIC_MARKETPLACE_CONFIG_URL: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace/eth-goerli.json
+    NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace-categories/default.json
     NEXT_PUBLIC_GRAPHIQL_TRANSACTION: 0xf7d4972356e6ae44ae948d0cf19ef2beaf0e574c180997e969a2837da15e349d
     NEXT_PUBLIC_WEB3_WALLETS: "['token_pocket','coinbase','metamask']"
     NEXT_PUBLIC_VIEWS_NFT_MARKETPLACES: "[{'name':'LooksRare','collection_url':'https://goerli.looksrare.org/collections/{hash}','instance_url':'https://goerli.looksrare.org/collections/{hash}/{id}','logo_url':'https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/nft-marketplace-logos/looks-rare.png'}]"
+    NEXT_PUBLIC_CONTRACT_CODE_IDES: "[{'title':'Remix IDE','url':'https://remix.blockscout.com/?address={hash}&blockscout=eth-goerli.blockscout.com','icon_url':'https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/ide-icons/remix.png'}]"
+    NEXT_PUBLIC_SWAP_BUTTON_URL: uniswap
   envFromSecret:
     NEXT_PUBLIC_SENTRY_DSN: ref+vault://deployment-values/blockscout/dev/front-main?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_SENTRY_DSN
     SENTRY_CSP_REPORT_URI: ref+vault://deployment-values/blockscout/dev/front-main?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/SENTRY_CSP_REPORT_URI
diff --git a/deploy/values/review-l2/values.yaml.gotmpl b/deploy/values/review-l2/values.yaml.gotmpl
index e55c460edf..eea25de5e8 100644
--- a/deploy/values/review-l2/values.yaml.gotmpl
+++ b/deploy/values/review-l2/values.yaml.gotmpl
@@ -30,10 +30,12 @@ frontend:
       kubernetes.io/ingress.class: internal-and-public
       nginx.ingress.kubernetes.io/proxy-body-size: 500m
       nginx.ingress.kubernetes.io/client-max-body-size: "500M"
-      nginx.ingress.kubernetes.io/proxy-buffering: "off"
+      nginx.ingress.kubernetes.io/proxy-buffering: "on"
       nginx.ingress.kubernetes.io/proxy-connect-timeout: "15m"
       nginx.ingress.kubernetes.io/proxy-send-timeout: "15m"
       nginx.ingress.kubernetes.io/proxy-read-timeout: "15m"
+      nginx.ingress.kubernetes.io/proxy-buffer-size: "128k"
+      nginx.ingress.kubernetes.io/proxy-buffers-number: "8"
       cert-manager.io/cluster-issuer: "zerossl-prod"
     hostname: review-l2-{{ requiredEnv "GITHUB_REF_NAME_SLUG" }}.k8s-dev.blockscout.com
 
@@ -52,10 +54,13 @@ frontend:
     NEXT_PUBLIC_NETWORK_ICON: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/base.svg
     NEXT_PUBLIC_FEATURED_NETWORKS: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/featured-networks/base-goerli.json
     NEXT_PUBLIC_API_HOST: blockscout-optimism-goerli.k8s-dev.blockscout.com
+    NEXT_PUBLIC_MARKETPLACE_ENABLED: true
     NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM: https://airtable.com/shrqUAcjgGJ4jU88C
+    NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM: https://airtable.com/appiy5yijZpMMSKjT/pag3t82DUCyhGRZZO/form
     NEXT_PUBLIC_LOGOUT_URL: https://blockscoutcom.us.auth0.com/v2/logout
     NEXT_PUBLIC_STATS_API_HOST: https://stats-optimism-goerli.k8s-dev.blockscout.com
     NEXT_PUBLIC_MARKETPLACE_CONFIG_URL: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace/base-goerli.json
+    NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace-categories/default.json
     NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND: "linear-gradient(136.9deg,rgb(107 94 236) 1.5%,rgb(0 82 255) 56.84%,rgb(82 62 231) 98.54%)"
     NEXT_PUBLIC_NETWORK_RPC_URL: https://goerli.optimism.io
     NEXT_PUBLIC_WEB3_WALLETS: "['coinbase']"
@@ -64,11 +69,12 @@ frontend:
     NEXT_PUBLIC_VISUALIZE_API_HOST: https://visualizer-optimism-goerli.k8s-dev.blockscout.com
     NEXT_PUBLIC_CONTRACT_INFO_API_HOST: https://contracts-info-test.k8s-dev.blockscout.com
     NEXT_PUBLIC_ADMIN_SERVICE_API_HOST: https://admin-rs-test.k8s-dev.blockscout.com
-    NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK: "true"
-    NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL: https://app.optimism.io/bridge/withdraw
-    NEXT_PUBLIC_L1_BASE_URL: https://blockscout-main.k8s-dev.blockscout.com
+    NEXT_PUBLIC_ROLLUP_TYPE=optimistic
+    NEXT_PUBLIC_ROLLUP_L1_BASE_URL=https://blockscout-main.k8s-dev.blockscout.com
+    NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL=https://app.optimism.io/bridge/withdraw
     NEXT_PUBLIC_GRAPHIQL_TRANSACTION: 0x4a0ed8ddf751a7cb5297f827699117b0f6d21a0b2907594d300dc9fed75c7e62
     NEXT_PUBLIC_USE_NEXT_JS_PROXY: true
+    NEXT_PUBLIC_SWAP_BUTTON_URL: sushiswap
   envFromSecret:
     NEXT_PUBLIC_SENTRY_DSN: ref+vault://deployment-values/blockscout/dev/review-l2?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_SENTRY_DSN
     SENTRY_CSP_REPORT_URI: ref+vault://deployment-values/blockscout/dev/review-l2?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/SENTRY_CSP_REPORT_URI
diff --git a/deploy/values/review/values.yaml.gotmpl b/deploy/values/review/values.yaml.gotmpl
index dbfd815a82..7f6418f43f 100644
--- a/deploy/values/review/values.yaml.gotmpl
+++ b/deploy/values/review/values.yaml.gotmpl
@@ -4,7 +4,7 @@ imagePullSecrets:
   - name: regcred
 config:
   network:
-    id: 5
+    id: 11155111
     name: Blockscout
     shortname: Blockscout
     currency:
@@ -30,10 +30,12 @@ frontend:
       kubernetes.io/ingress.class: internal-and-public
       nginx.ingress.kubernetes.io/proxy-body-size: 500m
       nginx.ingress.kubernetes.io/client-max-body-size: "500M"
-      nginx.ingress.kubernetes.io/proxy-buffering: "off"
+      nginx.ingress.kubernetes.io/proxy-buffering: "on"
       nginx.ingress.kubernetes.io/proxy-connect-timeout: "15m"
       nginx.ingress.kubernetes.io/proxy-send-timeout: "15m"
       nginx.ingress.kubernetes.io/proxy-read-timeout: "15m"
+      nginx.ingress.kubernetes.io/proxy-buffer-size: "128k"
+      nginx.ingress.kubernetes.io/proxy-buffers-number: "8"
       cert-manager.io/cluster-issuer: "zerossl-prod"
     hostname: review-{{ requiredEnv "GITHUB_REF_NAME_SLUG" }}.k8s-dev.blockscout.com
 
@@ -51,18 +53,24 @@ frontend:
     NEXT_PUBLIC_FEATURED_NETWORKS: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/featured-networks/eth-goerli.json
     NEXT_PUBLIC_NETWORK_LOGO: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/goerli.svg
     NEXT_PUBLIC_NETWORK_ICON: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/goerli.svg
-    NEXT_PUBLIC_API_HOST: eth-goerli.blockscout.com
+    NEXT_PUBLIC_API_HOST: eth-sepolia.blockscout.com
     NEXT_PUBLIC_STATS_API_HOST: https://stats-goerli.k8s-dev.blockscout.com/
     NEXT_PUBLIC_VISUALIZE_API_HOST: http://visualizer-svc.visualizer-testing.svc.cluster.local/
     NEXT_PUBLIC_CONTRACT_INFO_API_HOST: https://contracts-info-test.k8s-dev.blockscout.com
     NEXT_PUBLIC_ADMIN_SERVICE_API_HOST: https://admin-rs-test.k8s-dev.blockscout.com
+    NEXT_PUBLIC_NAME_SERVICE_API_HOST: https://bens-rs-test.k8s-dev.blockscout.com
     NEXT_PUBLIC_AUTH_URL: https://blockscout-main.k8s-dev.blockscout.com
+    NEXT_PUBLIC_MARKETPLACE_ENABLED: true
+    NEXT_PUBLIC_MARKETPLACE_CONFIG_URL: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace/eth-goerli.json
     NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM: https://airtable.com/shrqUAcjgGJ4jU88C
+    NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM: https://airtable.com/appiy5yijZpMMSKjT/pag3t82DUCyhGRZZO/form
+    NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL: https://gist.githubusercontent.com/maxaleks/ce5c7e3de53e8f5b240b88265daf5839/raw/328383c958a8f7ecccf6d50c953bcdf8ab3faa0a/security_reports_goerli_test.json
     NEXT_PUBLIC_LOGOUT_URL: https://blockscoutcom.us.auth0.com/v2/logout
     NEXT_PUBLIC_HOMEPAGE_CHARTS: "['daily_txs','coin_price','market_cap']"
-    NEXT_PUBLIC_NETWORK_RPC_URL: https://rpc.ankr.com/eth_goerli
-    NEXT_PUBLIC_NETWORK_EXPLORERS: "[{'title':'Bitquery','baseUrl':'https://explorer.bitquery.io/','paths':{'tx':'/goerli/tx','address':'/goerli/address','token':'/goerli/token','block':'/goerli/block'}},{'title':'Etherscan','baseUrl':'https://goerli.etherscan.io/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}]"
-    NEXT_PUBLIC_MARKETPLACE_CONFIG_URL: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace/eth-goerli.json
+    NEXT_PUBLIC_NETWORK_RPC_URL: https://eth-sepolia.public.blastapi.io
+    NEXT_PUBLIC_NETWORK_ID: '11155111'
+    NEXT_PUBLIC_NETWORK_EXPLORERS: "[{'title':'Bitquery','baseUrl':'https://explorer.bitquery.io/','paths':{'tx':'/goerli/tx','address':'/goerli/address','token':'/goerli/token','block':'/goerli/block'}},{'title':'Etherscan','logo':'https://github.com/blockscout/frontend-configs/blob/main/configs/explorer-logos/etherscan.png?raw=true','baseUrl':'https://goerli.etherscan.io/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}]"
+    NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL: https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/marketplace-categories/default.json
     NEXT_PUBLIC_GRAPHIQL_TRANSACTION: 0xf7d4972356e6ae44ae948d0cf19ef2beaf0e574c180997e969a2837da15e349d
     NEXT_PUBLIC_WEB3_WALLETS: "['token_pocket','coinbase','metamask']"
     NEXT_PUBLIC_VIEWS_ADDRESS_IDENTICON_TYPE: gradient_avatar
@@ -72,9 +80,16 @@ frontend:
     NEXT_PUBLIC_VIEWS_TX_ADDITIONAL_FIELDS: "['fee_per_gas']"
     NEXT_PUBLIC_USE_NEXT_JS_PROXY: true
     NEXT_PUBLIC_VIEWS_NFT_MARKETPLACES: "[{'name':'LooksRare','collection_url':'https://goerli.looksrare.org/collections/{hash}','instance_url':'https://goerli.looksrare.org/collections/{hash}/{id}','logo_url':'https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/nft-marketplace-logos/looks-rare.png'}]"
-    OTEL_SDK_ENABLED: true
-    OTEL_EXPORTER_OTLP_ENDPOINT: http://jaeger-collector.jaeger.svc.cluster.local:4318
-    NEXT_OTEL_VERBOSE: 1
+    NEXT_PUBLIC_HAS_USER_OPS: true
+    NEXT_PUBLIC_CONTRACT_CODE_IDES: "[{'title':'Remix IDE','url':'https://remix.blockscout.com/?address={hash}&blockscout=eth-goerli.blockscout.com','icon_url':'https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/ide-icons/remix.png'}]"
+    NEXT_PUBLIC_TRANSACTION_INTERPRETATION_PROVIDER: noves
+    NEXT_PUBLIC_SWAP_BUTTON_URL: uniswap
+    NEXT_PUBLIC_HAS_CONTRACT_AUDIT_REPORTS: true
+    NEXT_PUBLIC_AD_BANNER_PROVIDER: getit
+    NEXT_PUBLIC_AD_BANNER_ADDITIONAL_PROVIDER: adbutler
+    NEXT_PUBLIC_AD_ADBUTLER_CONFIG_DESKTOP: "{ \"id\": \"632019\", \"width\": \"728\", \"height\": \"90\" }"
+    NEXT_PUBLIC_AD_ADBUTLER_CONFIG_MOBILE: "{ \"id\": \"632018\", \"width\": \"320\", \"height\": \"100\" }"
+    NEXT_PUBLIC_DATA_AVAILABILITY_ENABLED: true
   envFromSecret:
     NEXT_PUBLIC_SENTRY_DSN: ref+vault://deployment-values/blockscout/dev/review?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_SENTRY_DSN
     SENTRY_CSP_REPORT_URI: ref+vault://deployment-values/blockscout/dev/review?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/SENTRY_CSP_REPORT_URI
@@ -83,3 +98,5 @@ frontend:
     NEXT_PUBLIC_RE_CAPTCHA_APP_SITE_KEY: ref+vault://deployment-values/blockscout/dev/review?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_RE_CAPTCHA_APP_SITE_KEY
     NEXT_PUBLIC_GOOGLE_ANALYTICS_PROPERTY_ID: ref+vault://deployment-values/blockscout/dev/review?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_GOOGLE_ANALYTICS_PROPERTY_ID
     FAVICON_GENERATOR_API_KEY: ref+vault://deployment-values/blockscout/common?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_FAVICON_GENERATOR_API_KEY
+    NEXT_PUBLIC_GROWTH_BOOK_CLIENT_KEY: ref+vault://deployment-values/blockscout/dev/review?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_GROWTH_BOOK_CLIENT_KEY
+    NEXT_PUBLIC_MIXPANEL_PROJECT_TOKEN: ref+vault://deployment-values/blockscout/common?token_env=VAULT_TOKEN&address=https://vault.k8s.blockscout.com#/NEXT_PUBLIC_MIXPANEL_PROJECT_TOKEN
diff --git a/docs/CONTRIBUTING.md b/docs/CONTRIBUTING.md
index 578cbd2129..58dcae80c9 100644
--- a/docs/CONTRIBUTING.md
+++ b/docs/CONTRIBUTING.md
@@ -14,7 +14,7 @@ Thanks for showing interest to contribute to Blockscout. The following steps wil
     cd <fork_name>
     ```
 
-3. Make sure you're running Node.js 18+ and NPM 8+; if not, upgrade it accordingly, for example using [nvm](https://github.com/nvm-sh/nvm).
+3. Make sure you're running Node.js 20+ and NPM 10+; if not, upgrade it accordingly, for example using [nvm](https://github.com/nvm-sh/nvm).
     ```sh
     node -v
     npm -v
@@ -57,7 +57,7 @@ B. Pre-defined configuration:
 
 1. Optionally, clone `.env.example` file into `configs/envs/.env.secrets`. Fill it with necessary secrets for integrating with [external services](./ENVS.md#external-services-configuration). Include only secrets your need.
 2. Choose one of the predefined configurations located in the `/configs/envs` folder.
-3. Start your local dev server using the `yarn dev:<config_name>` command.
+3. Start your local dev server using the `yarn dev:preset <config_preset_name>` command.
 4. Open your browser and navigate to the URL provided in the command line output (by default, it is `http://localhost:3000`).
 
 
@@ -79,18 +79,21 @@ These are the steps that you have to follow to make everything work:
 2. Make sure that you have added a property to React app config (`configs/app/index.ts`) in appropriate section that is associated with this variable; do not use ENV variable values directly in the application code; decide where this variable belongs to and place it under the certain section:
     - `app` - the front-end app itself
     - `api` - the main API configuration
+    - `chain` - the Blockchain parameters
     - `UI` - the app UI customization
+    - `meta` - SEO and meta-tags customization
     - `features` - the particular feature of the app
-    - `services` - some 3rd party service integration which is not related to one particular feature  
-3. For local development purposes add the variable with its appropriate values to pre-defined ENV configs `configs/envs` where it is needed
-4. Add the variable to CI configs where it is needed
+    - `services` - some 3rd party service integration which is not related to one particular feature
+3. If a new variable is meant to store the URL of an external API service, remember to include its value in the Content-Security-Policy document header. Refer to `nextjs/csp/policies/app.ts` for details.
+4. For local development purposes add the variable with its appropriate values to pre-defined ENV configs `configs/envs` where it is needed
+5. Add the variable to CI configs where it is needed
     - `deploy/values/review/values.yaml.gotmpl` - review development environment
     - `deploy/values/main/values.yaml` - main development environment
     - `deploy/values/review-l2/values.yaml.gotmpl` - review development environment for L2 networks
     - `deploy/values/l2-optimism-goerli/values.yaml` - main development environment
-5. If your variable is meant to receive a link to some external resource (image or JSON-config file), extend the array `ASSETS_ENVS` in `deploy/scripts/download_assets.sh` with your variable name
-6. Add validation schema for the new variable into the file `deploy/tools/envs-validator/schema.ts`
-7. Check if modified validation schema is valid by doing the following steps:
+6. If your variable is meant to receive a link to some external resource (image or JSON-config file), extend the array `ASSETS_ENVS` in `deploy/scripts/download_assets.sh` with your variable name
+7. Add validation schema for the new variable into the file `deploy/tools/envs-validator/schema.ts`
+8. Check if modified validation schema is valid by doing the following steps:
     - change your current directory to `deploy/tools/envs-validator`
     - install deps with `yarn` command
     - add your variable into `./test/.env.base` test preset or create a new test preset if needed
@@ -98,7 +101,7 @@ These are the steps that you have to follow to make everything work:
       - add example of file content into `./test/assets` directory; the file name should be constructed by stripping away prefix `NEXT_PUBLIC_` and postfix `_URL` if any, and converting the remaining string to lowercase (for example, `NEXT_PUBLIC_MARKETPLACE_CONFIG_URL` will become `marketplace_config.json`)
       - in the main script `index.ts` extend array `envsWithJsonConfig` with your variable name
     - run `yarn test` command to see the validation result
-8. Don't forget to mention in the PR notes that new ENV variable was added  
+9. Don't forget to mention in the PR notes that new ENV variable was added  
 
 &nbsp;
 
diff --git a/docs/DEPRECATED_ENVS.md b/docs/DEPRECATED_ENVS.md
new file mode 100644
index 0000000000..b46ea04108
--- /dev/null
+++ b/docs/DEPRECATED_ENVS.md
@@ -0,0 +1,9 @@
+# Deprecated environment variables
+
+| Variable | Type | Description | Compulsoriness | Default value | Example value | Deprecated in version | Comment |
+| --- | --- | --- | --- | --- | --- | --- | --- |
+| NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK | `boolean` | Set to true for optimistic L2 solutions | Required | - | `true` | v1.24.0 | Replaced by NEXT_PUBLIC_ROLLUP_TYPE |
+| NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK | `boolean` | Set to true for zkevm L2 solutions  | Required | - | `true` | v1.24.0 | Replaced by NEXT_PUBLIC_ROLLUP_TYPE |
+| NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL | `string` | URL for optimistic L2 -> L1 withdrawals | Required | - | `https://app.optimism.io/bridge/withdraw` | v1.24.0 | Renamed to NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL |
+| NEXT_PUBLIC_L1_BASE_URL | `string` | Blockscout base URL for L1 network | Required | - | `'http://eth-goerli.blockscout.com'` | v1.24.0 | Renamed to NEXT_PUBLIC_ROLLUP_L1_BASE_URL |
+| NEXT_PUBLIC_HOMEPAGE_SHOW_GAS_TRACKER | `boolean` | Set to false if network doesn't have gas tracker | - | `true` | `false` | v1.25.0 | Replaced by NEXT_PUBLIC_GAS_TRACKER_ENABLED |
\ No newline at end of file
diff --git a/docs/ENVS.md b/docs/ENVS.md
index 5398faa46d..3058167161 100644
--- a/docs/ENVS.md
+++ b/docs/ENVS.md
@@ -28,16 +28,18 @@ Please be aware that all environment variables prefixed with `NEXT_PUBLIC_` will
   - [Misc](ENVS.md#misc)
 - [App features](ENVS.md#app-features)
   - [My account](ENVS.md#my-account)
+  - [Gas tracker](ENVS.md#gas-tracker)
   - [Address verification](ENVS.md#address-verification-in-my-account) in "My account"
   - [Blockchain interaction](ENVS.md#blockchain-interaction-writing-to-contract-etc) (writing to contract, etc.)
   - [Banner ads](ENVS.md#banner-ads)
   - [Text ads](ENVS.md#text-ads)
   - [Beacon chain](ENVS.md#beacon-chain)
-  - [Optimistic rollup (L2) chain](ENVS.md#optimistic-rollup-l2-chain)
-  - [ZkEvm rollup (L2) chain](NVS.md#zkevm-rollup-l2-chain)
+  - [User operations](ENVS.md#user-operations-feature-erc-4337)
+  - [Rollup chain](ENVS.md#rollup-chain)
   - [Export data to CSV file](ENVS.md#export-data-to-csv-file)
   - [Google analytics](ENVS.md#google-analytics)
   - [Mixpanel analytics](ENVS.md#mixpanel-analytics)
+  - [GrowthBook feature flagging and A/B testing](ENVS.md#growthbook-feature-flagging-and-ab-testing)
   - [GraphQL API documentation](ENVS.md#graphql-api-documentation)
   - [REST API documentation](ENVS.md#rest-api-documentation)
   - [Marketplace](ENVS.md#marketplace)
@@ -46,11 +48,14 @@ Please be aware that all environment variables prefixed with `NEXT_PUBLIC_` will
   - [Web3 wallet integration](ENVS.md#web3-wallet-integration-add-token-or-network-to-the-wallet) (add token or network to the wallet)
   - [Transaction interpretation](ENVS.md#transaction-interpretation)
   - [Verified tokens info](ENVS.md#verified-tokens-info)
+  - [Name service integration](ENVS.md#name-service-integration)
   - [Bridged tokens](ENVS.md#bridged-tokens)
   - [Safe{Core} address tags](ENVS.md#safecore-address-tags)
   - [SUAVE chain](ENVS.md#suave-chain)
+  - [MetaSuites extension](ENVS.md#metasuites-extension)
   - [Sentry error monitoring](ENVS.md#sentry-error-monitoring)
   - [OpenTelemetry](ENVS.md#opentelemetry)
+  - [Swap button](ENVS.md#swap-button)
 - [3rd party services configuration](ENVS.md#external-services-configuration)
 
 &nbsp;
@@ -75,6 +80,7 @@ Please be aware that all environment variables prefixed with `NEXT_PUBLIC_` will
 | NEXT_PUBLIC_NETWORK_ID | `number` | Chain id, see [https://chainlist.org](https://chainlist.org) for the reference | Required | -  | `99` |
 | NEXT_PUBLIC_NETWORK_RPC_URL | `string` | Chain public RPC server url, see [https://chainlist.org](https://chainlist.org) for the reference | - | - | `https://core.poa.network` |
 | NEXT_PUBLIC_NETWORK_CURRENCY_NAME | `string` | Network currency name | - | - | `Ether` |
+| NEXT_PUBLIC_NETWORK_CURRENCY_WEI_NAME | `string` | Name of network currency subdenomination | - | `wei` | `duck` |
 | NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL | `string` | Network currency symbol | - | - | `ETH` |
 | NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS | `string` | Network currency decimals | - | `18` | `6` |
 | NEXT_PUBLIC_NETWORK_GOVERNANCE_TOKEN_SYMBOL | `string` | Network governance token symbol | - | - | `GNO` |
@@ -104,7 +110,6 @@ Please be aware that all environment variables prefixed with `NEXT_PUBLIC_` will
 | NEXT_PUBLIC_HOMEPAGE_CHARTS | `Array<'daily_txs' \| 'coin_price' \| 'market_cap' \| 'tvl'>` | List of charts displayed on the home page | - | - | `['daily_txs','coin_price','market_cap']` |
 | NEXT_PUBLIC_HOMEPAGE_PLATE_TEXT_COLOR | `string` | Text color of the hero plate on the homepage (escape "#" symbol if you use HEX color codes or use rgba-value instead) | - | `white` | `\#DCFE76` |
 | NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND | `string` | Background css value for hero plate on the homepage (escape "#" symbol if you use HEX color codes or use rgba-value instead) | - | `radial-gradient(103.03% 103.03% at 0% 0%, rgba(183, 148, 244, 0.8) 0%, rgba(0, 163, 196, 0.8) 100%), var(--chakra-colors-blue-400)` | `radial-gradient(at 15% 86%, hsla(350,65%,70%,1) 0px, transparent 50%)` \| `no-repeat bottom 20% right 0px/100% url(https://placekitten/1400/200)` |
-| NEXT_PUBLIC_HOMEPAGE_SHOW_GAS_TRACKER | `boolean` | Set to false if network doesn't have gas tracker | - | `true` | `false` |
 | NEXT_PUBLIC_HOMEPAGE_SHOW_AVG_BLOCK_TIME | `boolean` | Set to false if average block time is useless for the network | - | `true` | `false` |
 
 &nbsp;
@@ -204,6 +209,7 @@ Settings for meta tags and OG tags
 | NEXT_PUBLIC_ALGOLIA_APP_ID                      | `string`                                                                                       | Algolia App's ID                                                                                                                                                              | -                                                                                                                                                                                                                                                                                                                                                                            | -             | `ABCD1234`                         |
 | NEXT_PUBLIC_ALGOLIA_API_KEY                     | `string`                                                                                       | Algolia API key used for authenticating requests                                                                                                                              | -                                                                                                                                                                                                                                                                                                                                                                            | -             | `abcd1234defg5678`                 |
 | NEXT_PUBLIC_ALGOLIA_INDEX_NAME                  | `string`                                                                                       | Index name from where data should be requested                                                                                                                                | -                                                                                                                                                                                                                                                                                                                                                                            | -             | `prod_mainnet_data`                |
+| NEXT_PUBLIC_VIEWS_CONTRACT_SOLIDITYSCAN_ENABLED | `boolean`                                                                                      | Set to `true` if SolidityScan reports are supported                                                                                                                           | -                                                                                                                                                                                                                                                                                                                                                                            | -             | `true`                             |
 
 ##### Address views list
 | Id | Description |
@@ -260,6 +266,8 @@ Settings for meta tags and OG tags
 | Variable | Type| Description | Compulsoriness  | Default value | Example value |
 | --- | --- | --- | --- | --- | --- |
 | NEXT_PUBLIC_NETWORK_EXPLORERS | `Array<NetworkExplorer>` where `NetworkExplorer` can have following [properties](#network-explorer-configuration-properties) | Used to build up links to transactions, blocks, addresses in other chain explorers. | - | - | `[{'title':'Anyblock','baseUrl':'https://explorer.anyblock.tools','paths':{'tx':'/ethereum/poa/core/tx'}}]` |
+| NEXT_PUBLIC_CONTRACT_CODE_IDES | `Array<ContractCodeIde>` where `ContractCodeIde` can have following [properties](#contract-code-ide-configuration-properties) | Used to build up links to IDEs with contract source code. | - | - | `[{'title':'Remix IDE','url':'https://remix.blockscout.com/?address={hash}&blockscout={domain}','icon_url':'https://example.com/icon.svg'}]` |
+| NEXT_PUBLIC_HAS_CONTRACT_AUDIT_REPORTS | `boolean` | Set to `true` to enable Submit Audit form on the contract page | - | `false` | `true` |
 | NEXT_PUBLIC_HIDE_INDEXING_ALERT_BLOCKS | `boolean` | Set to `true` to hide indexing alert in the page header about indexing chain's blocks | - | `false` | `true` |
 | NEXT_PUBLIC_HIDE_INDEXING_ALERT_INT_TXS | `boolean` | Set to `true` to hide indexing alert in the page footer about indexing block's internal transactions | - | `false` | `true` |
 | NEXT_PUBLIC_MAINTENANCE_ALERT_MESSAGE | `string` | Used for displaying custom announcements or alerts in the header of the site. Could be a regular string or a HTML code. | - | - | `Hello world! 🤪` |
@@ -268,12 +276,21 @@ Settings for meta tags and OG tags
 
 | Variable | Type| Description | Compulsoriness  | Default value | Example value |
 | --- | --- | --- | --- | --- | --- |
+| logo | `string` | URL to explorer logo file. Should be at least 40x40. | - | - | `'https://foo.app/icon.png'` |
 | title | `string` | Displayed name of the explorer | Required | - | `Anyblock` |
 | baseUrl | `string` | Base url of the explorer | Required | - | `https://explorer.anyblock.tools` |
 | paths | `Record<'tx' \| 'block' \| 'address' \| 'token', string>` | Map of explorer entities and their paths | Required | - | `{'tx':'/ethereum/poa/core/tx'}` |
 
 *Note* The url of an entity will be constructed as `<baseUrl><paths[<entity-type>]><entity-id>`, e.g `https://explorer.anyblock.tools/ethereum/poa/core/tx/<tx-id>`
 
+#### Contract code IDE configuration properties
+
+| Variable | Type| Description | Compulsoriness  | Default value | Example value |
+| --- | --- | --- | --- | --- | --- |
+| title | `string` | Displayed name of the IDE | Required | - | `Remix IDE` |
+| url | `string` | URL of the IDE with placeholders for contract hash (`{hash}`) and current domain (`{domain}`) | Required | - | `https://remix.blockscout.com/?address={hash}&blockscout={domain}` |
+| icon_url | `string` | URL of the IDE icon | Required | - | `https://example.com/icon.svg` |
+
 &nbsp;
 
 ## App features
@@ -291,6 +308,17 @@ Settings for meta tags and OG tags
 
 &nbsp;
 
+### Gas tracker
+
+This feature is **enabled by default**. To switch it off pass `NEXT_PUBLIC_GAS_TRACKER_ENABLED=false`.
+
+| Variable | Type| Description | Compulsoriness  | Default value | Example value |
+| --- | --- | --- | --- | --- | --- |
+| NEXT_PUBLIC_GAS_TRACKER_ENABLED | `boolean` | Set to true to enable "Gas tracker" in the app | Required | `true` | `false` |
+| NEXT_PUBLIC_GAS_TRACKER_UNITS | Array<`usd` \| `gwei`> | Array of units for displaying gas prices on the Gas Tracker page, in the stats snippet on the Home page, and in the top bar. The first value in the array will take priority over the second one in all mentioned views. If only one value is provided, gas prices will be displayed only in that unit. | - | `[ 'usd', 'gwei' ]` | `[ 'gwei' ]` |
+
+&nbsp;
+
 ### Address verification in "My account"
 
 *Note* all ENV variables required for [My account](ENVS.md#my-account) feature should be passed alongside the following ones:
@@ -306,7 +334,7 @@ Settings for meta tags and OG tags
 
 | Variable | Type| Description | Compulsoriness  | Default value | Example value |
 | --- | --- | --- | --- | --- | --- |
-| NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID | `string` | Project id for [WalletConnect](https://docs.walletconnect.com/2.0/web3modal/react/installation#obtain-project-id) integration | Required | - | `<your-secret>` |
+| NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID | `string` | Project id for [WalletConnect](https://cloud.walletconnect.com/) integration | Required | - | `<your-secret>` |
 | NEXT_PUBLIC_NETWORK_RPC_URL | `string` | See in [Blockchain parameters](ENVS.md#blockchain-parameters) section | Required | - | `https://core.poa.network` |
 | NEXT_PUBLIC_NETWORK_NAME | `string` | See in [Blockchain parameters](ENVS.md#blockchain-parameters) section | Required | - | `Gnosis Chain` |
 | NEXT_PUBLIC_NETWORK_ID | `number` | See in [Blockchain parameters](ENVS.md#blockchain-parameters) section | Required | -  | `99` |
@@ -322,7 +350,8 @@ This feature is **enabled by default** with the `slise` ads provider. To switch
 
 | Variable | Type| Description | Compulsoriness  | Default value | Example value |
 | --- | --- | --- | --- | --- | --- |
-| NEXT_PUBLIC_AD_BANNER_PROVIDER | `slise` \| `adbutler` \| `coinzilla` \| `none` | Ads provider  | - | `slise` | `coinzilla` |
+| NEXT_PUBLIC_AD_BANNER_PROVIDER | `slise` \| `adbutler` \| `coinzilla` \|  `hype` \| `getit` \| `none` | Ads provider  | - | `slise` | `coinzilla` |
+| NEXT_PUBLIC_AD_BANNER_ADDITIONAL_PROVIDER | `adbutler` | Additional ads provider to mix with the main one | - | - | `adbutler` |
 | NEXT_PUBLIC_AD_ADBUTLER_CONFIG_DESKTOP | `{ id: string; width: string; height: string }` | Placement config for desktop Adbutler banner | - | - | `{'id':'123456','width':'728','height':'90'}` |
 | NEXT_PUBLIC_AD_ADBUTLER_CONFIG_MOBILE | `{ id: string; width: number; height: number }` | Placement config for mobile Adbutler banner | - | - | `{'id':'654321','width':'300','height':'100'}` |
 
@@ -347,22 +376,21 @@ This feature is **enabled by default** with the `coinzilla` ads provider. To swi
 
 &nbsp;
 
-### Optimistic rollup (L2) chain
+### User operations feature (ERC-4337)
 
 | Variable | Type| Description | Compulsoriness  | Default value | Example value |
 | --- | --- | --- | --- | --- | --- |
-| NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK | `boolean` | Set to true for optimistic L2 solutions | Required | - | `true` |
-| NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL | `string` | URL for optimistic L2 -> L1 withdrawals | Required | - | `https://app.optimism.io/bridge/withdraw` |
-| NEXT_PUBLIC_L1_BASE_URL | `string` | Blockscout base URL for L1 network | Required | - | `'http://eth-goerli.blockscout.com'` |
+| NEXT_PUBLIC_HAS_USER_OPS | `boolean` | Set to true to show user operations related data and pages | - | - | `true` |
 
 &nbsp;
 
-### ZkEvm rollup (L2) chain
+### Rollup chain
+
 | Variable | Type| Description | Compulsoriness  | Default value | Example value |
 | --- | --- | --- | --- | --- | --- |
-| NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK | `boolean` | Set to true for zkevm L2 solutions  | Required | - | `true` |
-| NEXT_PUBLIC_L1_BASE_URL | `string` | Blockscout base URL for L1 network | Required | - | `'http://eth-goerli.blockscout.com'` |
-
+| NEXT_PUBLIC_ROLLUP_TYPE | `'optimistic' \| 'shibarium' \| 'zkEvm' \| 'zkSync' ` | Rollup chain type | Required | - | `'optimistic'` |
+| NEXT_PUBLIC_ROLLUP_L1_BASE_URL | `string` | Blockscout base URL for L1 network | Required | - | `'http://eth-goerli.blockscout.com'` |
+| NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL | `string` | URL for L2 -> L1 withdrawals | - | - | `https://app.optimism.io/bridge/withdraw` |
 
 &nbsp;
 
@@ -390,6 +418,14 @@ This feature is **enabled by default** with the `coinzilla` ads provider. To swi
 
 &nbsp;
 
+### GrowthBook feature flagging and A/B testing
+
+| Variable | Type| Description | Compulsoriness  | Default value | Example value |
+| --- | --- | --- | --- | --- | --- |
+| NEXT_PUBLIC_GROWTH_BOOK_CLIENT_KEY | `string` | Client SDK key for [GrowthBook](https://www.growthbook.io/) service | true | - | `<your-secret>` |
+
+&nbsp;
+
 ### GraphQL API documentation
 
 This feature is **always enabled**, but you can configure its behavior by passing the following variables.
@@ -412,9 +448,14 @@ This feature is **always enabled**, but you can configure its behavior by passin
 
 | Variable | Type| Description | Compulsoriness  | Default value | Example value |
 | --- | --- | --- | --- | --- | --- |
-| NEXT_PUBLIC_MARKETPLACE_CONFIG_URL | `string` | URL of configuration file (`.json` format only) which contains list of apps that will be shown on the marketplace page. See [below](#marketplace-app-configuration-properties) list of available properties for an app | Required | - | `https://example.com/marketplace_config.json` |
+| NEXT_PUBLIC_MARKETPLACE_ENABLED | `boolean` | `true` means that the marketplace page will be enabled | - | - | `true` |
+| NEXT_PUBLIC_MARKETPLACE_CONFIG_URL | `string` | URL of configuration file (`.json` format only) which contains list of apps that will be shown on the marketplace page. See [below](#marketplace-app-configuration-properties) list of available properties for an app. Can be replaced with NEXT_PUBLIC_ADMIN_SERVICE_API_HOST | Required | - | `https://example.com/marketplace_config.json` |
+| NEXT_PUBLIC_ADMIN_SERVICE_API_HOST | `string` | Admin Service API endpoint url. Can be used instead of NEXT_PUBLIC_MARKETPLACE_CONFIG_URL | - | - | `https://admin-rs.services.blockscout.com` |
 | NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM | `string` | Link to form where authors can submit their dapps to the marketplace | Required | - | `https://airtable.com/shrqUAcjgGJ4jU88C` |
+| NEXT_PUBLIC_MARKETPLACE_SUGGEST_IDEAS_FORM | `string` | Link to form where users can suggest ideas for the marketplace | - | - | `https://airtable.com/appiy5yijZpMMSKjT/pag3t82DUCyhGRZZO/form` |
 | NEXT_PUBLIC_NETWORK_RPC_URL | `string` | See in [Blockchain parameters](ENVS.md#blockchain-parameters) section | Required | - | `https://core.poa.network` |
+| NEXT_PUBLIC_MARKETPLACE_CATEGORIES_URL | `string` | URL of configuration file (`.json` format only) which contains the list of categories to be displayed on the marketplace page in the specified order. If no URL is provided, then the list of categories will be compiled based on the `categories` fields from the marketplace (apps) configuration file | - | - | `https://example.com/marketplace_categories.json` |
+| NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL | `string` | URL of configuration file (`.json` format only) which contains app security reports for displaying security scores on the Marketplace page | - | - | `https://example.com/marketplace_security_reports.json` |
 
 #### Marketplace app configuration properties
 
@@ -433,6 +474,8 @@ This feature is **always enabled**, but you can configure its behavior by passin
 | twitter | `string` | Displayed twitter link | - | `'https://twitter.com/blockscoutcom'` |
 | telegram | `string`  | Displayed telegram link | - | `'https://t.me/poa_network'` |
 | github | `string` | Displayed github link | - | `'https://github.com/blockscout'` |
+| internalWallet | `boolean` | `true` means that the application can automatically connect to the Blockscout wallet. | - | `true` |
+| priority | `number` | The higher the priority, the higher the app will appear in the list on the Marketplace page. | - | `7` |
 
 #### Marketplace categories ids
 
@@ -482,7 +525,7 @@ This feature is **enabled by default** with the `['metamask']` value. To switch
 
 | Variable | Type| Description | Compulsoriness  | Default value | Example value |
 | --- | --- | --- | --- | --- | --- |
-| NEXT_PUBLIC_TRANSACTION_INTERPRETATION_PROVIDER | `blockscout` \| `none` | Transaction interpretation provider that displays human readable transaction description | - | `none` | `blockscout` |
+| NEXT_PUBLIC_TRANSACTION_INTERPRETATION_PROVIDER | `blockscout` \| `noves` \| `none` | Transaction interpretation provider that displays human readable transaction description | - | `none` | `blockscout` |
 
 &nbsp;
 
@@ -494,6 +537,26 @@ This feature is **enabled by default** with the `['metamask']` value. To switch
 
 &nbsp;
 
+### Name service integration
+
+This feature allows resolving blockchain addresses using human-readable domain names.
+
+| Variable | Type| Description | Compulsoriness  | Default value | Example value |
+| --- | --- | --- | --- | --- | --- |
+| NEXT_PUBLIC_NAME_SERVICE_API_HOST | `string` | Name Service API endpoint url | Required | - | `https://bens.services.blockscout.com` |
+
+&nbsp;
+
+### Data Availability
+
+This feature enables views related to blob transactions (EIP-4844), such as the Blob Txns tab on the Transactions page and the Blob details page.
+
+| Variable | Type| Description | Compulsoriness  | Default value | Example value |
+| --- | --- | --- | --- | --- | --- |
+| NEXT_PUBLIC_DATA_AVAILABILITY_ENABLED | `boolean` | Set to true to enable blob transactions views. | Required | - | `true` |
+
+&nbsp;
+
 ### Bridged tokens
 
 This feature allows users to view tokens that have been bridged from other EVM chains. Additional tab "Bridged" will be added to the tokens page and the link to original token will be displayed on the token page.
@@ -526,7 +589,11 @@ This feature allows users to view tokens that have been bridged from other EVM c
 
 ### Safe{Core} address tags
 
-For the smart contract addresses which are [Safe{Core} accounts](https://safe.global/) public tag "Multisig: Safe" will be displayed in the address page header alongside to Safe logo. The Safe service is available only for certain networks, see full list [here](https://docs.safe.global/safe-core-api/available-services). Based on provided value of `NEXT_PUBLIC_NETWORK_ID`, the feature will be enabled or disabled. 
+For the smart contract addresses which are [Safe{Core} accounts](https://safe.global/) public tag "Multisig: Safe" will be displayed in the address page header alongside to Safe logo.
+
+| Variable | Type| Description | Compulsoriness  | Default value | Example value |
+| --- | --- | --- | --- | --- | --- |
+| NEXT_PUBLIC_SAFE_TX_SERVICE_URL | `string` | The Safe transaction service URL. See full list of supported networks [here](https://docs.safe.global/api-supported-networks). | - | - | `uniswap` |
 
 &nbsp;
 
@@ -540,6 +607,26 @@ For blockchains that implement SUAVE architecture additional fields will be show
 
 &nbsp;
 
+### MetaSuites extension
+
+Enables [MetaSuites browser extension](https://github.com/blocksecteam/metasuites) to integrate with the app views.
+
+| Variable | Type| Description | Compulsoriness  | Default value | Example value |
+| --- | --- | --- | --- | --- | --- |
+| NEXT_PUBLIC_METASUITES_ENABLED | `boolean` | Set to true to enable integration | Required | - | `true` |
+
+&nbsp;
+
+### Validators list
+
+The feature enables the Validators page which provides detailed information about the validators of the PoS chains.
+
+| Variable | Type| Description | Compulsoriness  | Default value | Example value |
+| --- | --- | --- | --- | --- | --- |
+| NEXT_PUBLIC_VALIDATORS_CHAIN_TYPE | `'stability'` | Chain type | Required | - | `'stability'` |
+
+&nbsp;
+
 ### Sentry error monitoring
 
 | Variable | Type| Description | Compulsoriness  | Default value | Example value |
@@ -562,6 +649,16 @@ OpenTelemetry SDK for Node.js app could be enabled by passing `OTEL_SDK_ENABLED=
 
 &nbsp;
 
+### Swap button
+
+If the feature is enabled, a Swap button will be displayed at the top of the explorer page, which will take you to the specified application in the marketplace or to an external site.
+
+| Variable | Type| Description | Compulsoriness  | Default value | Example value |
+| --- | --- | --- | --- | --- | --- |
+| NEXT_PUBLIC_SWAP_BUTTON_URL | `string` | Application ID in the marketplace or website URL | - | - | `uniswap` |
+
+&nbsp;
+
 ## External services configuration
 
 ### Google ReCaptcha
diff --git a/global.d.ts b/global.d.ts
index 58230cb3ca..591cf3882d 100644
--- a/global.d.ts
+++ b/global.d.ts
@@ -1,6 +1,7 @@
 import type { LuksoProfile } from '@lukso/web-components/dist/components/lukso-profile';
 import type * as React from 'react';
-import type { WindowProvider } from 'wagmi';
+
+import type { WalletProvider } from 'types/web3';
 
 type CPreferences = {
   zone: string;
@@ -15,7 +16,7 @@ type WebComponent<T> =
 
 declare global {
   export interface Window {
-    ethereum?: WindowProvider;
+    ethereum?: WalletProvider | undefined;
     coinzilla_display: Array<CPreferences>;
     ga?: {
       getAll: () => Array<{ get: (prop: string) => string }>;
@@ -40,3 +41,5 @@ declare global {
     }
   }
 }
+
+export {};
diff --git a/icons/ABI_slim.svg b/icons/ABI_slim.svg
new file mode 100644
index 0000000000..89532207b1
--- /dev/null
+++ b/icons/ABI_slim.svg
@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none">
+  <g clip-path="url(#a)" fill="currentColor">
+    <path d="M5.176 5.291a1.253 1.253 0 0 0-1.76.159L.29 9.2a1.247 1.247 0 0 0 0 1.6l3.125 3.75a1.25 1.25 0 1 0 1.919-1.6L2.876 10l2.459-2.949a1.25 1.25 0 0 0-.159-1.76Z"/>
+    <path d="M5.176 5.291a1.253 1.253 0 0 0-1.76.159L.29 9.2a1.247 1.247 0 0 0 0 1.6l3.125 3.75a1.25 1.25 0 1 0 1.919-1.6L2.876 10l2.459-2.949a1.25 1.25 0 0 0-.159-1.76Zm6.318-2.766a1.261 1.261 0 0 0-1.47.981l-2.5 12.5a1.247 1.247 0 0 0 1.23 1.494 1.249 1.249 0 0 0 1.223-1.006l2.5-12.5a1.246 1.246 0 0 0-.982-1.469Z"/>
+    <path d="M11.494 2.525a1.261 1.261 0 0 0-1.47.981l-2.5 12.5a1.247 1.247 0 0 0 1.23 1.494 1.249 1.249 0 0 0 1.223-1.006l2.5-12.5a1.246 1.246 0 0 0-.982-1.469ZM19.708 9.2l-3.124-3.75a1.249 1.249 0 1 0-1.92 1.601l2.46 2.95-2.46 2.948a1.25 1.25 0 1 0 1.92 1.602l3.124-3.75a1.246 1.246 0 0 0 0-1.601Z"/>
+    <path d="m19.708 9.2-3.124-3.75a1.249 1.249 0 1 0-1.92 1.601l2.46 2.95-2.46 2.948a1.25 1.25 0 1 0 1.92 1.602l3.124-3.75a1.246 1.246 0 0 0 0-1.601Z"/>
+  </g>
+  <defs>
+    <clipPath id="a">
+      <path fill="#fff" d="M0 0h20v20H0z"/>
+    </clipPath>
+  </defs>
+</svg>
diff --git a/icons/ENS.svg b/icons/ENS.svg
new file mode 100644
index 0000000000..9832944dab
--- /dev/null
+++ b/icons/ENS.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M14.41 3 7.764 7.625c-.396.263-.72.62-.946 1.038a4.74 4.74 0 0 0-.046.1l-.009.019a4.786 4.786 0 0 0 .01 3.93c.233.508.828 1.51.828 1.51L14.41 3ZM4.076 16.404A15.45 15.45 0 0 1 4 14.886l1.168-3.159a6.617 6.617 0 0 0 .755 2.095C9.802 20.393 14.401 27 14.401 27l-7.35-5.108A7.562 7.562 0 0 1 4.25 17.57a7.53 7.53 0 0 1-.174-1.166ZM4 14.886l1.144-3.306a3.575 3.575 0 0 1 0-1.076c-.101.187-.298.57-.298.57a8.68 8.68 0 0 0-.794 2.534A15.45 15.45 0 0 0 4 14.886ZM15.192 27l.063-.103 6.734-11.113.005.009.007-.012s.589 1.002.827 1.51a4.787 4.787 0 0 1-.045 4.05c-.225.417-.55.774-.946 1.037L15.192 27Zm9.263-7.504c.054-.357.054-.72 0-1.076a6.622 6.622 0 0 0-.776-2.242C19.796 9.607 15.2 3 15.2 3l7.35 5.108a7.533 7.533 0 0 1 2.975 5.488c.091.93.098 1.865.02 2.796a8.68 8.68 0 0 1-.794 2.535s-.196.382-.297.57v-.001Z" fill="currentColor"/>
+</svg>
diff --git a/icons/ENS_slim.svg b/icons/ENS_slim.svg
new file mode 100644
index 0000000000..cd999b523a
--- /dev/null
+++ b/icons/ENS_slim.svg
@@ -0,0 +1,4 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M3.145 8.091c.198.423.689 1.258.689 1.258L9.508 0 3.97 3.854c-.33.22-.6.517-.788.865a3.989 3.989 0 0 0-.037 3.372ZM.897 11.17a6.277 6.277 0 0 0 2.478 4.573L9.501 20S5.668 14.495 2.436 9.018a5.52 5.52 0 0 1-.65-1.868 2.98 2.98 0 0 1 0-.897 35.09 35.09 0 0 0-.247.475A7.234 7.234 0 0 0 .877 8.84a12.86 12.86 0 0 0 .02 2.33Zm15.626.739c-.198-.423-.689-1.258-.689-1.258L10.16 20l5.538-3.852c.33-.22.6-.516.788-.864a3.99 3.99 0 0 0 .037-3.375Zm2.249-3.079a6.279 6.279 0 0 0-2.48-4.573L10.168 0s3.83 5.505 7.065 10.982a5.52 5.52 0 0 1 .647 1.868c.045.297.045.6 0 .897.084-.156.248-.475.248-.475a7.223 7.223 0 0 0 .662-2.112c.065-.776.059-1.555-.017-2.33Z" fill="currentColor"/>
+  <path d="M3.182 4.719c.188-.348.458-.645.788-.865L9.508 0 3.834 9.351s-.496-.835-.69-1.257a3.989 3.989 0 0 1 .038-3.375Zm-2.285 6.45a6.278 6.278 0 0 0 2.478 4.574L9.501 20S5.668 14.495 2.436 9.018a5.52 5.52 0 0 1-.65-1.868 2.98 2.98 0 0 1 0-.897 34.31 34.31 0 0 0-.247.475A7.234 7.234 0 0 0 .877 8.84c-.064.776-.057 1.555.02 2.33Zm15.616.742c-.198-.422-.689-1.258-.689-1.258L10.16 20l5.538-3.852c.33-.22.6-.516.788-.864a3.99 3.99 0 0 0 .037-3.375l-.01.002Zm2.249-3.078a6.277 6.277 0 0 0-2.48-4.574L10.169 0s3.83 5.505 7.064 10.982a5.52 5.52 0 0 1 .647 1.868c.045.297.045.6 0 .897.084-.156.248-.475.248-.475a7.233 7.233 0 0 0 .662-2.112c.064-.776.059-1.555-.018-2.33l-.01.003Z" fill="currentColor" style="mix-blend-mode:color"/>
+</svg>
diff --git a/icons/apps_list.svg b/icons/apps_list.svg
new file mode 100644
index 0000000000..62cb5020d6
--- /dev/null
+++ b/icons/apps_list.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M2.167 4.167c0-.92.746-1.667 1.667-1.667h3.333c.92 0 1.667.746 1.667 1.667V7.5c0 .92-.747 1.667-1.667 1.667H3.834c-.92 0-1.667-.747-1.667-1.667V4.167Zm1.667.5a.5.5 0 0 1 .5-.5h2.333a.5.5 0 0 1 .5.5V7a.5.5 0 0 1-.5.5H4.334a.5.5 0 0 1-.5-.5V4.667ZM10.5 4.27c0 .519.42.938.938.938h4.792a.938.938 0 0 0 0-1.875h-4.792a.937.937 0 0 0-.938.938Zm0 3.334c0 .518.42.938.938.938h4.792a.938.938 0 0 0 0-1.875h-4.792a.937.937 0 0 0-.938.937ZM2.167 12.5c0-.92.746-1.667 1.667-1.667h3.333c.92 0 1.667.746 1.667 1.667v3.333c0 .92-.747 1.667-1.667 1.667H3.834c-.92 0-1.667-.746-1.667-1.667V12.5Zm1.667.5a.5.5 0 0 1 .5-.5h2.333a.5.5 0 0 1 .5.5v2.333a.5.5 0 0 1-.5.5H4.334a.5.5 0 0 1-.5-.5V13Zm6.666-.396c0 .518.42.938.938.938h4.792a.938.938 0 0 0 0-1.875h-4.792a.937.937 0 0 0-.938.937Zm0 3.334c0 .517.42.937.938.937h4.792a.938.938 0 0 0 0-1.875h-4.792a.937.937 0 0 0-.938.938Z" fill="currentColor"/>
+</svg>
diff --git a/icons/apps_xs.svg b/icons/apps_xs.svg
new file mode 100644
index 0000000000..4daa74955d
--- /dev/null
+++ b/icons/apps_xs.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M3 4.167c0-.92.746-1.667 1.667-1.667H8c.92 0 1.667.746 1.667 1.667V7.5c0 .92-.747 1.667-1.667 1.667H4.667C3.747 9.167 3 8.42 3 7.5V4.167Zm1.667.5a.5.5 0 0 1 .5-.5H7.5a.5.5 0 0 1 .5.5V7a.5.5 0 0 1-.5.5H5.167a.5.5 0 0 1-.5-.5V4.667ZM3 12.5c0-.92.746-1.667 1.667-1.667H8c.92 0 1.667.746 1.667 1.667v3.333c0 .92-.747 1.667-1.667 1.667H4.667C3.747 17.5 3 16.754 3 15.833V12.5Zm1.667.5a.5.5 0 0 1 .5-.5H7.5a.5.5 0 0 1 .5.5v2.333a.5.5 0 0 1-.5.5H5.167a.5.5 0 0 1-.5-.5V13ZM13 2.5c-.92 0-1.667.746-1.667 1.667V7.5c0 .92.746 1.667 1.667 1.667h3.333C17.253 9.167 18 8.42 18 7.5V4.167c0-.92-.746-1.667-1.667-1.667H13Zm3.333 2.167a.5.5 0 0 0-.5-.5H13.5a.5.5 0 0 0-.5.5V7a.5.5 0 0 0 .5.5h2.333a.5.5 0 0 0 .5-.5V4.667Zm-5 7.833c0-.92.746-1.667 1.667-1.667h3.333c.92 0 1.667.746 1.667 1.667v3.333c0 .92-.746 1.667-1.667 1.667H13c-.92 0-1.667-.746-1.667-1.667V12.5ZM13 13a.5.5 0 0 1 .5-.5h2.333a.5.5 0 0 1 .5.5v2.333a.5.5 0 0 1-.5.5H13.5a.5.5 0 0 1-.5-.5V13Z" fill="currentColor"/>
+</svg>
diff --git a/icons/beta.svg b/icons/beta.svg
new file mode 100644
index 0000000000..bba1309f3a
--- /dev/null
+++ b/icons/beta.svg
@@ -0,0 +1,4 @@
+<svg viewBox="0 0 26 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect width="26" height="12" rx="2" fill="#F56565"/>
+  <path d="M3.028 9V1.727h1.061V4.43h.064c.062-.114.15-.245.267-.394.116-.15.277-.28.483-.391.205-.114.478-.17.816-.17.44 0 .834.11 1.18.333.345.223.616.544.812.963.2.419.299.923.299 1.512 0 .59-.098 1.095-.295 1.517a2.3 2.3 0 0 1-.81.97 2.097 2.097 0 0 1-1.175.337c-.332 0-.603-.056-.813-.167a1.54 1.54 0 0 1-.49-.391 2.957 2.957 0 0 1-.274-.398h-.089V9H3.028Zm1.04-2.727c0 .383.056.72.167 1.008.111.29.272.515.483.679.21.16.469.241.774.241.317 0 .582-.084.795-.252.214-.17.375-.401.483-.693.112-.29.167-.619.167-.983 0-.36-.054-.683-.163-.97a1.484 1.484 0 0 0-.483-.678c-.213-.166-.48-.249-.799-.249-.308 0-.568.08-.781.238-.21.159-.37.38-.48.664a2.77 2.77 0 0 0-.163.995Zm7.485 2.837c-.538 0-1-.115-1.389-.344a2.336 2.336 0 0 1-.894-.977c-.209-.421-.313-.915-.313-1.48 0-.56.104-1.052.313-1.478.21-.426.504-.759.88-.998.379-.239.822-.359 1.328-.359.308 0 .606.051.895.153.29.102.548.262.778.48.23.217.41.5.543.848.133.346.2.766.2 1.26v.377H9.556v-.795h3.296c0-.28-.057-.527-.17-.742a1.29 1.29 0 0 0-1.198-.703 1.38 1.38 0 0 0-.78.22 1.474 1.474 0 0 0-.512.568 1.641 1.641 0 0 0-.178.756v.622c0 .364.064.674.192.93.13.256.311.451.543.586.232.133.503.199.814.199.2 0 .384-.028.55-.085a1.143 1.143 0 0 0 .707-.692l1.005.18a1.82 1.82 0 0 1-.434.778 2.1 2.1 0 0 1-.777.515 2.91 2.91 0 0 1-1.062.181Zm6.064-5.565v.853h-2.979v-.853h2.98Zm-2.18-1.306h1.062v5.16c0 .205.03.36.092.465a.49.49 0 0 0 .238.21c.1.035.207.052.323.052.085 0 .16-.005.224-.017l.149-.029.192.877a2.08 2.08 0 0 1-.689.114 1.87 1.87 0 0 1-.781-.15 1.34 1.34 0 0 1-.586-.482c-.15-.218-.224-.491-.224-.82v-5.38Zm4.942 6.882c-.345 0-.658-.064-.937-.192a1.58 1.58 0 0 1-.664-.565c-.161-.246-.242-.548-.242-.905 0-.308.06-.561.178-.76a1.31 1.31 0 0 1 .48-.472c.2-.116.425-.204.674-.263a6.56 6.56 0 0 1 .76-.135l.795-.092c.204-.027.352-.068.444-.125.092-.057.139-.149.139-.277V5.31c0-.31-.088-.55-.263-.72-.173-.171-.431-.256-.774-.256-.358 0-.64.08-.845.238-.204.156-.345.33-.423.522l-.998-.228a1.92 1.92 0 0 1 .519-.802c.23-.206.493-.355.791-.448a3.116 3.116 0 0 1 1.634-.063c.246.05.476.142.689.277.215.134.392.327.53.578.136.249.205.572.205.97V9h-1.037v-.746h-.043a1.512 1.512 0 0 1-.308.405 1.642 1.642 0 0 1-.53.33 2.053 2.053 0 0 1-.774.132Zm.231-.853c.294 0 .545-.058.753-.174a1.192 1.192 0 0 0 .646-1.061V6.33a.552.552 0 0 1-.22.106 3.43 3.43 0 0 1-.366.082l-.401.06c-.13.017-.24.03-.327.043a2.63 2.63 0 0 0-.564.131.97.97 0 0 0-.405.266.665.665 0 0 0-.15.455c0 .263.098.462.292.597.194.132.441.198.742.198Z" fill="#fff"/>
+</svg>
diff --git a/icons/beta_xs.svg b/icons/beta_xs.svg
new file mode 100644
index 0000000000..a6dc48ee4e
--- /dev/null
+++ b/icons/beta_xs.svg
@@ -0,0 +1,4 @@
+<svg viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect width="12" height="12" rx="2" fill="#F56565"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M7.42 2.494c-.373-.313-.896-.49-1.5-.49a2.028 2.028 0 0 0-1.52.567 1.948 1.948 0 0 0-.453.685 1.91 1.91 0 0 0-.127.805V10h.79V8.508a2.46 2.46 0 0 0 1.59.549c.3.01.6-.04.88-.147a2.21 2.21 0 0 0 .751-.48 2.136 2.136 0 0 0 .652-1.596 1.925 1.925 0 0 0-.309-1.09 1.978 1.978 0 0 0-.717-.664 1.75 1.75 0 0 0 .557-1.301c0-.523-.22-.97-.594-1.285Zm-2.023.36c.163-.06.338-.085.512-.074h.008c.413 0 .741.105.964.28.22.171.343.417.343.72v.004a.944.944 0 0 1-.288.713.99.99 0 0 1-.732.283l-.115-.004v.781h.112c.467 0 .84.13 1.094.351.253.219.398.534.398.927v.004a1.357 1.357 0 0 1-.418 1.04 1.422 1.422 0 0 1-1.069.4h-.012a1.532 1.532 0 0 1-1.109-.393 1.437 1.437 0 0 1-.475-1.052V4.05a1.165 1.165 0 0 1 .352-.923c.123-.12.272-.214.435-.274Z" fill="#fff"/>
+</svg>
diff --git a/icons/blob.svg b/icons/blob.svg
new file mode 100644
index 0000000000..9dc2b542ff
--- /dev/null
+++ b/icons/blob.svg
@@ -0,0 +1,5 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M3.392.45C3.644.163 3.984 0 4.34 0h8.038a.63.63 0 0 1 .474.225L17.54 5.61a.83.83 0 0 1 .196.544v12.308c0 .408-.141.799-.393 1.087-.25.289-.592.451-.947.451H4.34c-.356 0-.696-.162-.948-.45A1.661 1.661 0 0 1 3 18.461V1.538c0-.408.141-.799.392-1.087Zm.948 1.088h6.87v4.497c0 .388.315.702.702.702h4.485v11.725H4.34V1.538Zm8.274.59 2.791 3.205h-2.791V2.128Z" fill="currentColor"/>
+  <path d="M8.1 16.4a.5.5 0 0 1-.5-.5v-7a.5.5 0 0 1 .5-.5h2.237c.74 0 1.305.164 1.697.491.397.324.595.808.595 1.452 0 .457-.101.85-.303 1.177-.202.328-.505.552-.909.674l.097-.223c.59.11 1.04.345 1.349.703.309.358.463.84.463 1.446 0 .709-.229 1.267-.686 1.674-.457.404-1.086.606-1.886.606H8.1Zm.746-1.12h1.765c.423 0 .76-.097 1.012-.291.255-.199.383-.517.383-.955 0-.476-.132-.805-.395-.988-.259-.187-.592-.28-1-.28H8.846v2.514Zm0-3.634h1.32c.373 0 .666-.075.88-.223.217-.152.325-.432.325-.84 0-.412-.108-.692-.325-.84-.213-.152-.507-.229-.88-.229h-1.32v2.132Z" fill="currentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M12.038 12.116a2 2 0 0 1 .825.558c.309.358.463.84.463 1.446 0 .709-.229 1.267-.686 1.674-.457.404-1.086.606-1.886.606H8.1a.5.5 0 0 1-.5-.5v-7a.5.5 0 0 1 .5-.5h2.237c.74 0 1.305.164 1.697.491.397.324.595.808.595 1.452 0 .457-.101.85-.303 1.177a1.477 1.477 0 0 1-.534.515c.086.024.168.05.246.08Zm.177-.145c.32.137.588.327.8.573.347.403.51.936.51 1.576 0 .756-.245 1.372-.752 1.824-.504.445-1.185.656-2.019.656H8.1a.7.7 0 0 1-.7-.7v-7a.7.7 0 0 1 .7-.7h2.237c.765 0 1.383.17 1.825.537.454.371.667.92.667 1.606 0 .487-.108.917-.333 1.282-.08.13-.174.245-.281.346Zm-.72 1.237c-.217-.156-.506-.242-.883-.242H9.046v2.114h1.566c.393 0 .682-.09.889-.25.19-.147.305-.396.305-.796 0-.444-.122-.695-.309-.824l-.002-.002Zm.128 1.78c-.251.195-.589.292-1.011.292H8.846v-2.514h1.766c.407 0 .74.093 1 .28.262.183.394.512.394.988 0 .438-.128.756-.383.954Zm-.693-5.082c-.168-.12-.415-.192-.764-.192h-1.12v1.732h1.12c.35 0 .597-.07.765-.187.14-.098.24-.298.24-.676 0-.384-.1-.581-.238-.675l-.003-.002Zm.116 1.517c-.213.148-.507.223-.88.223h-1.32V9.514h1.32c.373 0 .666.076.88.229.217.148.326.428.326.84 0 .407-.109.687-.326.84Z" fill="currentColor"/>
+</svg>
diff --git a/icons/blobs/image.svg b/icons/blobs/image.svg
new file mode 100644
index 0000000000..be08dd269c
--- /dev/null
+++ b/icons/blobs/image.svg
@@ -0,0 +1,11 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g clip-path="url(#a)" fill="currentColor">
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M3.647 1h12.705A2.65 2.65 0 0 1 19 3.647v12.706A2.65 2.65 0 0 1 16.353 19H3.647A2.65 2.65 0 0 1 1 16.353V3.647A2.65 2.65 0 0 1 3.647 1Zm12.705 16.94a1.59 1.59 0 0 0 1.588-1.588l.001-1.87-2.647-2.206-3.192 2.66-5.77-5.246-4.273 4.747v1.915a1.59 1.59 0 0 0 1.588 1.588h12.705Zm-1.059-7.04 2.647 2.205.001-9.457a1.59 1.59 0 0 0-1.588-1.588H3.647A1.59 1.59 0 0 0 2.06 3.647v9.208L6.257 8.19l5.874 5.342 3.162-2.634Zm1.06-4.605a2.65 2.65 0 0 1-2.647 2.647 2.65 2.65 0 0 1-2.647-2.648 2.65 2.65 0 0 1 2.647-2.647 2.65 2.65 0 0 1 2.647 2.647Zm-1.059 0a1.59 1.59 0 1 0-1.588 1.588 1.59 1.59 0 0 0 1.588-1.588Z"/>
+    <path d="M19 3.647h.2-.2Zm-1.06 12.705h-.2.2Zm.001-1.87h.2v-.094l-.072-.06-.128.154Zm-2.647-2.206.128-.153-.128-.107-.128.107.128.153Zm-3.192 2.66-.134.148.129.117.133-.112-.128-.153ZM6.332 9.69l.134-.148-.149-.136-.134.15.148.134Zm-4.273 4.747-.149-.134-.051.057v.077h.2Zm15.881-1.333-.128.154.328.273v-.427h-.2ZM15.293 10.9l.128-.154-.128-.107-.128.107.128.154Zm2.648-7.252h.2-.2ZM2.06 12.855h-.2v.521l.349-.387-.15-.134ZM6.257 8.19l.134-.148-.149-.135-.134.15.149.133Zm5.874 5.342-.134.148.129.117.133-.112-.128-.153ZM16.351.8H3.648v.4h12.705V.8ZM19.2 3.647A2.85 2.85 0 0 0 16.352.8v.4A2.45 2.45 0 0 1 18.8 3.647h.4Zm0 12.706V3.647h-.4v12.706h.4ZM16.353 19.2a2.85 2.85 0 0 0 2.847-2.847h-.4a2.45 2.45 0 0 1-2.447 2.447v.4Zm-12.706 0h12.706v-.4H3.647v.4ZM.8 16.353A2.85 2.85 0 0 0 3.647 19.2v-.4A2.45 2.45 0 0 1 1.2 16.353H.8Zm0-12.706v12.706h.4V3.647H.8ZM3.647.8A2.85 2.85 0 0 0 .8 3.647h.4A2.45 2.45 0 0 1 3.647 1.2V.8ZM17.74 16.352a1.39 1.39 0 0 1-1.388 1.388v.4a1.79 1.79 0 0 0 1.788-1.788h-.4Zm.001-1.87v1.87h.4v-1.87h-.4Zm-2.575-2.052 2.647 2.205.256-.307-2.647-2.205-.256.307Zm-2.936 2.66 3.192-2.66-.256-.307-3.192 2.66.256.306ZM6.197 9.837l5.77 5.246.27-.296-5.771-5.246-.27.296Zm-3.99 4.733L6.48 9.823l-.297-.267-4.273 4.747.298.268Zm.052 1.78v-1.914h-.4v1.915h.4Zm1.388 1.39a1.39 1.39 0 0 1-1.388-1.39h-.4a1.79 1.79 0 0 0 1.788 1.79v-.4Zm12.705 0H3.647v.4h12.705v-.4Zm1.716-4.79-2.647-2.206-.256.307 2.647 2.206.256-.307Zm-.327-9.304v9.457h.4V3.647h-.4ZM16.353 2.26a1.39 1.39 0 0 1 1.388 1.388h.4a1.79 1.79 0 0 0-1.788-1.788v.4Zm-12.706 0h12.706v-.4H3.647v.4ZM2.26 3.647A1.39 1.39 0 0 1 3.647 2.26v-.4A1.79 1.79 0 0 0 1.86 3.647h.4Zm0 9.208V3.647h-.4v9.208h.4Zm3.849-4.798L1.91 12.721l.298.268 4.197-4.664-.297-.268Zm6.158 5.328L6.39 8.043l-.269.296 5.875 5.342.269-.296Zm2.899-2.64-3.162 2.634.256.307 3.162-2.634-.256-.307Zm-1.46-1.604a2.85 2.85 0 0 0 2.848-2.848h-.4a2.45 2.45 0 0 1-2.447 2.448v.4Zm-2.847-2.848a2.85 2.85 0 0 0 2.848 2.848v-.4a2.45 2.45 0 0 1-2.447-2.447h-.4Zm2.848-2.847a2.85 2.85 0 0 0-2.848 2.847h.4a2.45 2.45 0 0 1 2.448-2.447v-.4Zm2.847 2.847a2.85 2.85 0 0 0-2.847-2.847v.4a2.45 2.45 0 0 1 2.447 2.447h.4Zm-2.847-1.387a1.39 1.39 0 0 1 1.388 1.388h.4a1.79 1.79 0 0 0-1.788-1.788v.4Zm-1.389 1.388a1.39 1.39 0 0 1 1.389-1.388v-.4a1.79 1.79 0 0 0-1.789 1.788h.4Zm1.389 1.389a1.39 1.39 0 0 1-1.389-1.389h-.4a1.79 1.79 0 0 0 1.789 1.789v-.4Zm1.388-1.389a1.39 1.39 0 0 1-1.388 1.389v.4a1.79 1.79 0 0 0 1.788-1.789h-.4Z"/>
+  </g>
+  <defs>
+    <clipPath id="a">
+      <path fill="#fff" d="M0 0h20v20H0z"/>
+    </clipPath>
+  </defs>
+</svg>
diff --git a/icons/blobs/raw.svg b/icons/blobs/raw.svg
new file mode 100644
index 0000000000..8a97401ff5
--- /dev/null
+++ b/icons/blobs/raw.svg
@@ -0,0 +1,11 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g clip-path="url(#a)" fill="currentColor" stroke="currentColor" stroke-width=".4">
+    <path d="M15.063 19H4.937A3.937 3.937 0 0 1 1 15.062V4.938A3.937 3.937 0 0 1 4.938 1h5.625v1.125H4.936a2.813 2.813 0 0 0-2.812 2.813v10.125a2.812 2.812 0 0 0 2.813 2.812h10.125a2.812 2.812 0 0 0 2.812-2.813V9.439H19v5.624A3.937 3.937 0 0 1 15.062 19Z"/>
+    <path d="M15.063 8.875a3.938 3.938 0 1 1 0-7.875 3.938 3.938 0 0 1 0 7.875Zm0-6.75a2.812 2.812 0 1 0 0 5.624 2.812 2.812 0 0 0 0-5.624Z"/>
+  </g>
+  <defs>
+    <clipPath id="a">
+      <path fill="#fff" d="M0 0h20v20H0z"/>
+    </clipPath>
+  </defs>
+</svg>
diff --git a/icons/blobs/text.svg b/icons/blobs/text.svg
new file mode 100644
index 0000000000..08ec8801bf
--- /dev/null
+++ b/icons/blobs/text.svg
@@ -0,0 +1,7 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M4 1a3 3 0 0 0-3 3v12a3 3 0 0 0 3 3h12a3 3 0 0 0 3-3V4a3 3 0 0 0-3-3H4Zm.2 1.2a2 2 0 0 0-2 2v11.6a2 2 0 0 0 2 2h11.6a2 2 0 0 0 2-2V4.2a2 2 0 0 0-2-2H4.2Z" fill="currentColor"/>
+  <rect x="4" y="5" width="12" height="1.4" rx=".7" fill="currentColor"/>
+  <rect x="4" y="8" width="8" height="1.4" rx=".7" fill="currentColor"/>
+  <rect x="4" y="10.8" width="12" height="1.4" rx=".7" fill="currentColor"/>
+  <rect x="4" y="13.6" width="9" height="1.4" rx=".7" fill="currentColor"/>
+</svg>
diff --git a/icons/brands/safe.svg b/icons/brands/safe.svg
index 9e596a3821..8369513837 100644
--- a/icons/brands/safe.svg
+++ b/icons/brands/safe.svg
@@ -1,3 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="background:#12ff80" viewBox="0 0 661.6 661.5">
-  <path d="M532 330.7h-49.4c-14.8 0-26.7 12-26.7 26.7v71.7c0 14.8-12 26.7-26.7 26.7H232.5c-14.8 0-26.7 12-26.7 26.7V532c0 14.8 12 26.7 26.7 26.7h208c14.8 0 26.5-12 26.5-26.7v-39.6c0-14.8 12-25.2 26.7-25.2H532c14.8 0 26.7-12 26.7-26.7v-83.3c0-14.9-12-26.5-26.7-26.5zm-326.2-98.2c0-14.8 12-26.7 26.7-26.7H429c14.8 0 26.7-12 26.7-26.7v-49.4c0-14.8-12-26.7-26.7-26.7H221.1c-14.8 0-26.7 12-26.7 26.7v38.1c0 14.8-12 26.7-26.7 26.7h-38c-14.8 0-26.7 12-26.7 26.7v83.4c0 14.8 12 26.1 26.8 26.1h49.4c14.8 0 26.7-12 26.7-26.7l-.1-71.5zm101.7 46.3H355c15.5 0 28 12.6 28 28v47.5c0 15.5-12.6 28-28 28h-47.5c-15.5 0-28-12.6-28-28v-47.5c0-15.5 12.6-28 28-28z"/>
+<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 661.6 661.5">
+  <path fill="currentColor" d="M532 330.7h-49.4c-14.8 0-26.7 12-26.7 26.7v71.7c0 14.8-12 26.7-26.7 26.7H232.5c-14.8 0-26.7 12-26.7 26.7V532c0 14.8 12 26.7 26.7 26.7h208c14.8 0 26.5-12 26.5-26.7v-39.6c0-14.8 12-25.2 26.7-25.2H532c14.8 0 26.7-12 26.7-26.7v-83.3c0-14.9-12-26.5-26.7-26.5zm-326.2-98.2c0-14.8 12-26.7 26.7-26.7H429c14.8 0 26.7-12 26.7-26.7v-49.4c0-14.8-12-26.7-26.7-26.7H221.1c-14.8 0-26.7 12-26.7 26.7v38.1c0 14.8-12 26.7-26.7 26.7h-38c-14.8 0-26.7 12-26.7 26.7v83.4c0 14.8 12 26.1 26.8 26.1h49.4c14.8 0 26.7-12 26.7-26.7l-.1-71.5zm101.7 46.3H355c15.5 0 28 12.6 28 28v47.5c0 15.5-12.6 28-28 28h-47.5c-15.5 0-28-12.6-28-28v-47.5c0-15.5 12.6-28 28-28z"/>
 </svg>
diff --git a/icons/brands/solidity_scan.svg b/icons/brands/solidity_scan.svg
new file mode 100644
index 0000000000..ac5747c69a
--- /dev/null
+++ b/icons/brands/solidity_scan.svg
@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 23 20">
+  <path fill="url(#a)" d="M1.12 1.111v5.556h2.241V2.222h4.482V0H2.241a1.13 1.13 0 0 0-.793.325c-.21.209-.327.491-.327.786Zm20.168 5.556V1.11c0-.295-.118-.577-.328-.786A1.125 1.125 0 0 0 20.168 0h-5.603v2.222h4.482v4.445h2.24Zm-2.24 11.11h-4.483V20h5.603c.297 0 .582-.117.792-.326.21-.208.328-.49.328-.785v-5.556h-2.24v4.445ZM7.842 20v-2.222H3.361v-4.445h-2.24v5.556c0 .295.117.577.327.785.21.209.496.326.793.326h5.602ZM0 8.889h22.408v2.222H0V8.89Z"/>
+  <defs>
+    <linearGradient id="a" x1="2.161" x2="21.104" y1="1.429" y2="18.729" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#52FF00"/>
+      <stop offset="1" stop-color="#00EEFD"/>
+    </linearGradient>
+  </defs>
+</svg>
diff --git a/icons/contracts.svg b/icons/contracts.svg
new file mode 100644
index 0000000000..1f0b62afd2
--- /dev/null
+++ b/icons/contracts.svg
@@ -0,0 +1,6 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M3.4 2a1.8 1.8 0 0 0-1.8 1.8v14.8A1.4 1.4 0 0 0 3 20h1.6v-1.326H3V3.516h1.6V2H3.4Z" fill="currentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M3.992.45C4.244.163 4.585 0 4.94 0h8.038a.63.63 0 0 1 .474.225L18.14 5.61a.83.83 0 0 1 .196.544v12.308c0 .408-.141.799-.392 1.087a1.26 1.26 0 0 1-.948.451H4.94c-.356 0-.696-.162-.948-.45a1.661 1.661 0 0 1-.392-1.088V1.538c0-.408.141-.799.392-1.087Zm.948 1.088h6.87v4.497c0 .388.315.702.702.702h4.485v11.725H4.94V1.538Zm8.274.59 2.791 3.205h-2.79V2.128Z" fill="currentColor"/>
+  <rect x="7.2" y="14.3" width="7.8" height="1.2" rx=".6" fill="currentColor"/>
+  <rect x="7.2" y="12" width="7.8" height="1.2" rx=".6" fill="currentColor"/>
+</svg>
diff --git a/icons/contracts_verified.svg b/icons/contracts_verified.svg
new file mode 100644
index 0000000000..2a004f596d
--- /dev/null
+++ b/icons/contracts_verified.svg
@@ -0,0 +1,6 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M3.4 2a1.8 1.8 0 0 0-1.8 1.8v14.8A1.4 1.4 0 0 0 3 20h1.6v-1.326H3V3.516h1.6V2H3.4Z" fill="currentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M3.992.45C4.244.163 4.585 0 4.94 0h8.038a.63.63 0 0 1 .474.225L18.14 5.61a.83.83 0 0 1 .196.544v12.308c0 .408-.141.799-.392 1.087a1.26 1.26 0 0 1-.948.451H4.94c-.356 0-.696-.162-.948-.45a1.661 1.661 0 0 1-.392-1.088V1.538c0-.408.141-.799.392-1.087Zm8.709 1.088H4.94v16.924h12.057V6.472l-4.296-4.934Z" fill="currentColor"/>
+  <path d="m7.9 13.357 2.2 2.357L14.5 11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M12.512.42c.388 0 .702.315.702.703v4.21h4.21a.702.702 0 1 1 0 1.404h-4.912a.702.702 0 0 1-.702-.702V1.123c0-.388.315-.702.702-.702Z" fill="currentColor"/>
+</svg>
diff --git a/icons/dots.svg b/icons/dots.svg
new file mode 100644
index 0000000000..1ea165f92f
--- /dev/null
+++ b/icons/dots.svg
@@ -0,0 +1,5 @@
+<svg viewBox="0 0 18 4" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="2" cy="2" r="2" fill="currentColor"/>
+  <circle cx="9" cy="2" r="2" fill="currentColor"/>
+  <circle cx="16" cy="2" r="2" fill="currentColor"/>
+</svg>
diff --git a/icons/gas_xl.svg b/icons/gas_xl.svg
new file mode 100644
index 0000000000..5a3913ac16
--- /dev/null
+++ b/icons/gas_xl.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M6.121 1C3.131 1 .667 3.464.667 6.455V41H26.12V28.273h3.637v7.272c0 2.99 2.464 5.455 5.454 5.455 2.99 0 5.455-2.465 5.455-5.455V17.023a5.33 5.33 0 0 0-1.591-3.807l-8.58-8.58-2.557 2.557 5.17 5.17c-1.952.832-3.352 2.756-3.352 5 0 2.99 2.465 5.455 5.455 5.455.64 0 1.243-.135 1.818-.34v13.067c0 1.03-.788 1.819-1.818 1.819a1.786 1.786 0 0 1-1.818-1.819v-7.272c0-1.989-1.648-3.637-3.636-3.637H26.12V6.455C26.12 3.465 23.656 1 20.666 1H6.12Zm0 3.636h14.546c1.03 0 1.818.789 1.818 1.819v7.272H4.303V6.455c0-1.03.788-1.819 1.818-1.819Zm29.091 10.91c1.023 0 1.818.795 1.818 1.818a1.795 1.795 0 0 1-1.818 1.818 1.795 1.795 0 0 1-1.818-1.818c0-1.023.795-1.819 1.818-1.819ZM4.303 17.364h18.182v20H4.303v-20Z" fill="currentColor" stroke="currentColor"/>
+</svg>
diff --git a/icons/gear_slim.svg b/icons/gear_slim.svg
new file mode 100644
index 0000000000..abc14e6a78
--- /dev/null
+++ b/icons/gear_slim.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M8.039 17.16h2.432a.608.608 0 0 0 .584-.608v-.827a.84.84 0 0 1 1.429-.608l.608.608a.608.608 0 0 0 .864 0l1.72-1.72a.61.61 0 0 0 0-.864l-.608-.608a.84.84 0 0 1 .608-1.43h.876a.608.608 0 0 0 .608-.607V8.063a.608.608 0 0 0-.608-.608h-.857a.84.84 0 0 1-.608-1.429l.608-.608a.607.607 0 0 0 0-.863l-1.721-1.721a.609.609 0 0 0-.864 0l-.608.608a.84.84 0 0 1-1.429-.608v-.876a.608.608 0 0 0-.608-.608H8.033a.608.608 0 0 0-.608.608v.845a.84.84 0 0 1-1.43.608l-.607-.608a.608.608 0 0 0-.864 0L2.834 4.53a.608.608 0 0 0 0 .864l.608.608a.84.84 0 0 1-.608 1.429h-.876a.608.608 0 0 0-.608.608v2.438a.608.608 0 0 0 .608.608h.845a.839.839 0 0 1 .608 1.43l-.608.607a.609.609 0 0 0 0 .864l1.727 1.69a.608.608 0 0 0 .864 0l.608-.608a.84.84 0 0 1 1.429.608v.876a.608.608 0 0 0 .608.608Zm1.824-1.216H8.647v-.268a2.049 2.049 0 0 0-3.503-1.447l-.188.189-.863-.864.188-.188a2.05 2.05 0 0 0-1.447-3.503h-.268V8.647h.268A2.05 2.05 0 0 0 4.28 5.144l-.188-.188.863-.864.188.189a2.05 2.05 0 0 0 3.503-1.447v-.268h1.216v.268a2.05 2.05 0 0 0 3.503 1.447l.188-.189.864.864-.189.188a2.05 2.05 0 0 0 1.447 3.503h.268v1.216h-.268a2.05 2.05 0 0 0-1.447 3.503l.189.188-.864.864-.188-.189a2.05 2.05 0 0 0-3.503 1.447v.268Zm-2.297-4.161a3.04 3.04 0 1 0 3.378-5.056 3.04 3.04 0 0 0-3.378 5.056Zm.676-4.045a1.824 1.824 0 1 1 2.027 3.034 1.824 1.824 0 0 1-2.027-3.034Z" fill="currentColor"/>
+</svg>
diff --git a/icons/integration/full.svg b/icons/integration/full.svg
new file mode 100644
index 0000000000..0ac50a345b
--- /dev/null
+++ b/icons/integration/full.svg
@@ -0,0 +1,3 @@
+<svg viewBox="-1 -1 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M7.24.661a.964.964 0 1 0-1.831.607l.426 1.285a.964.964 0 0 0 1.83-.606L7.24.661Zm10.478.985A.964.964 0 0 0 16.354.283l-3.495 3.495-.204-.204a2.893 2.893 0 0 0-4.091 0L6.75 5.388A.964.964 0 0 0 5.388 6.75L3.575 8.562a2.893 2.893 0 0 0 0 4.091l.204.204-3.496 3.497a.964.964 0 1 0 1.364 1.363l3.496-3.496.205.205a2.893 2.893 0 0 0 4.091 0l1.813-1.813a.964.964 0 0 0 1.361-1.361l1.815-1.814a2.893 2.893 0 0 0 0-4.091l-.206-.206 3.496-3.495ZM11.25 9.887l1.813-1.813a.964.964 0 0 0 0-1.364l-.839-.839a.996.996 0 0 1-.096-.096l-.838-.838a.964.964 0 0 0-1.363 0L8.114 6.751l3.137 3.136Zm-4.5-1.773L4.939 9.926a.964.964 0 0 0 0 1.364l.864.864a1.193 1.193 0 0 1 .044.043l.865.866a.964.964 0 0 0 1.363 0l1.812-1.812-3.136-3.137Zm4.196 6.72a.964.964 0 0 1 1.218.613l.426 1.285a.964.964 0 1 1-1.83.607l-.426-1.286a.964.964 0 0 1 .612-1.219Zm3.888-3.887a.964.964 0 0 1 1.218-.612l1.286.425a.964.964 0 1 1-.607 1.831l-1.285-.426a.964.964 0 0 1-.612-1.218ZM1.268 5.409a.964.964 0 1 0-.607 1.83l1.286.426a.964.964 0 1 0 .606-1.83l-1.285-.426Z" fill="currentColor"/>
+</svg>
diff --git a/icons/integration/partial.svg b/icons/integration/partial.svg
new file mode 100644
index 0000000000..2f7a76969f
--- /dev/null
+++ b/icons/integration/partial.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 -1 19 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M18.394.273a.931.931 0 0 1 0 1.316l-1.825 1.825.194.194h.001a2.795 2.795 0 0 1 0 3.956l-1.747 1.747a.931.931 0 0 1-1.354 1.278l-.609-.61-.011-.01-.012-.012L8.71 5.635l-.011-.011-.011-.012-.61-.609A.931.931 0 0 1 9.355 3.65l1.747-1.747a2.794 2.794 0 0 1 3.956 0l.195.194L17.077.273a.931.931 0 0 1 1.317 0Zm-2.945 5.973L13.7 7.994l-3.028-3.029 1.748-1.747a.93.93 0 0 1 1.319 0l1.708 1.708a.93.93 0 0 1 0 1.32ZM6.563 8.304l-.893-.893a.931.931 0 0 0-1.354 1.278L2.57 10.435l-.001.001a2.793 2.793 0 0 0 0 3.956l.195.194-1.825 1.825a.931.931 0 0 0 1.317 1.316l1.824-1.824.194.194a2.793 2.793 0 0 0 3.956 0h.001l1.747-1.747a.931.931 0 0 0 1.278-1.353l-.894-.893.894-.894a.931.931 0 0 0-1.317-1.317l-.893.894L7.88 9.62l.893-.894A.931.931 0 1 0 7.456 7.41l-.893.893Zm-.655 1.978-.003-.003-.004-.003-.27-.27-1.747 1.748a.931.931 0 0 0 0 1.32l.845.844.01.01.01.01.843.843.001.002a.93.93 0 0 0 1.319 0l1.748-1.748-2.752-2.753Z" fill="currentColor"/>
+</svg>
diff --git a/icons/lightning.svg b/icons/lightning.svg
index 91b1ae92ca..03fea73d75 100644
--- a/icons/lightning.svg
+++ b/icons/lightning.svg
@@ -1,3 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
-  <path fill="currentColor" d="M10.833 7.5H17.5L9.167 20v-7.5H3.333l7.5-12.5v7.5ZM9.167 9.167v-3.15l-2.89 4.816h4.556v3.662l3.553-5.328h-5.22Z"/>
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10.833 7.5H17.5L9.167 20v-7.5H3.333l7.5-12.5v7.5ZM9.167 9.167v-3.15l-2.89 4.816h4.556v3.662l3.553-5.328h-5.22Z" fill="currentColor"/>
 </svg>
diff --git a/icons/rocket_xl.svg b/icons/rocket_xl.svg
new file mode 100644
index 0000000000..8b3f4ccdbf
--- /dev/null
+++ b/icons/rocket_xl.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M26.05 8.552c3.799-3.798 7.474-4.099 9.352-3.954.145 1.878-.156 5.553-3.954 9.352l-11.32 11.32-5.398-5.398 9.163-9.162.008-.01 2.15-2.148ZM22.817 5.32l-1.484 1.483H9.94a3.81 3.81 0 0 0-2.656 1.132l-6.166 6.147-.003.003a3.81 3.81 0 0 0 1.95 6.43h.002l7.302 1.464 7.653 7.653 1.463 7.301v.003a3.812 3.812 0 0 0 6.43 1.95l6.151-6.169a3.81 3.81 0 0 0 1.132-2.656V18.667l1.483-1.484C40.216 11.65 40.24 5.961 39.863 3.36A3.773 3.773 0 0 0 36.641.137c-2.602-.376-8.29-.353-13.824 5.182ZM5.358 16.31l5.388 1.08 6.015-6.015h-6.452l-4.95 4.935ZM22.61 29.255l1.08 5.387 4.935-4.951v-6.452l-6.015 6.015Zm-13.608-.278a2.286 2.286 0 1 0-2.29-3.958c-3.224 1.866-4.709 5.062-5.404 7.487a19.116 19.116 0 0 0-.697 4.184 11.72 11.72 0 0 0-.012.38v.044l2.286.001H.598a2.286 2.286 0 0 0 2.287 2.287v-2.287l.001 2.287h.045a9.419 9.419 0 0 0 .38-.013 19.11 19.11 0 0 0 4.184-.698c2.424-.694 5.62-2.179 7.486-5.404a2.286 2.286 0 0 0-3.958-2.29c-1.012 1.749-2.874 2.75-4.788 3.299-.244.07-.483.13-.714.183.053-.23.113-.47.183-.714.549-1.914 1.55-3.776 3.298-4.788Z" fill="currentColor"/>
+</svg>
diff --git a/icons/star_filled.svg b/icons/star_filled.svg
index 10a3cfb0c8..2bdea23a41 100644
--- a/icons/star_filled.svg
+++ b/icons/star_filled.svg
@@ -1,3 +1,3 @@
-<svg viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M13.76 17.333a.603.603 0 0 1-.294-.075L9 14.798l-4.467 2.46a.606.606 0 0 1-.663-.051.657.657 0 0 1-.213-.285.69.69 0 0 1-.038-.36l.854-5.21-3.616-3.69a.69.69 0 0 1-.16-.677.663.663 0 0 1 .194-.301c.09-.08.2-.131.316-.149l4.994-.76 2.234-4.74a.65.65 0 0 1 .232-.269.61.61 0 0 1 .666 0c.1.065.18.158.233.269l2.233 4.74 4.994.76c.117.018.226.07.316.149a.66.66 0 0 1 .193.3.69.69 0 0 1-.16.678l-3.614 3.69.853 5.21a.692.692 0 0 1-.14.537.634.634 0 0 1-.216.173.605.605 0 0 1-.265.061Z" fill="currentColor"/>
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M14.76 18.333a.603.603 0 0 1-.294-.075L10 15.798l-4.467 2.46a.607.607 0 0 1-.663-.052.657.657 0 0 1-.213-.285.69.69 0 0 1-.038-.36l.853-5.21-3.615-3.69a.69.69 0 0 1-.16-.677.663.663 0 0 1 .194-.3.615.615 0 0 1 .315-.149l4.995-.76 2.233-4.74a.65.65 0 0 1 .233-.269.61.61 0 0 1 .666 0c.1.065.18.158.232.269l2.234 4.74 4.994.76c.116.018.226.07.316.149.09.079.157.183.193.3a.69.69 0 0 1-.16.678l-3.615 3.69.854 5.21a.692.692 0 0 1-.14.537.636.636 0 0 1-.216.173.607.607 0 0 1-.266.061h.001Z" fill="currentColor"/>
 </svg>
diff --git a/icons/star_outline.svg b/icons/star_outline.svg
index e6fd05339c..bf2eca9845 100644
--- a/icons/star_outline.svg
+++ b/icons/star_outline.svg
@@ -1,3 +1,3 @@
-<svg viewBox="0 0 18 18" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M13.76 17.333a.604.604 0 0 1-.294-.075l.293.075Zm.004 0a.625.625 0 0 0 .477-.234.671.671 0 0 0 .14-.538l-.853-5.21 3.615-3.689a.69.69 0 0 0 .16-.677.663.663 0 0 0-.194-.301.617.617 0 0 0-.316-.149l-4.884-.743a.208.208 0 0 1-.157-.117l-2.186-4.64a.65.65 0 0 0-.233-.269.61.61 0 0 0-.666 0 .65.65 0 0 0-.232.269l-2.186 4.64a.208.208 0 0 1-.158.117l-4.884.743a.618.618 0 0 0-.316.149.663.663 0 0 0-.193.3.69.69 0 0 0 .16.678l3.54 3.614a.208.208 0 0 1 .058.18l-.837 5.105a.69.69 0 0 0 .038.36.657.657 0 0 0 .213.286.613.613 0 0 0 .663.05L8.9 14.854a.208.208 0 0 1 .2 0l4.366 2.405m-7.795-2.915c-.028.172.154.3.307.216L8.9 12.95a.208.208 0 0 1 .2 0l2.923 1.61a.208.208 0 0 0 .306-.216l-.566-3.452a.208.208 0 0 1 .057-.18l2.486-2.536a.208.208 0 0 0-.118-.351l-3.408-.519a.208.208 0 0 1-.157-.117L9.189 4.145a.208.208 0 0 0-.377 0L7.378 7.19a.208.208 0 0 1-.158.117l-3.408.519a.208.208 0 0 0-.117.351l2.485 2.537a.208.208 0 0 1 .057.18l-.566 3.45Zm8.093 2.99h-.003.003Z"/>
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M14.76 18.333a.603.603 0 0 1-.294-.075l.293.075Zm.003 0a.6.6 0 0 0 .262-.061c.083-.04.157-.1.216-.173a.674.674 0 0 0 .14-.538l-.854-5.21 3.616-3.69a.69.69 0 0 0 .16-.677.662.662 0 0 0-.194-.3.617.617 0 0 0-.316-.149l-4.884-.743a.208.208 0 0 1-.158-.117l-2.186-4.64a.651.651 0 0 0-.232-.269.61.61 0 0 0-.666 0 .65.65 0 0 0-.233.269l-2.186 4.64a.208.208 0 0 1-.157.117l-4.885.743a.617.617 0 0 0-.315.149.663.663 0 0 0-.194.3.69.69 0 0 0 .16.678L5.4 12.276a.208.208 0 0 1 .056.18L4.62 17.56a.69.69 0 0 0 .038.36.657.657 0 0 0 .213.285.613.613 0 0 0 .663.052L9.9 15.852a.208.208 0 0 1 .201 0l4.366 2.405m-7.795-2.915c-.028.172.154.3.306.216L9.9 13.95a.208.208 0 0 1 .201 0l2.922 1.61a.208.208 0 0 0 .306-.216l-.565-3.452a.208.208 0 0 1 .057-.18l2.485-2.536a.208.208 0 0 0-.117-.351l-3.409-.52a.208.208 0 0 1-.157-.116l-1.434-3.044a.208.208 0 0 0-.377 0L8.377 8.189a.208.208 0 0 1-.157.117l-3.408.518a.208.208 0 0 0-.118.352l2.486 2.537a.208.208 0 0 1 .057.18l-.566 3.45Zm8.092 2.99h-.003.003Z" fill="currentColor"/>
 </svg>
diff --git a/icons/swap.svg b/icons/swap.svg
new file mode 100644
index 0000000000..63d915c99b
--- /dev/null
+++ b/icons/swap.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M10.98 5.36c-.387 0-.645.258-.645.645a4.485 4.485 0 0 1-4.512 4.512h-.451c-.13 0-.194 0-.322-.064-.13 0-.194-.065-.323-.065-.064 0-.129-.064-.193-.064-.451-.129-.903-.387-1.29-.645-.064-.064-.128-.064-.128-.129-.065-.064-.13-.129-.194-.129-.129-.064-.258-.193-.322-.257l-.129-.13 1.16-.193a.669.669 0 0 0 .516-.773.669.669 0 0 0-.773-.516l-2.128.387-.515.129a.435.435 0 0 0-.387.258 1.195 1.195 0 0 0-.13.45l.517 2.708c.064.323.322.516.644.516h.13a.669.669 0 0 0 .515-.774l-.194-1.095c.13.128.323.257.452.386h.064c.065.065.129.13.193.13.13.128.258.193.452.257.129.258.322.322.515.451h.065c.064.065.193.065.322.13.258.064.516.128.71.193.128 0 .257.064.386.064h.774a5.778 5.778 0 0 0 5.801-5.801c.065-.323-.258-.58-.58-.58ZM.73 6.65c.387 0 .645-.258.645-.645a4.485 4.485 0 0 1 4.513-4.512h.45c.13 0 .194 0 .323.064.13 0 .194.065.323.065.064 0 .128.064.193.064.451.129.902.322 1.29.645.064.064.128.064.193.129.064.064.129.064.193.128.064.065.129.194.258.258l.129.13-1.16.193a.669.669 0 0 0-.516.773c.064.322.322.516.644.516h.13l2.707-.516a.669.669 0 0 0 .515-.773L11.045.526A.669.669 0 0 0 10.27.01a.669.669 0 0 0-.516.773L9.95 1.88c-.13-.129-.322-.322-.451-.386h-.065c-.064-.065-.129-.13-.193-.13-.13-.128-.258-.193-.451-.322C8.596.913 8.403.849 8.21.72h-.065C8.079.655 7.95.655 7.822.59a10.574 10.574 0 0 1-.71-.193c-.128 0-.257-.065-.386-.065h-.773A5.778 5.778 0 0 0 .15 6.134c-.064.258.194.516.58.516Z" fill="currentColor"/>
+</svg>
diff --git a/icons/up.svg b/icons/up.svg
new file mode 100644
index 0000000000..375381a790
--- /dev/null
+++ b/icons/up.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
+  <path fill="currentColor" d="M10.56 5.27A.72.72 0 0 0 10 5a.72.72 0 0 0-.56.27l-6.3 8.585a.729.729 0 0 0-.066.75A.699.699 0 0 0 3.7 15h12.6a.699.699 0 0 0 .626-.396.728.728 0 0 0-.066-.749l-6.3-8.585Z"/>
+</svg>
diff --git a/icons/user_op.svg b/icons/user_op.svg
new file mode 100644
index 0000000000..02bc701401
--- /dev/null
+++ b/icons/user_op.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 30 30">
+  <path fill="currentColor" d="M22.576 11.994a1.212 1.212 0 0 0 0-2.424H9.14L10.703 8a1.212 1.212 0 0 0-1.709-1.709L5.358 9.928a1.212 1.212 0 0 0-.267 1.32 1.212 1.212 0 0 0 1.121.746h16.364Z"/>
+  <path fill="currentColor" fill-rule="evenodd" d="M15.859 18.661c.091-.363.14-.754.14-1.161 0-.445-.059-.871-.167-1.263h7.955a1.213 1.213 0 0 1 1.121.745 1.212 1.212 0 0 1-.267 1.321l-3.636 3.637a1.214 1.214 0 0 1-2.049-.347 1.212 1.212 0 0 1 .34-1.362l1.564-1.57h-5.001Zm-3.633 1.862a3.636 3.636 0 0 0 1.275-1.83 3.615 3.615 0 0 0-.035-2.225 3.638 3.638 0 0 0-1.334-1.787 3.675 3.675 0 0 0-4.264 0 3.638 3.638 0 0 0-1.333 1.787 3.615 3.615 0 0 0-.036 2.226 3.636 3.636 0 0 0 1.275 1.829 5.482 5.482 0 0 0-2.714 2.606.588.588 0 0 0 .038.583.593.593 0 0 0 .51.288h1.413C7.2 22.76 8.465 21.8 10 21.8c1.535 0 2.8.96 2.979 2.2h1.412a.599.599 0 0 0 .511-.288.588.588 0 0 0 .038-.583 5.482 5.482 0 0 0-2.714-2.606ZM11.7 17.5a1.7 1.7 0 1 1-3.4 0 1.7 1.7 0 0 1 3.4 0Z" clip-rule="evenodd"/>
+</svg>
diff --git a/icons/user_op_slim.svg b/icons/user_op_slim.svg
new file mode 100644
index 0000000000..d8c64b52b8
--- /dev/null
+++ b/icons/user_op_slim.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 21">
+  <path d="m.29 5.053 3.722-3.828a.972.972 0 0 1 1.337.06c.177.183.283.429.292.69.01.257-.074.509-.234.704L3.399 4.751H17.77c.262 0 .514.107.7.3a1.05 1.05 0 0 1 0 1.459.976.976 0 0 1-.7.298H.987a.969.969 0 0 1-.55-.17 1.021 1.021 0 0 1-.368-.46 1.062 1.062 0 0 1 .22-1.125zm18.723 6a.97.97 0 0 1 .55.17c.163.111.292.271.368.46a1.061 1.061 0 0 1-.22 1.125l-3.737 3.841-.006.008a.997.997 0 0 1-.322.255.966.966 0 0 1-1.13-.197c-.097-.1-.174-.22-.224-.352a1.067 1.067 0 0 1 .03-.828c.06-.128.146-.241.25-.333l.008-.006 2.02-2.087h-5.88c.103-.684.183-1.403 0-2.072zM8.501 13.694a3.636 3.636 0 0 1-1.275 1.829 5.482 5.482 0 0 1 2.714 2.606.588.588 0 0 1-.038.583.593.593 0 0 1-.51.288H7.978C7.8 17.76 6.535 16.8 5 16.8s-2.8.96-2.979 2.2H.61a.599.599 0 0 1-.511-.288.588.588 0 0 1-.038-.583 5.482 5.482 0 0 1 2.714-2.606 3.636 3.636 0 0 1-1.275-1.83 3.615 3.615 0 0 1 .036-2.224A3.638 3.638 0 0 1 2.868 9.68a3.675 3.675 0 0 1 4.264 0 3.638 3.638 0 0 1 1.333 1.788c.246.72.259 1.497.036 2.225zM6.7 12.5a1.7 1.7 0 1 1-3.4 0 1.7 1.7 0 0 1 3.4 0z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"/>
+</svg>
diff --git a/icons/validator.svg b/icons/validator.svg
new file mode 100644
index 0000000000..e77bb0ba5d
--- /dev/null
+++ b/icons/validator.svg
@@ -0,0 +1,3 @@
+<svg viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M17.671 22.827a4.363 4.363 0 0 0 1.53-2.195 4.338 4.338 0 0 0-.042-2.67 4.366 4.366 0 0 0-1.6-2.145 4.41 4.41 0 0 0-5.117 0 4.366 4.366 0 0 0-1.6 2.145 4.338 4.338 0 0 0-.044 2.67c.267.873.802 1.64 1.53 2.195a6.578 6.578 0 0 0-3.256 3.127.705.705 0 0 0 .046.7.712.712 0 0 0 .613.346h1.246c.461-1.593 2.088-2.77 4.023-2.77 1.936 0 3.562 1.177 4.023 2.77h1.247a.716.716 0 0 0 .612-.346.705.705 0 0 0 .046-.7 6.578 6.578 0 0 0-3.257-3.127Zm-.179-3.489a2.492 2.492 0 1 1-4.984 0 2.492 2.492 0 0 1 4.984 0ZM15.002 3a1 1 0 0 1 .832.445l2.063 3.094 2.482-1.986a1 1 0 0 1 1.605.977l-1.333 6.669a1 1 0 0 1-.98.804h-9.337a1 1 0 0 1-.98-.804l-1.335-6.67a1 1 0 0 1 1.606-.976l2.482 1.986 2.063-3.094A1 1 0 0 1 15.002 3Zm0 2.803-1.836 2.753a1 1 0 0 1-1.456.226l-1.191-.952.635 3.173h7.696l.635-3.173-1.19.952a1 1 0 0 1-1.458-.226l-1.835-2.753Z" fill="currentColor"/>
+</svg>
diff --git a/icons/vertical_dots.svg b/icons/vertical_dots.svg
deleted file mode 100644
index 0d4cf417f4..0000000000
--- a/icons/vertical_dots.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg viewBox="2 2 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M11.667 3.75c0-.688-.563-1.25-1.25-1.25-.688 0-1.25.563-1.25 1.25 0 .688.562 1.25 1.25 1.25.687 0 1.25-.563 1.25-1.25Zm0 12.5c0-.688-.563-1.25-1.25-1.25-.688 0-1.25.563-1.25 1.25 0 .688.562 1.25 1.25 1.25.687 0 1.25-.563 1.25-1.25Zm0-6.25c0-.688-.563-1.25-1.25-1.25-.688 0-1.25.563-1.25 1.25 0 .688.562 1.25 1.25 1.25.687 0 1.25-.563 1.25-1.25Z" fill="currentColor" fill-opacity=".8"/>
-</svg>
diff --git a/jest/lib.tsx b/jest/lib.tsx
index 2c590932cf..048f26733a 100644
--- a/jest/lib.tsx
+++ b/jest/lib.tsx
@@ -1,4 +1,5 @@
 import { ChakraProvider } from '@chakra-ui/react';
+import { GrowthBookProvider } from '@growthbook/growthbook-react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import type { RenderOptions } from '@testing-library/react';
 import { render } from '@testing-library/react';
@@ -19,6 +20,8 @@ const PAGE_PROPS = {
   hash: '',
   number: '',
   q: '',
+  name: '',
+  adBannerProvider: '',
 };
 
 const TestApp = ({ children }: {children: React.ReactNode}) => {
@@ -36,9 +39,11 @@ const TestApp = ({ children }: {children: React.ReactNode}) => {
       <QueryClientProvider client={ queryClient }>
         <AppContextProvider pageProps={ PAGE_PROPS }>
           <ScrollDirectionProvider>
-            <SocketProvider>
-              { children }
-            </SocketProvider>
+            <GrowthBookProvider>
+              <SocketProvider>
+                { children }
+              </SocketProvider>
+            </GrowthBookProvider>
           </ScrollDirectionProvider>
         </AppContextProvider>
       </QueryClientProvider>
diff --git a/lib/api/buildUrl.test.ts b/lib/api/buildUrl.test.ts
new file mode 100644
index 0000000000..29ea283a95
--- /dev/null
+++ b/lib/api/buildUrl.test.ts
@@ -0,0 +1,43 @@
+import buildUrl from './buildUrl';
+
+test('builds URL for resource without path params', () => {
+  const url = buildUrl('config_backend_version');
+  expect(url).toBe('https://localhost:3003/api/v2/config/backend-version');
+});
+
+test('builds URL for resource with path params', () => {
+  const url = buildUrl('block', { height_or_hash: '42' });
+  expect(url).toBe('https://localhost:3003/api/v2/blocks/42');
+});
+
+describe('falsy query parameters', () => {
+  test('leaves "false" as query parameter', () => {
+    const url = buildUrl('block', { height_or_hash: '42' }, { includeTx: false });
+    expect(url).toBe('https://localhost:3003/api/v2/blocks/42?includeTx=false');
+  });
+
+  test('leaves "null" as query parameter', () => {
+    const url = buildUrl('block', { height_or_hash: '42' }, { includeTx: null });
+    expect(url).toBe('https://localhost:3003/api/v2/blocks/42?includeTx=null');
+  });
+
+  test('strips out empty string as query parameter', () => {
+    const url = buildUrl('block', { height_or_hash: '42' }, { includeTx: null, sort: '' });
+    expect(url).toBe('https://localhost:3003/api/v2/blocks/42?includeTx=null');
+  });
+
+  test('strips out "undefined" as query parameter', () => {
+    const url = buildUrl('block', { height_or_hash: '42' }, { includeTx: null, sort: undefined });
+    expect(url).toBe('https://localhost:3003/api/v2/blocks/42?includeTx=null');
+  });
+});
+
+test('builds URL with array-like query parameters', () => {
+  const url = buildUrl('block', { height_or_hash: '42' }, { includeTx: [ '0x11', '0x22' ], sort: 'asc' });
+  expect(url).toBe('https://localhost:3003/api/v2/blocks/42?includeTx=0x11%2C0x22&sort=asc');
+});
+
+test('builds URL for resource with custom API endpoint', () => {
+  const url = buildUrl('token_verified_info', { chainId: '42', hash: '0x11' });
+  expect(url).toBe('https://localhost:3005/api/v1/chains/42/token-infos/0x11');
+});
diff --git a/lib/api/buildUrl.ts b/lib/api/buildUrl.ts
index 2feb358e1c..07805dbd9c 100644
--- a/lib/api/buildUrl.ts
+++ b/lib/api/buildUrl.ts
@@ -9,7 +9,7 @@ import type { ApiResource, ResourceName, ResourcePathParams } from './resources'
 export default function buildUrl<R extends ResourceName>(
   resourceName: R,
   pathParams?: ResourcePathParams<R>,
-  queryParams?: Record<string, string | Array<string> | number | null | undefined>,
+  queryParams?: Record<string, string | Array<string> | number | boolean | null | undefined>,
 ): string {
   const resource: ApiResource = RESOURCES[resourceName];
   const baseUrl = isNeedProxy() ? config.app.baseUrl : (resource.endpoint || config.api.endpoint);
diff --git a/lib/api/resources.ts b/lib/api/resources.ts
index 21d1798204..ae6547ae87 100644
--- a/lib/api/resources.ts
+++ b/lib/api/resources.ts
@@ -31,20 +31,42 @@ import type {
   AddressNFTTokensFilter,
 } from 'types/api/address';
 import type { AddressesResponse } from 'types/api/addresses';
+import type { TxBlobs, Blob } from 'types/api/blobs';
 import type { BlocksResponse, BlockTransactionsResponse, Block, BlockFilters, BlockWithdrawalsResponse } from 'types/api/block';
 import type { ChartMarketResponse, ChartTransactionResponse } from 'types/api/charts';
 import type { BackendVersionConfig } from 'types/api/configs';
-import type { SmartContract, SmartContractReadMethod, SmartContractWriteMethod, SmartContractVerificationConfig, SolidityscanReport } from 'types/api/contract';
+import type {
+  SmartContract,
+  SmartContractReadMethod,
+  SmartContractWriteMethod,
+  SmartContractVerificationConfig,
+  SolidityscanReport,
+  SmartContractSecurityAudits,
+} from 'types/api/contract';
 import type { VerifiedContractsResponse, VerifiedContractsFilters, VerifiedContractsCounters } from 'types/api/contracts';
+import type {
+  EnsAddressLookupFilters,
+  EnsAddressLookupResponse,
+  EnsDomainDetailed,
+  EnsDomainEventsResponse,
+  EnsDomainLookupFilters,
+  EnsDomainLookupResponse,
+  EnsLookupSorting,
+} from 'types/api/ens';
 import type { IndexingStatus } from 'types/api/indexingStatus';
 import type { InternalTransactionsResponse } from 'types/api/internalTransaction';
-import type { L2DepositsResponse, L2DepositsItem } from 'types/api/l2Deposits';
-import type { L2OutputRootsResponse } from 'types/api/l2OutputRoots';
-import type { L2TxnBatchesResponse } from 'types/api/l2TxnBatches';
-import type { L2WithdrawalsResponse } from 'types/api/l2Withdrawals';
 import type { LogsResponseTx, LogsResponseAddress } from 'types/api/log';
+import type { NovesAccountHistoryResponse, NovesDescribeTxsResponse, NovesResponseData } from 'types/api/noves';
+import type {
+  OptimisticL2DepositsResponse,
+  OptimisticL2DepositsItem,
+  OptimisticL2OutputRootsResponse,
+  OptimisticL2TxnBatchesResponse,
+  OptimisticL2WithdrawalsResponse,
+} from 'types/api/optimisticL2';
 import type { RawTracesResponse } from 'types/api/rawTrace';
 import type { SearchRedirectResult, SearchResult, SearchResultFilters, SearchResultItem } from 'types/api/search';
+import type { ShibariumWithdrawalsResponse, ShibariumDepositsResponse } from 'types/api/shibarium';
 import type { Counters, StatsCharts, StatsChart, HomeStats } from 'types/api/stats';
 import type {
   TokenCounters,
@@ -64,24 +86,33 @@ import type {
   Transaction,
   TransactionsResponseWatchlist,
   TransactionsSorting,
+  TransactionsResponseWithBlobs,
 } from 'types/api/transaction';
 import type { TxInterpretationResponse } from 'types/api/txInterpretation';
-import type { TTxsFilters } from 'types/api/txsFilters';
+import type { TTxsFilters, TTxsWithBlobsFilters } from 'types/api/txsFilters';
 import type { TxStateChanges } from 'types/api/txStateChanges';
+import type { UserOpsResponse, UserOp, UserOpsFilters, UserOpsAccount } from 'types/api/userOps';
+import type { ValidatorsCountersResponse, ValidatorsFilters, ValidatorsResponse, ValidatorsSorting } from 'types/api/validators';
 import type { VerifiedContractsSorting } from 'types/api/verifiedContracts';
 import type { VisualizedContract } from 'types/api/visualization';
 import type { WithdrawalsResponse, WithdrawalsCounters } from 'types/api/withdrawals';
-import type { ZkEvmL2TxnBatch, ZkEvmL2TxnBatchesItem, ZkEvmL2TxnBatchesResponse, ZkEvmL2TxnBatchTxs } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatch, ZkEvmL2TxnBatchesItem, ZkEvmL2TxnBatchesResponse, ZkEvmL2TxnBatchTxs } from 'types/api/zkEvmL2';
+import type { ZkSyncBatch, ZkSyncBatchesResponse, ZkSyncBatchTxs } from 'types/api/zkSyncL2';
+import type { MarketplaceAppOverview } from 'types/client/marketplace';
 import type { ArrayElement } from 'types/utils';
 
 import config from 'configs/app';
 
+const marketplaceFeature = getFeaturePayload(config.features.marketplace);
+const marketplaceApi = marketplaceFeature && 'api' in marketplaceFeature ? marketplaceFeature.api : undefined;
+
 export interface ApiResource {
   path: ResourcePath;
   endpoint?: string;
   basePath?: string;
   pathParams?: Array<string>;
   needAuth?: boolean; // for external APIs which require authentication
+  headers?: RequestInit['headers'];
 }
 
 export const SORTING_FIELDS = [ 'sort', 'order' ];
@@ -158,7 +189,7 @@ export const RESOURCES = {
     needAuth: true,
   },
 
-  // STATS
+  // STATS MICROSERVICE API
   stats_counters: {
     path: '/api/v1/counters',
     endpoint: getFeaturePayload(config.features.stats)?.api.endpoint,
@@ -176,6 +207,34 @@ export const RESOURCES = {
     basePath: getFeaturePayload(config.features.stats)?.api.basePath,
   },
 
+  // NAME SERVICE
+  addresses_lookup: {
+    path: '/api/v1/:chainId/addresses\\:lookup',
+    pathParams: [ 'chainId' as const ],
+    endpoint: getFeaturePayload(config.features.nameService)?.api.endpoint,
+    basePath: getFeaturePayload(config.features.nameService)?.api.basePath,
+    filterFields: [ 'address' as const, 'resolved_to' as const, 'owned_by' as const, 'only_active' as const ],
+  },
+  domain_info: {
+    path: '/api/v1/:chainId/domains/:name',
+    pathParams: [ 'chainId' as const, 'name' as const ],
+    endpoint: getFeaturePayload(config.features.nameService)?.api.endpoint,
+    basePath: getFeaturePayload(config.features.nameService)?.api.basePath,
+  },
+  domain_events: {
+    path: '/api/v1/:chainId/domains/:name/events',
+    pathParams: [ 'chainId' as const, 'name' as const ],
+    endpoint: getFeaturePayload(config.features.nameService)?.api.endpoint,
+    basePath: getFeaturePayload(config.features.nameService)?.api.basePath,
+  },
+  domains_lookup: {
+    path: '/api/v1/:chainId/domains\\:lookup',
+    pathParams: [ 'chainId' as const ],
+    endpoint: getFeaturePayload(config.features.nameService)?.api.endpoint,
+    basePath: getFeaturePayload(config.features.nameService)?.api.basePath,
+    filterFields: [ 'name' as const, 'only_active' as const ],
+  },
+
   // VISUALIZATION
   visualize_sol2uml: {
     path: '/api/v1/solidity\\:visualize-contracts',
@@ -183,6 +242,20 @@ export const RESOURCES = {
     basePath: getFeaturePayload(config.features.sol2uml)?.api.basePath,
   },
 
+  // MARKETPLACE
+  marketplace_dapps: {
+    path: '/api/v1/chains/:chainId/marketplace/dapps',
+    pathParams: [ 'chainId' as const ],
+    endpoint: marketplaceApi?.endpoint,
+    basePath: marketplaceApi?.basePath,
+  },
+  marketplace_dapp: {
+    path: '/api/v1/chains/:chainId/marketplace/dapps/:dappId',
+    pathParams: [ 'chainId' as const, 'dappId' as const ],
+    endpoint: marketplaceApi?.endpoint,
+    basePath: marketplaceApi?.basePath,
+  },
+
   // BLOCKS, TXS
   blocks: {
     path: '/api/v2/blocks',
@@ -195,7 +268,7 @@ export const RESOURCES = {
   block_txs: {
     path: '/api/v2/blocks/:height_or_hash/transactions',
     pathParams: [ 'height_or_hash' as const ],
-    filterFields: [],
+    filterFields: [ 'type' as const ],
   },
   block_withdrawals: {
     path: '/api/v2/blocks/:height_or_hash/withdrawals',
@@ -210,6 +283,10 @@ export const RESOURCES = {
     path: '/api/v2/transactions',
     filterFields: [ 'filter' as const, 'type' as const, 'method' as const ],
   },
+  txs_with_blobs: {
+    path: '/api/v2/transactions',
+    filterFields: [ 'type' as const ],
+  },
   txs_watchlist: {
     path: '/api/v2/transactions/watchlist',
     filterFields: [ ],
@@ -247,6 +324,10 @@ export const RESOURCES = {
     pathParams: [ 'hash' as const ],
     filterFields: [],
   },
+  tx_blobs: {
+    path: '/api/v2/transactions/:hash/blobs',
+    pathParams: [ 'hash' as const ],
+  },
   tx_interpretation: {
     path: '/api/v2/transactions/:hash/summary',
     pathParams: [ 'hash' as const ],
@@ -373,6 +454,10 @@ export const RESOURCES = {
     path: '/api/v2/smart-contracts/:hash/solidityscan-report',
     pathParams: [ 'hash' as const ],
   },
+  contract_security_audits: {
+    path: '/api/v2/smart-contracts/:hash/audit-reports',
+    pathParams: [ 'hash' as const ],
+  },
 
   verified_contracts: {
     path: '/api/v2/smart-contracts',
@@ -441,16 +526,21 @@ export const RESOURCES = {
     filterFields: [],
   },
 
-  // HOMEPAGE
-  homepage_stats: {
+  // APP STATS
+  stats: {
     path: '/api/v2/stats',
+    headers: {
+      'updated-gas-oracle': 'true',
+    },
   },
-  homepage_chart_txs: {
+  stats_charts_txs: {
     path: '/api/v2/stats/charts/transactions',
   },
-  homepage_chart_market: {
+  stats_charts_market: {
     path: '/api/v2/stats/charts/market',
   },
+
+  // HOMEPAGE
   homepage_blocks: {
     path: '/api/v2/main-page/blocks',
   },
@@ -472,6 +562,9 @@ export const RESOURCES = {
   homepage_zkevm_latest_batch: {
     path: '/api/v2/main-page/zkevm/batches/latest-number',
   },
+  homepage_zksync_latest_batch: {
+    path: '/api/v2/main-page/zksync/batches/latest-number',
+  },
 
   // SEARCH
   quick_search: {
@@ -486,7 +579,7 @@ export const RESOURCES = {
     path: '/api/v2/search/check-redirect',
   },
 
-  // L2
+  // optimistic L2
   l2_deposits: {
     path: '/api/v2/optimism/deposits',
     filterFields: [],
@@ -523,6 +616,7 @@ export const RESOURCES = {
     path: '/api/v2/optimism/txn-batches/count',
   },
 
+  // zkEvm L2
   zkevm_l2_txn_batches: {
     path: '/api/v2/zkevm/batches',
     filterFields: [],
@@ -536,12 +630,102 @@ export const RESOURCES = {
     path: '/api/v2/zkevm/batches/:number',
     pathParams: [ 'number' as const ],
   },
+
   zkevm_l2_txn_batch_txs: {
     path: '/api/v2/transactions/zkevm-batch/:number',
     pathParams: [ 'number' as const ],
     filterFields: [],
   },
 
+  // zkSync L2
+  zksync_l2_txn_batches: {
+    path: '/api/v2/zksync/batches',
+    filterFields: [],
+  },
+
+  zksync_l2_txn_batches_count: {
+    path: '/api/v2/zksync/batches/count',
+  },
+
+  zksync_l2_txn_batch: {
+    path: '/api/v2/zksync/batches/:number',
+    pathParams: [ 'number' as const ],
+  },
+
+  zksync_l2_txn_batch_txs: {
+    path: '/api/v2/transactions/zksync-batch/:number',
+    pathParams: [ 'number' as const ],
+    filterFields: [],
+  },
+
+  // SHIBARIUM L2
+  shibarium_deposits: {
+    path: '/api/v2/shibarium/deposits',
+    filterFields: [],
+  },
+
+  shibarium_deposits_count: {
+    path: '/api/v2/shibarium/deposits/count',
+  },
+
+  shibarium_withdrawals: {
+    path: '/api/v2/shibarium/withdrawals',
+    filterFields: [],
+  },
+
+  shibarium_withdrawals_count: {
+    path: '/api/v2/shibarium/withdrawals/count',
+  },
+
+  // NOVES-FI
+  noves_transaction: {
+    path: '/api/v2/proxy/noves-fi/transactions/:hash',
+    pathParams: [ 'hash' as const ],
+  },
+  noves_address_history: {
+    path: '/api/v2/proxy/noves-fi/addresses/:address/transactions',
+    pathParams: [ 'address' as const ],
+    filterFields: [],
+  },
+  noves_describe_txs: {
+    path: '/api/v2/proxy/noves-fi/transaction-descriptions',
+  },
+
+  // USER OPS
+  user_ops: {
+    path: '/api/v2/proxy/account-abstraction/operations',
+    filterFields: [ 'transaction_hash' as const, 'sender' as const ],
+  },
+  user_op: {
+    path: '/api/v2/proxy/account-abstraction/operations/:hash',
+    pathParams: [ 'hash' as const ],
+  },
+  user_ops_account: {
+    path: '/api/v2/proxy/account-abstraction/accounts/:hash',
+    pathParams: [ 'hash' as const ],
+  },
+  user_op_interpretation: {
+    path: '/api/v2/proxy/account-abstraction/operations/:hash/summary',
+    pathParams: [ 'hash' as const ],
+  },
+
+  // VALIDATORS
+  validators: {
+    path: '/api/v2/validators/:chainType',
+    pathParams: [ 'chainType' as const ],
+    filterFields: [ 'address_hash' as const, 'state_filter' as const ],
+  },
+  validators_counters: {
+    path: '/api/v2/validators/:chainType/counters',
+    pathParams: [ 'chainType' as const ],
+  },
+
+  // BLOBS
+  blob: {
+    path: '/api/v2/blobs/:hash',
+    pathParams: [ 'hash' as const ],
+  },
+
   // CONFIGS
   config_backend_version: {
     path: '/api/v2/config/backend-version',
@@ -604,8 +788,8 @@ export interface ResourceError<T = unknown> {
 export type ResourceErrorAccount<T> = ResourceError<{ errors: T }>
 
 export type PaginatedResources = 'blocks' | 'block_txs' |
-'txs_validated' | 'txs_pending' | 'txs_watchlist' | 'txs_execution_node' |
-'tx_internal_txs' | 'tx_logs' | 'tx_token_transfers' | 'tx_state_changes' |
+'txs_validated' | 'txs_pending' | 'txs_with_blobs' | 'txs_watchlist' | 'txs_execution_node' |
+'tx_internal_txs' | 'tx_logs' | 'tx_token_transfers' | 'tx_state_changes' | 'tx_blobs' |
 'addresses' |
 'address_txs' | 'address_internal_txs' | 'address_token_transfers' | 'address_blocks_validated' | 'address_coin_balance' |
 'search' |
@@ -614,14 +798,20 @@ export type PaginatedResources = 'blocks' | 'block_txs' |
 'token_instance_transfers' | 'token_instance_holders' |
 'verified_contracts' |
 'l2_output_roots' | 'l2_withdrawals' | 'l2_txn_batches' | 'l2_deposits' |
+'shibarium_deposits' | 'shibarium_withdrawals' |
 'zkevm_l2_txn_batches' | 'zkevm_l2_txn_batch_txs' |
+'zksync_l2_txn_batches' | 'zksync_l2_txn_batch_txs' |
 'withdrawals' | 'address_withdrawals' | 'block_withdrawals' |
-'watchlist' | 'private_tags_address' | 'private_tags_tx';
+'watchlist' | 'private_tags_address' | 'private_tags_tx' |
+'domains_lookup' | 'addresses_lookup' | 'user_ops' | 'validators' | 'noves_address_history';
 
 export type PaginatedResponse<Q extends PaginatedResources> = ResourcePayload<Q>;
 
 /* eslint-disable @typescript-eslint/indent */
-export type ResourcePayload<Q extends ResourceName> =
+// !!! IMPORTANT !!!
+// Don't add any new types here because TypeScript cannot handle it properly
+// use ResourcePayloadB instead
+export type ResourcePayloadA<Q extends ResourceName> =
 Q extends 'user_info' ? UserInfo :
 Q extends 'custom_abi' ? CustomAbis :
 Q extends 'public_tags' ? PublicTags :
@@ -632,16 +822,17 @@ Q extends 'watchlist' ? WatchlistResponse :
 Q extends 'verified_addresses' ? VerifiedAddressResponse :
 Q extends 'token_info_applications_config' ? TokenInfoApplicationConfig :
 Q extends 'token_info_applications' ? TokenInfoApplications :
-Q extends 'homepage_stats' ? HomeStats :
-Q extends 'homepage_chart_txs' ? ChartTransactionResponse :
-Q extends 'homepage_chart_market' ? ChartMarketResponse :
+Q extends 'stats' ? HomeStats :
+Q extends 'stats_charts_txs' ? ChartTransactionResponse :
+Q extends 'stats_charts_market' ? ChartMarketResponse :
 Q extends 'homepage_blocks' ? Array<Block> :
 Q extends 'homepage_txs' ? Array<Transaction> :
 Q extends 'homepage_txs_watchlist' ? Array<Transaction> :
-Q extends 'homepage_deposits' ? Array<L2DepositsItem> :
+Q extends 'homepage_deposits' ? Array<OptimisticL2DepositsItem> :
 Q extends 'homepage_zkevm_l2_batches' ? { items: Array<ZkEvmL2TxnBatchesItem> } :
 Q extends 'homepage_indexing_status' ? IndexingStatus :
 Q extends 'homepage_zkevm_latest_batch' ? number :
+Q extends 'homepage_zksync_latest_batch' ? number :
 Q extends 'stats_counters' ? Counters :
 Q extends 'stats_lines' ? StatsCharts :
 Q extends 'stats_line' ? StatsChart :
@@ -651,6 +842,7 @@ Q extends 'block_txs' ? BlockTransactionsResponse :
 Q extends 'block_withdrawals' ? BlockWithdrawalsResponse :
 Q extends 'txs_validated' ? TransactionsResponseValidated :
 Q extends 'txs_pending' ? TransactionsResponsePending :
+Q extends 'txs_with_blobs' ? TransactionsResponseWithBlobs :
 Q extends 'txs_watchlist' ? TransactionsResponseWatchlist :
 Q extends 'txs_execution_node' ? TransactionsResponseValidated :
 Q extends 'tx' ? Transaction :
@@ -659,6 +851,7 @@ Q extends 'tx_logs' ? LogsResponseTx :
 Q extends 'tx_token_transfers' ? TokenTransferResponse :
 Q extends 'tx_raw_trace' ? RawTracesResponse :
 Q extends 'tx_state_changes' ? TxStateChanges :
+Q extends 'tx_blobs' ? TxBlobs :
 Q extends 'tx_interpretation' ? TxInterpretationResponse :
 Q extends 'addresses' ? AddressesResponse :
 Q extends 'address' ? Address :
@@ -703,10 +896,10 @@ Q extends 'visualize_sol2uml' ? VisualizedContract :
 Q extends 'contract_verification_config' ? SmartContractVerificationConfig :
 Q extends 'withdrawals' ? WithdrawalsResponse :
 Q extends 'withdrawals_counters' ? WithdrawalsCounters :
-Q extends 'l2_output_roots' ? L2OutputRootsResponse :
-Q extends 'l2_withdrawals' ? L2WithdrawalsResponse :
-Q extends 'l2_deposits' ? L2DepositsResponse :
-Q extends 'l2_txn_batches' ? L2TxnBatchesResponse :
+Q extends 'l2_output_roots' ? OptimisticL2OutputRootsResponse :
+Q extends 'l2_withdrawals' ? OptimisticL2WithdrawalsResponse :
+Q extends 'l2_deposits' ? OptimisticL2DepositsResponse :
+Q extends 'l2_txn_batches' ? OptimisticL2TxnBatchesResponse :
 Q extends 'l2_output_roots_count' ? number :
 Q extends 'l2_withdrawals_count' ? number :
 Q extends 'l2_deposits_count' ? number :
@@ -717,12 +910,52 @@ Q extends 'zkevm_l2_txn_batch' ? ZkEvmL2TxnBatch :
 Q extends 'zkevm_l2_txn_batch_txs' ? ZkEvmL2TxnBatchTxs :
 Q extends 'config_backend_version' ? BackendVersionConfig :
 never;
+// !!! IMPORTANT !!!
+// See comment above
 /* eslint-enable @typescript-eslint/indent */
 
+/* eslint-disable @typescript-eslint/indent */
+export type ResourcePayloadB<Q extends ResourceName> =
+Q extends 'blob' ? Blob :
+Q extends 'marketplace_dapps' ? Array<MarketplaceAppOverview> :
+Q extends 'marketplace_dapp' ? MarketplaceAppOverview :
+Q extends 'validators' ? ValidatorsResponse :
+Q extends 'validators_counters' ? ValidatorsCountersResponse :
+Q extends 'shibarium_withdrawals' ? ShibariumWithdrawalsResponse :
+Q extends 'shibarium_deposits' ? ShibariumDepositsResponse :
+Q extends 'shibarium_withdrawals_count' ? number :
+Q extends 'shibarium_deposits_count' ? number :
+Q extends 'zksync_l2_txn_batches' ? ZkSyncBatchesResponse :
+Q extends 'zksync_l2_txn_batches_count' ? number :
+Q extends 'zksync_l2_txn_batch' ? ZkSyncBatch :
+Q extends 'zksync_l2_txn_batch_txs' ? ZkSyncBatchTxs :
+Q extends 'contract_security_audits' ? SmartContractSecurityAudits :
+Q extends 'addresses_lookup' ? EnsAddressLookupResponse :
+Q extends 'domain_info' ? EnsDomainDetailed :
+Q extends 'domain_events' ? EnsDomainEventsResponse :
+Q extends 'domains_lookup' ? EnsDomainLookupResponse :
+Q extends 'user_ops' ? UserOpsResponse :
+Q extends 'user_op' ? UserOp :
+Q extends 'user_ops_account' ? UserOpsAccount :
+Q extends 'user_op_interpretation'? TxInterpretationResponse :
+Q extends 'noves_transaction' ? NovesResponseData :
+Q extends 'noves_address_history' ? NovesAccountHistoryResponse :
+Q extends 'noves_describe_txs' ? NovesDescribeTxsResponse :
+never;
+/* eslint-enable @typescript-eslint/indent */
+
+export type ResourcePayload<Q extends ResourceName> = ResourcePayloadA<Q> | ResourcePayloadB<Q>;
+export type PaginatedResponseItems<Q extends ResourceName> = Q extends PaginatedResources ? ResourcePayloadA<Q>['items'] | ResourcePayloadB<Q>['items'] : never;
+export type PaginatedResponseNextPageParams<Q extends ResourceName> = Q extends PaginatedResources ?
+  ResourcePayloadA<Q>['next_page_params'] | ResourcePayloadB<Q>['next_page_params'] :
+  never;
+
 /* eslint-disable @typescript-eslint/indent */
 export type PaginationFilters<Q extends PaginatedResources> =
 Q extends 'blocks' ? BlockFilters :
+Q extends 'block_txs' ? TTxsWithBlobsFilters :
 Q extends 'txs_validated' | 'txs_pending' ? TTxsFilters :
+Q extends 'txs_with_blobs' ? TTxsWithBlobsFilters :
 Q extends 'tx_token_transfers' ? TokenTransferFilters :
 Q extends 'token_transfers' ? TokenTransferFilters :
 Q extends 'address_txs' | 'address_internal_txs' ? AddressTxsFilters :
@@ -735,6 +968,10 @@ Q extends 'token_inventory' ? TokenInventoryFilters :
 Q extends 'tokens' ? TokensFilters :
 Q extends 'tokens_bridged' ? TokensBridgedFilters :
 Q extends 'verified_contracts' ? VerifiedContractsFilters :
+Q extends 'addresses_lookup' ? EnsAddressLookupFilters :
+Q extends 'domains_lookup' ? EnsDomainLookupFilters :
+Q extends 'user_ops' ? UserOpsFilters :
+Q extends 'validators' ? ValidatorsFilters :
 never;
 /* eslint-enable @typescript-eslint/indent */
 
@@ -744,5 +981,8 @@ Q extends 'tokens' ? TokensSorting :
 Q extends 'tokens_bridged' ? TokensSorting :
 Q extends 'verified_contracts' ? VerifiedContractsSorting :
 Q extends 'address_txs' ? TransactionsSorting :
+Q extends 'addresses_lookup' ? EnsLookupSorting :
+Q extends 'domains_lookup' ? EnsLookupSorting :
+Q extends 'validators' ? ValidatorsSorting :
 never;
 /* eslint-enable @typescript-eslint/indent */
diff --git a/lib/api/useApiFetch.tsx b/lib/api/useApiFetch.tsx
index 453f3dc753..85da773ab1 100644
--- a/lib/api/useApiFetch.tsx
+++ b/lib/api/useApiFetch.tsx
@@ -1,4 +1,5 @@
 import { useQueryClient } from '@tanstack/react-query';
+import _omit from 'lodash/omit';
 import _pickBy from 'lodash/pickBy';
 import React from 'react';
 
@@ -18,8 +19,8 @@ import type { ApiResource, ResourceName, ResourcePathParams } from './resources'
 
 export interface Params<R extends ResourceName> {
   pathParams?: ResourcePathParams<R>;
-  queryParams?: Record<string, string | Array<string> | number | undefined>;
-  fetchParams?: Pick<FetchParams, 'body' | 'method' | 'signal'>;
+  queryParams?: Record<string, string | Array<string> | number | boolean | undefined>;
+  fetchParams?: Pick<FetchParams, 'body' | 'method' | 'signal' | 'headers'>;
 }
 
 export default function useApiFetch() {
@@ -40,6 +41,8 @@ export default function useApiFetch() {
       'x-endpoint': resource.endpoint && isNeedProxy() ? resource.endpoint : undefined,
       Authorization: resource.endpoint && resource.needAuth ? apiToken : undefined,
       'x-csrf-token': withBody && csrfToken ? csrfToken : undefined,
+      ...resource.headers,
+      ...fetchParams?.headers,
     }, Boolean) as HeadersInit;
 
     return fetch<SuccessType, ErrorType>(
@@ -51,10 +54,11 @@ export default function useApiFetch() {
         // change condition here if something is changed
         credentials: config.features.account.isEnabled ? 'include' : 'same-origin',
         headers,
-        ...fetchParams,
+        ..._omit(fetchParams, 'headers'),
       },
       {
         resource: resource.path,
+        omitSentryErrorLog: true, // disable logging of API errors to Sentry
       },
     );
   }, [ fetch, csrfToken ]);
diff --git a/lib/api/useQueryClientConfig.tsx b/lib/api/useQueryClientConfig.tsx
index 6ff2fed457..b7a8fd2550 100644
--- a/lib/api/useQueryClientConfig.tsx
+++ b/lib/api/useQueryClientConfig.tsx
@@ -4,20 +4,22 @@ import React from 'react';
 import getErrorObjPayload from 'lib/errors/getErrorObjPayload';
 import getErrorObjStatusCode from 'lib/errors/getErrorObjStatusCode';
 
+export const retry = (failureCount: number, error: unknown) => {
+  const errorPayload = getErrorObjPayload<{ status: number }>(error);
+  const status = errorPayload?.status || getErrorObjStatusCode(error);
+  if (status && status >= 400 && status < 500) {
+    // don't do retry for client error responses
+    return false;
+  }
+  return failureCount < 2;
+};
+
 export default function useQueryClientConfig() {
   const [ queryClient ] = React.useState(() => new QueryClient({
     defaultOptions: {
       queries: {
         refetchOnWindowFocus: false,
-        retry: (failureCount, error) => {
-          const errorPayload = getErrorObjPayload<{ status: number }>(error);
-          const status = errorPayload?.status || getErrorObjStatusCode(error);
-          if (status && status >= 400 && status < 500) {
-            // don't do retry for client error responses
-            return false;
-          }
-          return failureCount < 2;
-        },
+        retry,
         throwOnError: (error) => {
           const status = getErrorObjStatusCode(error);
           // don't catch error for "Too many requests" response
diff --git a/lib/blob/guessDataType.ts b/lib/blob/guessDataType.ts
new file mode 100644
index 0000000000..fb409019e3
--- /dev/null
+++ b/lib/blob/guessDataType.ts
@@ -0,0 +1,12 @@
+import filetype from 'magic-bytes.js';
+
+import hexToBytes from 'lib/hexToBytes';
+
+import removeNonSignificantZeroBytes from './removeNonSignificantZeroBytes';
+
+export default function guessDataType(data: string) {
+  const bytes = new Uint8Array(hexToBytes(data));
+  const filteredBytes = removeNonSignificantZeroBytes(bytes);
+
+  return filetype(filteredBytes)[0];
+}
diff --git a/lib/blob/index.ts b/lib/blob/index.ts
new file mode 100644
index 0000000000..ab178e8231
--- /dev/null
+++ b/lib/blob/index.ts
@@ -0,0 +1 @@
+export { default as guessDataType } from './guessDataType';
diff --git a/lib/blob/removeNonSignificantZeroBytes.ts b/lib/blob/removeNonSignificantZeroBytes.ts
new file mode 100644
index 0000000000..9b25287478
--- /dev/null
+++ b/lib/blob/removeNonSignificantZeroBytes.ts
@@ -0,0 +1,20 @@
+export default function removeNonSignificantZeroBytes(bytes: Uint8Array) {
+  return shouldRemoveBytes(bytes) ? bytes.filter((item, index) => index % 32) : bytes;
+}
+
+// check if every 0, 32, 64, etc byte is 0 in the provided array
+function shouldRemoveBytes(bytes: Uint8Array) {
+  let result = true;
+
+  for (let index = 0; index < bytes.length; index += 32) {
+    const element = bytes[index];
+    if (element === 0) {
+      continue;
+    } else {
+      result = false;
+      break;
+    }
+  }
+
+  return result;
+}
diff --git a/lib/bytesToBase64.ts b/lib/bytesToBase64.ts
new file mode 100644
index 0000000000..60b23ad437
--- /dev/null
+++ b/lib/bytesToBase64.ts
@@ -0,0 +1,10 @@
+export default function bytesToBase64(bytes: Uint8Array) {
+  let binary = '';
+  for (const byte of bytes) {
+    binary += String.fromCharCode(byte);
+  }
+
+  const base64String = btoa(binary);
+
+  return base64String;
+}
diff --git a/lib/contexts/addressHighlight.tsx b/lib/contexts/addressHighlight.tsx
new file mode 100644
index 0000000000..84f5f896ec
--- /dev/null
+++ b/lib/contexts/addressHighlight.tsx
@@ -0,0 +1,69 @@
+import React from 'react';
+
+interface AddressHighlightProviderProps {
+  children: React.ReactNode;
+}
+
+interface TAddressHighlightContext {
+  onMouseEnter: (event: React.MouseEvent) => void;
+  onMouseLeave: (event: React.MouseEvent) => void;
+}
+
+export const AddressHighlightContext = React.createContext<TAddressHighlightContext | null>(null);
+
+export function AddressHighlightProvider({ children }: AddressHighlightProviderProps) {
+  const timeoutId = React.useRef<number | null>(null);
+  const hashRef = React.useRef<string | null>(null);
+
+  const onMouseEnter = React.useCallback((event: React.MouseEvent) => {
+    const hash = event.currentTarget.getAttribute('data-hash');
+    if (hash) {
+      hashRef.current = hash;
+      timeoutId.current = window.setTimeout(() => {
+        // for better performance we update DOM-nodes directly bypassing React reconciliation
+        const nodes = window.document.querySelectorAll(`[data-hash="${ hashRef.current }"]`);
+        for (const node of nodes) {
+          node.classList.add('address-entity_highlighted');
+        }
+      }, 100);
+    }
+  }, []);
+
+  const onMouseLeave = React.useCallback(() => {
+    if (hashRef.current) {
+      const nodes = window.document.querySelectorAll(`[data-hash="${ hashRef.current }"]`);
+      for (const node of nodes) {
+        node.classList.remove('address-entity_highlighted');
+      }
+      hashRef.current = null;
+    }
+    typeof timeoutId.current === 'number' && window.clearTimeout(timeoutId.current);
+  }, []);
+
+  const value = React.useMemo(() => {
+    return {
+      onMouseEnter,
+      onMouseLeave,
+    };
+  }, [ onMouseEnter, onMouseLeave ]);
+
+  React.useEffect(() => {
+    return () => {
+      typeof timeoutId.current === 'number' && window.clearTimeout(timeoutId.current);
+    };
+  }, []);
+
+  return (
+    <AddressHighlightContext.Provider value={ value }>
+      { children }
+    </AddressHighlightContext.Provider>
+  );
+}
+
+export function useAddressHighlightContext() {
+  const context = React.useContext(AddressHighlightContext);
+  if (context === undefined) {
+    return null;
+  }
+  return context;
+}
diff --git a/lib/contexts/app.tsx b/lib/contexts/app.tsx
index f0a1eec14e..1d7c7bf8c3 100644
--- a/lib/contexts/app.tsx
+++ b/lib/contexts/app.tsx
@@ -15,6 +15,8 @@ const AppContext = createContext<PageProps>({
   hash: '',
   number: '',
   q: '',
+  name: '',
+  adBannerProvider: '',
 });
 
 export function AppContextProvider({ children, pageProps }: Props) {
diff --git a/lib/contracts/licenses.ts b/lib/contracts/licenses.ts
new file mode 100644
index 0000000000..123149e294
--- /dev/null
+++ b/lib/contracts/licenses.ts
@@ -0,0 +1,88 @@
+import type { ContractLicense } from 'types/client/contract';
+
+export const CONTRACT_LICENSES: Array<ContractLicense> = [
+  {
+    type: 'none',
+    label: 'None',
+    title: 'No License',
+    url: 'https://choosealicense.com/no-permission/',
+  },
+  {
+    type: 'unlicense',
+    label: 'Unlicense',
+    title: 'The Unlicense',
+    url: 'https://choosealicense.com/licenses/unlicense/',
+  },
+  {
+    type: 'mit',
+    label: 'MIT',
+    title: 'MIT License',
+    url: 'https://choosealicense.com/licenses/mit/',
+  },
+  {
+    type: 'gnu_gpl_v2',
+    label: 'GNU GPLv2',
+    title: 'GNU General Public License v2.0',
+    url: 'https://choosealicense.com/licenses/gpl-2.0/',
+  },
+  {
+    type: 'gnu_gpl_v3',
+    label: 'GNU GPLv3',
+    title: 'GNU General Public License v3.0',
+    url: 'https://choosealicense.com/licenses/gpl-3.0/',
+  },
+  {
+    type: 'gnu_lgpl_v2_1',
+    label: 'GNU LGPLv2.1',
+    title: 'GNU Lesser General Public License v2.1',
+    url: 'https://choosealicense.com/licenses/lgpl-2.1/',
+  },
+  {
+    type: 'gnu_lgpl_v3',
+    label: 'GNU LGPLv3',
+    title: 'GNU Lesser General Public License v3.0',
+    url: 'https://choosealicense.com/licenses/lgpl-3.0/',
+  },
+  {
+    type: 'bsd_2_clause',
+    label: 'BSD-2-Clause',
+    title: 'BSD 2-clause "Simplified" license',
+    url: 'https://choosealicense.com/licenses/bsd-2-clause/',
+  },
+  {
+    type: 'bsd_3_clause',
+    label: 'BSD-3-Clause',
+    title: 'BSD 3-clause "New" Or "Revised" license',
+    url: 'https://choosealicense.com/licenses/bsd-3-clause/',
+  },
+  {
+    type: 'mpl_2_0',
+    label: 'MPL-2.0',
+    title: 'Mozilla Public License 2.0',
+    url: 'https://choosealicense.com/licenses/mpl-2.0/',
+  },
+  {
+    type: 'osl_3_0',
+    label: 'OSL-3.0',
+    title: 'Open Software License 3.0',
+    url: 'https://choosealicense.com/licenses/osl-3.0/',
+  },
+  {
+    type: 'apache_2_0',
+    label: 'Apache',
+    title: 'Apache 2.0',
+    url: 'https://choosealicense.com/licenses/apache-2.0/',
+  },
+  {
+    type: 'gnu_agpl_v3',
+    label: 'GNU AGPLv3',
+    title: 'GNU Affero General Public License',
+    url: 'https://choosealicense.com/licenses/agpl-3.0/',
+  },
+  {
+    type: 'bsl_1_1',
+    label: 'BSL 1.1',
+    title: 'Business Source License',
+    url: 'https://mariadb.com/bsl11/',
+  },
+];
diff --git a/lib/cookies.ts b/lib/cookies.ts
index 4e2d494102..cef6a38a42 100644
--- a/lib/cookies.ts
+++ b/lib/cookies.ts
@@ -10,10 +10,12 @@ export enum NAMES {
   TXS_SORT='txs_sort',
   COLOR_MODE='chakra-ui-color-mode',
   COLOR_MODE_HEX='chakra-ui-color-mode-hex',
+  ADDRESS_IDENTICON_TYPE='address_identicon_type',
   INDEXING_ALERT='indexing_alert',
   ADBLOCK_DETECTED='adblock_detected',
   MIXPANEL_DEBUG='_mixpanel_debug',
-  ADDRESS_NFT_DISPLAY_TYPE='address_nft_display_type'
+  ADDRESS_NFT_DISPLAY_TYPE='address_nft_display_type',
+  UUID='uuid',
 }
 
 export function get(name?: NAMES | undefined | null, serverCookie?: string) {
diff --git a/lib/errors/throwOnAbsentParamError.ts b/lib/errors/throwOnAbsentParamError.ts
new file mode 100644
index 0000000000..5978b600a5
--- /dev/null
+++ b/lib/errors/throwOnAbsentParamError.ts
@@ -0,0 +1,5 @@
+export default function throwOnAbsentParamError(param: unknown) {
+  if (!param) {
+    throw new Error('Required param not provided', { cause: { status: 404 } });
+  }
+}
diff --git a/lib/errors/throwOnResourceLoadError.ts b/lib/errors/throwOnResourceLoadError.ts
new file mode 100644
index 0000000000..32e5169fc7
--- /dev/null
+++ b/lib/errors/throwOnResourceLoadError.ts
@@ -0,0 +1,19 @@
+import type { ResourceError, ResourceName } from 'lib/api/resources';
+
+type Params = ({
+  isError: true;
+  error: ResourceError<unknown>;
+} | {
+  isError: false;
+  error: null;
+}) & {
+  resource?: ResourceName;
+}
+
+export const RESOURCE_LOAD_ERROR_MESSAGE = 'Resource load error';
+
+export default function throwOnResourceLoadError({ isError, error, resource }: Params) {
+  if (isError) {
+    throw Error(RESOURCE_LOAD_ERROR_MESSAGE, { cause: { ...error, resource } as unknown as Error });
+  }
+}
diff --git a/lib/growthbook/consts.ts b/lib/growthbook/consts.ts
new file mode 100644
index 0000000000..b687eedbb3
--- /dev/null
+++ b/lib/growthbook/consts.ts
@@ -0,0 +1,2 @@
+export const STORAGE_KEY = 'growthbook:experiments';
+export const STORAGE_LIMIT = 20;
diff --git a/lib/growthbook/init.ts b/lib/growthbook/init.ts
new file mode 100644
index 0000000000..10674a4fcc
--- /dev/null
+++ b/lib/growthbook/init.ts
@@ -0,0 +1,70 @@
+import { GrowthBook } from '@growthbook/growthbook-react';
+
+import config from 'configs/app';
+import * as mixpanel from 'lib/mixpanel';
+
+import { STORAGE_KEY, STORAGE_LIMIT } from './consts';
+
+export interface GrowthBookFeatures {
+  test_value: string;
+  security_score_exp: boolean;
+}
+
+export const growthBook = (() => {
+  const feature = config.features.growthBook;
+
+  if (!feature.isEnabled) {
+    return;
+  }
+
+  return new GrowthBook<GrowthBookFeatures>({
+    apiHost: 'https://cdn.growthbook.io',
+    clientKey: feature.clientKey,
+    enableDevMode: config.app.isDev,
+    attributes: {
+      id: mixpanel.getUuid(),
+      chain_id: config.chain.id,
+    },
+    trackingCallback: (experiment, result) => {
+      if (isExperimentStarted(experiment.key)) {
+        return;
+      }
+
+      saveExperimentInStorage(experiment.key);
+      mixpanel.logEvent(mixpanel.EventTypes.EXPERIMENT_STARTED, {
+        'Experiment name': experiment.key,
+        'Variant name': result.value,
+        Source: 'growthbook',
+      });
+    },
+  });
+})();
+
+function getStorageValue(): Array<unknown> | undefined {
+  const item = window.localStorage.getItem(STORAGE_KEY);
+  if (!item) {
+    return;
+  }
+
+  try {
+    const parsedValue = JSON.parse(item);
+    if (Array.isArray(parsedValue)) {
+      return parsedValue;
+    }
+  } catch {
+    return;
+  }
+}
+
+function isExperimentStarted(key: string): boolean {
+  const items = getStorageValue() ?? [];
+  return items.some((item) => item === key);
+}
+
+function saveExperimentInStorage(key: string) {
+  const items = getStorageValue() ?? [];
+  const newItems = [ key, ...items ].slice(0, STORAGE_LIMIT);
+  try {
+    window.localStorage.setItem(STORAGE_KEY, JSON.stringify(newItems));
+  } catch (error) {}
+}
diff --git a/lib/growthbook/useFeatureValue.ts b/lib/growthbook/useFeatureValue.ts
new file mode 100644
index 0000000000..7dde7e8522
--- /dev/null
+++ b/lib/growthbook/useFeatureValue.ts
@@ -0,0 +1,14 @@
+import type { WidenPrimitives } from '@growthbook/growthbook';
+import { useFeatureValue, useGrowthBook } from '@growthbook/growthbook-react';
+
+import type { GrowthBookFeatures } from './init';
+
+export default function useGbFeatureValue<Name extends keyof GrowthBookFeatures>(
+  name: Name,
+  fallback: GrowthBookFeatures[Name],
+): { value: WidenPrimitives<GrowthBookFeatures[Name]>; isLoading: boolean } {
+  const value = useFeatureValue(name, fallback);
+  const growthBook = useGrowthBook();
+
+  return { value, isLoading: !(growthBook?.ready ?? true) };
+}
diff --git a/lib/growthbook/useLoadFeatures.ts b/lib/growthbook/useLoadFeatures.ts
new file mode 100644
index 0000000000..993e84505c
--- /dev/null
+++ b/lib/growthbook/useLoadFeatures.ts
@@ -0,0 +1,17 @@
+import React from 'react';
+
+import { SECOND } from 'lib/consts';
+
+import { growthBook } from './init';
+
+export default function useLoadFeatures() {
+  React.useEffect(() => {
+    growthBook?.setAttributes({
+      ...growthBook.getAttributes(),
+      timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
+      language: window.navigator.language,
+    });
+
+    growthBook?.loadFeatures({ timeout: SECOND });
+  }, []);
+}
diff --git a/lib/hexToBase64.ts b/lib/hexToBase64.ts
new file mode 100644
index 0000000000..5b1366a6da
--- /dev/null
+++ b/lib/hexToBase64.ts
@@ -0,0 +1,8 @@
+import bytesToBase64 from './bytesToBase64';
+import hexToBytes from './hexToBytes';
+
+export default function hexToBase64(hex: string) {
+  const bytes = new Uint8Array(hexToBytes(hex));
+
+  return bytesToBase64(bytes);
+}
diff --git a/lib/hexToBytes.ts b/lib/hexToBytes.ts
index 382fd777d3..e34435fbf4 100644
--- a/lib/hexToBytes.ts
+++ b/lib/hexToBytes.ts
@@ -1,6 +1,8 @@
+// hex can be with prefix  - `0x{string}` - or without it - `{string}`
 export default function hexToBytes(hex: string) {
   const bytes = [];
-  for (let c = 0; c < hex.length; c += 2) {
+  const startIndex = hex.startsWith('0x') ? 2 : 0;
+  for (let c = startIndex; c < hex.length; c += 2) {
     bytes.push(parseInt(hex.substring(c, c + 2), 16));
   }
   return bytes;
diff --git a/lib/hexToDecimal.ts b/lib/hexToDecimal.ts
new file mode 100644
index 0000000000..43bf1be78b
--- /dev/null
+++ b/lib/hexToDecimal.ts
@@ -0,0 +1,4 @@
+export default function hetToDecimal(hex: string) {
+  const strippedHex = hex.startsWith('0x') ? hex.slice(2) : hex;
+  return parseInt(strippedHex, 16);
+}
diff --git a/lib/hooks/useLazyRenderedList.tsx b/lib/hooks/useLazyRenderedList.tsx
new file mode 100644
index 0000000000..245d8a0b0b
--- /dev/null
+++ b/lib/hooks/useLazyRenderedList.tsx
@@ -0,0 +1,23 @@
+import _clamp from 'lodash/clamp';
+import React from 'react';
+import { useInView } from 'react-intersection-observer';
+
+const STEP = 10;
+const MIN_ITEMS_NUM = 50;
+
+export default function useLazyRenderedList(list: Array<unknown>, isEnabled: boolean) {
+  const [ renderedItemsNum, setRenderedItemsNum ] = React.useState(MIN_ITEMS_NUM);
+  const { ref, inView } = useInView({
+    rootMargin: '200px',
+    triggerOnce: false,
+    skip: !isEnabled || list.length <= MIN_ITEMS_NUM,
+  });
+
+  React.useEffect(() => {
+    if (inView) {
+      setRenderedItemsNum((prev) => _clamp(prev + STEP, 0, list.length));
+    }
+  }, [ inView, list.length ]);
+
+  return { cutRef: ref, renderedItemsNum };
+}
diff --git a/lib/hooks/useNavItems.tsx b/lib/hooks/useNavItems.tsx
index f330a53c07..f3f40fc038 100644
--- a/lib/hooks/useNavItems.tsx
+++ b/lib/hooks/useNavItems.tsx
@@ -46,6 +46,13 @@ export default function useNavItems(): ReturnType {
       icon: 'transactions',
       isActive: pathname === '/txs' || pathname === '/tx/[hash]',
     };
+    const userOps: NavItem | null = config.features.userOps.isEnabled ? {
+      text: 'User operations',
+      nextRoute: { pathname: '/ops' as const },
+      icon: 'user_op',
+      isActive: pathname === '/ops' || pathname === '/op/[hash]',
+    } : null;
+
     const verifiedContracts: NavItem | null =
      {
        text: 'Verified contracts',
@@ -53,51 +60,111 @@ export default function useNavItems(): ReturnType {
        icon: 'verified',
        isActive: pathname === '/verified-contracts',
      };
+    const ensLookup = config.features.nameService.isEnabled ? {
+      text: 'Name services lookup',
+      nextRoute: { pathname: '/name-domains' as const },
+      icon: 'ENS',
+      isActive: pathname === '/name-domains' || pathname === '/name-domains/[name]',
+    } : null;
+    const validators = config.features.validators.isEnabled ? {
+      text: 'Top validators',
+      nextRoute: { pathname: '/validators' as const },
+      icon: 'validator',
+      isActive: pathname === '/validators',
+    } : null;
+
+    const rollupFeature = config.features.rollup;
 
-    if (config.features.zkEvmRollup.isEnabled) {
+    if (rollupFeature.isEnabled && rollupFeature.type === 'zkEvm') {
       blockchainNavItems = [
         [
           txs,
+          userOps,
           blocks,
           {
             text: 'Txn batches',
-            nextRoute: { pathname: '/zkevm-l2-txn-batches' as const },
+            nextRoute: { pathname: '/batches' as const },
             icon: 'txn_batches',
-            isActive: pathname === '/zkevm-l2-txn-batches' || pathname === '/zkevm-l2-txn-batch/[number]',
+            isActive: pathname === '/batches' || pathname === '/batches/[number]',
           },
-        ],
+        ].filter(Boolean),
         [
           topAccounts,
+          validators,
           verifiedContracts,
+          ensLookup,
         ].filter(Boolean),
       ];
-    } else if (config.features.optimisticRollup.isEnabled) {
+    } else if (rollupFeature.isEnabled && rollupFeature.type === 'optimistic') {
       blockchainNavItems = [
         [
           txs,
           // eslint-disable-next-line max-len
-          { text: `Deposits (L1${ rightLineArrow }L2)`, nextRoute: { pathname: '/l2-deposits' as const }, icon: 'arrows/south-east', isActive: pathname === '/l2-deposits' },
+          { text: `Deposits (L1${ rightLineArrow }L2)`, nextRoute: { pathname: '/deposits' as const }, icon: 'arrows/south-east', isActive: pathname === '/deposits' },
           // eslint-disable-next-line max-len
-          { text: `Withdrawals (L2${ rightLineArrow }L1)`, nextRoute: { pathname: '/l2-withdrawals' as const }, icon: 'arrows/north-east', isActive: pathname === '/l2-withdrawals' },
+          { text: `Withdrawals (L2${ rightLineArrow }L1)`, nextRoute: { pathname: '/withdrawals' as const }, icon: 'arrows/north-east', isActive: pathname === '/withdrawals' },
         ],
         [
           blocks,
           // eslint-disable-next-line max-len
-          { text: 'Txn batches', nextRoute: { pathname: '/l2-txn-batches' as const }, icon: 'txn_batches', isActive: pathname === '/l2-txn-batches' },
+          { text: 'Txn batches', nextRoute: { pathname: '/batches' as const }, icon: 'txn_batches', isActive: pathname === '/batches' },
+          // eslint-disable-next-line max-len
+          { text: 'Output roots', nextRoute: { pathname: '/output-roots' as const }, icon: 'output_roots', isActive: pathname === '/output-roots' },
+        ],
+        [
+          userOps,
+          topAccounts,
+          validators,
+          verifiedContracts,
+          ensLookup,
+        ].filter(Boolean),
+      ];
+    } else if (rollupFeature.isEnabled && rollupFeature.type === 'shibarium') {
+      blockchainNavItems = [
+        [
+          txs,
+          // eslint-disable-next-line max-len
+          { text: `Deposits (L1${ rightLineArrow }L2)`, nextRoute: { pathname: '/deposits' as const }, icon: 'arrows/south-east', isActive: pathname === '/deposits' },
           // eslint-disable-next-line max-len
-          { text: 'Output roots', nextRoute: { pathname: '/l2-output-roots' as const }, icon: 'output_roots', isActive: pathname === '/l2-output-roots' },
+          { text: `Withdrawals (L2${ rightLineArrow }L1)`, nextRoute: { pathname: '/withdrawals' as const }, icon: 'arrows/north-east', isActive: pathname === '/withdrawals' },
         ],
+        [
+          blocks,
+          userOps,
+          topAccounts,
+          verifiedContracts,
+          ensLookup,
+        ].filter(Boolean),
+      ];
+    } else if (rollupFeature.isEnabled && rollupFeature.type === 'zkSync') {
+      blockchainNavItems = [
+        [
+          txs,
+          userOps,
+          blocks,
+          {
+            text: 'Txn batches',
+            nextRoute: { pathname: '/batches' as const },
+            icon: 'txn_batches',
+            isActive: pathname === '/batches' || pathname === '/batches/[number]',
+          },
+        ].filter(Boolean),
         [
           topAccounts,
+          validators,
           verifiedContracts,
+          ensLookup,
         ].filter(Boolean),
       ];
     } else {
       blockchainNavItems = [
         txs,
+        userOps,
         blocks,
         topAccounts,
+        validators,
         verifiedContracts,
+        ensLookup,
         config.features.beaconChain.isEnabled && {
           text: 'Withdrawals',
           nextRoute: { pathname: '/withdrawals' as const },
@@ -146,7 +213,7 @@ export default function useNavItems(): ReturnType {
         isActive: pathname.startsWith('/token'),
       },
       config.features.marketplace.isEnabled ? {
-        text: 'Apps',
+        text: 'DApps',
         nextRoute: { pathname: '/apps' as const },
         icon: 'apps',
         isActive: pathname.startsWith('/app'),
@@ -172,8 +239,13 @@ export default function useNavItems(): ReturnType {
             nextRoute: { pathname: '/contract-verification' as const },
             isActive: pathname.startsWith('/contract-verification'),
           },
+          config.features.gasTracker.isEnabled && {
+            text: 'Gas tracker',
+            nextRoute: { pathname: '/gas-tracker' as const },
+            isActive: pathname.startsWith('/gas-tracker'),
+          },
           ...config.UI.sidebar.otherLinks,
-        ],
+        ].filter(Boolean),
       },
     ].filter(Boolean);
 
diff --git a/lib/hooks/useNotifyOnNavigation.tsx b/lib/hooks/useNotifyOnNavigation.tsx
new file mode 100644
index 0000000000..a3b7a7c92f
--- /dev/null
+++ b/lib/hooks/useNotifyOnNavigation.tsx
@@ -0,0 +1,24 @@
+import { usePathname } from 'next/navigation';
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import config from 'configs/app';
+import getQueryParamString from 'lib/router/getQueryParamString';
+
+export default function useNotifyOnNavigation() {
+  const router = useRouter();
+  const pathname = usePathname();
+  const tab = getQueryParamString(router.query.tab);
+
+  React.useEffect(() => {
+    if (config.features.metasuites.isEnabled) {
+      window.postMessage({ source: 'APP_ROUTER', type: 'PATHNAME_CHANGED' }, window.location.origin);
+    }
+  }, [ pathname ]);
+
+  React.useEffect(() => {
+    if (config.features.metasuites.isEnabled) {
+      window.postMessage({ source: 'APP_ROUTER', type: 'TAB_CHANGED' }, window.location.origin);
+    }
+  }, [ tab ]);
+}
diff --git a/lib/metadata/getPageOgType.ts b/lib/metadata/getPageOgType.ts
index 36e70e9fee..ef7ef24e26 100644
--- a/lib/metadata/getPageOgType.ts
+++ b/lib/metadata/getPageOgType.ts
@@ -33,13 +33,18 @@ const OG_TYPE_DICT: Record<Route['pathname'], OGPageType> = {
   '/withdrawals': 'Root page',
   '/visualize/sol2uml': 'Regular page',
   '/csv-export': 'Regular page',
-  '/l2-deposits': 'Root page',
-  '/l2-output-roots': 'Root page',
-  '/l2-txn-batches': 'Root page',
-  '/l2-withdrawals': 'Root page',
-  '/zkevm-l2-txn-batches': 'Root page',
-  '/zkevm-l2-txn-batch/[number]': 'Regular page',
+  '/deposits': 'Root page',
+  '/output-roots': 'Root page',
+  '/batches': 'Root page',
+  '/batches/[number]': 'Regular page',
+  '/blobs/[hash]': 'Regular page',
+  '/ops': 'Root page',
+  '/op/[hash]': 'Regular page',
   '/404': 'Regular page',
+  '/name-domains': 'Root page',
+  '/name-domains/[name]': 'Regular page',
+  '/validators': 'Root page',
+  '/gas-tracker': 'Root page',
 
   // service routes, added only to make typescript happy
   '/login': 'Regular page',
diff --git a/lib/metadata/templates/description.ts b/lib/metadata/templates/description.ts
index 175e118f13..c064709b6f 100644
--- a/lib/metadata/templates/description.ts
+++ b/lib/metadata/templates/description.ts
@@ -36,13 +36,18 @@ const TEMPLATE_MAP: Record<Route['pathname'], string> = {
   '/withdrawals': DEFAULT_TEMPLATE,
   '/visualize/sol2uml': DEFAULT_TEMPLATE,
   '/csv-export': DEFAULT_TEMPLATE,
-  '/l2-deposits': DEFAULT_TEMPLATE,
-  '/l2-output-roots': DEFAULT_TEMPLATE,
-  '/l2-txn-batches': DEFAULT_TEMPLATE,
-  '/l2-withdrawals': DEFAULT_TEMPLATE,
-  '/zkevm-l2-txn-batches': DEFAULT_TEMPLATE,
-  '/zkevm-l2-txn-batch/[number]': DEFAULT_TEMPLATE,
+  '/deposits': DEFAULT_TEMPLATE,
+  '/output-roots': DEFAULT_TEMPLATE,
+  '/batches': DEFAULT_TEMPLATE,
+  '/batches/[number]': DEFAULT_TEMPLATE,
+  '/blobs/[hash]': DEFAULT_TEMPLATE,
+  '/ops': DEFAULT_TEMPLATE,
+  '/op/[hash]': DEFAULT_TEMPLATE,
   '/404': DEFAULT_TEMPLATE,
+  '/name-domains': DEFAULT_TEMPLATE,
+  '/name-domains/[name]': DEFAULT_TEMPLATE,
+  '/validators': DEFAULT_TEMPLATE,
+  '/gas-tracker': DEFAULT_TEMPLATE,
 
   // service routes, added only to make typescript happy
   '/login': DEFAULT_TEMPLATE,
diff --git a/lib/metadata/templates/title.ts b/lib/metadata/templates/title.ts
index 5a9e48eebb..9a667bb9ce 100644
--- a/lib/metadata/templates/title.ts
+++ b/lib/metadata/templates/title.ts
@@ -14,7 +14,7 @@ const TEMPLATE_MAP: Record<Route['pathname'], string> = {
   '/address/[hash]/contract-verification': 'contract verification for %hash%',
   '/tokens': 'tokens',
   '/token/[hash]': '%symbol% token details',
-  '/token/[hash]/instance/[id]': 'token instance for %symbol%',
+  '/token/[hash]/instance/[id]': 'NFT instance',
   '/apps': 'apps marketplace',
   '/apps/[id]': '- %app_name%',
   '/stats': 'statistics',
@@ -31,13 +31,18 @@ const TEMPLATE_MAP: Record<Route['pathname'], string> = {
   '/withdrawals': 'withdrawals',
   '/visualize/sol2uml': 'Solidity UML diagram',
   '/csv-export': 'export data to CSV',
-  '/l2-deposits': 'deposits (L1 > L2)',
-  '/l2-output-roots': 'output roots',
-  '/l2-txn-batches': 'Tx batches (L2 blocks)',
-  '/l2-withdrawals': 'withdrawals (L2 > L1)',
-  '/zkevm-l2-txn-batches': 'zkEvm L2 Tx batches',
-  '/zkevm-l2-txn-batch/[number]': 'zkEvm L2 Tx batch %number%',
+  '/deposits': 'deposits (L1 > L2)',
+  '/output-roots': 'output roots',
+  '/batches': 'tx batches (L2 blocks)',
+  '/batches/[number]': 'L2 tx batch %number%',
+  '/blobs/[hash]': 'blob %hash% details',
+  '/ops': 'user operations',
+  '/op/[hash]': 'user operation %hash%',
   '/404': 'error - page not found',
+  '/name-domains': 'domains search and resolve',
+  '/name-domains/[name]': '%name% domain details',
+  '/validators': 'validators list',
+  '/gas-tracker': 'gas tracker',
 
   // service routes, added only to make typescript happy
   '/login': 'login',
diff --git a/lib/mixpanel/getGoogleAnalyticsClientId.ts b/lib/mixpanel/getGoogleAnalyticsClientId.ts
deleted file mode 100644
index 704cf14f2f..0000000000
--- a/lib/mixpanel/getGoogleAnalyticsClientId.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export default function getGoogleAnalyticsClientId() {
-  return window.ga?.getAll()[0].get('clientId');
-}
diff --git a/lib/mixpanel/getPageType.ts b/lib/mixpanel/getPageType.ts
index 4ff5e22aa2..fb4c48e7fe 100644
--- a/lib/mixpanel/getPageType.ts
+++ b/lib/mixpanel/getPageType.ts
@@ -15,8 +15,8 @@ export const PAGE_TYPE_DICT: Record<Route['pathname'], string> = {
   '/tokens': 'Tokens',
   '/token/[hash]': 'Token details',
   '/token/[hash]/instance/[id]': 'Token Instance',
-  '/apps': 'Apps',
-  '/apps/[id]': 'App',
+  '/apps': 'DApps',
+  '/apps/[id]': 'DApp',
   '/stats': 'Stats',
   '/api-docs': 'REST API',
   '/graphiql': 'GraphQL',
@@ -31,13 +31,18 @@ export const PAGE_TYPE_DICT: Record<Route['pathname'], string> = {
   '/withdrawals': 'Withdrawals',
   '/visualize/sol2uml': 'Solidity UML diagram',
   '/csv-export': 'Export data to CSV file',
-  '/l2-deposits': 'Deposits (L1 > L2)',
-  '/l2-output-roots': 'Output roots',
-  '/l2-txn-batches': 'Tx batches (L2 blocks)',
-  '/l2-withdrawals': 'Withdrawals (L2 > L1)',
-  '/zkevm-l2-txn-batches': 'ZkEvm L2 Tx batches',
-  '/zkevm-l2-txn-batch/[number]': 'ZkEvm L2 Tx batch details',
+  '/deposits': 'Deposits (L1 > L2)',
+  '/output-roots': 'Output roots',
+  '/batches': 'Tx batches (L2 blocks)',
+  '/batches/[number]': 'L2 tx batch details',
+  '/blobs/[hash]': 'Blob details',
+  '/ops': 'User operations',
+  '/op/[hash]': 'User operation details',
   '/404': '404',
+  '/name-domains': 'Domains search and resolve',
+  '/name-domains/[name]': 'Domain details',
+  '/validators': 'Validators list',
+  '/gas-tracker': 'Gas tracker',
 
   // service routes, added only to make typescript happy
   '/login': 'Login',
diff --git a/lib/mixpanel/getUuid.ts b/lib/mixpanel/getUuid.ts
new file mode 100644
index 0000000000..797034ceae
--- /dev/null
+++ b/lib/mixpanel/getUuid.ts
@@ -0,0 +1,20 @@
+import * as cookies from 'lib/cookies';
+import * as growthBook from 'lib/growthbook/consts';
+import isBrowser from 'lib/isBrowser';
+
+export default function getUuid() {
+  const cookie = cookies.get(cookies.NAMES.UUID);
+
+  if (cookie) {
+    return cookie;
+  }
+
+  const uuid = crypto.randomUUID();
+  cookies.set(cookies.NAMES.UUID, uuid);
+
+  if (isBrowser()) {
+    window.localStorage.removeItem(growthBook.STORAGE_KEY);
+  }
+
+  return uuid;
+}
diff --git a/lib/mixpanel/index.ts b/lib/mixpanel/index.ts
index 646a13d3e9..492269c5ea 100644
--- a/lib/mixpanel/index.ts
+++ b/lib/mixpanel/index.ts
@@ -1,4 +1,5 @@
 import getPageType from './getPageType';
+import getUuid from './getUuid';
 import logEvent from './logEvent';
 import useInit from './useInit';
 import useLogPageView from './useLogPageView';
@@ -9,4 +10,5 @@ export {
   useLogPageView,
   logEvent,
   getPageType,
+  getUuid,
 };
diff --git a/lib/mixpanel/isGoogleAnalyticsLoaded.ts b/lib/mixpanel/isGoogleAnalyticsLoaded.ts
deleted file mode 100644
index 08667749b1..0000000000
--- a/lib/mixpanel/isGoogleAnalyticsLoaded.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import config from 'configs/app';
-import delay from 'lib/delay';
-
-export default function isGoogleAnalyticsLoaded(retries = 3): Promise<boolean> {
-  if (!retries || !config.features.googleAnalytics.isEnabled) {
-    return Promise.resolve(false);
-  }
-  return typeof window.ga?.getAll === 'function' ? Promise.resolve(true) : delay(500).then(() => isGoogleAnalyticsLoaded(retries - 1));
-}
diff --git a/lib/mixpanel/useInit.tsx b/lib/mixpanel/useInit.tsx
index b7a203ecce..0be8371066 100644
--- a/lib/mixpanel/useInit.tsx
+++ b/lib/mixpanel/useInit.tsx
@@ -9,8 +9,7 @@ import config from 'configs/app';
 import * as cookies from 'lib/cookies';
 import getQueryParamString from 'lib/router/getQueryParamString';
 
-import getGoogleAnalyticsClientId from './getGoogleAnalyticsClientId';
-import isGoogleAnalyticsLoaded from './isGoogleAnalyticsLoaded';
+import getUuid from './getUuid';
 
 export default function useMixpanelInit() {
   const [ isInited, setIsInited ] = React.useState(false);
@@ -18,36 +17,34 @@ export default function useMixpanelInit() {
   const debugFlagQuery = React.useRef(getQueryParamString(router.query._mixpanel_debug));
 
   React.useEffect(() => {
-    isGoogleAnalyticsLoaded().then((isGALoaded) => {
-      const feature = config.features.mixpanel;
-      if (!feature.isEnabled) {
-        return;
-      }
-
-      const debugFlagCookie = cookies.get(cookies.NAMES.MIXPANEL_DEBUG);
-
-      const mixpanelConfig: Partial<Config> = {
-        debug: Boolean(debugFlagQuery.current || debugFlagCookie),
-      };
-      const isAuth = Boolean(cookies.get(cookies.NAMES.API_TOKEN));
-
-      mixpanel.init(feature.projectToken, mixpanelConfig);
-      mixpanel.register({
-        'Chain id': config.chain.id,
-        Environment: config.app.isDev ? 'Dev' : 'Prod',
-        Authorized: isAuth,
-        'Viewport width': window.innerWidth,
-        'Viewport height': window.innerHeight,
-        Language: window.navigator.language,
-        'User id': isGALoaded ? getGoogleAnalyticsClientId() : undefined,
-        'Device type': _capitalize(deviceType),
-      });
-
-      setIsInited(true);
-      if (debugFlagQuery.current && !debugFlagCookie) {
-        cookies.set(cookies.NAMES.MIXPANEL_DEBUG, 'true');
-      }
+    const feature = config.features.mixpanel;
+    if (!feature.isEnabled) {
+      return;
+    }
+
+    const debugFlagCookie = cookies.get(cookies.NAMES.MIXPANEL_DEBUG);
+
+    const mixpanelConfig: Partial<Config> = {
+      debug: Boolean(debugFlagQuery.current || debugFlagCookie),
+    };
+    const isAuth = Boolean(cookies.get(cookies.NAMES.API_TOKEN));
+
+    mixpanel.init(feature.projectToken, mixpanelConfig);
+    mixpanel.register({
+      'Chain id': config.chain.id,
+      Environment: config.app.isDev ? 'Dev' : 'Prod',
+      Authorized: isAuth,
+      'Viewport width': window.innerWidth,
+      'Viewport height': window.innerHeight,
+      Language: window.navigator.language,
+      'Device type': _capitalize(deviceType),
+      'User id': getUuid(),
     });
+
+    setIsInited(true);
+    if (debugFlagQuery.current && !debugFlagCookie) {
+      cookies.set(cookies.NAMES.MIXPANEL_DEBUG, 'true');
+    }
   }, []);
 
   return isInited;
diff --git a/lib/mixpanel/utils.ts b/lib/mixpanel/utils.ts
index b886f32249..20c4b92970 100644
--- a/lib/mixpanel/utils.ts
+++ b/lib/mixpanel/utils.ts
@@ -3,17 +3,22 @@ import type { WalletType } from 'types/client/wallets';
 export enum EventTypes {
   PAGE_VIEW = 'Page view',
   SEARCH_QUERY = 'Search query',
+  LOCAL_SEARCH = 'Local search',
   ADD_TO_WALLET = 'Add to wallet',
   ACCOUNT_ACCESS = 'Account access',
   PRIVATE_TAG = 'Private tag',
   VERIFY_ADDRESS = 'Verify address',
   VERIFY_TOKEN = 'Verify token',
   WALLET_CONNECT = 'Wallet connect',
+  WALLET_ACTION = 'Wallet action',
   CONTRACT_INTERACTION = 'Contract interaction',
   CONTRACT_VERIFICATION = 'Contract verification',
   QR_CODE = 'QR code',
   PAGE_WIDGET = 'Page widget',
-  TX_INTERPRETATION_INTERACTION = 'Transaction interpratetion interaction'
+  TX_INTERPRETATION_INTERACTION = 'Transaction interpretation interaction',
+  EXPERIMENT_STARTED = 'Experiment started',
+  FILTERS = 'Filters',
+  BUTTON_CLICK = 'Button click',
 }
 
 /* eslint-disable @typescript-eslint/indent */
@@ -30,6 +35,10 @@ Type extends EventTypes.SEARCH_QUERY ? {
   'Source page type': string;
   'Result URL': string;
 } :
+Type extends EventTypes.LOCAL_SEARCH ? {
+  'Search query': string;
+  'Source': 'Marketplace';
+} :
 Type extends EventTypes.ADD_TO_WALLET ? (
   {
     'Wallet': WalletType;
@@ -62,9 +71,18 @@ Type extends EventTypes.VERIFY_TOKEN ? {
   'Action': 'Form opened' | 'Submit';
 } :
 Type extends EventTypes.WALLET_CONNECT ? {
-  'Source': 'Header' | 'Smart contracts';
+  'Source': 'Header' | 'Smart contracts' | 'Swap button';
   'Status': 'Started' | 'Connected';
 } :
+Type extends EventTypes.WALLET_ACTION ? (
+  {
+    'Action': 'Open' | 'Address click';
+  } | {
+    'Action': 'Send Transaction' | 'Sign Message' | 'Sign Typed Data';
+    'Address': string | undefined;
+    'AppId': string;
+  }
+) :
 Type extends EventTypes.CONTRACT_INTERACTION ? {
   'Method type': 'Read' | 'Write';
   'Method name': string;
@@ -76,11 +94,33 @@ Type extends EventTypes.CONTRACT_VERIFICATION ? {
 Type extends EventTypes.QR_CODE ? {
   'Page type': string;
 } :
-Type extends EventTypes.PAGE_WIDGET ? {
-  'Type': 'Tokens dropdown' | 'Tokens show all (icon)' | 'Add to watchlist' | 'Address actions (more button)';
-} :
+Type extends EventTypes.PAGE_WIDGET ? (
+  {
+    'Type': 'Tokens dropdown' | 'Tokens show all (icon)' | 'Add to watchlist' | 'Address actions (more button)';
+  } | {
+    'Type': 'Favorite app' | 'More button' | 'Security score' | 'Total contracts' | 'Verified contracts' | 'Analyzed contracts';
+    'Info': string;
+    'Source': 'Discovery view' | 'Security view' | 'App modal' | 'App page' | 'Security score popup';
+  } | {
+    'Type': 'Security score';
+    'Source': 'Analyzed contracts popup';
+  }
+) :
 Type extends EventTypes.TX_INTERPRETATION_INTERACTION ? {
-  'Type': 'Address click' | 'Token click';
+  'Type': 'Address click' | 'Token click' | 'Domain click';
+} :
+Type extends EventTypes.EXPERIMENT_STARTED ? {
+  'Experiment name': string;
+  'Variant name': string;
+  'Source': 'growthbook';
+} :
+Type extends EventTypes.FILTERS ? {
+  'Source': 'Marketplace';
+  'Filter name': string;
+} :
+Type extends EventTypes.BUTTON_CLICK ? {
+  'Content': 'Swap button';
+  'Source': string;
 } :
 undefined;
 /* eslint-enable @typescript-eslint/indent */
diff --git a/lib/router/removeQueryParam.ts b/lib/router/removeQueryParam.ts
new file mode 100644
index 0000000000..83daa6bd28
--- /dev/null
+++ b/lib/router/removeQueryParam.ts
@@ -0,0 +1,8 @@
+import type { NextRouter } from 'next/router';
+
+export default function removeQueryParam(router: NextRouter, param: string) {
+  const { pathname, query } = router;
+  const newQuery = { ...query };
+  delete newQuery[param];
+  router.replace({ pathname, query: newQuery }, undefined, { shallow: true });
+}
diff --git a/lib/router/updateQueryParam.ts b/lib/router/updateQueryParam.ts
new file mode 100644
index 0000000000..de9fadce8b
--- /dev/null
+++ b/lib/router/updateQueryParam.ts
@@ -0,0 +1,8 @@
+import type { NextRouter } from 'next/router';
+
+export default function updateQueryParam(router: NextRouter, param: string, newValue: string) {
+  const { pathname, query } = router;
+  const newQuery = { ...query };
+  newQuery[param] = newValue;
+  router.replace({ pathname, query: newQuery }, undefined, { shallow: true });
+}
diff --git a/lib/sentry/config.ts b/lib/sentry/config.ts
index d52c20e382..f619c9346c 100644
--- a/lib/sentry/config.ts
+++ b/lib/sentry/config.ts
@@ -2,6 +2,7 @@ import * as Sentry from '@sentry/react';
 import { BrowserTracing } from '@sentry/tracing';
 
 import appConfig from 'configs/app';
+import { RESOURCE_LOAD_ERROR_MESSAGE } from 'lib/errors/throwOnResourceLoadError';
 
 const feature = appConfig.features.sentry;
 
@@ -59,6 +60,9 @@ export const config: Sentry.BrowserOptions | undefined = (() => {
       'The quota has been exceeded',
       'Attempt to connect to relay via',
       'WebSocket connection failed for URL: wss://relay.walletconnect.com',
+
+      // API errors
+      RESOURCE_LOAD_ERROR_MESSAGE,
     ],
     denyUrls: [
       // Facebook flakiness
diff --git a/lib/shortenString.ts b/lib/shortenString.ts
index 28a7f67411..4125ec06f2 100644
--- a/lib/shortenString.ts
+++ b/lib/shortenString.ts
@@ -1,11 +1,11 @@
-export default function shortenString(string: string | null) {
+export default function shortenString(string: string | null, charNumber: number | undefined = 8) {
   if (!string) {
     return '';
   }
 
-  if (string.length <= 7) {
+  if (string.length <= charNumber) {
     return string;
   }
 
-  return string.slice(0, 4) + '...' + string.slice(-4);
+  return string.slice(0, charNumber - 4) + '...' + string.slice(-4);
 }
diff --git a/lib/socket/types.ts b/lib/socket/types.ts
index 4d05a1acb7..b2d8d7301a 100644
--- a/lib/socket/types.ts
+++ b/lib/socket/types.ts
@@ -6,7 +6,7 @@ import type { SmartContractVerificationResponse } from 'types/api/contract';
 import type { RawTracesResponse } from 'types/api/rawTrace';
 import type { TokenTransfer } from 'types/api/tokenTransfer';
 import type { Transaction } from 'types/api/transaction';
-import type { NewZkEvmBatchSocketResponse } from 'types/api/zkEvmL2TxnBatches';
+import type { NewZkEvmBatchSocketResponse } from 'types/api/zkEvmL2';
 
 export type SocketMessageParams = SocketMessage.NewBlock |
 SocketMessage.BlocksIndexStatus |
@@ -22,6 +22,7 @@ SocketMessage.AddressTokenBalance |
 SocketMessage.AddressTokenBalancesErc20 |
 SocketMessage.AddressTokenBalancesErc721 |
 SocketMessage.AddressTokenBalancesErc1155 |
+SocketMessage.AddressTokenBalancesErc404 |
 SocketMessage.AddressCoinBalance |
 SocketMessage.AddressTxs |
 SocketMessage.AddressTxsPending |
@@ -57,6 +58,7 @@ export namespace SocketMessage {
   export type AddressTokenBalancesErc20 = SocketMessageParamsGeneric<'updated_token_balances_erc_20', AddressTokensBalancesSocketMessage>;
   export type AddressTokenBalancesErc721 = SocketMessageParamsGeneric<'updated_token_balances_erc_721', AddressTokensBalancesSocketMessage>;
   export type AddressTokenBalancesErc1155 = SocketMessageParamsGeneric<'updated_token_balances_erc_1155', AddressTokensBalancesSocketMessage>;
+  export type AddressTokenBalancesErc404 = SocketMessageParamsGeneric<'updated_token_balances_erc_404', AddressTokensBalancesSocketMessage>;
   export type AddressCoinBalance = SocketMessageParamsGeneric<'coin_balance', { coin_balance: AddressCoinBalanceHistoryItem }>;
   export type AddressTxs = SocketMessageParamsGeneric<'transaction', { transactions: Array<Transaction> }>;
   export type AddressTxsPending = SocketMessageParamsGeneric<'pending_transaction', { transactions: Array<Transaction> }>;
diff --git a/lib/token/metadata/attributesParser.ts b/lib/token/metadata/attributesParser.ts
index c863000366..00119abe90 100644
--- a/lib/token/metadata/attributesParser.ts
+++ b/lib/token/metadata/attributesParser.ts
@@ -19,7 +19,7 @@ function formatValue(value: string | number, display: string | undefined, trait:
     }
     case 'date': {
       return {
-        value: dayjs(value).format('YYYY-MM-DD'),
+        value: dayjs(Number(value) * 1000).format('YYYY-MM-DD'),
       };
     }
     default: {
diff --git a/lib/token/tokenTypes.ts b/lib/token/tokenTypes.ts
index 5246fc2418..4b7fabf9ea 100644
--- a/lib/token/tokenTypes.ts
+++ b/lib/token/tokenTypes.ts
@@ -3,6 +3,7 @@ import type { NFTTokenType, TokenType } from 'types/api/token';
 export const NFT_TOKEN_TYPES: Array<{ title: string; id: NFTTokenType }> = [
   { title: 'ERC-721', id: 'ERC-721' },
   { title: 'ERC-1155', id: 'ERC-1155' },
+  { title: 'ERC-404', id: 'ERC-404' },
 ];
 
 export const TOKEN_TYPES: Array<{ title: string; id: TokenType }> = [
diff --git a/lib/units.ts b/lib/units.ts
new file mode 100644
index 0000000000..546e4308ee
--- /dev/null
+++ b/lib/units.ts
@@ -0,0 +1,11 @@
+import type { Unit } from 'types/unit';
+
+import config from 'configs/app';
+
+const weiName = config.chain.currency.weiName || 'wei';
+
+export const currencyUnits: Record<Unit, string> = {
+  wei: weiName,
+  gwei: `G${ weiName }`,
+  ether: config.chain.currency.symbol || 'ETH',
+};
diff --git a/lib/web3/client.ts b/lib/web3/client.ts
new file mode 100644
index 0000000000..8188f22869
--- /dev/null
+++ b/lib/web3/client.ts
@@ -0,0 +1,19 @@
+import { createPublicClient, http } from 'viem';
+
+import currentChain from './currentChain';
+
+export const publicClient = (() => {
+  if (currentChain.rpcUrls.default.http.filter(Boolean).length === 0) {
+    return;
+  }
+
+  try {
+    return createPublicClient({
+      chain: currentChain,
+      transport: http(),
+      batch: {
+        multicall: true,
+      },
+    });
+  } catch (error) {}
+})();
diff --git a/lib/web3/currentChain.ts b/lib/web3/currentChain.ts
new file mode 100644
index 0000000000..dd3892859f
--- /dev/null
+++ b/lib/web3/currentChain.ts
@@ -0,0 +1,27 @@
+import { type Chain } from 'viem';
+
+import config from 'configs/app';
+
+const currentChain = {
+  id: Number(config.chain.id),
+  name: config.chain.name ?? '',
+  nativeCurrency: {
+    decimals: config.chain.currency.decimals,
+    name: config.chain.currency.name ?? '',
+    symbol: config.chain.currency.symbol ?? '',
+  },
+  rpcUrls: {
+    'default': {
+      http: [ config.chain.rpcUrl ?? '' ],
+    },
+  },
+  blockExplorers: {
+    'default': {
+      name: 'Blockscout',
+      url: config.app.baseUrl,
+    },
+  },
+  testnet: config.chain.isTestnet,
+} as const satisfies Chain;
+
+export default currentChain;
diff --git a/lib/web3/useProvider.tsx b/lib/web3/useProvider.tsx
index 029eb24835..43cc7aa8fa 100644
--- a/lib/web3/useProvider.tsx
+++ b/lib/web3/useProvider.tsx
@@ -1,16 +1,14 @@
 import React from 'react';
-import type { WindowProvider } from 'wagmi';
-
-import 'wagmi/window';
 
 import type { WalletType } from 'types/client/wallets';
+import type { WalletProvider } from 'types/web3';
 
 import config from 'configs/app';
 
 const feature = config.features.web3Wallet;
 
 export default function useProvider() {
-  const [ provider, setProvider ] = React.useState<WindowProvider>();
+  const [ provider, setProvider ] = React.useState<WalletProvider>();
   const [ wallet, setWallet ] = React.useState<WalletType>();
 
   const initializeProvider = React.useMemo(() => async() => {
diff --git a/lib/web3/wagmiConfig.ts b/lib/web3/wagmiConfig.ts
new file mode 100644
index 0000000000..f90d0a069f
--- /dev/null
+++ b/lib/web3/wagmiConfig.ts
@@ -0,0 +1,38 @@
+import { defaultWagmiConfig } from '@web3modal/wagmi/react/config';
+import { http } from 'viem';
+import type { CreateConfigParameters } from 'wagmi';
+
+import config from 'configs/app';
+import currentChain from 'lib/web3/currentChain';
+const feature = config.features.blockchainInteraction;
+
+const wagmiConfig = (() => {
+  try {
+    if (!feature.isEnabled) {
+      throw new Error();
+    }
+
+    const chains: CreateConfigParameters['chains'] = [ currentChain ];
+
+    const wagmiConfig = defaultWagmiConfig({
+      chains,
+      multiInjectedProviderDiscovery: true,
+      transports: {
+        [currentChain.id]: http(),
+      },
+      projectId: feature.walletConnect.projectId,
+      metadata: {
+        name: `${ config.chain.name } explorer`,
+        description: `${ config.chain.name } explorer`,
+        url: config.app.baseUrl,
+        icons: [ config.UI.sidebar.icon.default ].filter(Boolean),
+      },
+      enableEmail: true,
+      ssr: true,
+    });
+
+    return wagmiConfig;
+  } catch (error) {}
+})();
+
+export default wagmiConfig;
diff --git a/mocks/ad/textAd.ts b/mocks/ad/textAd.ts
index 6ee891bea8..0e5bb6feae 100644
--- a/mocks/ad/textAd.ts
+++ b/mocks/ad/textAd.ts
@@ -2,7 +2,7 @@ export const duck = {
   ad: {
     name: 'Hello utia!',
     description_short: 'Utia is the best! Go with utia! Utia is the best! Go with utia!',
-    thumbnail: 'https://utia.utia',
+    thumbnail: 'http://localhost:3100/utia.jpg',
     url: 'https://test.url',
     cta_button: 'Click me!',
   },
diff --git a/mocks/address/address.ts b/mocks/address/address.ts
index fe1903164a..7c7bc612cb 100644
--- a/mocks/address/address.ts
+++ b/mocks/address/address.ts
@@ -15,6 +15,19 @@ export const withName: AddressParam = {
   private_tags: [],
   watchlist_names: [],
   public_tags: [],
+  ens_domain_name: null,
+};
+
+export const withEns: AddressParam = {
+  hash: hash,
+  implementation_name: null,
+  is_contract: false,
+  is_verified: null,
+  name: 'ArianeeStore',
+  private_tags: [],
+  watchlist_names: [],
+  public_tags: [],
+  ens_domain_name: 'kitty.kitty.kitty.cat.eth',
 };
 
 export const withoutName: AddressParam = {
@@ -26,6 +39,7 @@ export const withoutName: AddressParam = {
   private_tags: [],
   watchlist_names: [],
   public_tags: [],
+  ens_domain_name: null,
 };
 
 export const token: Address = {
@@ -56,6 +70,7 @@ export const token: Address = {
   has_token_transfers: true,
   has_tokens: true,
   has_validated_blocks: false,
+  ens_domain_name: null,
 };
 
 export const contract: Address = {
@@ -86,6 +101,7 @@ export const contract: Address = {
   token: null,
   watchlist_names: [ watchlistName ],
   watchlist_address_id: 42,
+  ens_domain_name: null,
 };
 
 export const validator: Address = {
@@ -116,4 +132,5 @@ export const validator: Address = {
   token: null,
   watchlist_names: [],
   watchlist_address_id: null,
+  ens_domain_name: null,
 };
diff --git a/mocks/address/tokens.ts b/mocks/address/tokens.ts
index c8c7386134..f3fd58b8d5 100644
--- a/mocks/address/tokens.ts
+++ b/mocks/address/tokens.ts
@@ -38,6 +38,17 @@ export const erc20LongSymbol: AddressTokenBalance = {
   token_instance: null,
 };
 
+export const erc20BigAmount: AddressTokenBalance = {
+  token: {
+    ...tokens.tokenInfoERC20LongSymbol,
+    exchange_rate: '4200000000',
+    name: 'DuckDuckGoose Stable Coin',
+  },
+  token_id: null,
+  value: '39000000000000000000',
+  token_instance: null,
+};
+
 export const erc721a: AddressTokenBalance = {
   token: tokens.tokenInfoERC721a,
   token_id: null,
@@ -94,6 +105,20 @@ export const erc1155LongId: AddressTokenBalance = {
   value: '42',
 };
 
+export const erc404a: AddressTokenBalance = {
+  token: tokens.tokenInfoERC404,
+  token_id: '42',
+  token_instance: tokenInstance.base,
+  value: '240000000000000',
+};
+
+export const erc404b: AddressTokenBalance = {
+  token: tokens.tokenInfoERC404,
+  token_instance: null,
+  value: '11',
+  token_id: null,
+};
+
 export const erc20List = {
   items: [
     erc20a,
@@ -118,6 +143,13 @@ export const erc1155List = {
   ],
 };
 
+export const erc404List = {
+  items: [
+    erc404a,
+    erc404b,
+  ],
+};
+
 export const nfts: AddressNFTsResponse = {
   items: [
     {
@@ -132,6 +164,12 @@ export const nfts: AddressNFTsResponse = {
       token_type: 'ERC-721',
       value: '1',
     },
+    {
+      ...tokenInstance.unique,
+      token: tokens.tokenInfoERC404,
+      token_type: 'ERC-404',
+      value: '11000',
+    },
   ],
   next_page_params: null,
 };
diff --git a/mocks/apps/app.html b/mocks/apps/app.html
new file mode 100644
index 0000000000..c7c675b977
--- /dev/null
+++ b/mocks/apps/app.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Mock HTML Content</title>
+  <style>
+    html {
+      height: 100%;
+    }
+    body {
+      margin: 0;
+      padding: 0;
+      height: 100%;
+      border: 1px solid #9747FF;
+      background: rgba(151, 71, 255, 0.10);
+      position: relative;
+      box-sizing: border-box;
+    }
+    h1 {
+      color: #9F7AEA;
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      margin: 0;
+    }
+  </style>
+</head>
+<body>
+  <h1>Full view app</h1>
+</body>
+</html>
diff --git a/mocks/apps/apps.ts b/mocks/apps/apps.ts
index a8b27a70a4..2f748c625a 100644
--- a/mocks/apps/apps.ts
+++ b/mocks/apps/apps.ts
@@ -11,6 +11,9 @@ export const apps = [
     description: 'Hop is a scalable rollup-to-rollup general token bridge. It allows users to send tokens from one rollup or sidechain to another almost immediately without having to wait for the networks challenge period.',
     external: true,
     url: 'https://goerli.hop.exchange/send?token=ETH&sourceNetwork=ethereum',
+    github: [ 'https://github.com/hop-protocol/hop', 'https://github.com/hop-protocol/hop-ui' ],
+    discord: 'https://discord.gg/hopprotocol',
+    twitter: 'https://twitter.com/HopProtocol',
   },
   {
     author: 'Blockscout',
diff --git a/mocks/apps/securityReports.ts b/mocks/apps/securityReports.ts
new file mode 100644
index 0000000000..824a6fbe13
--- /dev/null
+++ b/mocks/apps/securityReports.ts
@@ -0,0 +1,58 @@
+export const securityReports = [
+  {
+    appName: 'token-approval-tracker',
+    doc: 'http://docs.li.fi/smart-contracts/deployments#mainnet',
+    chainsData: {
+      '1': {
+        overallInfo: {
+          verifiedNumber: 1,
+          totalContractsNumber: 1,
+          solidityScanContractsNumber: 1,
+          securityScore: 87.5,
+          issueSeverityDistribution: {
+            critical: 4,
+            gas: 1,
+            high: 0,
+            informational: 4,
+            low: 2,
+            medium: 0,
+          },
+        },
+        contractsData: [
+          {
+            address: '0x1231DEB6f5749EF6cE6943a275A1D3E7486F4EaE',
+            isVerified: true,
+            solidityScanReport: {
+              connection_id: '',
+              contract_address: '0x1231DEB6f5749EF6cE6943a275A1D3E7486F4EaE',
+              contract_chain: 'optimism',
+              contract_platform: 'blockscout',
+              contract_url: 'http://optimism.blockscout.com/address/0x1231DEB6f5749EF6cE6943a275A1D3E7486F4EaE',
+              contractname: 'LiFiDiamond',
+              is_quick_scan: true,
+              node_reference_id: null,
+              request_type: 'threat_scan',
+              scanner_reference_url: 'http://solidityscan.com/quickscan/0x1231DEB6f5749EF6cE6943a275A1D3E7486F4EaE/blockscout/eth?ref=blockscout',
+              scan_status: 'scan_done',
+              scan_summary: {
+                issue_severity_distribution: {
+                  critical: 0,
+                  gas: 1,
+                  high: 0,
+                  informational: 4,
+                  low: 2,
+                  medium: 0,
+                },
+                lines_analyzed_count: 72,
+                scan_time_taken: 1,
+                score: '4.38',
+                score_v2: '87.50',
+                threat_score: '100.00',
+              },
+            },
+          },
+        ],
+      },
+    },
+  },
+];
diff --git a/mocks/blobs/blobs.ts b/mocks/blobs/blobs.ts
new file mode 100644
index 0000000000..24d25b465f
--- /dev/null
+++ b/mocks/blobs/blobs.ts
@@ -0,0 +1,36 @@
+import type { Blob, TxBlobs } from 'types/api/blobs';
+
+export const base1: Blob = {
+  blob_data: '0x004242004242004242004242004242004242',
+  hash: '0x016316f61a259aa607096440fc3eeb90356e079be01975d2fb18347bd50df33c',
+  kzg_commitment: '0xa95caabd009e189b9f205e0328ff847ad886e4f8e719bd7219875fbb9688fb3fbe7704bb1dfa7e2993a3dea8d0cf767d',
+  kzg_proof: '0x89cf91c4c8be6f2a390d4262425f79dffb74c174fb15a210182184543bf7394e5a7970a774ee8e0dabc315424c22df0f',
+  transaction_hashes: [
+    { block_consensus: true, transaction_hash: '0x970d8c45c713a50a1fa351b00ca29a8890cac474c59cc8eee4eddec91a1729f0' },
+  ],
+};
+
+export const base2: Blob = {
+  blob_data: '0x89504E470D0A1A0A0000000D494844520000003C0000003C0403',
+  hash: '0x0197fdb17195c176b23160f335daabd4b6a231aaaadd73ec567877c66a3affd1',
+  kzg_commitment: '0x89b0d8ac715ee134135471994a161ef068a784f51982fcd7161aa8e3e818eb83017ccfbfc30c89b796a2743d77554e2f',
+  kzg_proof: '0x8255a6c6a236483814b8e68992e70f3523f546866a9fed6b8e0ecfef314c65634113b8aa02d6c5c6e91b46e140f17a07',
+  transaction_hashes: [
+    { block_consensus: true, transaction_hash: '0x22d597ebcf3e8d60096dd0363bc2f0f5e2df27ba1dacd696c51aa7c9409f3193' },
+  ],
+};
+
+export const withoutData: Blob = {
+  blob_data: null,
+  hash: '0x0197fdb17195c176b23160f335daabd4b6a231aaaadd73ec567877c66a3affd3',
+  kzg_commitment: null,
+  kzg_proof: null,
+  transaction_hashes: [
+    { block_consensus: true, transaction_hash: '0x22d597ebcf3e8d60096dd0363bc2f0f5e2df27ba1dacd696c51aa7c9409f3193' },
+  ],
+};
+
+export const txBlobs: TxBlobs = {
+  items: [ base1, base2, withoutData ],
+  next_page_params: null,
+};
diff --git a/mocks/blocks/block.ts b/mocks/blocks/block.ts
index a1e9b31f0c..eb182d2ebf 100644
--- a/mocks/blocks/block.ts
+++ b/mocks/blocks/block.ts
@@ -22,6 +22,7 @@ export const base: Block = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   nonce: '0x0000000000000000',
   parent_hash: '0x44125f0eb36a9d942e0c23bb4e8117f7ba86a9537a69b59c0025986ed2b7500f',
@@ -71,6 +72,7 @@ export const genesis: Block = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: 'kitty.kitty.cat.eth',
   },
   nonce: '0x0000000000000000',
   parent_hash: '0x0000000000000000000000000000000000000000000000000000000000000000',
@@ -99,6 +101,7 @@ export const base2: Block = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   timestamp: '2022-11-11T11:46:05Z',
   tx_count: 253,
@@ -132,6 +135,15 @@ export const rootstock: Block = {
   minimum_gas_price: '59240000',
 };
 
+export const withBlobTxs: Block = {
+  ...base,
+  blob_gas_price: '21518435987',
+  blob_gas_used: '393216',
+  burnt_blob_fees: '8461393325064192',
+  excess_blob_gas: '79429632',
+  blob_tx_count: 1,
+};
+
 export const baseListResponse: BlocksResponse = {
   items: [
     base,
diff --git a/mocks/contract/audits.ts b/mocks/contract/audits.ts
new file mode 100644
index 0000000000..a2a6644229
--- /dev/null
+++ b/mocks/contract/audits.ts
@@ -0,0 +1,16 @@
+import type { SmartContractSecurityAudits } from 'types/api/contract';
+
+export const contractAudits: SmartContractSecurityAudits = {
+  items: [
+    {
+      audit_company_name: 'OpenZeppelin',
+      audit_publish_date: '2023-03-01',
+      audit_report_url: 'https://blog.openzeppelin.com/eip-4337-ethereum-account-abstraction-incremental-audit',
+    },
+    {
+      audit_company_name: 'OpenZeppelin',
+      audit_publish_date: '2023-03-01',
+      audit_report_url: 'https://blog.openzeppelin.com/eip-4337-ethereum-account-abstraction-incremental-audit',
+    },
+  ],
+};
diff --git a/mocks/contract/info.ts b/mocks/contract/info.ts
index c5e1a7e040..a797383474 100644
--- a/mocks/contract/info.ts
+++ b/mocks/contract/info.ts
@@ -31,6 +31,7 @@ export const verified: Partial<SmartContract> = {
     { address_hash: '0xa62744BeE8646e237441CDbfdedD3458861748A8', name: 'math' },
   ],
   language: 'solidity',
+  license_type: 'gnu_gpl_v3',
 };
 
 export const withMultiplePaths: Partial<SmartContract> = {
diff --git a/mocks/contract/methods.ts b/mocks/contract/methods.ts
index 745c19770a..6c1bdf367e 100644
--- a/mocks/contract/methods.ts
+++ b/mocks/contract/methods.ts
@@ -132,6 +132,7 @@ export const write: Array<SmartContractWriteMethod> = [
     payable: false,
     stateMutability: 'nonpayable',
     type: 'function',
+    method_id: '0x01',
   },
   {
     constant: false,
@@ -146,6 +147,7 @@ export const write: Array<SmartContractWriteMethod> = [
     payable: true,
     stateMutability: 'payable',
     type: 'function',
+    method_id: '0x02',
   },
   {
     stateMutability: 'payable',
@@ -159,6 +161,7 @@ export const write: Array<SmartContractWriteMethod> = [
     payable: false,
     stateMutability: 'nonpayable',
     type: 'function',
+    method_id: '0x03',
   },
   {
     constant: false,
@@ -173,6 +176,7 @@ export const write: Array<SmartContractWriteMethod> = [
     payable: false,
     stateMutability: 'nonpayable',
     type: 'function',
+    method_id: '0x04',
   },
   {
     constant: false,
@@ -190,6 +194,7 @@ export const write: Array<SmartContractWriteMethod> = [
     payable: false,
     stateMutability: 'nonpayable',
     type: 'function',
+    method_id: '0x05',
   },
   {
     constant: false,
@@ -208,5 +213,6 @@ export const write: Array<SmartContractWriteMethod> = [
     payable: false,
     stateMutability: 'nonpayable',
     type: 'function',
+    method_id: '0x06',
   },
 ];
diff --git a/mocks/contracts/index.ts b/mocks/contracts/index.ts
index 219333ef2b..bc3b4ecfb2 100644
--- a/mocks/contracts/index.ts
+++ b/mocks/contracts/index.ts
@@ -10,6 +10,7 @@ export const contract1: VerifiedContract = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   coin_balance: '2346534676900000008',
   compiler_version: 'v0.8.17+commit.8df45f5f',
@@ -19,6 +20,7 @@ export const contract1: VerifiedContract = {
   optimization_enabled: false,
   tx_count: 7334224,
   verified_at: '2022-09-16T18:49:29.605179Z',
+  license_type: 'mit',
 };
 
 export const contract2: VerifiedContract = {
@@ -31,6 +33,7 @@ export const contract2: VerifiedContract = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   coin_balance: '9078234570352343999',
   compiler_version: 'v0.3.1+commit.0463ea4c',
@@ -40,6 +43,7 @@ export const contract2: VerifiedContract = {
   optimization_enabled: true,
   tx_count: 440,
   verified_at: '2021-09-07T20:01:56.076979Z',
+  license_type: 'bsd_3_clause',
 };
 
 export const baseResponse: VerifiedContractsResponse = {
diff --git a/mocks/ens/domain.ts b/mocks/ens/domain.ts
new file mode 100644
index 0000000000..3126aaecf5
--- /dev/null
+++ b/mocks/ens/domain.ts
@@ -0,0 +1,91 @@
+import type { EnsDomainDetailed } from 'types/api/ens';
+
+const domainTokenA = {
+  id: '97352314626701792030827861137068748433918254309635329404916858191911576754327',
+  contract_hash: '0x57f1887a8bf19b14fc0df6fd9b2acc9af147ea85',
+  type: 'NATIVE_DOMAIN_TOKEN' as const,
+};
+const domainTokenB = {
+  id: '423546333',
+  contract_hash: '0x57f1887a8bf19b14fc0df6fd9b2acc9af147ea86',
+  type: 'WRAPPED_DOMAIN_TOKEN' as const,
+};
+
+export const ensDomainA: EnsDomainDetailed = {
+  id: '0xb140bf9645e54f02ed3c1bcc225566b515a98d1688f10494a5c3bc5b447936a7',
+  tokens: [
+    domainTokenA,
+    domainTokenB,
+  ],
+  name: 'cat.eth',
+  registrant: {
+    hash: '0x114d4603199df73e7d157787f8778e21fcd13066',
+  },
+  resolved_address: {
+    hash: '0xfe6ab8a0dafe7d41adf247c210451c264155c9b0',
+  },
+  owner: {
+    hash: '0x114d4603199df73e7d157787f8778e21fcd13066',
+  },
+  wrapped_owner: null,
+  registration_date: '2021-06-27T13:34:44.000Z',
+  expiry_date: '2025-03-01T14:20:24.000Z',
+  other_addresses: {
+    ETH: 'fe6ab8a0dafe7d41adf247c210451c264155c9b0',
+    GNO: 'DDAfbb505ad214D7b80b1f830fcCc89B60fb7A83',
+    NEAR: 'a0b86991c6218b36c1d19d4a2e9eb0ce3606eb48.factory.bridge.near',
+  },
+};
+
+export const ensDomainB: EnsDomainDetailed = {
+  id: '0x632ac7bec8e883416b371b36beaa822f4784208c99d063ee030020e2bd09b885',
+  tokens: [ domainTokenA ],
+  name: 'kitty.kitty.kitty.cat.eth',
+  resolved_address: null,
+  registrant: {
+    hash: '0x114d4603199df73e7d157787f8778e21fcd13066',
+  },
+  owner: {
+    hash: '0x114d4603199df73e7d157787f8778e21fcd13066',
+  },
+  wrapped_owner: null,
+  registration_date: '2023-08-13T13:01:12.000Z',
+  expiry_date: null,
+  other_addresses: {},
+};
+
+export const ensDomainC: EnsDomainDetailed = {
+  id: '0xdb7f351de6d93bda077a9211bdc49f249326d87932e4787d109b0262e9d189ad',
+  tokens: [ domainTokenA ],
+  name: 'duck.duck.eth',
+  registrant: {
+    hash: '0x114d4603199df73e7d157787f8778e21fcd13066',
+  },
+  resolved_address: {
+    hash: '0xfe6ab8a0dafe7d41adf247c210451c264155c9b0',
+  },
+  owner: {
+    hash: '0x114d4603199df73e7d157787f8778e21fcd13066',
+  },
+  wrapped_owner: null,
+  registration_date: '2022-04-24T07:34:44.000Z',
+  expiry_date: '2022-11-01T13:10:36.000Z',
+  other_addresses: {},
+};
+
+export const ensDomainD: EnsDomainDetailed = {
+  id: '0xdb7f351de6d93bda077a9211bdc49f249326d87932e4787d109b0262e9d189ae',
+  tokens: [ domainTokenA ],
+  name: '🦆.duck.eth',
+  registrant: {
+    hash: '0x114d4603199df73e7d157787f8778e21fcd13066',
+  },
+  resolved_address: {
+    hash: '0x114d4603199df73e7d157787f8778e21fcd13066',
+  },
+  owner: null,
+  wrapped_owner: null,
+  registration_date: '2022-04-24T07:34:44.000Z',
+  expiry_date: '2027-09-23T13:10:36.000Z',
+  other_addresses: {},
+};
diff --git a/mocks/ens/events.ts b/mocks/ens/events.ts
new file mode 100644
index 0000000000..2d60cc721a
--- /dev/null
+++ b/mocks/ens/events.ts
@@ -0,0 +1,19 @@
+import type { EnsDomainEvent } from 'types/api/ens';
+
+export const ensDomainEventA: EnsDomainEvent = {
+  transaction_hash: '0x86c66b9fad66e4f20d42a6eed4fe12a0f48a274786fd85e9d4aa6c60e84b5874',
+  timestamp: '2021-06-27T13:34:44.000000Z',
+  from_address: {
+    hash: '0xaa96a50a2f67111262fe24576bd85bb56ec65016',
+  },
+  action: '0xf7a16963',
+};
+
+export const ensDomainEventB = {
+  transaction_hash: '0x150bf7d5cd42457dd9c799ddd9d4bf6c30c703e1954a88c6d4b668b23fe0fbf8',
+  timestamp: '2022-11-02T14:20:24.000000Z',
+  from_address: {
+    hash: '0xfe6ab8a0dafe7d41adf247c210451c264155c9b0',
+  },
+  action: 'register',
+};
diff --git a/mocks/l2txnBatches/txnBatches.ts b/mocks/l2txnBatches/txnBatches.ts
index 4459c2b57f..f3c086c855 100644
--- a/mocks/l2txnBatches/txnBatches.ts
+++ b/mocks/l2txnBatches/txnBatches.ts
@@ -1,7 +1,6 @@
 export const txnBatchesData = {
   items: [
     {
-      epoch_number: 8547349,
       l1_tx_hashes: [
         '0x5bc94d02b65743dfaa9e10a2d6e175aff2a05cce2128c8eaf848bd84ab9325c5',
         '0x92a51bc623111dbb91f243e3452e60fab6f090710357f9d9b75ac8a0f67dfd9d',
@@ -11,7 +10,6 @@ export const txnBatchesData = {
       tx_count: 0,
     },
     {
-      epoch_number: 8547348,
       l1_tx_hashes: [
         '0xc45f846ee28ce9ba116ce2d378d3dd00b55d324b833b3ecd4241c919c572c4aa',
       ],
@@ -20,7 +18,6 @@ export const txnBatchesData = {
       tx_count: 0,
     },
     {
-      epoch_number: 8547348,
       l1_tx_hashes: [
         '0x48139721f792d3a68c3781b4cf50e66e8fc7dbb38adff778e09066ea5be9adb8',
       ],
diff --git a/mocks/noves/transaction.ts b/mocks/noves/transaction.ts
new file mode 100644
index 0000000000..6feb72a564
--- /dev/null
+++ b/mocks/noves/transaction.ts
@@ -0,0 +1,103 @@
+import type { NovesResponseData } from 'types/api/noves';
+
+import type { TokensData } from 'ui/tx/assetFlows/utils/getTokensData';
+
+export const hash = '0x380400d04ebb4179a35b1d7fdef260776915f015e978f8587ef2704b843d4e53';
+
+export const transaction: NovesResponseData = {
+  accountAddress: '0xef6595A423c99f3f2821190A4d96fcE4DcD89a80',
+  chain: 'eth-goerli',
+  classificationData: {
+    description: 'Called function \'stake\' on contract 0xef326CdAdA59D3A740A76bB5f4F88Fb2.',
+    protocol: {
+      name: null,
+    },
+    received: [],
+    sent: [
+      {
+        action: 'sent',
+        actionFormatted: 'Sent',
+        amount: '3000',
+        from: {
+          address: '0xef6595A423c99f3f2821190A4d96fcE4DcD89a80',
+          name: 'This wallet',
+        },
+        to: {
+          address: '0xdD15D2650387Fb6FEDE27ae7392C402a393F8A37',
+          name: null,
+        },
+        token: {
+          address: '0x1bfe4298796198f8664b18a98640cec7c89b5baa',
+          decimals: 18,
+          name: 'PQR-Test',
+          symbol: 'PQR',
+        },
+      },
+      {
+        action: 'paidGas',
+        actionFormatted: 'Paid Gas',
+        amount: '0.000395521502109448',
+        from: {
+          address: '0xef6595A423c99f3f2821190A4d96fcE4DcD89a80',
+          name: 'This wallet',
+        },
+        to: {
+          address: null,
+          name: 'Validators',
+        },
+        token: {
+          address: 'ETH',
+          decimals: 18,
+          name: 'ETH',
+          symbol: 'ETH',
+        },
+      },
+    ],
+    source: {
+      type: null,
+    },
+    type: 'unclassified',
+    typeFormatted: 'Unclassified',
+  },
+  rawTransactionData: {
+    blockNumber: 10388918,
+    fromAddress: '0xef6595A423c99f3f2821190A4d96fcE4DcD89a80',
+    gas: 275079,
+    gasPrice: 1500000008,
+    timestamp: 1705488588,
+    toAddress: '0xef326CdAdA59D3A740A76bB5f4F88Fb2f1076164',
+    transactionFee: {
+      amount: '395521502109448',
+      token: {
+        decimals: 18,
+        symbol: 'ETH',
+      },
+    },
+    transactionHash: '0x380400d04ebb4179a35b1d7fdef260776915f015e978f8587ef2704b843d4e53',
+  },
+  txTypeVersion: 2,
+};
+
+export const tokenData: TokensData = {
+  nameList: [ 'PQR-Test', 'ETH' ],
+  symbolList: [ 'PQR' ],
+  idList: [],
+  byName: {
+    'PQR-Test': {
+      name: 'PQR-Test',
+      symbol: 'PQR',
+      address: '0x1bfe4298796198f8664b18a98640cec7c89b5baa',
+      id: undefined,
+    },
+    ETH: { name: 'ETH', symbol: null, address: '', id: undefined },
+  },
+  bySymbol: {
+    PQR: {
+      name: 'PQR-Test',
+      symbol: 'PQR',
+      address: '0x1bfe4298796198f8664b18a98640cec7c89b5baa',
+      id: undefined,
+    },
+    'null': { name: 'ETH', symbol: null, address: '', id: undefined },
+  },
+};
diff --git a/mocks/search/index.ts b/mocks/search/index.ts
index 9f8907fa71..4009a6d460 100644
--- a/mocks/search/index.ts
+++ b/mocks/search/index.ts
@@ -5,6 +5,8 @@ import type {
   SearchResultTx,
   SearchResultLabel,
   SearchResult,
+  SearchResultUserOp,
+  SearchResultBlob,
 } from 'types/api/search';
 
 export const token1: SearchResultToken = {
@@ -54,6 +56,15 @@ export const block2: SearchResultBlock = {
   url: '/block/0x1af31d7535dded06bab9a88eb40ee2f8d0529a60ab3b8a7be2ba69b008cacbd2',
 };
 
+export const block3: SearchResultBlock = {
+  block_hash: '0x1af31d7535dded06bab9a88eb40ee2f8d0529a60ab3b8a7be2ba69b008cacbd3',
+  block_number: 8198536,
+  block_type: 'uncle',
+  type: 'block' as const,
+  timestamp: '2022-12-11T18:11:11Z',
+  url: '/block/0x1af31d7535dded06bab9a88eb40ee2f8d0529a60ab3b8a7be2ba69b008cacbd3',
+};
+
 export const address1: SearchResultAddressOrContractOrUniversalProfile = {
   address: '0xb64a30399f7F6b0C154c2E7Af0a3ec7B0A5b131a',
   name: null,
@@ -62,6 +73,20 @@ export const address1: SearchResultAddressOrContractOrUniversalProfile = {
   url: '/address/0xb64a30399f7F6b0C154c2E7Af0a3ec7B0A5b131a',
 };
 
+export const address2: SearchResultAddressOrContractOrUniversalProfile = {
+  address: '0xb64a30399f7F6b0C154c2E7Af0a3ec7B0A5b131b',
+  name: null,
+  type: 'address' as const,
+  is_smart_contract_verified: false,
+  url: '/address/0xb64a30399f7F6b0C154c2E7Af0a3ec7B0A5b131b',
+  ens_info: {
+    address_hash: '0x1234567890123456789012345678901234567890',
+    expiry_date: '2022-12-11T17:55:20Z',
+    name: 'utko.eth',
+    names_count: 1,
+  },
+};
+
 export const contract1: SearchResultAddressOrContractOrUniversalProfile = {
   address: '0xb64a30399f7F6b0C154c2E7Af0a3ec7B0A5b131a',
   name: 'Unknown contract in this network',
@@ -85,6 +110,19 @@ export const tx1: SearchResultTx = {
   url: '/tx/0x349d4025d03c6faec117ee10ac0bce7c7a805dd2cbff7a9f101304d9a8a525dd',
 };
 
+export const userOp1: SearchResultUserOp = {
+  timestamp: '2024-01-11T14:15:48.000000Z',
+  type: 'user_operation',
+  user_operation_hash: '0xcb560d77b0f3af074fa05c1e5c691bcdfe457e630062b5907e9e71fc74b2ec61',
+  url: '/op/0xcb560d77b0f3af074fa05c1e5c691bcdfe457e630062b5907e9e71fc74b2ec61',
+};
+
+export const blob1: SearchResultBlob = {
+  blob_hash: '0x0108dd3e414da9f3255f7a831afa606e8dfaea93d082dfa9b15305583cbbdbbe',
+  type: 'blob' as const,
+  timestamp: null,
+};
+
 export const baseResponse: SearchResult = {
   items: [
     token1,
@@ -93,6 +131,7 @@ export const baseResponse: SearchResult = {
     address1,
     contract1,
     tx1,
+    blob1,
   ],
   next_page_params: null,
 };
diff --git a/mocks/shibarium/deposits.ts b/mocks/shibarium/deposits.ts
new file mode 100644
index 0000000000..98bf9d925d
--- /dev/null
+++ b/mocks/shibarium/deposits.ts
@@ -0,0 +1,61 @@
+import type { ShibariumDepositsResponse } from 'types/api/shibarium';
+
+export const data: ShibariumDepositsResponse = {
+  items: [
+    {
+      l1_block_number: 8382841,
+      timestamp: '2022-05-27T01:13:48.000000Z',
+      l1_transaction_hash: '0xaf3e5f4ef03eac22a622b3434c5dc9f4465aa291900a86bcf0ad9fb14429f05e',
+      user: {
+        hash: '0x6197d1eef304eb5284a0f6720f79403b4e9bf3a5',
+        implementation_name: null,
+        is_contract: false,
+        is_verified: false,
+        name: null,
+        private_tags: [],
+        public_tags: [],
+        watchlist_names: [],
+        ens_domain_name: null,
+      },
+      l2_transaction_hash: '0xb9212c76069b926917816767e4c5a0ef80e519b1ac1c3d3fb5818078f4984667',
+    },
+    {
+      l1_block_number: 8382841,
+      timestamp: '2022-05-27T01:13:48.000000Z',
+      l1_transaction_hash: '0xaf3e5f4ef03eac22a622b3434c5dc9f4465aa291900a86bcf0ad9fb14429f05e',
+      user: {
+        hash: '0x6197d1eef304eb5284a0f6720f79403b4e9bf3a5',
+        implementation_name: null,
+        is_contract: false,
+        is_verified: false,
+        name: null,
+        private_tags: [],
+        public_tags: [],
+        watchlist_names: [],
+        ens_domain_name: null,
+      },
+      l2_transaction_hash: '0xb9212c76069b926917816767e4c5a0ef80e519b1ac1c3d3fb5818078f4984667',
+    },
+    {
+      l1_block_number: 8382841,
+      timestamp: '2022-05-27T01:13:48.000000Z',
+      l1_transaction_hash: '0xaf3e5f4ef03eac22a622b3434c5dc9f4465aa291900a86bcf0ad9fb14429f05e',
+      user: {
+        hash: '0x6197d1eef304eb5284a0f6720f79403b4e9bf3a5',
+        implementation_name: null,
+        is_contract: false,
+        is_verified: false,
+        name: null,
+        private_tags: [],
+        public_tags: [],
+        watchlist_names: [],
+        ens_domain_name: null,
+      },
+      l2_transaction_hash: '0xb9212c76069b926917816767e4c5a0ef80e519b1ac1c3d3fb5818078f4984667',
+    },
+  ],
+  next_page_params: {
+    items_count: 50,
+    block_number: 8382363,
+  },
+};
diff --git a/mocks/shibarium/withdrawals.ts b/mocks/shibarium/withdrawals.ts
new file mode 100644
index 0000000000..79851f3d1b
--- /dev/null
+++ b/mocks/shibarium/withdrawals.ts
@@ -0,0 +1,61 @@
+import type { ShibariumWithdrawalsResponse } from 'types/api/shibarium';
+
+export const data: ShibariumWithdrawalsResponse = {
+  items: [
+    {
+      l2_block_number: 8382841,
+      timestamp: '2022-05-27T01:13:48.000000Z',
+      l1_transaction_hash: '0xaf3e5f4ef03eac22a622b3434c5dc9f4465aa291900a86bcf0ad9fb14429f05e',
+      user: {
+        hash: '0x6197d1eef304eb5284a0f6720f79403b4e9bf3a5',
+        implementation_name: null,
+        is_contract: false,
+        is_verified: false,
+        name: null,
+        private_tags: [],
+        public_tags: [],
+        watchlist_names: [],
+        ens_domain_name: null,
+      },
+      l2_transaction_hash: '0xb9212c76069b926917816767e4c5a0ef80e519b1ac1c3d3fb5818078f4984667',
+    },
+    {
+      l2_block_number: 8382841,
+      timestamp: '2022-05-27T01:13:48.000000Z',
+      l1_transaction_hash: '0xaf3e5f4ef03eac22a622b3434c5dc9f4465aa291900a86bcf0ad9fb14429f05e',
+      user: {
+        hash: '0x6197d1eef304eb5284a0f6720f79403b4e9bf3a5',
+        implementation_name: null,
+        is_contract: false,
+        is_verified: false,
+        name: null,
+        private_tags: [],
+        public_tags: [],
+        watchlist_names: [],
+        ens_domain_name: null,
+      },
+      l2_transaction_hash: '0xb9212c76069b926917816767e4c5a0ef80e519b1ac1c3d3fb5818078f4984667',
+    },
+    {
+      l2_block_number: 8382841,
+      timestamp: '2022-05-27T01:13:48.000000Z',
+      l1_transaction_hash: '0xaf3e5f4ef03eac22a622b3434c5dc9f4465aa291900a86bcf0ad9fb14429f05e',
+      user: {
+        hash: '0x6197d1eef304eb5284a0f6720f79403b4e9bf3a5',
+        implementation_name: null,
+        is_contract: false,
+        is_verified: false,
+        name: null,
+        private_tags: [],
+        public_tags: [],
+        watchlist_names: [],
+        ens_domain_name: null,
+      },
+      l2_transaction_hash: '0xb9212c76069b926917816767e4c5a0ef80e519b1ac1c3d3fb5818078f4984667',
+    },
+  ],
+  next_page_params: {
+    items_count: 50,
+    block_number: 8382363,
+  },
+};
diff --git a/mocks/stats/daily_txs.ts b/mocks/stats/daily_txs.ts
index 03cb3f20ac..afb2dcca58 100644
--- a/mocks/stats/daily_txs.ts
+++ b/mocks/stats/daily_txs.ts
@@ -126,3 +126,24 @@ export const base = {
     },
   ],
 };
+
+export const partialData = {
+  chart_data: [
+    { date: '2022-11-28', tx_count: 26815 },
+    { date: '2022-11-27', tx_count: 34784 },
+    { date: '2022-11-26', tx_count: 77527 },
+    { date: '2022-11-25', tx_count: null },
+    { date: '2022-11-24', tx_count: null },
+    { date: '2022-11-23', tx_count: null },
+    { date: '2022-11-22', tx_count: 63433 },
+    { date: '2022-11-21', tx_count: null },
+  ],
+};
+
+export const noData = {
+  chart_data: [
+    { date: '2022-11-25', tx_count: null },
+    { date: '2022-11-24', tx_count: null },
+    { date: '2022-11-23', tx_count: null },
+  ],
+};
diff --git a/mocks/stats/index.ts b/mocks/stats/index.ts
index 3bc757e155..d9d00e36e1 100644
--- a/mocks/stats/index.ts
+++ b/mocks/stats/index.ts
@@ -1,13 +1,34 @@
-import type { HomeStats } from 'types/api/stats';
+import _mapValues from 'lodash/mapValues';
 
-export const base: HomeStats = {
+export const base = {
   average_block_time: 6212.0,
   coin_price: '0.00199678',
+  coin_price_change_percentage: -7.42,
   gas_prices: {
-    average: 48.0,
-    fast: 67.5,
-    slow: 48.0,
+    average: {
+      fiat_price: '1.39',
+      price: 23.75,
+      time: 12030.25,
+      base_fee: 2.22222,
+      priority_fee: 12.424242,
+    },
+    fast: {
+      fiat_price: '1.74',
+      price: 29.72,
+      time: 8763.25,
+      base_fee: 4.44444,
+      priority_fee: 22.242424,
+    },
+    slow: {
+      fiat_price: '1.35',
+      price: 23.04,
+      time: 20100.25,
+      base_fee: 1.11111,
+      priority_fee: 7.8909,
+    },
   },
+  gas_price_updated_at: '2022-11-11T11:09:49.051171Z',
+  gas_prices_update_in: 300000,
   gas_used_today: '4108680603',
   market_cap: '330809.96443288102524',
   network_utilization_percentage: 1.55372064,
@@ -20,7 +41,30 @@ export const base: HomeStats = {
   tvl: '1767425.102766552',
 };
 
-export const withBtcLocked: HomeStats = {
+export const withBtcLocked = {
   ...base,
   rootstock_locked_btc: '3337493406696977561374',
 };
+
+export const withoutFiatPrices = {
+  ...base,
+  gas_prices: _mapValues(base.gas_prices, (price) => price ? ({ ...price, fiat_price: null }) : null),
+};
+
+export const withoutGweiPrices = {
+  ...base,
+  gas_prices: _mapValues(base.gas_prices, (price) => price ? ({ ...price, price: null }) : null),
+};
+
+export const withoutBothPrices = {
+  ...base,
+  gas_prices: _mapValues(base.gas_prices, (price) => price ? ({ ...price, price: null, fiat_price: null }) : null),
+};
+
+export const noChartData = {
+  ...base,
+  transactions_today: null,
+  coin_price: null,
+  market_cap: null,
+  tvl: null,
+};
diff --git a/mocks/stats/line.ts b/mocks/stats/line.ts
new file mode 100644
index 0000000000..47de79b184
--- /dev/null
+++ b/mocks/stats/line.ts
@@ -0,0 +1,128 @@
+export const averageGasPrice = {
+  chart: [
+    {
+      date: '2023-12-22',
+      value: '37.7804422597599',
+    },
+    {
+      date: '2023-12-23',
+      value: '25.84889883009387',
+    },
+    {
+      date: '2023-12-24',
+      value: '25.818463227198574',
+    },
+    {
+      date: '2023-12-25',
+      value: '26.045513050051298',
+    },
+    {
+      date: '2023-12-26',
+      value: '21.42600692652399',
+    },
+    {
+      date: '2023-12-27',
+      value: '31.066730409846656',
+    },
+    {
+      date: '2023-12-28',
+      value: '33.63955781902089',
+    },
+    {
+      date: '2023-12-29',
+      value: '28.064736756058384',
+    },
+    {
+      date: '2023-12-30',
+      value: '23.074500869678175',
+    },
+    {
+      date: '2023-12-31',
+      value: '17.651005734615133',
+    },
+    {
+      date: '2024-01-01',
+      value: '14.906085174476441',
+    },
+    {
+      date: '2024-01-02',
+      value: '22.28459059038656',
+    },
+    {
+      date: '2024-01-03',
+      value: '39.8311646806592',
+    },
+    {
+      date: '2024-01-04',
+      value: '26.09989322256083',
+    },
+    {
+      date: '2024-01-05',
+      value: '22.821996688111998',
+    },
+    {
+      date: '2024-01-06',
+      value: '20.32680041262083',
+    },
+    {
+      date: '2024-01-07',
+      value: '32.535045831809704',
+    },
+    {
+      date: '2024-01-08',
+      value: '27.443477102139482',
+    },
+    {
+      date: '2024-01-09',
+      value: '20.7911332558055',
+    },
+    {
+      date: '2024-01-10',
+      value: '42.10740192523919',
+    },
+    {
+      date: '2024-01-11',
+      value: '35.75215680343582',
+    },
+    {
+      date: '2024-01-12',
+      value: '27.430414798093253',
+    },
+    {
+      date: '2024-01-13',
+      value: '20.170934096589875',
+    },
+    {
+      date: '2024-01-14',
+      value: '38.79660984371034',
+    },
+    {
+      date: '2024-01-15',
+      value: '26.140740484554204',
+    },
+    {
+      date: '2024-01-16',
+      value: '36.708543184194156',
+    },
+    {
+      date: '2024-01-17',
+      value: '40.325438794298876',
+    },
+    {
+      date: '2024-01-18',
+      value: '37.55145309930694',
+    },
+    {
+      date: '2024-01-19',
+      value: '33.271450114434664',
+    },
+    {
+      date: '2024-01-20',
+      value: '19.303304377685638',
+    },
+    {
+      date: '2024-01-21',
+      value: '14.375908594704976',
+    },
+  ],
+};
diff --git a/mocks/stats/lines.ts b/mocks/stats/lines.ts
new file mode 100644
index 0000000000..51aca3c97d
--- /dev/null
+++ b/mocks/stats/lines.ts
@@ -0,0 +1,142 @@
+export const base = {
+  sections: [
+    {
+      id: 'accounts',
+      title: 'Accounts',
+      charts: [
+        {
+          id: 'accountsGrowth',
+          title: 'Accounts growth',
+          description: 'Cumulative accounts number per period',
+          units: null,
+        },
+        {
+          id: 'activeAccounts',
+          title: 'Active accounts',
+          description: 'Active accounts number per period',
+          units: null,
+        },
+        {
+          id: 'newAccounts',
+          title: 'New accounts',
+          description: 'New accounts number per day',
+          units: null,
+        },
+      ],
+    },
+    {
+      id: 'transactions',
+      title: 'Transactions',
+      charts: [
+        {
+          id: 'averageTxnFee',
+          title: 'Average transaction fee',
+          description: 'The average amount in ETH spent per transaction',
+          units: 'ETH',
+        },
+        {
+          id: 'newTxns',
+          title: 'New transactions',
+          description: 'New transactions number',
+          units: null,
+        },
+        {
+          id: 'txnsFee',
+          title: 'Transactions fees',
+          description: 'Amount of tokens paid as fees',
+          units: 'ETH',
+        },
+        {
+          id: 'txnsGrowth',
+          title: 'Transactions growth',
+          description: 'Cumulative transactions number',
+          units: null,
+        },
+        {
+          id: 'txnsSuccessRate',
+          title: 'Transactions success rate',
+          description: 'Successful transactions rate per day',
+          units: null,
+        },
+      ],
+    },
+    {
+      id: 'blocks',
+      title: 'Blocks',
+      charts: [
+        {
+          id: 'averageBlockRewards',
+          title: 'Average block rewards',
+          description: 'Average amount of distributed reward in tokens per day',
+          units: 'ETH',
+        },
+        {
+          id: 'averageBlockSize',
+          title: 'Average block size',
+          description: 'Average size of blocks in bytes',
+          units: 'Bytes',
+        },
+        {
+          id: 'newBlocks',
+          title: 'New blocks',
+          description: 'New blocks number',
+          units: null,
+        },
+      ],
+    },
+    {
+      id: 'tokens',
+      title: 'Tokens',
+      charts: [
+        {
+          id: 'newNativeCoinTransfers',
+          title: 'New ETH transfers',
+          description: 'New token transfers number for the period',
+          units: null,
+        },
+      ],
+    },
+    {
+      id: 'gas',
+      title: 'Gas',
+      charts: [
+        {
+          id: 'averageGasLimit',
+          title: 'Average gas limit',
+          description: 'Average gas limit per block for the period',
+          units: null,
+        },
+        {
+          id: 'averageGasPrice',
+          title: 'Average gas price',
+          description: 'Average gas price for the period (Gwei)',
+          units: 'Gwei',
+        },
+        {
+          id: 'gasUsedGrowth',
+          title: 'Gas used growth',
+          description: 'Cumulative gas used for the period',
+          units: null,
+        },
+      ],
+    },
+    {
+      id: 'contracts',
+      title: 'Contracts',
+      charts: [
+        {
+          id: 'newVerifiedContracts',
+          title: 'New verified contracts',
+          description: 'New verified contracts number for the period',
+          units: null,
+        },
+        {
+          id: 'verifiedContractsGrowth',
+          title: 'Verified contracts growth',
+          description: 'Cumulative number verified contracts for the period',
+          units: null,
+        },
+      ],
+    },
+  ],
+};
diff --git a/mocks/tokens/tokenHolders.ts b/mocks/tokens/tokenHolders.ts
index 582476e903..89f2595482 100644
--- a/mocks/tokens/tokenHolders.ts
+++ b/mocks/tokens/tokenHolders.ts
@@ -2,18 +2,14 @@ import type { TokenHolders } from 'types/api/token';
 
 import { withName, withoutName } from 'mocks/address/address';
 
-import { tokenInfoERC1155a, tokenInfoERC20a } from './tokenInfo';
-
 export const tokenHoldersERC20: TokenHolders = {
   items: [
     {
       address: withName,
-      token: tokenInfoERC20a,
       value: '107014805905725000000',
     },
     {
       address: withoutName,
-      token: tokenInfoERC20a,
       value: '207014805905725000000',
     },
   ],
@@ -27,13 +23,11 @@ export const tokenHoldersERC1155: TokenHolders = {
   items: [
     {
       address: withName,
-      token: tokenInfoERC1155a,
       value: '107014805905725000000',
       token_id: '12345',
     },
     {
       address: withoutName,
-      token: tokenInfoERC1155a,
       value: '207014805905725000000',
       token_id: '12345',
     },
diff --git a/mocks/tokens/tokenInfo.ts b/mocks/tokens/tokenInfo.ts
index 1034b9bc64..a732712775 100644
--- a/mocks/tokens/tokenInfo.ts
+++ b/mocks/tokens/tokenInfo.ts
@@ -28,7 +28,7 @@ export const tokenInfoERC20a: TokenInfo<'ERC-20'> = {
   symbol: 'HyFi',
   total_supply: '369000000000000000000000000',
   type: 'ERC-20',
-  icon_url: 'https://example.com/token-icon.png',
+  icon_url: 'http://localhost:3000/token-icon.png',
 };
 
 export const tokenInfoERC20b: TokenInfo<'ERC-20'> = {
@@ -174,6 +174,19 @@ export const tokenInfoERC1155WithoutName: TokenInfo<'ERC-1155'> = {
   icon_url: null,
 };
 
+export const tokenInfoERC404: TokenInfo<'ERC-404'> = {
+  address: '0xB5C457dDB4cE3312a6C5a2b056a1652bd542a208',
+  circulating_market_cap: '0.0',
+  decimals: '18',
+  exchange_rate: '1484.13',
+  holders: '81',
+  icon_url: null,
+  name: 'OMNI404',
+  symbol: 'O404',
+  total_supply: '6482275000000000000',
+  type: 'ERC-404',
+};
+
 export const bridgedTokenA: TokenInfo<'ERC-20'> = {
   ...tokenInfoERC20a,
   is_bridged: true,
diff --git a/mocks/tokens/tokenTransfer.ts b/mocks/tokens/tokenTransfer.ts
index 670f276867..08b87b6858 100644
--- a/mocks/tokens/tokenTransfer.ts
+++ b/mocks/tokens/tokenTransfer.ts
@@ -10,6 +10,7 @@ export const erc20: TokenTransfer = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   to: {
     hash: '0x7d20a8D54F955b4483A66aB335635ab66e151c51',
@@ -20,6 +21,7 @@ export const erc20: TokenTransfer = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: 'kitty.kitty.cat.eth',
   },
   token: {
     address: '0x55d536e4d6c1993d8ef2e2a4ef77f02088419420',
@@ -55,6 +57,7 @@ export const erc721: TokenTransfer = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: 'kitty.kitty.cat.eth',
   },
   to: {
     hash: '0x47eE48AEBc4ab9Ed908b805b8c8dAAa71B31Db1A',
@@ -65,6 +68,7 @@ export const erc721: TokenTransfer = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   token: {
     address: '0x363574E6C5C71c343d7348093D84320c76d5Dd29',
@@ -99,6 +103,7 @@ export const erc1155A: TokenTransfer = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   to: {
     hash: '0xBb36c792B9B45Aaf8b848A1392B0d6559202729E',
@@ -109,6 +114,7 @@ export const erc1155A: TokenTransfer = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: 'kitty.kitty.cat.eth',
   },
   token: {
     address: '0xF56b7693E4212C584de4a83117f805B8E89224CB',
@@ -164,6 +170,63 @@ export const erc1155D: TokenTransfer = {
   total: { token_id: '456', value: '42', decimals: null },
 };
 
+export const erc404A: TokenTransfer = {
+  from: {
+    hash: '0x0000000000000000000000000000000000000000',
+    implementation_name: null,
+    is_contract: false,
+    is_verified: false,
+    name: null,
+    private_tags: [],
+    public_tags: [],
+    watchlist_names: [],
+    ens_domain_name: null,
+  },
+  to: {
+    hash: '0xBb36c792B9B45Aaf8b848A1392B0d6559202729E',
+    implementation_name: null,
+    is_contract: false,
+    is_verified: false,
+    name: null,
+    private_tags: [],
+    public_tags: [],
+    watchlist_names: [],
+    ens_domain_name: 'kitty.kitty.cat.eth',
+  },
+  token: {
+    address: '0xF56b7693E4212C584de4a83117f805B8E89224CB',
+    circulating_market_cap: null,
+    decimals: null,
+    exchange_rate: null,
+    holders: '1',
+    name: null,
+    symbol: 'MY_SYMBOL_IS_VERY_LONG',
+    type: 'ERC-404',
+    total_supply: '0',
+    icon_url: null,
+  },
+  total: {
+    value: '42000000000000000000000000',
+    decimals: '18',
+  },
+  tx_hash: '0x05d6589367633c032d757a69c5fb16c0e33e3994b0d9d1483f82aeee1f05d746',
+  type: 'token_transfer',
+  method: 'swap',
+  timestamp: '2022-10-10T14:34:30.000000Z',
+  block_hash: '1',
+  log_index: '1',
+};
+
+export const erc404B: TokenTransfer = {
+  ...erc404A,
+  token: {
+    ...erc404A.token,
+    name: 'SastanaNFT',
+    symbol: 'ipfs://QmUpFUfVKDCWeZQk5pvDFUxnpQP9N6eLSHhNUy49T1JVtY',
+  },
+  total: { token_id: '4625304364899952' },
+};
+
 export const mixTokens: TokenTransferResponse = {
   items: [
     erc20,
@@ -172,6 +235,8 @@ export const mixTokens: TokenTransferResponse = {
     erc1155B,
     erc1155C,
     erc1155D,
+    erc404A,
+    erc404B,
   ],
   next_page_params: null,
 };
diff --git a/mocks/txs/internalTxs.ts b/mocks/txs/internalTxs.ts
index 8bd2773236..07eb83dc5e 100644
--- a/mocks/txs/internalTxs.ts
+++ b/mocks/txs/internalTxs.ts
@@ -13,6 +13,7 @@ export const base: InternalTransaction = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   gas_limit: '757586',
   index: 1,
@@ -27,6 +28,7 @@ export const base: InternalTransaction = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   transaction_hash: '0xe9e27dfeb183066e26cfe556f74b7219b08df6951e25d14003d4fc7af8bbff61',
   type: 'call',
@@ -61,6 +63,7 @@ export const withContractCreated: InternalTransaction = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   value: '1420000000000000000',
   gas_limit: '5433',
diff --git a/mocks/txs/state.ts b/mocks/txs/state.ts
index 3192de294d..204fe1c867 100644
--- a/mocks/txs/state.ts
+++ b/mocks/txs/state.ts
@@ -10,6 +10,7 @@ export const mintToken: TxStateChange = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   balance_after: null,
   balance_before: null,
@@ -47,6 +48,7 @@ export const receiveMintedToken: TxStateChange = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   balance_after: '1',
   balance_before: '0',
@@ -84,6 +86,7 @@ export const transfer1155Token: TxStateChange = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   balance_after: '1',
   balance_before: '0',
@@ -115,6 +118,7 @@ export const receiveCoin: TxStateChange = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   balance_after: '443787514723917012805',
   balance_before: '443787484997510408745',
@@ -134,6 +138,7 @@ export const sendCoin: TxStateChange = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   balance_after: '828282622733717191',
   balance_before: '832127467556437753',
diff --git a/mocks/txs/tx.ts b/mocks/txs/tx.ts
index c2d7d8ad0f..0b97508282 100644
--- a/mocks/txs/tx.ts
+++ b/mocks/txs/tx.ts
@@ -29,6 +29,7 @@ export const base: Transaction = {
     private_tags: [ ],
     public_tags: [ publicTag ],
     watchlist_names: [],
+    ens_domain_name: 'kitty.kitty.cat.eth',
   },
   gas_limit: '800000',
   gas_price: '48000000000',
@@ -54,6 +55,7 @@ export const base: Transaction = {
     private_tags: [ privateTag ],
     public_tags: [],
     watchlist_names: [ watchlistName ],
+    ens_domain_name: null,
   },
   token_transfers: [],
   token_transfers_overflow: false,
@@ -97,6 +99,7 @@ export const withContractCreation: Transaction = {
     private_tags: [],
     public_tags: [],
     watchlist_names: [],
+    ens_domain_name: null,
   },
   tx_types: [
     'contract_creation',
@@ -115,6 +118,7 @@ export const withTokenTransfer: Transaction = {
     private_tags: [ privateTag ],
     public_tags: [],
     watchlist_names: [ watchlistName ],
+    ens_domain_name: null,
   },
   token_transfers: [
     tokenTransferMock.erc20,
@@ -123,6 +127,8 @@ export const withTokenTransfer: Transaction = {
     tokenTransferMock.erc1155B,
     tokenTransferMock.erc1155C,
     tokenTransferMock.erc1155D,
+    tokenTransferMock.erc404A,
+    tokenTransferMock.erc404B,
   ],
   token_transfers_overflow: true,
   tx_types: [
@@ -168,6 +174,7 @@ export const withRawRevertReason: Transaction = {
     private_tags: [ ],
     public_tags: [],
     watchlist_names: [ ],
+    ens_domain_name: null,
   },
 };
 
@@ -283,6 +290,7 @@ export const stabilityTx: Transaction = {
       private_tags: [],
       public_tags: [],
       watchlist_names: [],
+      ens_domain_name: null,
     },
     dapp_fee: '34381250000000',
     token: {
@@ -307,6 +315,7 @@ export const stabilityTx: Transaction = {
       private_tags: [],
       public_tags: [],
       watchlist_names: [],
+      ens_domain_name: null,
     },
     validator_fee: '34381250000000',
   },
@@ -334,3 +343,17 @@ export const base4 = {
   ...base,
   hash: '0x22d597ebcf3e8d60096dd0363bc2f0f5e2df27ba1dacd696c51aa7c9409f3193',
 };
+
+export const withBlob = {
+  ...base,
+  blob_gas_price: '21518435987',
+  blob_gas_used: '131072',
+  blob_versioned_hashes: [
+    '0x01a8c328b0370068aaaef49c107f70901cd79adcda81e3599a88855532122e09',
+    '0x0197fdb17195c176b23160f335daabd4b6a231aaaadd73ec567877c66a3affd1',
+  ],
+  burnt_blob_fee: '2820464441688064',
+  max_fee_per_blob_gas: '60000000000',
+  tx_types: [ 'blob_transaction' as const ],
+  type: 3,
+};
diff --git a/mocks/txs/txInterpretation.ts b/mocks/txs/txInterpretation.ts
index b351363a52..e9c1a43b85 100644
--- a/mocks/txs/txInterpretation.ts
+++ b/mocks/txs/txInterpretation.ts
@@ -33,6 +33,7 @@ export const txInterpretation: TxInterpretationResponse = {
             private_tags: [],
             public_tags: [],
             watchlist_names: [],
+            ens_domain_name: null,
           },
         },
         timestamp: {
diff --git a/mocks/user/profile.ts b/mocks/user/profile.ts
index e5caed3b63..955f872e01 100644
--- a/mocks/user/profile.ts
+++ b/mocks/user/profile.ts
@@ -4,3 +4,10 @@ export const base = {
   name: 'tom goriunov',
   nickname: 'tom2drum',
 };
+
+export const withoutEmail = {
+  avatar: 'https://avatars.githubusercontent.com/u/22130104',
+  email: null,
+  name: 'tom goriunov',
+  nickname: 'tom2drum',
+};
diff --git a/mocks/userOps/userOp.ts b/mocks/userOps/userOp.ts
new file mode 100644
index 0000000000..efb7517187
--- /dev/null
+++ b/mocks/userOps/userOp.ts
@@ -0,0 +1,77 @@
+import type { UserOp } from 'types/api/userOps';
+
+export const userOpData: UserOp = {
+  timestamp: '2024-01-19T12:42:12.000000Z',
+  transaction_hash: '0x715fe1474ac7bea3d6f4a03b1c5b6d626675fb0b103be29f849af65e9f1f9c6a',
+  user_logs_start_index: 40,
+  fee: '187125856691380',
+  call_gas_limit: '26624',
+  gas: '258875',
+  status: true,
+  aggregator_signature: null,
+  block_hash: '0xff5f41ec89e5fb3dfcf103bbbd67469fed491a7dd7cffdf00bd9e3bf45d8aeab',
+  pre_verification_gas: '48396',
+  factory: null,
+  signature: '0x2b95a173c1ea314d2c387e0d84194d221c14805e02157b7cefaf607a53e9081c0099ccbeaa1020ab91b862d4a4743dc1e20b4953f5bb6c13afeac760cef34fd11b',
+  verification_gas_limit: '61285',
+  max_fee_per_gas: '1575000898',
+  aggregator: null,
+  hash: '0xe72500491b3f2549ac53bd9de9dbb1d2edfc33cdddf5c079d6d64dfec650ef83',
+  gas_price: '1575000898',
+  user_logs_count: 1,
+  block_number: '10399597',
+  gas_used: '118810',
+  sender: {
+    ens_domain_name: null,
+    hash: '0xF0C14FF4404b188fAA39a3507B388998c10FE284',
+    implementation_name: null,
+    is_contract: true,
+    is_verified: null,
+    name: null,
+  },
+  nonce: '0x000000000000000000000000000000000000000000000000000000000000004f',
+  entry_point: {
+    ens_domain_name: null,
+    hash: '0x5FF137D4b0FDCD49DcA30c7CF57E578a026d2789',
+    implementation_name: null,
+    is_contract: true,
+    is_verified: null,
+    name: null,
+  },
+  sponsor_type: 'paymaster_sponsor',
+  raw: {
+    // eslint-disable-next-line max-len
+    call_data: '0xb61d27f600000000000000000000000059f6aa952df7f048fd076e33e0ea8bb552d5ffd8000000000000000000000000000000000000000000000000003f3d017500800000000000000000000000000000000000000000000000000000000000000000600000000000000000000000000000000000000000000000000000000000000000',
+    call_gas_limit: '26624',
+    init_code: '0x',
+    max_fee_per_gas: '1575000898',
+    max_priority_fee_per_gas: '1575000898',
+    nonce: '79',
+    // eslint-disable-next-line max-len
+    paymaster_and_data: '0x7cea357b5ac0639f89f9e378a1f03aa5005c0a250000000000000000000000000000000000000000000000000000000065b3a8800000000000000000000000000000000000000000000000000000000065aa6e0028fa4c57ac1141bc9ecd8c9243f618ade8ea1db10ab6c1d1798a222a824764ff2269a72ae7a3680fa8b03a80d8a00cdc710eaf37afdcc55f8c9c4defa3fdf2471b',
+    pre_verification_gas: '48396',
+    sender: '0xF0C14FF4404b188fAA39a3507B388998c10FE284',
+    signature: '0x2b95a173c1ea314d2c387e0d84194d221c14805e02157b7cefaf607a53e9081c0099ccbeaa1020ab91b862d4a4743dc1e20b4953f5bb6c13afeac760cef34fd11b',
+    verification_gas_limit: '61285',
+  },
+  max_priority_fee_per_gas: '1575000898',
+  revert_reason: null,
+  bundler: {
+    ens_domain_name: null,
+    hash: '0xd53Eb5203e367BbDD4f72338938224881Fc501Ab',
+    implementation_name: null,
+    is_contract: false,
+    is_verified: null,
+    name: null,
+  },
+  // eslint-disable-next-line max-len
+  call_data: '0xb61d27f600000000000000000000000059f6aa952df7f048fd076e33e0ea8bb552d5ffd8000000000000000000000000000000000000000000000000003f3d017500800000000000000000000000000000000000000000000000000000000000000000600000000000000000000000000000000000000000000000000000000000000000',
+  paymaster: {
+    ens_domain_name: null,
+    hash: '0x7ceA357B5AC0639F89F9e378a1f03Aa5005C0a25',
+    implementation_name: null,
+    is_contract: true,
+    is_verified: null,
+    name: null,
+  },
+};
diff --git a/mocks/userOps/userOps.ts b/mocks/userOps/userOps.ts
new file mode 100644
index 0000000000..a58ff6ed74
--- /dev/null
+++ b/mocks/userOps/userOps.ts
@@ -0,0 +1,58 @@
+import type { UserOpsResponse } from 'types/api/userOps';
+
+export const userOpsData: UserOpsResponse = {
+  items: [
+    {
+      address: {
+        ens_domain_name: null,
+        hash: '0xF0C14FF4404b188fAA39a3507B388998c10FE284',
+        implementation_name: null,
+        is_contract: true,
+        is_verified: null,
+        name: null,
+      },
+      block_number: '10399597',
+      fee: '187125856691380',
+      hash: '0xe72500491b3f2549ac53bd9de9dbb1d2edfc33cdddf5c079d6d64dfec650ef83',
+      status: true,
+      timestamp: '2022-01-19T12:42:12.000000Z',
+      transaction_hash: '0x715fe1474ac7bea3d6f4a03b1c5b6d626675fb0b103be29f849af65e9f1f9c6a',
+    },
+    {
+      address:
+        { ens_domain_name: null,
+          hash: '0x2c298CcaFFD1549e1C21F46966A6c236fCC66dB2',
+          implementation_name: null,
+          is_contract: true,
+          is_verified: null,
+          name: null,
+        },
+      block_number: '10399596',
+      fee: '381895502291373',
+      hash: '0xcb945ae86608bdc88c3318245403c81a880fcb1e49fef18ac59477761c056cea',
+      status: false,
+      timestamp: '2022-01-19T12:42:00.000000Z',
+      transaction_hash: '0x558d699e7cbc235461d48ed04b8c3892d598a4000f20851760d00dc3513c2e48',
+    },
+    {
+      address: {
+        ens_domain_name: null,
+        hash: '0x2c298CcaFFD1549e1C21F46966A6c236fCC66dB2',
+        implementation_name: null,
+        is_contract: true,
+        is_verified: null,
+        name: null,
+      },
+      block_number: '10399560',
+      fee: '165019501210143',
+      hash: '0x84c1270b12af3f0ffa204071f1bf503ebf9b1ccf6310680383be5a2b6fd1d8e5',
+      status: true,
+      timestamp: '2022-01-19T12:32:00.000000Z',
+      transaction_hash: '0xc4c1c38680ec63139411aa2193275e8de44be15217c4256db9473bf0ea2b6264',
+    },
+  ],
+  next_page_params: {
+    page_size: 50,
+    page_token: '10396582,0x9bf4d2a28813c5c244884cb20cdfe01dabb3f927234ae961eab6e38502de7a28',
+  },
+};
diff --git a/mocks/validators/index.ts b/mocks/validators/index.ts
new file mode 100644
index 0000000000..22081cae8c
--- /dev/null
+++ b/mocks/validators/index.ts
@@ -0,0 +1,33 @@
+import type { Validator, ValidatorsCountersResponse, ValidatorsResponse } from 'types/api/validators';
+
+import * as addressMock from '../address/address';
+
+export const validator1: Validator = {
+  address: addressMock.withName,
+  blocks_validated_count: 7334224,
+  state: 'active',
+};
+
+export const validator2: Validator = {
+  address: addressMock.withEns,
+  blocks_validated_count: 8937453,
+  state: 'probation',
+};
+
+export const validator3: Validator = {
+  address: addressMock.withoutName,
+  blocks_validated_count: 1234,
+  state: 'inactive',
+};
+
+export const validatorsResponse: ValidatorsResponse = {
+  items: [ validator1, validator2, validator3 ],
+  next_page_params: null,
+};
+
+export const validatorsCountersResponse: ValidatorsCountersResponse = {
+  active_validators_counter: '42',
+  active_validators_percentage: 7.14,
+  new_validators_counter_24h: '11',
+  validators_counter: '140',
+};
diff --git a/mocks/zkSync/zkSyncTxnBatch.ts b/mocks/zkSync/zkSyncTxnBatch.ts
new file mode 100644
index 0000000000..ab865dc513
--- /dev/null
+++ b/mocks/zkSync/zkSyncTxnBatch.ts
@@ -0,0 +1,20 @@
+import type { ZkSyncBatch } from 'types/api/zkSyncL2';
+
+export const base: ZkSyncBatch = {
+  commit_transaction_hash: '0x7cd80c88977c2b310f79196b0b2136da18012be015ce80d0d9e9fe6cfad52b16',
+  commit_transaction_timestamp: '2022-03-19T09:37:38.726996Z',
+  end_block: 1245490,
+  execute_transaction_hash: '0x110b9a19afbabd5818a996ab2b493a9b23c888d73d95f1ab5272dbae503e103a',
+  execute_transaction_timestamp: '2022-03-19T10:29:05.358066Z',
+  l1_gas_price: '4173068062',
+  l1_tx_count: 0,
+  l2_fair_gas_price: '100000000',
+  l2_tx_count: 287,
+  number: 8051,
+  prove_transaction_hash: '0xb424162ba5afe17c710dceb5fc8d15d7d46a66223454dae8c74aa39f6802625b',
+  prove_transaction_timestamp: '2022-03-19T10:29:05.279179Z',
+  root_hash: '0x108c635b94f941fcabcb85500daec2f6be4f0747dff649b1cdd9dd7a7a264792',
+  start_block: 1245209,
+  status: 'Executed on L1',
+  timestamp: '2022-03-19T09:05:49.000000Z',
+};
diff --git a/mocks/zkSync/zkSyncTxnBatches.ts b/mocks/zkSync/zkSyncTxnBatches.ts
new file mode 100644
index 0000000000..a717308641
--- /dev/null
+++ b/mocks/zkSync/zkSyncTxnBatches.ts
@@ -0,0 +1,49 @@
+import type { ZkSyncBatchesItem, ZkSyncBatchesResponse } from 'types/api/zkSyncL2';
+
+export const sealed: ZkSyncBatchesItem = {
+  commit_transaction_hash: null,
+  commit_transaction_timestamp: null,
+  execute_transaction_hash: null,
+  execute_transaction_timestamp: null,
+  number: 8055,
+  prove_transaction_hash: null,
+  prove_transaction_timestamp: null,
+  status: 'Sealed on L2',
+  timestamp: '2022-03-19T12:53:36.000000Z',
+  tx_count: 738,
+};
+
+export const sent: ZkSyncBatchesItem = {
+  commit_transaction_hash: '0x262e7215739d6a7e33b2c20b45a838801a0f5f080f20bec8e54eb078420c4661',
+  commit_transaction_timestamp: '2022-03-19T13:09:07.357570Z',
+  execute_transaction_hash: null,
+  execute_transaction_timestamp: null,
+  number: 8054,
+  prove_transaction_hash: null,
+  prove_transaction_timestamp: null,
+  status: 'Sent to L1',
+  timestamp: '2022-03-19T11:36:45.000000Z',
+  tx_count: 766,
+};
+
+export const executed: ZkSyncBatchesItem = {
+  commit_transaction_hash: '0xa2628f477e1027ac1c60fa75c186b914647769ac1cb9c7e1cab50b13506a0035',
+  commit_transaction_timestamp: '2022-03-19T11:52:18.963659Z',
+  execute_transaction_hash: '0xb7bd6b2b17498c66d3f6e31ac3685133a81b7f728d4f6a6f42741daa257d0d68',
+  execute_transaction_timestamp: '2022-03-19T13:28:16.712656Z',
+  number: 8053,
+  prove_transaction_hash: '0x9d44f2b775bd771f8a53205755b3897929aa672d2cd419b3b988c16d41d4f21e',
+  prove_transaction_timestamp: '2022-03-19T13:28:16.603104Z',
+  status: 'Executed on L1',
+  timestamp: '2022-03-19T10:01:52.000000Z',
+  tx_count: 1071,
+};
+
+export const baseResponse: ZkSyncBatchesResponse = {
+  items: [
+    sealed,
+    sent,
+    executed,
+  ],
+  next_page_params: null,
+};
diff --git a/mocks/zkevmL2txnBatches/zkevmL2txnBatch.ts b/mocks/zkevmL2txnBatches/zkevmL2txnBatch.ts
index 172481ce60..56a0f67c33 100644
--- a/mocks/zkevmL2txnBatches/zkevmL2txnBatch.ts
+++ b/mocks/zkevmL2txnBatches/zkevmL2txnBatch.ts
@@ -1,4 +1,4 @@
-import type { ZkEvmL2TxnBatch } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatch } from 'types/api/zkEvmL2';
 
 export const txnBatchData: ZkEvmL2TxnBatch = {
   acc_input_hash: '0x4bf88aabe33713b7817266d7860912c58272d808da7397cdc627ca53b296fad3',
diff --git a/mocks/zkevmL2txnBatches/zkevmL2txnBatches.ts b/mocks/zkevmL2txnBatches/zkevmL2txnBatches.ts
index 5d81a72686..895f9a7744 100644
--- a/mocks/zkevmL2txnBatches/zkevmL2txnBatches.ts
+++ b/mocks/zkevmL2txnBatches/zkevmL2txnBatches.ts
@@ -1,4 +1,4 @@
-import type { ZkEvmL2TxnBatchesResponse } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatchesResponse } from 'types/api/zkEvmL2';
 
 export const txnBatchesData: ZkEvmL2TxnBatchesResponse = {
   items: [
diff --git a/nextjs/csp/generateCspPolicy.ts b/nextjs/csp/generateCspPolicy.ts
index 0a91366a98..fa505e3ddf 100644
--- a/nextjs/csp/generateCspPolicy.ts
+++ b/nextjs/csp/generateCspPolicy.ts
@@ -9,6 +9,7 @@ function generateCspPolicy() {
     descriptors.googleAnalytics(),
     descriptors.googleFonts(),
     descriptors.googleReCaptcha(),
+    descriptors.growthBook(),
     descriptors.mixpanel(),
     descriptors.monaco(),
     descriptors.safe(),
diff --git a/nextjs/csp/policies/ad.ts b/nextjs/csp/policies/ad.ts
index 2808dfb07c..55f23ff913 100644
--- a/nextjs/csp/policies/ad.ts
+++ b/nextjs/csp/policies/ad.ts
@@ -3,30 +3,57 @@ import sha256 from 'crypto-js/sha256';
 import type CspDev from 'csp-dev';
 
 import { connectAdbutler, placeAd } from 'ui/shared/ad/adbutlerScript';
+import { hypeInit } from 'ui/shared/ad/hypeBannerScript';
 
 export function ad(): CspDev.DirectiveDescriptor {
   return {
     'connect-src': [
+      // coinzilla
       'coinzilla.com',
       '*.coinzilla.com',
       'https://request-global.czilladx.com',
+
+      // slise
       '*.slise.xyz',
+
+      // hype
+      'api.hypelab.com',
+      '*.ixncdn.com',
+
+      //getit
+      'v1.getittech.io',
+      'ipapi.co',
     ],
     'frame-src': [
+      // coinzilla
       'https://request-global.czilladx.com',
     ],
     'script-src': [
+      // coinzilla
       'coinzillatag.com',
+
+      // adbutler
       'servedbyadbutler.com',
       `'sha256-${ Base64.stringify(sha256(connectAdbutler)) }'`,
       `'sha256-${ Base64.stringify(sha256(placeAd ?? '')) }'`,
+
+      // slise
       '*.slise.xyz',
+
+      //hype
+      `'sha256-${ Base64.stringify(sha256(hypeInit ?? '')) }'`,
+      'https://api.hypelab.com',
+      'd1q98dzwj6s2rb.cloudfront.net',
     ],
     'img-src': [
-      'servedbyadbutler.com',
+      // coinzilla
       'cdn.coinzilla.io',
+
+      // adbutler
+      'servedbyadbutler.com',
     ],
     'font-src': [
+      // coinzilla
       'https://request-global.czilladx.com',
     ],
   };
diff --git a/nextjs/csp/policies/app.ts b/nextjs/csp/policies/app.ts
index 37822e4766..d1596cb1c5 100644
--- a/nextjs/csp/policies/app.ts
+++ b/nextjs/csp/policies/app.ts
@@ -31,6 +31,8 @@ const getCspReportUrl = () => {
 };
 
 export function app(): CspDev.DirectiveDescriptor {
+  const marketplaceFeaturePayload = getFeaturePayload(config.features.marketplace);
+
   return {
     'default-src': [
       // KEY_WORDS.NONE,
@@ -53,6 +55,8 @@ export function app(): CspDev.DirectiveDescriptor {
       getFeaturePayload(config.features.sol2uml)?.api.endpoint,
       getFeaturePayload(config.features.verifiedTokens)?.api.endpoint,
       getFeaturePayload(config.features.addressVerification)?.api.endpoint,
+      getFeaturePayload(config.features.nameService)?.api.endpoint,
+      marketplaceFeaturePayload && 'api' in marketplaceFeaturePayload ? marketplaceFeaturePayload.api.endpoint : '',
 
       // chain RPC server
       config.chain.rpcUrl,
diff --git a/nextjs/csp/policies/growthBook.ts b/nextjs/csp/policies/growthBook.ts
new file mode 100644
index 0000000000..ae0f055fb8
--- /dev/null
+++ b/nextjs/csp/policies/growthBook.ts
@@ -0,0 +1,15 @@
+import type CspDev from 'csp-dev';
+
+import config from 'configs/app';
+
+export function growthBook(): CspDev.DirectiveDescriptor {
+  if (!config.features.growthBook.isEnabled) {
+    return {};
+  }
+
+  return {
+    'connect-src': [
+      'cdn.growthbook.io',
+    ],
+  };
+}
diff --git a/nextjs/csp/policies/index.ts b/nextjs/csp/policies/index.ts
index 4ff00e072c..10fd95a484 100644
--- a/nextjs/csp/policies/index.ts
+++ b/nextjs/csp/policies/index.ts
@@ -4,6 +4,7 @@ export { cloudFlare } from './cloudFlare';
 export { googleAnalytics } from './googleAnalytics';
 export { googleFonts } from './googleFonts';
 export { googleReCaptcha } from './googleReCaptcha';
+export { growthBook } from './growthBook';
 export { mixpanel } from './mixpanel';
 export { monaco } from './monaco';
 export { safe } from './safe';
diff --git a/nextjs/getServerSideProps.ts b/nextjs/getServerSideProps.ts
index 2f62492617..6b3d959ab2 100644
--- a/nextjs/getServerSideProps.ts
+++ b/nextjs/getServerSideProps.ts
@@ -1,6 +1,9 @@
 import type { GetServerSideProps } from 'next';
 
 import config from 'configs/app';
+import isNeedProxy from 'lib/api/isNeedProxy';
+const rollupFeature = config.features.rollup;
+const adBannerFeature = config.features.adsBanner;
 
 export type Props = {
   cookies: string;
@@ -10,9 +13,24 @@ export type Props = {
   hash: string;
   number: string;
   q: string;
+  name: string;
+  adBannerProvider: string;
 }
 
 export const base: GetServerSideProps<Props> = async({ req, query }) => {
+  const adBannerProvider = (() => {
+    if (adBannerFeature.isEnabled) {
+      if ('additionalProvider' in adBannerFeature && adBannerFeature.additionalProvider) {
+        // we need to get a random ad provider on the server side to keep it consistent with the client side
+        const randomIndex = Math.round(Math.random());
+        return [ adBannerFeature.provider, adBannerFeature.additionalProvider ][randomIndex];
+      } else {
+        return adBannerFeature.provider;
+      }
+    }
+    return '';
+  })();
+
   return {
     props: {
       cookies: req.headers.cookie || '',
@@ -22,6 +40,8 @@ export const base: GetServerSideProps<Props> = async({ req, query }) => {
       height_or_hash: query.height_or_hash?.toString() || '',
       number: query.number?.toString() || '',
       q: query.q?.toString() || '',
+      name: query.name?.toString() || '',
+      adBannerProvider,
     },
   };
 };
@@ -46,8 +66,31 @@ export const verifiedAddresses: GetServerSideProps<Props> = async(context) => {
   return account(context);
 };
 
-export const beaconChain: GetServerSideProps<Props> = async(context) => {
-  if (!config.features.beaconChain.isEnabled) {
+export const deposits: GetServerSideProps<Props> = async(context) => {
+  if (!(rollupFeature.isEnabled && (rollupFeature.type === 'optimistic' || rollupFeature.type === 'shibarium'))) {
+    return {
+      notFound: true,
+    };
+  }
+
+  return base(context);
+};
+
+export const withdrawals: GetServerSideProps<Props> = async(context) => {
+  if (
+    !config.features.beaconChain.isEnabled &&
+    !(rollupFeature.isEnabled && (rollupFeature.type === 'optimistic' || rollupFeature.type === 'shibarium'))
+  ) {
+    return {
+      notFound: true,
+    };
+  }
+
+  return base(context);
+};
+
+export const rollup: GetServerSideProps<Props> = async(context) => {
+  if (!config.features.rollup.isEnabled) {
     return {
       notFound: true,
     };
@@ -56,8 +99,8 @@ export const beaconChain: GetServerSideProps<Props> = async(context) => {
   return base(context);
 };
 
-export const L2: GetServerSideProps<Props> = async(context) => {
-  if (!config.features.optimisticRollup.isEnabled) {
+export const optimisticRollup: GetServerSideProps<Props> = async(context) => {
+  if (!(rollupFeature.isEnabled && rollupFeature.type === 'optimistic')) {
     return {
       notFound: true,
     };
@@ -66,8 +109,8 @@ export const L2: GetServerSideProps<Props> = async(context) => {
   return base(context);
 };
 
-export const zkEvmL2: GetServerSideProps<Props> = async(context) => {
-  if (!config.features.zkEvmRollup.isEnabled) {
+export const batch: GetServerSideProps<Props> = async(context) => {
+  if (!(rollupFeature.isEnabled && (rollupFeature.type === 'zkEvm' || rollupFeature.type === 'zkSync'))) {
     return {
       notFound: true,
     };
@@ -126,6 +169,16 @@ export const suave: GetServerSideProps<Props> = async(context) => {
   return base(context);
 };
 
+export const nameService: GetServerSideProps<Props> = async(context) => {
+  if (!config.features.nameService.isEnabled) {
+    return {
+      notFound: true,
+    };
+  }
+
+  return base(context);
+};
+
 export const accounts: GetServerSideProps<Props> = async(context) => {
   if (config.UI.views.address.hiddenViews?.top_accounts) {
     return {
@@ -135,3 +188,54 @@ export const accounts: GetServerSideProps<Props> = async(context) => {
 
   return base(context);
 };
+
+export const userOps: GetServerSideProps<Props> = async(context) => {
+  if (!config.features.userOps.isEnabled) {
+    return {
+      notFound: true,
+    };
+  }
+
+  return base(context);
+};
+
+export const validators: GetServerSideProps<Props> = async(context) => {
+  if (!config.features.validators.isEnabled) {
+    return {
+      notFound: true,
+    };
+  }
+
+  return base(context);
+};
+
+export const gasTracker: GetServerSideProps<Props> = async(context) => {
+  if (!config.features.gasTracker.isEnabled) {
+    return {
+      notFound: true,
+    };
+  }
+
+  return base(context);
+};
+
+export const dataAvailability: GetServerSideProps<Props> = async(context) => {
+  if (!config.features.dataAvailability.isEnabled) {
+    return {
+      notFound: true,
+    };
+  }
+
+  return base(context);
+};
+
+export const login: GetServerSideProps<Props> = async(context) => {
+
+  if (!isNeedProxy()) {
+    return {
+      notFound: true,
+    };
+  }
+
+  return base(context);
+};
diff --git a/nextjs/nextjs-routes.d.ts b/nextjs/nextjs-routes.d.ts
index aa7c203b56..ee87eb5dc1 100644
--- a/nextjs/nextjs-routes.d.ts
+++ b/nextjs/nextjs-routes.d.ts
@@ -26,17 +26,23 @@ declare module "nextjs-routes" {
     | StaticRoute<"/auth/auth0">
     | StaticRoute<"/auth/profile">
     | StaticRoute<"/auth/unverified-email">
+    | DynamicRoute<"/batches/[number]", { "number": string }>
+    | StaticRoute<"/batches">
+    | DynamicRoute<"/blobs/[hash]", { "hash": string }>
     | DynamicRoute<"/block/[height_or_hash]", { "height_or_hash": string }>
     | StaticRoute<"/blocks">
     | StaticRoute<"/contract-verification">
     | StaticRoute<"/csv-export">
+    | StaticRoute<"/deposits">
+    | StaticRoute<"/gas-tracker">
     | StaticRoute<"/graphiql">
     | StaticRoute<"/">
-    | StaticRoute<"/l2-deposits">
-    | StaticRoute<"/l2-output-roots">
-    | StaticRoute<"/l2-txn-batches">
-    | StaticRoute<"/l2-withdrawals">
     | StaticRoute<"/login">
+    | DynamicRoute<"/name-domains/[name]", { "name": string }>
+    | StaticRoute<"/name-domains">
+    | DynamicRoute<"/op/[hash]", { "hash": string }>
+    | StaticRoute<"/ops">
+    | StaticRoute<"/output-roots">
     | StaticRoute<"/search-results">
     | StaticRoute<"/stats">
     | DynamicRoute<"/token/[hash]", { "hash": string }>
@@ -45,11 +51,10 @@ declare module "nextjs-routes" {
     | DynamicRoute<"/tx/[hash]", { "hash": string }>
     | StaticRoute<"/txs">
     | DynamicRoute<"/txs/kettle/[hash]", { "hash": string }>
+    | StaticRoute<"/validators">
     | StaticRoute<"/verified-contracts">
     | StaticRoute<"/visualize/sol2uml">
-    | StaticRoute<"/withdrawals">
-    | DynamicRoute<"/zkevm-l2-txn-batch/[number]", { "number": string }>
-    | StaticRoute<"/zkevm-l2-txn-batches">;
+    | StaticRoute<"/withdrawals">;
 
   interface StaticRoute<Pathname> {
     pathname: Pathname;
diff --git a/nextjs/redirects.js b/nextjs/redirects.js
index 3c2ed3ba9a..3a0317d0e4 100644
--- a/nextjs/redirects.js
+++ b/nextjs/redirects.js
@@ -242,6 +242,32 @@ const oldUrls = [
     source: '/token/:hash/write-proxy',
     destination: '/token/:hash?tab=write_proxy',
   },
+
+  // ROLLUPs
+  {
+    source: '/l2-txn-batches',
+    destination: '/batches',
+  },
+  {
+    source: '/zkevm-l2-txn-batches',
+    destination: '/batches',
+  },
+  {
+    source: '/zkevm-l2-txn-batch/:path*',
+    destination: '/batches/:path*',
+  },
+  {
+    source: '/l2-deposits',
+    destination: '/deposits',
+  },
+  {
+    source: '/l2-withdrawals',
+    destination: '/withdrawals',
+  },
+  {
+    source: '/l2-output-roots',
+    destination: '/output-roots',
+  },
 ];
 
 async function redirects() {
diff --git a/nextjs/utils/fetch.ts b/nextjs/utils/fetch.ts
index f372d996bd..22bfc32ff6 100644
--- a/nextjs/utils/fetch.ts
+++ b/nextjs/utils/fetch.ts
@@ -1,4 +1,5 @@
 import type { IncomingMessage } from 'http';
+import _pick from 'lodash/pick';
 import type { NextApiRequest } from 'next';
 import type { NextApiRequestCookies } from 'next/dist/server/api-utils';
 import type { RequestInit, Response } from 'node-fetch';
@@ -14,16 +15,18 @@ export default function fetchFactory(
   // first arg can be only a string
   // FIXME migrate to RequestInfo later if needed
   return function fetch(url: string, init?: RequestInit): Promise<Response> {
-    const csrfToken = _req.headers['x-csrf-token'];
-    const authToken = _req.headers['Authorization'];
     const apiToken = _req.cookies[cookies.NAMES.API_TOKEN];
 
     const headers = {
       accept: _req.headers['accept'] || 'application/json',
       'content-type': _req.headers['content-type'] || 'application/json',
       cookie: apiToken ? `${ cookies.NAMES.API_TOKEN }=${ apiToken }` : '',
-      ...(csrfToken ? { 'x-csrf-token': String(csrfToken) } : {}),
-      ...(authToken ? { Authorization: String(authToken) } : {}),
+      ..._pick(_req.headers, [
+        'x-csrf-token',
+        'Authorization',
+        // feature flags
+        'updated-gas-oracle',
+      ]) as Record<string, string | undefined>,
     };
 
     httpLogger.logger.info({
diff --git a/package.json b/package.json
index e8738214cf..eed616c134 100644
--- a/package.json
+++ b/package.json
@@ -4,8 +4,8 @@
   "private": false,
   "homepage": "https://github.com/blockscout/frontend#readme",
   "engines": {
-    "node": "18",
-    "npm": "8"
+    "node": "20.11.0",
+    "npm": "10.2.4"
   },
   "scripts": {
     "dev": "./tools/scripts/dev.sh",
@@ -24,8 +24,10 @@
     "svg:build-sprite": "icons build -i ./icons -o ./public/icons --optimize",
     "test:pw": "./tools/scripts/pw.sh",
     "test:pw:local": "export NODE_PATH=$(pwd)/node_modules && yarn test:pw",
-    "test:pw:docker": "docker run --rm --network host -v $(pwd):/work/ -w /work/ -it mcr.microsoft.com/playwright:v1.35.1-focal ./tools/scripts/pw.docker.sh",
+    "test:pw:docker": "docker run --rm --network host -v $(pwd):/work/ -w /work/ -it mcr.microsoft.com/playwright:v1.41.1-focal ./tools/scripts/pw.docker.sh",
+    "test:pw:docker:deps": "docker run --rm --network host -v $(pwd):/work/ -w /work/ -it mcr.microsoft.com/playwright:v1.41.1-focal ./tools/scripts/pw.docker.deps.sh",
     "test:pw:ci": "yarn test:pw --project=$PW_PROJECT",
+    "test:pw:detect-affected": "node ./deploy/tools/affected-tests/index.js",
     "test:jest": "jest",
     "test:jest:watch": "jest --watch",
     "favicon:generate:dev": "./tools/scripts/favicon-generator.dev.sh"
@@ -36,6 +38,8 @@
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
     "@lukso/web-components": "^1.47.1",
+    "@growthbook/growthbook-react": "0.21.0",
+    "@hypelab/sdk-react": "^1.0.0",
     "@metamask/post-message-stream": "^7.0.0",
     "@metamask/providers": "^10.2.1",
     "@monaco-editor/react": "^4.4.6",
@@ -55,25 +59,26 @@
     "@tanstack/react-query-devtools": "^5.4.3",
     "@types/papaparse": "^5.3.5",
     "@types/react-scroll": "^1.8.4",
-    "@web3modal/wagmi": "3.5.0",
-    "@web3modal/ethereum": "^2.6.2",
-    "@web3modal/react": "^2.6.2",
+    "@web3modal/wagmi": "4.1.3",
     "algoliasearch": "^4.20.0",
     "bignumber.js": "^9.1.0",
     "blo": "^1.1.1",
     "chakra-react-select": "^4.4.3",
     "crypto-js": "^4.2.0",
     "d3": "^7.6.1",
-    "dappscout-iframe": "^0.1.0",
+    "dappscout-iframe": "0.2.1",
     "dayjs": "^1.11.5",
     "dom-to-image": "^2.6.0",
+    "focus-visible": "^5.2.0",
     "framer-motion": "^6.5.1",
+    "getit-sdk": "^1.0.4",
     "gradient-avatar": "^1.0.2",
     "graphiql": "^2.2.0",
     "graphql": "^16.8.1",
     "graphql-ws": "^5.11.3",
     "js-cookie": "^3.0.1",
     "lodash": "^4.0.0",
+    "magic-bytes.js": "1.8.0",
     "mixpanel-browser": "^2.47.0",
     "monaco-editor": "^0.34.1",
     "next": "13.5.4",
@@ -97,13 +102,13 @@
     "react-scroll": "^1.8.7",
     "swagger-ui-react": "^5.9.0",
     "use-font-face-observer": "^1.2.1",
-    "viem": "1.20.1",
-    "wagmi": "1.4.12",
+    "viem": "2.9.6",
+    "wagmi": "2.5.16",
     "xss": "^1.0.14"
   },
   "devDependencies": {
-    "@playwright/experimental-ct-react": "1.35.1",
-    "@playwright/test": "^1.35.1",
+    "@playwright/experimental-ct-react": "1.41.1",
+    "@playwright/test": "1.41.1",
     "@svgr/webpack": "^6.5.1",
     "@tanstack/eslint-plugin-query": "^5.0.5",
     "@testing-library/react": "^14.0.0",
@@ -115,7 +120,7 @@
     "@types/jest": "^29.2.0",
     "@types/js-cookie": "^3.0.2",
     "@types/mixpanel-browser": "^2.38.1",
-    "@types/node": "18.11.18",
+    "@types/node": "20.11.0",
     "@types/phoenix": "^1.5.4",
     "@types/qrcode": "^1.5.0",
     "@types/react": "18.0.9",
@@ -146,7 +151,7 @@
     "svgo": "^2.8.0",
     "ts-jest": "^29.0.3",
     "ts-node": "^10.9.1",
-    "typescript": "^5.1.0",
+    "typescript": "5.4.2",
     "vite-plugin-svgr": "^2.2.2",
     "vite-tsconfig-paths": "^3.5.2",
     "ws": "^8.11.0"
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 14a70d043f..15fc5edd91 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -1,4 +1,5 @@
 import type { ChakraProps } from '@chakra-ui/react';
+import { GrowthBookProvider } from '@growthbook/growthbook-react';
 import * as Sentry from '@sentry/react';
 import { QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
@@ -12,6 +13,9 @@ import useQueryClientConfig from 'lib/api/useQueryClientConfig';
 import { AppContextProvider } from 'lib/contexts/app';
 import { ChakraProvider } from 'lib/contexts/chakra';
 import { ScrollDirectionProvider } from 'lib/contexts/scrollDirection';
+import { growthBook } from 'lib/growthbook/init';
+import useLoadFeatures from 'lib/growthbook/useLoadFeatures';
+import useNotifyOnNavigation from 'lib/hooks/useNotifyOnNavigation';
 import { SocketProvider } from 'lib/socket/context';
 import theme from 'theme';
 import AppErrorBoundary from 'ui/shared/AppError/AppErrorBoundary';
@@ -20,6 +24,7 @@ import Layout from 'ui/shared/layout/Layout';
 import Web3ModalProvider from 'ui/shared/Web3ModalProvider';
 
 import 'lib/setLocale';
+// import 'focus-visible/dist/focus-visible';
 
 type AppPropsWithLayout = AppProps & {
   Component: NextPageWithLayout;
@@ -39,6 +44,9 @@ const ERROR_SCREEN_STYLES: ChakraProps = {
 
 function MyApp({ Component, pageProps }: AppPropsWithLayout) {
 
+  useLoadFeatures();
+  useNotifyOnNavigation();
+
   const queryClient = useQueryClientConfig();
 
   const handleError = React.useCallback((error: Error) => {
@@ -56,11 +64,13 @@ function MyApp({ Component, pageProps }: AppPropsWithLayout) {
         <Web3ModalProvider>
           <AppContextProvider pageProps={ pageProps }>
             <QueryClientProvider client={ queryClient }>
-              <ScrollDirectionProvider>
-                <SocketProvider url={ `${ config.api.socket }${ config.api.basePath }/socket/v2` }>
-                  { getLayout(<Component { ...pageProps }/>) }
-                </SocketProvider>
-              </ScrollDirectionProvider>
+              <GrowthBookProvider growthbook={ growthBook }>
+                <ScrollDirectionProvider>
+                  <SocketProvider url={ `${ config.api.socket }${ config.api.basePath }/socket/v2` }>
+                    { getLayout(<Component { ...pageProps }/>) }
+                  </SocketProvider>
+                </ScrollDirectionProvider>
+              </GrowthBookProvider>
               <ReactQueryDevtools buttonPosition="bottom-left" position="left"/>
               <GoogleAnalytics/>
             </QueryClientProvider>
diff --git a/pages/api/media-type.ts b/pages/api/media-type.ts
index f64301f094..7489fecdf1 100644
--- a/pages/api/media-type.ts
+++ b/pages/api/media-type.ts
@@ -22,11 +22,13 @@ export default async function mediaTypeHandler(req: NextApiRequest, res: NextApi
         return 'video';
       }
 
+      if (contentType?.startsWith('image')) {
+        return 'image';
+      }
+
       if (contentType?.startsWith('text/html')) {
         return 'html';
       }
-
-      return 'image';
     })();
     res.status(200).json({ type: mediaType });
   } catch (error) {
diff --git a/pages/apps/index.tsx b/pages/apps/index.tsx
index 17f75586ac..aa5c0bae15 100644
--- a/pages/apps/index.tsx
+++ b/pages/apps/index.tsx
@@ -4,31 +4,13 @@ import React from 'react';
 
 import PageNextJs from 'nextjs/PageNextJs';
 
-import config from 'configs/app';
-import LinkExternal from 'ui/shared/LinkExternal';
-import PageTitle from 'ui/shared/Page/PageTitle';
-
-const feature = config.features.marketplace;
-
 const Marketplace = dynamic(() => import('ui/pages/Marketplace'), { ssr: false });
 
-const Page: NextPage = () => {
-  return (
-    <PageNextJs pathname="/apps">
-      <>
-        <PageTitle
-          title="DAppscout"
-          contentAfter={ feature.isEnabled && (
-            <LinkExternal href={ feature.submitFormUrl } variant="subtle" fontSize="sm" lineHeight={ 5 } ml="auto">
-              Submit app
-            </LinkExternal>
-          ) }
-        />
-        <Marketplace/>
-      </>
-    </PageNextJs>
-  );
-};
+const Page: NextPage = () => (
+  <PageNextJs pathname="/apps">
+    <Marketplace/>
+  </PageNextJs>
+);
 
 export default Page;
 
diff --git a/pages/batches/[number].tsx b/pages/batches/[number].tsx
new file mode 100644
index 0000000000..870a1cc7b4
--- /dev/null
+++ b/pages/batches/[number].tsx
@@ -0,0 +1,36 @@
+import type { NextPage } from 'next';
+import dynamic from 'next/dynamic';
+import React from 'react';
+
+import type { Props } from 'nextjs/getServerSideProps';
+import PageNextJs from 'nextjs/PageNextJs';
+
+import config from 'configs/app';
+
+const rollupFeature = config.features.rollup;
+
+const Batch = dynamic(() => {
+  if (!rollupFeature.isEnabled) {
+    throw new Error('Rollup feature is not enabled.');
+  }
+
+  switch (rollupFeature.type) {
+    case 'zkEvm':
+      return import('ui/pages/ZkEvmL2TxnBatch');
+    case 'zkSync':
+      return import('ui/pages/ZkSyncL2TxnBatch');
+  }
+  throw new Error('Txn batches feature is not enabled.');
+}, { ssr: false });
+
+const Page: NextPage<Props> = (props: Props) => {
+  return (
+    <PageNextJs pathname="/batches/[number]" query={ props }>
+      <Batch/>
+    </PageNextJs>
+  );
+};
+
+export default Page;
+
+export { batch as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/batches/index.tsx b/pages/batches/index.tsx
new file mode 100644
index 0000000000..f5bea98b4b
--- /dev/null
+++ b/pages/batches/index.tsx
@@ -0,0 +1,36 @@
+import type { NextPage } from 'next';
+import dynamic from 'next/dynamic';
+import React from 'react';
+
+import PageNextJs from 'nextjs/PageNextJs';
+
+import config from 'configs/app';
+const rollupFeature = config.features.rollup;
+
+const Batches = dynamic(() => {
+  if (!rollupFeature.isEnabled) {
+    throw new Error('Rollup feature is not enabled.');
+  }
+
+  switch (rollupFeature.type) {
+    case 'zkEvm':
+      return import('ui/pages/ZkEvmL2TxnBatches');
+    case 'zkSync':
+      return import('ui/pages/ZkSyncL2TxnBatches');
+    case 'optimistic':
+      return import('ui/pages/OptimisticL2TxnBatches');
+  }
+  throw new Error('Txn batches feature is not enabled.');
+}, { ssr: false });
+
+const Page: NextPage = () => {
+  return (
+    <PageNextJs pathname="/batches">
+      <Batches/>
+    </PageNextJs>
+  );
+};
+
+export default Page;
+
+export { rollup as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/blobs/[hash].tsx b/pages/blobs/[hash].tsx
new file mode 100644
index 0000000000..f1056d36fa
--- /dev/null
+++ b/pages/blobs/[hash].tsx
@@ -0,0 +1,20 @@
+import type { NextPage } from 'next';
+import dynamic from 'next/dynamic';
+import React from 'react';
+
+import type { Props } from 'nextjs/getServerSideProps';
+import PageNextJs from 'nextjs/PageNextJs';
+
+const Blob = dynamic(() => import('ui/pages/Blob'), { ssr: false });
+
+const Page: NextPage<Props> = (props: Props) => {
+  return (
+    <PageNextJs pathname="/blobs/[hash]" query={ props }>
+      <Blob/>
+    </PageNextJs>
+  );
+};
+
+export default Page;
+
+export { dataAvailability as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/deposits/index.tsx b/pages/deposits/index.tsx
new file mode 100644
index 0000000000..789dd39657
--- /dev/null
+++ b/pages/deposits/index.tsx
@@ -0,0 +1,32 @@
+import type { NextPage } from 'next';
+import dynamic from 'next/dynamic';
+import React from 'react';
+
+import PageNextJs from 'nextjs/PageNextJs';
+
+import config from 'configs/app';
+const rollupFeature = config.features.rollup;
+
+const Deposits = dynamic(() => {
+  if (rollupFeature.isEnabled && rollupFeature.type === 'optimistic') {
+    return import('ui/pages/OptimisticL2Deposits');
+  }
+
+  if (rollupFeature.isEnabled && rollupFeature.type === 'shibarium') {
+    return import('ui/pages/ShibariumDeposits');
+  }
+
+  throw new Error('Withdrawals feature is not enabled.');
+}, { ssr: false });
+
+const Page: NextPage = () => {
+  return (
+    <PageNextJs pathname="/deposits">
+      <Deposits/>
+    </PageNextJs>
+  );
+};
+
+export default Page;
+
+export { deposits as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/l2-txn-batches.tsx b/pages/gas-tracker.tsx
similarity index 51%
rename from pages/l2-txn-batches.tsx
rename to pages/gas-tracker.tsx
index 391a77c283..e407fa5cb5 100644
--- a/pages/l2-txn-batches.tsx
+++ b/pages/gas-tracker.tsx
@@ -4,16 +4,16 @@ import React from 'react';
 
 import PageNextJs from 'nextjs/PageNextJs';
 
-const L2TxnBatches = dynamic(() => import('ui/pages/L2TxnBatches'), { ssr: false });
+const GasTracker = dynamic(() => import('ui/pages/GasTracker'), { ssr: false });
 
 const Page: NextPage = () => {
   return (
-    <PageNextJs pathname="/l2-txn-batches">
-      <L2TxnBatches/>
+    <PageNextJs pathname="/gas-tracker">
+      <GasTracker/>
     </PageNextJs>
   );
 };
 
 export default Page;
 
-export { L2 as getServerSideProps } from 'nextjs/getServerSideProps';
+export { gasTracker as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/l2-output-roots.tsx b/pages/l2-output-roots.tsx
deleted file mode 100644
index 06a84a5c9b..0000000000
--- a/pages/l2-output-roots.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import type { NextPage } from 'next';
-import dynamic from 'next/dynamic';
-import React from 'react';
-
-import PageNextJs from 'nextjs/PageNextJs';
-
-const L2OutputRoots = dynamic(() => import('ui/pages/L2OutputRoots'), { ssr: false });
-
-const Page: NextPage = () => {
-  return (
-    <PageNextJs pathname="/l2-output-roots">
-      <L2OutputRoots/>
-    </PageNextJs>
-  );
-};
-
-export default Page;
-
-export { L2 as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/login.tsx b/pages/login.tsx
index a74410f613..11562f856b 100644
--- a/pages/login.tsx
+++ b/pages/login.tsx
@@ -15,4 +15,4 @@ const Page: NextPage = () => {
 
 export default Page;
 
-export { base as getServerSideProps } from 'nextjs/getServerSideProps';
+export { login as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/name-domains/[name].tsx b/pages/name-domains/[name].tsx
new file mode 100644
index 0000000000..7a01829baa
--- /dev/null
+++ b/pages/name-domains/[name].tsx
@@ -0,0 +1,20 @@
+import type { NextPage } from 'next';
+import dynamic from 'next/dynamic';
+import React from 'react';
+
+import type { Props } from 'nextjs/getServerSideProps';
+import PageNextJs from 'nextjs/PageNextJs';
+
+const NameDomain = dynamic(() => import('ui/pages/NameDomain'), { ssr: false });
+
+const Page: NextPage<Props> = (props: Props) => {
+  return (
+    <PageNextJs pathname="/name-domains/[name]" query={ props }>
+      <NameDomain/>
+    </PageNextJs>
+  );
+};
+
+export default Page;
+
+export { nameService as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/withdrawals.tsx b/pages/name-domains/index.tsx
similarity index 58%
rename from pages/withdrawals.tsx
rename to pages/name-domains/index.tsx
index f8df33177f..f00e06e9ba 100644
--- a/pages/withdrawals.tsx
+++ b/pages/name-domains/index.tsx
@@ -4,16 +4,16 @@ import React from 'react';
 
 import PageNextJs from 'nextjs/PageNextJs';
 
-const Withdrawals = dynamic(() => import('ui/pages/Withdrawals'), { ssr: false });
+const NameDomains = dynamic(() => import('ui/pages/NameDomains'), { ssr: false });
 
 const Page: NextPage = () => {
   return (
-    <PageNextJs pathname="/withdrawals">
-      <Withdrawals/>
+    <PageNextJs pathname="/name-domains">
+      <NameDomains/>
     </PageNextJs>
   );
 };
 
 export default Page;
 
-export { beaconChain as getServerSideProps } from 'nextjs/getServerSideProps';
+export { nameService as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/zkevm-l2-txn-batch/[number].tsx b/pages/op/[hash].tsx
similarity index 56%
rename from pages/zkevm-l2-txn-batch/[number].tsx
rename to pages/op/[hash].tsx
index b128b8d070..63080f817c 100644
--- a/pages/zkevm-l2-txn-batch/[number].tsx
+++ b/pages/op/[hash].tsx
@@ -5,16 +5,16 @@ import React from 'react';
 import type { Props } from 'nextjs/getServerSideProps';
 import PageNextJs from 'nextjs/PageNextJs';
 
-const ZkEvmL2TxnBatch = dynamic(() => import('ui/pages/ZkEvmL2TxnBatch'), { ssr: false });
+const UserOp = dynamic(() => import('ui/pages/UserOp'), { ssr: false });
 
 const Page: NextPage<Props> = (props: Props) => {
   return (
-    <PageNextJs pathname="/zkevm-l2-txn-batch/[number]" query={ props }>
-      <ZkEvmL2TxnBatch/>
+    <PageNextJs pathname="/op/[hash]" query={ props }>
+      <UserOp/>
     </PageNextJs>
   );
 };
 
 export default Page;
 
-export { zkEvmL2 as getServerSideProps } from 'nextjs/getServerSideProps';
+export { userOps as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/l2-withdrawals.tsx b/pages/ops.tsx
similarity index 51%
rename from pages/l2-withdrawals.tsx
rename to pages/ops.tsx
index 0814bf4a10..6d70165262 100644
--- a/pages/l2-withdrawals.tsx
+++ b/pages/ops.tsx
@@ -4,16 +4,16 @@ import React from 'react';
 
 import PageNextJs from 'nextjs/PageNextJs';
 
-const L2Withdrawals = dynamic(() => import('ui/pages/L2Withdrawals'), { ssr: false });
+const UserOps = dynamic(() => import('ui/pages/UserOps'), { ssr: false });
 
 const Page: NextPage = () => {
   return (
-    <PageNextJs pathname="/l2-withdrawals">
-      <L2Withdrawals/>
+    <PageNextJs pathname="/ops">
+      <UserOps/>
     </PageNextJs>
   );
 };
 
 export default Page;
 
-export { L2 as getServerSideProps } from 'nextjs/getServerSideProps';
+export { userOps as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/output-roots/index.tsx b/pages/output-roots/index.tsx
new file mode 100644
index 0000000000..4ce87bec5a
--- /dev/null
+++ b/pages/output-roots/index.tsx
@@ -0,0 +1,19 @@
+import type { NextPage } from 'next';
+import dynamic from 'next/dynamic';
+import React from 'react';
+
+import PageNextJs from 'nextjs/PageNextJs';
+
+const OutputRoots = dynamic(() => import('ui/pages/OptimisticL2OutputRoots'), { ssr: false });
+
+const Page: NextPage = () => {
+  return (
+    <PageNextJs pathname="/output-roots">
+      <OutputRoots/>
+    </PageNextJs>
+  );
+};
+
+export default Page;
+
+export { optimisticRollup as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/l2-deposits.tsx b/pages/validators.tsx
similarity index 55%
rename from pages/l2-deposits.tsx
rename to pages/validators.tsx
index 0c445b4706..42409f3fd3 100644
--- a/pages/l2-deposits.tsx
+++ b/pages/validators.tsx
@@ -4,16 +4,16 @@ import React from 'react';
 
 import PageNextJs from 'nextjs/PageNextJs';
 
-const L2Deposits = dynamic(() => import('ui/pages/L2Deposits'), { ssr: false });
+const Validators = dynamic(() => import('ui/pages/Validators'), { ssr: false });
 
 const Page: NextPage = () => {
   return (
-    <PageNextJs pathname="/l2-deposits">
-      <L2Deposits/>
+    <PageNextJs pathname="/validators">
+      <Validators/>
     </PageNextJs>
   );
 };
 
 export default Page;
 
-export { L2 as getServerSideProps } from 'nextjs/getServerSideProps';
+export { validators as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/withdrawals/index.tsx b/pages/withdrawals/index.tsx
new file mode 100644
index 0000000000..661ada21eb
--- /dev/null
+++ b/pages/withdrawals/index.tsx
@@ -0,0 +1,37 @@
+import type { NextPage } from 'next';
+import dynamic from 'next/dynamic';
+import React from 'react';
+
+import PageNextJs from 'nextjs/PageNextJs';
+
+import config from 'configs/app';
+const rollupFeature = config.features.rollup;
+const beaconChainFeature = config.features.beaconChain;
+
+const Withdrawals = dynamic(() => {
+  if (rollupFeature.isEnabled && rollupFeature.type === 'optimistic') {
+    return import('ui/pages/OptimisticL2Withdrawals');
+  }
+
+  if (rollupFeature.isEnabled && rollupFeature.type === 'shibarium') {
+    return import('ui/pages/ShibariumWithdrawals');
+  }
+
+  if (beaconChainFeature.isEnabled) {
+    return import('ui/pages/BeaconChainWithdrawals');
+  }
+
+  throw new Error('Withdrawals feature is not enabled.');
+}, { ssr: false });
+
+const Page: NextPage = () => {
+  return (
+    <PageNextJs pathname="/withdrawals">
+      <Withdrawals/>
+    </PageNextJs>
+  );
+};
+
+export default Page;
+
+export { withdrawals as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/pages/zkevm-l2-txn-batches.tsx b/pages/zkevm-l2-txn-batches.tsx
deleted file mode 100644
index 36b8139216..0000000000
--- a/pages/zkevm-l2-txn-batches.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import type { NextPage } from 'next';
-import dynamic from 'next/dynamic';
-import React from 'react';
-
-import PageNextJs from 'nextjs/PageNextJs';
-
-const ZkEvmL2TxnBatches = dynamic(() => import('ui/pages/ZkEvmL2TxnBatches'), { ssr: false });
-
-const Page: NextPage = () => {
-  return (
-    <PageNextJs pathname="/zkevm-l2-txn-batches">
-      <ZkEvmL2TxnBatches/>
-    </PageNextJs>
-  );
-};
-
-export default Page;
-
-export { zkEvmL2 as getServerSideProps } from 'nextjs/getServerSideProps';
diff --git a/playwright-ct.config.ts b/playwright-ct.config.ts
index eccae16aa5..d6c7c6c231 100644
--- a/playwright-ct.config.ts
+++ b/playwright-ct.config.ts
@@ -4,6 +4,8 @@ import react from '@vitejs/plugin-react';
 import svgr from 'vite-plugin-svgr';
 import tsconfigPaths from 'vite-tsconfig-paths';
 
+import appConfig from 'configs/app';
+
 /**
  * See https://playwright.dev/docs/test-configuration.
  */
@@ -26,14 +28,17 @@ const config: PlaywrightTestConfig = defineConfig({
   /* Retry on CI only */
   retries: process.env.CI ? 2 : 0,
 
-  /* Opt out of parallel tests on CI. */
-  workers: process.env.CI ? 1 : undefined,
+  /* Opt out of parallel tests. */
+  // on non-performant local machines some tests may fail due to lack of resources
+  // so we opt out of parallel tests in any environment
+  workers: 1,
 
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */
   reporter: 'html',
 
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
+    baseURL: appConfig.app.baseUrl,
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
     trace: 'on-first-retry',
@@ -58,14 +63,26 @@ const config: PlaywrightTestConfig = defineConfig({
         minify: false,
       },
       resolve: {
-        alias: {
+        alias: [
           // There is an issue with building these package using vite that I cannot resolve
           // The solution described here - https://github.com/vitejs/vite/issues/9703#issuecomment-1216662109
           // doesn't seam to work well with our setup
           // so for now we just mock these modules in tests
-          '@metamask/post-message-stream': './playwright/mocks/modules/@metamask/post-message-stream.js',
-          '@metamask/providers': './playwright/mocks/modules/@metamask/providers.js',
-        },
+          { find: '@metamask/post-message-stream', replacement: './playwright/mocks/modules/@metamask/post-message-stream.js' },
+          { find: '@metamask/providers', replacement: './playwright/mocks/modules/@metamask/providers.js' },
+
+          // '@metamask/sdk imports the browser module as UMD, but @wagmi/connectors expects it to be ESM
+          // so we do a little remapping here
+          { find: '@metamask/sdk', replacement: './node_modules/@metamask/sdk/dist/browser/es/metamask-sdk.js' },
+
+          // Mock for growthbook to test feature flags
+          { find: 'lib/growthbook/useFeatureValue', replacement: './playwright/mocks/lib/growthbook/useFeatureValue.js' },
+
+          // The createWeb3Modal() function from web3modal/wagmi/react somehow pollutes the global styles which causes the tests to fail
+          // We don't call this function in TestApp and since we use useWeb3Modal() and useWeb3ModalState() hooks in the code, we have to mock the module
+          // Otherwise it will complain that createWeb3Modal() is no called before the hooks are used
+          { find: /^@web3modal\/wagmi\/react$/, replacement: './playwright/mocks/modules/@web3modal/wagmi/react.js' },
+        ],
       },
       define: {
         'process.env': '__envs', // Port process.env over window.__envs
diff --git a/playwright/TestApp.tsx b/playwright/TestApp.tsx
index 748e52c052..8db3aee3b2 100644
--- a/playwright/TestApp.tsx
+++ b/playwright/TestApp.tsx
@@ -1,18 +1,18 @@
 import { ChakraProvider } from '@chakra-ui/react';
+import { GrowthBookProvider } from '@growthbook/growthbook-react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { createWeb3Modal, defaultWagmiConfig } from '@web3modal/wagmi/react';
 import React from 'react';
-import { WagmiConfig } from 'wagmi';
-import { mainnet } from 'wagmi/chains';
+import { WagmiProvider } from 'wagmi';
 
 import type { Props as PageProps } from 'nextjs/getServerSideProps';
 
 import { AppContextProvider } from 'lib/contexts/app';
 import { SocketProvider } from 'lib/socket/context';
+import wagmiConfig from 'lib/web3/wagmiConfig';
 import * as app from 'playwright/utils/app';
 import theme from 'theme';
 
-type Props = {
+export type Props = {
   children: React.ReactNode;
   withSocket?: boolean;
   appContext?: {
@@ -29,25 +29,11 @@ const defaultAppContext = {
     hash: '',
     number: '',
     q: '',
+    name: '',
+    adBannerProvider: 'slise',
   },
 };
 
-// >>> Web3 stuff
-const chains = [ mainnet ];
-const WALLET_CONNECT_PROJECT_ID = 'PROJECT_ID';
-
-const wagmiConfig = defaultWagmiConfig({
-  chains,
-  projectId: WALLET_CONNECT_PROJECT_ID,
-});
-
-createWeb3Modal({
-  wagmiConfig,
-  projectId: WALLET_CONNECT_PROJECT_ID,
-  chains,
-});
-// <<<<
-
 const TestApp = ({ children, withSocket, appContext = defaultAppContext }: Props) => {
   const [ queryClient ] = React.useState(() => new QueryClient({
     defaultOptions: {
@@ -63,9 +49,11 @@ const TestApp = ({ children, withSocket, appContext = defaultAppContext }: Props
       <QueryClientProvider client={ queryClient }>
         <SocketProvider url={ withSocket ? `ws://${ app.domain }:${ app.socketPort }` : undefined }>
           <AppContextProvider { ...appContext }>
-            <WagmiConfig config={ wagmiConfig }>
-              { children }
-            </WagmiConfig>
+            <GrowthBookProvider>
+              <WagmiProvider config={ wagmiConfig! }>
+                { children }
+              </WagmiProvider>
+            </GrowthBookProvider>
           </AppContextProvider>
         </SocketProvider>
       </QueryClientProvider>
diff --git a/playwright/fixtures/contextWithEnvs.ts b/playwright/fixtures/contextWithEnvs.ts
index 5281646245..e703a922fb 100644
--- a/playwright/fixtures/contextWithEnvs.ts
+++ b/playwright/fixtures/contextWithEnvs.ts
@@ -1,7 +1,6 @@
 import type { test } from '@playwright/experimental-ct-react';
-import type { Browser } from '@playwright/test';
 
-import * as app from 'playwright/utils/app';
+import createContextWithStorage from './createContextWithStorage';
 
 interface Env {
   name: string;
@@ -11,20 +10,9 @@ interface Env {
 // keep in mind that all passed variables here should be present in env config files (.env.pw or .env.poa)
 export default function contextWithEnvsFixture(envs: Array<Env>): Parameters<typeof test.extend>[0]['context'] {
   return async({ browser }, use) => {
-    const context = await createContextWithEnvs(browser, envs);
+    const context = await createContextWithStorage(browser, envs);
 
     await use(context);
     await context.close();
   };
 }
-
-export async function createContextWithEnvs(browser: Browser, envs: Array<Env>) {
-  return browser.newContext({
-    storageState: {
-      origins: [
-        { origin: app.url, localStorage: envs },
-      ],
-      cookies: [],
-    },
-  });
-}
diff --git a/playwright/fixtures/contextWithFeatures.ts b/playwright/fixtures/contextWithFeatures.ts
new file mode 100644
index 0000000000..a9c7836937
--- /dev/null
+++ b/playwright/fixtures/contextWithFeatures.ts
@@ -0,0 +1,18 @@
+import type { test } from '@playwright/experimental-ct-react';
+
+import createContextWithStorage from './createContextWithStorage';
+
+interface Feature {
+  id: string;
+  value: unknown;
+}
+
+export default function contextWithFeaturesFixture(envs: Array<Feature>): Parameters<typeof test.extend>[0]['context'] {
+  return async({ browser }, use) => {
+    const storageItems = envs.map(({ id, value }) => ({ name: `pw_feature:${ id }`, value: JSON.stringify(value) }));
+    const context = await createContextWithStorage(browser, storageItems);
+
+    await use(context);
+    await context.close();
+  };
+}
diff --git a/playwright/fixtures/createContextWithStorage.ts b/playwright/fixtures/createContextWithStorage.ts
new file mode 100644
index 0000000000..f2555b37c0
--- /dev/null
+++ b/playwright/fixtures/createContextWithStorage.ts
@@ -0,0 +1,14 @@
+import type { Browser } from '@playwright/test';
+
+import * as app from 'playwright/utils/app';
+
+export default async function createContextWithEnvs(browser: Browser, localStorage: Array<{ name: string; value: string }>) {
+  return browser.newContext({
+    storageState: {
+      origins: [
+        { origin: app.url, localStorage },
+      ],
+      cookies: [],
+    },
+  });
+}
diff --git a/playwright/fixtures/mockApiResponse.ts b/playwright/fixtures/mockApiResponse.ts
new file mode 100644
index 0000000000..595b623ae9
--- /dev/null
+++ b/playwright/fixtures/mockApiResponse.ts
@@ -0,0 +1,26 @@
+import type { TestFixture, Page } from '@playwright/test';
+
+import buildUrl from 'lib/api/buildUrl';
+import type { ResourceName, ResourcePayload } from 'lib/api/resources';
+
+interface Options<R extends ResourceName> {
+  pathParams?: Parameters<typeof buildUrl<R>>[1];
+  queryParams?: Parameters<typeof buildUrl<R>>[2];
+}
+
+export type MockApiResponseFixture = <R extends ResourceName>(resourceName: R, responseMock: ResourcePayload<R>, options?: Options<R>) => Promise<string>;
+
+const fixture: TestFixture<MockApiResponseFixture, { page: Page }> = async({ page }, use) => {
+  await use(async(resourceName, responseMock, options) => {
+    const apiUrl = buildUrl(resourceName, options?.pathParams, options?.queryParams);
+
+    await page.route(apiUrl, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(responseMock),
+    }));
+
+    return apiUrl;
+  });
+};
+
+export default fixture;
diff --git a/playwright/fixtures/mockAssetResponse.ts b/playwright/fixtures/mockAssetResponse.ts
new file mode 100644
index 0000000000..8da0b75fea
--- /dev/null
+++ b/playwright/fixtures/mockAssetResponse.ts
@@ -0,0 +1,15 @@
+import type { TestFixture, Page } from '@playwright/test';
+
+export type MockAssetResponseFixture = (url: string, path: string) => Promise<void>;
+
+const fixture: TestFixture<MockAssetResponseFixture, { page: Page }> = async({ page }, use) => {
+  await use(async(url, path) => {
+
+    await page.route(url, (route) => route.fulfill({
+      status: 200,
+      path,
+    }));
+  });
+};
+
+export default fixture;
diff --git a/playwright/fixtures/render.tsx b/playwright/fixtures/render.tsx
new file mode 100644
index 0000000000..88f7fe669f
--- /dev/null
+++ b/playwright/fixtures/render.tsx
@@ -0,0 +1,35 @@
+import type { MountOptions } from '@playwright/experimental-ct-react';
+import type { Locator, TestFixture } from '@playwright/test';
+import type router from 'next/router';
+import React from 'react';
+
+import type { JsonObject } from '@playwright/experimental-ct-core/types/component';
+
+import type { Props as TestAppProps } from 'playwright/TestApp';
+import TestApp from 'playwright/TestApp';
+
+interface MountResult extends Locator {
+  unmount(): Promise<void>;
+  update(component: JSX.Element): Promise<void>;
+}
+
+type Mount = <HooksConfig extends JsonObject>(component: JSX.Element, options?: MountOptions<HooksConfig>) => Promise<MountResult>;
+
+interface Options extends JsonObject {
+  hooksConfig?: {
+    router: Partial<Pick<typeof router, 'query' | 'isReady' | 'asPath' | 'pathname'>>;
+  };
+}
+
+export type RenderFixture = (component: JSX.Element, options?: Options, props?: Omit<TestAppProps, 'children'>) => Promise<MountResult>
+
+const fixture: TestFixture<RenderFixture, { mount: Mount }> = async({ mount }, use) => {
+  await use((component, options, props) => {
+    return mount(
+      <TestApp { ...props }>{ component }</TestApp>,
+      options,
+    );
+  });
+};
+
+export default fixture;
diff --git a/playwright/fixtures/socketServer.ts b/playwright/fixtures/socketServer.ts
index 43c3726371..f630cdd012 100644
--- a/playwright/fixtures/socketServer.ts
+++ b/playwright/fixtures/socketServer.ts
@@ -10,16 +10,16 @@ import type { Transaction } from 'types/api/transaction';
 
 import * as app from 'playwright/utils/app';
 
-type ReturnType = () => Promise<WebSocket>;
+export type CreateSocketFixture = () => Promise<WebSocket>;
 
 type Channel = [string, string, string];
 
 export interface SocketServerFixture {
-  createSocket: ReturnType;
+  createSocket: CreateSocketFixture;
 }
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const createSocket: TestFixture<ReturnType, { page: Page}> = async({ page }, use) => {
+export const createSocket: TestFixture<CreateSocketFixture, { page: Page}> = async({ page }, use) => {
   const socketServer = new WebSocketServer({ port: app.socketPort });
 
   const connectionPromise = new Promise<WebSocket>((resolve) => {
@@ -62,6 +62,7 @@ export function sendMessage(socket: WebSocket, channel: Channel, msg: 'token_bal
 export function sendMessage(socket: WebSocket, channel: Channel, msg: 'updated_token_balances_erc_20', payload: AddressTokensBalancesSocketMessage): void;
 export function sendMessage(socket: WebSocket, channel: Channel, msg: 'updated_token_balances_erc_721', payload: AddressTokensBalancesSocketMessage): void;
 export function sendMessage(socket: WebSocket, channel: Channel, msg: 'updated_token_balances_erc_1155', payload: AddressTokensBalancesSocketMessage): void;
+export function sendMessage(socket: WebSocket, channel: Channel, msg: 'updated_token_balances_erc_404', payload: AddressTokensBalancesSocketMessage): void;
 export function sendMessage(socket: WebSocket, channel: Channel, msg: 'transaction', payload: { transaction: number }): void;
 export function sendMessage(socket: WebSocket, channel: Channel, msg: 'transaction', payload: { transactions: Array<Transaction> }): void;
 export function sendMessage(socket: WebSocket, channel: Channel, msg: 'pending_transaction', payload: { pending_transaction: number }): void;
diff --git a/playwright/index.ts b/playwright/index.ts
index 879cfa0127..e0e5b4be99 100644
--- a/playwright/index.ts
+++ b/playwright/index.ts
@@ -9,6 +9,7 @@ const NEXT_ROUTER_MOCK = {
   query: {},
   pathname: '',
   push: () => Promise.resolve(),
+  replace: () => Promise.resolve(),
 };
 
 beforeMount(async({ hooksConfig }) => {
diff --git a/playwright/lib.tsx b/playwright/lib.tsx
new file mode 100644
index 0000000000..215f71d17e
--- /dev/null
+++ b/playwright/lib.tsx
@@ -0,0 +1,64 @@
+/* eslint-disable no-console */
+import { test as base } from '@playwright/experimental-ct-react';
+
+import * as textAdMock from 'mocks/ad/textAd';
+
+import type { MockApiResponseFixture } from './fixtures/mockApiResponse';
+import mockApiResponseFixture from './fixtures/mockApiResponse';
+import type { MockAssetResponseFixture } from './fixtures/mockAssetResponse';
+import mockAssetResponseFixture from './fixtures/mockAssetResponse';
+import type { RenderFixture } from './fixtures/render';
+import renderFixture from './fixtures/render';
+import type { CreateSocketFixture } from './fixtures/socketServer';
+import { createSocket as createSocketFixture } from './fixtures/socketServer';
+
+interface Fixtures {
+  render: RenderFixture;
+  mockApiResponse: MockApiResponseFixture;
+  mockAssetResponse: MockAssetResponseFixture;
+  createSocket: CreateSocketFixture;
+}
+
+const test = base.extend<Fixtures>({
+  render: renderFixture,
+  mockApiResponse: mockApiResponseFixture,
+  mockAssetResponse: mockAssetResponseFixture,
+  createSocket: createSocketFixture,
+});
+
+test.beforeEach(async({ page }) => {
+  // debug
+  const isDebug = process.env.PWDEBUG === '1';
+
+  if (isDebug) {
+    page.on('console', msg => console.log(msg.text()));
+    page.on('request', request => console.info('\x1b[34m%s\x1b[0m', '>>', request.method(), request.url()));
+    page.on('response', response => console.info('\x1b[35m%s\x1b[0m', '<<', String(response.status()), response.url()));
+  }
+
+  // Abort all other requests to external resources
+  await page.route('**', (route) => {
+    if (!route.request().url().startsWith('http://localhost')) {
+      isDebug && console.info('Aborting request to', route.request().url());
+      route.abort();
+    } else {
+      route.continue();
+    }
+  });
+
+  // with few exceptions:
+  //  1. mock text AD requests
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(textAdMock.duck),
+  }));
+  await page.route(textAdMock.duck.ad.thumbnail, (route) => {
+    return route.fulfill({
+      status: 200,
+      path: './playwright/mocks/image_s.jpg',
+    });
+  });
+});
+
+export * from '@playwright/experimental-ct-react';
+export { test };
diff --git a/playwright/mocks/lib/growthbook/useFeatureValue.js b/playwright/mocks/lib/growthbook/useFeatureValue.js
new file mode 100644
index 0000000000..e3c810f70b
--- /dev/null
+++ b/playwright/mocks/lib/growthbook/useFeatureValue.js
@@ -0,0 +1,10 @@
+const useFeatureValue = (name, fallback) => {
+  try {
+    const value = JSON.parse(localStorage.getItem(`pw_feature:${ name }`));
+    return { isLoading: false, value };
+  } catch (error) {
+    return { isLoading: false, value: fallback };
+  }
+};
+
+export default useFeatureValue;
diff --git a/playwright/mocks/modules/@web3modal/wagmi/react.js b/playwright/mocks/modules/@web3modal/wagmi/react.js
new file mode 100644
index 0000000000..7765272c71
--- /dev/null
+++ b/playwright/mocks/modules/@web3modal/wagmi/react.js
@@ -0,0 +1,26 @@
+function useWeb3Modal() {
+  return {
+    open: () => {},
+  };
+}
+
+function useWeb3ModalState() {
+  return {
+    isOpen: false,
+  };
+}
+
+function useWeb3ModalTheme() {
+  return {
+    setThemeMode: () => {},
+  };
+}
+
+function createWeb3Modal() {}
+
+export {
+  createWeb3Modal,
+  useWeb3Modal,
+  useWeb3ModalState,
+  useWeb3ModalTheme,
+};
diff --git a/playwright/utils/buildApiUrl.ts b/playwright/utils/buildApiUrl.ts
index 4279efb71d..f8ce6bc063 100644
--- a/playwright/utils/buildApiUrl.ts
+++ b/playwright/utils/buildApiUrl.ts
@@ -1,11 +1,22 @@
 import { compile } from 'path-to-regexp';
 
+import config from 'configs/app';
 import type { ResourceName, ResourcePathParams } from 'lib/api/resources';
 import { RESOURCES } from 'lib/api/resources';
 
+// DEPRECATED
+
+/**
+ * @deprecated please use fixture mockApiResponse from playwright/lib.tsx for rendering test suite
+ *
+ * @export
+ * @template R
+ * @param {R} resourceName
+ * @param {ResourcePathParams<R>} [pathParams]
+ * @return {*} string
+ */
 export default function buildApiUrl<R extends ResourceName>(resourceName: R, pathParams?: ResourcePathParams<R>) {
   const resource = RESOURCES[resourceName];
-  const defaultApi = 'https://' + process.env.NEXT_PUBLIC_API_HOST + ':' + process.env.NEXT_PUBLIC_API_PORT;
-  const origin = 'endpoint' in resource && resource.endpoint ? resource.endpoint + (resource.basePath ?? '') : defaultApi;
+  const origin = 'endpoint' in resource && resource.endpoint ? resource.endpoint + (resource.basePath ?? '') : config.api.endpoint;
   return origin + compile(resource.path)(pathParams);
 }
diff --git a/playwright/utils/configs.ts b/playwright/utils/configs.ts
index 4d9bc8802f..d0a7ac6da9 100644
--- a/playwright/utils/configs.ts
+++ b/playwright/utils/configs.ts
@@ -3,6 +3,7 @@ import { devices } from '@playwright/test';
 
 export const viewport = {
   mobile: devices['iPhone 13 Pro'].viewport,
+  md: { width: 1001, height: 800 },
   xl: { width: 1600, height: 1000 },
 };
 
@@ -15,9 +16,13 @@ export const featureEnvs = {
     { name: 'NEXT_PUBLIC_HAS_BEACON_CHAIN', value: 'true' },
   ],
   optimisticRollup: [
-    { name: 'NEXT_PUBLIC_IS_OPTIMISTIC_L2_NETWORK', value: 'true' },
-    { name: 'NEXT_PUBLIC_L1_BASE_URL', value: 'https://localhost:3101' },
-    { name: 'NEXT_PUBLIC_OPTIMISTIC_L2_WITHDRAWAL_URL', value: 'https://localhost:3102' },
+    { name: 'NEXT_PUBLIC_ROLLUP_TYPE', value: 'optimistic' },
+    { name: 'NEXT_PUBLIC_ROLLUP_L1_BASE_URL', value: 'https://localhost:3101' },
+    { name: 'NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL', value: 'https://localhost:3102' },
+  ],
+  shibariumRollup: [
+    { name: 'NEXT_PUBLIC_ROLLUP_TYPE', value: 'shibarium' },
+    { name: 'NEXT_PUBLIC_ROLLUP_L1_BASE_URL', value: 'https://localhost:3101' },
   ],
   bridgedTokens: [
     {
@@ -32,9 +37,19 @@ export const featureEnvs = {
   txInterpretation: [
     { name: 'NEXT_PUBLIC_TRANSACTION_INTERPRETATION_PROVIDER', value: 'blockscout' },
   ],
-  zkRollup: [
-    { name: 'NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK', value: 'true' },
-    { name: 'NEXT_PUBLIC_L1_BASE_URL', value: 'https://localhost:3101' },
+  zkEvmRollup: [
+    { name: 'NEXT_PUBLIC_ROLLUP_TYPE', value: 'zkEvm' },
+    { name: 'NEXT_PUBLIC_ROLLUP_L1_BASE_URL', value: 'https://localhost:3101' },
+  ],
+  zkSyncRollup: [
+    { name: 'NEXT_PUBLIC_ROLLUP_TYPE', value: 'zkSync' },
+    { name: 'NEXT_PUBLIC_ROLLUP_L1_BASE_URL', value: 'https://localhost:3101' },
+  ],
+  userOps: [
+    { name: 'NEXT_PUBLIC_HAS_USER_OPS', value: 'true' },
+  ],
+  validators: [
+    { name: 'NEXT_PUBLIC_VALIDATORS_CHAIN_TYPE', value: 'stability' },
   ],
 };
 
@@ -46,6 +61,12 @@ export const viewsEnvs = {
   },
 };
 
+export const UIEnvs = {
+  hasContractAuditReports: [
+    { name: 'NEXT_PUBLIC_HAS_CONTRACT_AUDIT_REPORTS', value: 'true' },
+  ],
+};
+
 export const stabilityEnvs = [
   { name: 'NEXT_PUBLIC_VIEWS_ADDRESS_HIDDEN_VIEWS', value: '["top_accounts"]' },
   { name: 'NEXT_PUBLIC_VIEWS_TX_HIDDEN_FIELDS', value: '["value","fee_currency","gas_price","gas_fees","burnt_fees"]' },
diff --git a/public/icons/name.d.ts b/public/icons/name.d.ts
index 31e3f50b9d..6f6bc7c55b 100644
--- a/public/icons/name.d.ts
+++ b/public/icons/name.d.ts
@@ -1,8 +1,11 @@
 // This file is generated by npm run build:icons
   
   export type IconName =
-  	| "ABI"
+  	| "ABI_slim"
+	| "ABI"
 	| "API"
+	| "apps_list"
+	| "apps_xs"
 	| "apps"
 	| "arrows/down-right"
 	| "arrows/east-mini"
@@ -10,9 +13,16 @@
 	| "arrows/north-east"
 	| "arrows/south-east"
 	| "arrows/up-down"
+	| "beta_xs"
+	| "beta"
+	| "blob"
+	| "blobs/image"
+	| "blobs/raw"
+	| "blobs/text"
 	| "block_slim"
 	| "block"
 	| "brands/safe"
+	| "brands/solidity_scan"
 	| "burger"
 	| "check"
 	| "clock-light"
@@ -21,16 +31,21 @@
 	| "collection"
 	| "contract_verified"
 	| "contract"
+	| "contracts_verified"
+	| "contracts"
 	| "copy"
 	| "cross"
 	| "delete"
 	| "discussions"
 	| "docs"
 	| "donate"
+	| "dots"
 	| "edit"
 	| "email-sent"
 	| "email"
 	| "empty_search_result"
+	| "ENS_slim"
+	| "ENS"
 	| "error-pages/404"
 	| "error-pages/422"
 	| "error-pages/429"
@@ -45,12 +60,16 @@
 	| "filter"
 	| "finalized"
 	| "flame"
+	| "gas_xl"
 	| "gas"
+	| "gear_slim"
 	| "gear"
 	| "globe-b"
 	| "globe"
 	| "graphQL"
 	| "info"
+	| "integration/full"
+	| "integration/partial"
 	| "key"
 	| "lightning"
 	| "link"
@@ -76,6 +95,7 @@
 	| "qr_code"
 	| "repeat_arrow"
 	| "restAPI"
+	| "rocket_xl"
 	| "rocket"
 	| "RPC"
 	| "scope"
@@ -109,6 +129,7 @@
 	| "status/success"
 	| "status/warning"
 	| "sun"
+	| "swap"
 	| "testnet"
 	| "token-placeholder"
 	| "token"
@@ -121,10 +142,13 @@
 	| "txn_batches"
 	| "unfinalized"
 	| "uniswap"
+	| "up"
+	| "user_op_slim"
+	| "user_op"
+	| "validator"
 	| "verified_token"
 	| "verified"
 	| "verify-contract"
-	| "vertical_dots"
 	| "wallet"
 	| "wallets/coinbase"
 	| "wallets/metamask"
diff --git a/public/static/contract_star.png b/public/static/contract_star.png
new file mode 100644
index 0000000000..32d635ef60
Binary files /dev/null and b/public/static/contract_star.png differ
diff --git a/public/static/identicon_logos/blockies.png b/public/static/identicon_logos/blockies.png
new file mode 100644
index 0000000000..d9ccead353
Binary files /dev/null and b/public/static/identicon_logos/blockies.png differ
diff --git a/public/static/identicon_logos/github.png b/public/static/identicon_logos/github.png
new file mode 100644
index 0000000000..346f9d212e
Binary files /dev/null and b/public/static/identicon_logos/github.png differ
diff --git a/public/static/identicon_logos/gradient_avatar.png b/public/static/identicon_logos/gradient_avatar.png
new file mode 100644
index 0000000000..396ee27848
Binary files /dev/null and b/public/static/identicon_logos/gradient_avatar.png differ
diff --git a/public/static/identicon_logos/jazzicon.png b/public/static/identicon_logos/jazzicon.png
new file mode 100644
index 0000000000..c06bc880ca
Binary files /dev/null and b/public/static/identicon_logos/jazzicon.png differ
diff --git a/stubs/ENS.ts b/stubs/ENS.ts
new file mode 100644
index 0000000000..4fbd654adf
--- /dev/null
+++ b/stubs/ENS.ts
@@ -0,0 +1,32 @@
+import type { EnsDomainDetailed, EnsDomainEvent } from 'types/api/ens';
+
+import { ADDRESS_PARAMS, ADDRESS_HASH } from './addressParams';
+import { TX_HASH } from './tx';
+
+export const ENS_DOMAIN: EnsDomainDetailed = {
+  id: '0x126d74db13895f8d3a1d362410212731d1e1d9be8add83e388385f93d84c8c84',
+  name: 'kitty.cat.eth',
+  tokens: [
+    {
+      id: '973523146267017920308',
+      contract_hash: ADDRESS_HASH,
+      type: 'NATIVE_DOMAIN_TOKEN',
+    },
+  ],
+  owner: ADDRESS_PARAMS,
+  wrapped_owner: null,
+  resolved_address: ADDRESS_PARAMS,
+  registrant: ADDRESS_PARAMS,
+  registration_date: '2023-12-20T01:29:12.000Z',
+  expiry_date: '2099-01-02T01:29:12.000Z',
+  other_addresses: {
+    ETH: ADDRESS_HASH,
+  },
+};
+
+export const ENS_DOMAIN_EVENT: EnsDomainEvent = {
+  transaction_hash: TX_HASH,
+  timestamp: '2022-06-06T08:43:15.000000Z',
+  from_address: ADDRESS_PARAMS,
+  action: '0xf7a16963',
+};
diff --git a/stubs/L2.ts b/stubs/L2.ts
index b10eb4db0e..21346e0ef5 100644
--- a/stubs/L2.ts
+++ b/stubs/L2.ts
@@ -1,12 +1,14 @@
-import type { L2DepositsItem } from 'types/api/l2Deposits';
-import type { L2OutputRootsItem } from 'types/api/l2OutputRoots';
-import type { L2TxnBatchesItem } from 'types/api/l2TxnBatches';
-import type { L2WithdrawalsItem } from 'types/api/l2Withdrawals';
+import type {
+  OptimisticL2DepositsItem,
+  OptimisticL2OutputRootsItem,
+  OptimisticL2TxnBatchesItem,
+  OptimisticL2WithdrawalsItem,
+} from 'types/api/optimisticL2';
 
 import { ADDRESS_HASH, ADDRESS_PARAMS } from './addressParams';
 import { TX_HASH } from './tx';
 
-export const L2_DEPOSIT_ITEM: L2DepositsItem = {
+export const L2_DEPOSIT_ITEM: OptimisticL2DepositsItem = {
   l1_block_number: 9045233,
   l1_block_timestamp: '2023-05-22T18:00:36.000000Z',
   l1_tx_hash: TX_HASH,
@@ -15,7 +17,7 @@ export const L2_DEPOSIT_ITEM: L2DepositsItem = {
   l2_tx_hash: TX_HASH,
 };
 
-export const L2_WITHDRAWAL_ITEM: L2WithdrawalsItem = {
+export const L2_WITHDRAWAL_ITEM: OptimisticL2WithdrawalsItem = {
   challenge_period_end: null,
   from: ADDRESS_PARAMS,
   l1_tx_hash: TX_HASH,
@@ -26,8 +28,7 @@ export const L2_WITHDRAWAL_ITEM: L2WithdrawalsItem = {
   status: 'Ready to prove',
 };
 
-export const L2_TXN_BATCHES_ITEM: L2TxnBatchesItem = {
-  epoch_number: 9103513,
+export const L2_TXN_BATCHES_ITEM: OptimisticL2TxnBatchesItem = {
   l1_timestamp: '2023-06-01T14:46:48.000000Z',
   l1_tx_hashes: [
     TX_HASH,
@@ -36,7 +37,7 @@ export const L2_TXN_BATCHES_ITEM: L2TxnBatchesItem = {
   tx_count: 9,
 };
 
-export const L2_OUTPUT_ROOTS_ITEM: L2OutputRootsItem = {
+export const L2_OUTPUT_ROOTS_ITEM: OptimisticL2OutputRootsItem = {
   l1_block_number: 9103684,
   l1_timestamp: '2023-06-01T15:26:12.000000Z',
   l1_tx_hash: TX_HASH,
diff --git a/stubs/RPC.ts b/stubs/RPC.ts
new file mode 100644
index 0000000000..0da0947c7c
--- /dev/null
+++ b/stubs/RPC.ts
@@ -0,0 +1,94 @@
+import type { Chain, GetBlockReturnType, GetTransactionReturnType, TransactionReceipt, Withdrawal } from 'viem';
+
+import { ADDRESS_HASH } from './addressParams';
+import { BLOCK_HASH } from './block';
+import { TX_HASH } from './tx';
+
+export const WITHDRAWAL: Withdrawal = {
+  index: '0x1af95d9',
+  validatorIndex: '0x7d748',
+  address: '0x9b52b9033ecbb6635f1c31a646d5691b282878aa',
+  amount: '0x29e16b',
+};
+
+export const GET_TRANSACTION: GetTransactionReturnType<Chain, 'latest'> = {
+  blockHash: BLOCK_HASH,
+  blockNumber: BigInt(10361367),
+  from: ADDRESS_HASH,
+  gas: BigInt(800000),
+  maxPriorityFeePerGas: BigInt(2),
+  maxFeePerGas: BigInt(14),
+  hash: TX_HASH,
+  input: '0x7898e0',
+  nonce: 117694,
+  to: ADDRESS_HASH,
+  transactionIndex: 60,
+  value: BigInt(42),
+  type: 'eip1559',
+  accessList: [],
+  chainId: 5,
+  v: BigInt(0),
+  r: '0x2c5022ff7f78a22f1a99afbd568f75cb52812189ed8c264c8310e0b8dba2c8a8',
+  s: '0x50938f87c92b9eeb9777507ca8f7397840232d00d1dbac3edac6c115b4656763',
+  yParity: 1,
+  typeHex: '0x2',
+};
+
+export const GET_TRANSACTION_RECEIPT: TransactionReceipt = {
+  blockHash: BLOCK_HASH,
+  blockNumber: BigInt(10361367),
+  contractAddress: null,
+  cumulativeGasUsed: BigInt(39109),
+  effectiveGasPrice: BigInt(13),
+  from: ADDRESS_HASH,
+  gasUsed: BigInt(39109),
+  logs: [],
+  logsBloom: '0x0',
+  status: 'success',
+  to: ADDRESS_HASH,
+  transactionHash: TX_HASH,
+  transactionIndex: 60,
+  type: '0x2',
+};
+
+export const GET_TRANSACTION_CONFIRMATIONS = BigInt(420);
+
+export const GET_BALANCE = BigInt(42_000_000_000_000);
+
+export const GET_TRANSACTIONS_COUNT = 42;
+
+export const GET_BLOCK: GetBlockReturnType<Chain, false, 'latest'> = {
+  baseFeePerGas: BigInt(11),
+  difficulty: BigInt(111),
+  extraData: '0xd8830',
+  gasLimit: BigInt(800000),
+  gasUsed: BigInt(42000),
+  hash: BLOCK_HASH,
+  logsBloom: '0x008000',
+  miner: ADDRESS_HASH,
+  mixHash: BLOCK_HASH,
+  nonce: '0x0000000000000000',
+  number: BigInt(10361367),
+  parentHash: BLOCK_HASH,
+  receiptsRoot: BLOCK_HASH,
+  sha3Uncles: BLOCK_HASH,
+  size: BigInt(88),
+  stateRoot: BLOCK_HASH,
+  timestamp: BigInt(1628580000),
+  totalDifficulty: BigInt(10361367),
+  transactions: [
+    TX_HASH,
+  ],
+  transactionsRoot: TX_HASH,
+  uncles: [],
+  withdrawals: Array(10).fill(WITHDRAWAL),
+  withdrawalsRoot: TX_HASH,
+  sealFields: [ '0x00' ],
+  blobGasUsed: BigInt(0),
+  excessBlobGas: BigInt(0),
+};
+
+export const GET_BLOCK_WITH_TRANSACTIONS: GetBlockReturnType<Chain, true, 'latest'> = {
+  ...GET_BLOCK,
+  transactions: Array(50).fill(GET_TRANSACTION),
+};
diff --git a/stubs/address.ts b/stubs/address.ts
index c2e0ffd7c6..983565ca24 100644
--- a/stubs/address.ts
+++ b/stubs/address.ts
@@ -10,7 +10,7 @@ import type {
 import type { AddressesItem } from 'types/api/addresses';
 
 import { ADDRESS_HASH } from './addressParams';
-import { TOKEN_INFO_ERC_1155, TOKEN_INFO_ERC_20, TOKEN_INFO_ERC_721, TOKEN_INSTANCE } from './token';
+import { TOKEN_INFO_ERC_1155, TOKEN_INFO_ERC_20, TOKEN_INFO_ERC_721, TOKEN_INFO_ERC_404, TOKEN_INSTANCE } from './token';
 import { TX_HASH } from './tx';
 
 export const ADDRESS_INFO: Address = {
@@ -41,6 +41,7 @@ export const ADDRESS_INFO: Address = {
   public_tags: [],
   watchlist_names: [],
   watchlist_address_id: null,
+  ens_domain_name: null,
 };
 
 export const ADDRESS_COUNTERS: AddressCounters = {
@@ -71,6 +72,7 @@ export const TOP_ADDRESS: AddressesItem = {
   private_tags: [],
   public_tags: [ ],
   watchlist_names: [],
+  ens_domain_name: null,
 };
 
 export const ADDRESS_COIN_BALANCE: AddressCoinBalanceHistoryItem = {
@@ -102,6 +104,13 @@ export const ADDRESS_NFT_1155: AddressNFT = {
   ...TOKEN_INSTANCE,
 };
 
+export const ADDRESS_NFT_404: AddressNFT = {
+  token_type: 'ERC-404',
+  token: TOKEN_INFO_ERC_404,
+  value: '10',
+  ...TOKEN_INSTANCE,
+};
+
 export const ADDRESS_COLLECTION: AddressCollection = {
   token: TOKEN_INFO_ERC_1155,
   amount: '4',
diff --git a/stubs/addressParams.ts b/stubs/addressParams.ts
index a5f7374bde..819a71402b 100644
--- a/stubs/addressParams.ts
+++ b/stubs/addressParams.ts
@@ -11,4 +11,5 @@ export const ADDRESS_PARAMS: AddressParam = {
   private_tags: [],
   public_tags: [],
   watchlist_names: [],
+  ens_domain_name: null,
 };
diff --git a/stubs/blobs.ts b/stubs/blobs.ts
new file mode 100644
index 0000000000..89ca5c4cb4
--- /dev/null
+++ b/stubs/blobs.ts
@@ -0,0 +1,20 @@
+import type { Blob, TxBlob } from 'types/api/blobs';
+
+import { TX_HASH } from './tx';
+
+const BLOB_HASH = '0x0137cd898a9aaa92bbe94999d2a98241f5eabc829d9354160061789963f85995';
+const BLOB_PROOF = '0x82683d5d6e58a76f2a607b8712cad113621d46cb86a6bcfcffb1e274a70c7308b3243c6075ee22d904fecf8d4c147c6f';
+
+export const TX_BLOB: TxBlob = {
+  blob_data: '0x010203040506070809101112',
+  hash: BLOB_HASH,
+  kzg_commitment: BLOB_PROOF,
+  kzg_proof: BLOB_PROOF,
+};
+
+export const BLOB: Blob = {
+  ...TX_BLOB,
+  transaction_hashes: [
+    { block_consensus: true, transaction_hash: TX_HASH },
+  ],
+};
diff --git a/stubs/contract.ts b/stubs/contract.ts
index 36d7b13ed2..d242609f97 100644
--- a/stubs/contract.ts
+++ b/stubs/contract.ts
@@ -1,5 +1,5 @@
 import type { SmartContract, SolidityscanReport } from 'types/api/contract';
-import type { VerifiedContract } from 'types/api/contracts';
+import type { VerifiedContract, VerifiedContractsCounters } from 'types/api/contracts';
 
 import { ADDRESS_PARAMS } from './addressParams';
 
@@ -40,6 +40,7 @@ export const CONTRACT_CODE_VERIFIED = {
   optimization_runs: 200,
   source_code: 'source_code',
   verified_at: '2023-02-21T14:39:16.906760Z',
+  license_type: 'mit',
 } as unknown as SmartContract;
 
 export const VERIFIED_CONTRACT_INFO: VerifiedContract = {
@@ -52,10 +53,19 @@ export const VERIFIED_CONTRACT_INFO: VerifiedContract = {
   optimization_enabled: false,
   tx_count: 565058,
   verified_at: '2023-04-10T13:16:33.884921Z',
+  license_type: 'mit',
+};
+
+export const VERIFIED_CONTRACTS_COUNTERS: VerifiedContractsCounters = {
+  smart_contracts: '123456789',
+  new_smart_contracts_24h: '12345',
+  verified_smart_contracts: '654321',
+  new_verified_smart_contracts_24h: '1234',
 };
 
 export const SOLIDITYSCAN_REPORT: SolidityscanReport = {
   scan_report: {
+    contractname: 'BullRunners',
     scan_status: 'scan_done',
     scan_summary: {
       issue_severity_distribution: {
diff --git a/stubs/marketplace.ts b/stubs/marketplace.ts
index cbb786a74e..0671368937 100644
--- a/stubs/marketplace.ts
+++ b/stubs/marketplace.ts
@@ -15,3 +15,5 @@ export const MARKETPLACE_APP: MarketplaceAppOverview = {
   external: true,
   url: 'https://example.com',
 };
+
+export const CATEGORIES: Array<string> = Array(9).fill('Bridge').map((c, i) => c + i);
diff --git a/stubs/noves/NovesTranslate.ts b/stubs/noves/NovesTranslate.ts
new file mode 100644
index 0000000000..848ed6dab9
--- /dev/null
+++ b/stubs/noves/NovesTranslate.ts
@@ -0,0 +1,43 @@
+import type { NovesResponseData, NovesClassificationData, NovesRawTransactionData } from 'types/api/noves';
+
+const NOVES_TRANSLATE_CLASSIFIED: NovesClassificationData = {
+  description: 'Sent 0.04 ETH',
+  received: [ {
+    action: 'Sent Token',
+    actionFormatted: 'Sent Token',
+    amount: '45',
+    from: { name: '', address: '0xa0393A76b132526a70450273CafeceB45eea6dEE' },
+    to: { name: '', address: '0xa0393A76b132526a70450273CafeceB45eea6dEE' },
+    token: {
+      address: '',
+      name: 'ETH',
+      symbol: 'ETH',
+      decimals: 18,
+    },
+  } ],
+  sent: [],
+  source: {
+    type: '',
+  },
+  type: '0x2',
+  typeFormatted: 'Send NFT',
+};
+
+const NOVES_TRANSLATE_RAW: NovesRawTransactionData = {
+  blockNumber: 1,
+  fromAddress: '0xCFC123a23dfeD71bDAE054e487989d863C525C73',
+  gas: 2,
+  gasPrice: 3,
+  timestamp: 20000,
+  toAddress: '0xCFC123a23dfeD71bDAE054e487989d863C525C73',
+  transactionFee: 2,
+  transactionHash: '0x128b79937a0eDE33258992c9668455f997f1aF24',
+};
+
+export const NOVES_TRANSLATE: NovesResponseData = {
+  accountAddress: '0x2b824349b320cfa72f292ab26bf525adb00083ba9fa097141896c3c8c74567cc',
+  chain: 'base',
+  txTypeVersion: 2,
+  rawTransactionData: NOVES_TRANSLATE_RAW,
+  classificationData: NOVES_TRANSLATE_CLASSIFIED,
+};
diff --git a/stubs/shibarium.ts b/stubs/shibarium.ts
new file mode 100644
index 0000000000..3003be7110
--- /dev/null
+++ b/stubs/shibarium.ts
@@ -0,0 +1,20 @@
+import type { ShibariumDepositsItem, ShibariumWithdrawalsItem } from 'types/api/shibarium';
+
+import { ADDRESS_PARAMS } from './addressParams';
+import { TX_HASH } from './tx';
+
+export const SHIBARIUM_DEPOSIT_ITEM: ShibariumDepositsItem = {
+  l1_block_number: 9045233,
+  l1_transaction_hash: TX_HASH,
+  l2_transaction_hash: TX_HASH,
+  timestamp: '2023-05-22T18:00:36.000000Z',
+  user: ADDRESS_PARAMS,
+};
+
+export const SHIBARIUM_WITHDRAWAL_ITEM: ShibariumWithdrawalsItem = {
+  l2_block_number: 9045233,
+  l1_transaction_hash: TX_HASH,
+  l2_transaction_hash: TX_HASH,
+  timestamp: '2023-05-22T18:00:36.000000Z',
+  user: ADDRESS_PARAMS,
+};
diff --git a/stubs/stats.ts b/stubs/stats.ts
index bbe8623ffe..d21ba588fd 100644
--- a/stubs/stats.ts
+++ b/stubs/stats.ts
@@ -3,11 +3,32 @@ import type { Counter, HomeStats, StatsChartsSection } from 'types/api/stats';
 export const HOMEPAGE_STATS: HomeStats = {
   average_block_time: 14346,
   coin_price: '1807.68',
+  coin_price_change_percentage: 42,
   gas_prices: {
-    average: 0.1,
-    fast: 0.11,
-    slow: 0.1,
+    average: {
+      fiat_price: '1.01',
+      price: 20.41,
+      time: 12283,
+      base_fee: 2.22222,
+      priority_fee: 12.424242,
+    },
+    fast: {
+      fiat_price: '1.26',
+      price: 25.47,
+      time: 9321,
+      base_fee: 4.44444,
+      priority_fee: 22.242424,
+    },
+    slow: {
+      fiat_price: '0.97',
+      price: 19.55,
+      time: 24543,
+      base_fee: 1.11111,
+      priority_fee: 7.8909,
+    },
   },
+  gas_price_updated_at: '2022-11-11T11:09:49.051171Z',
+  gas_prices_update_in: 300000,
   gas_used_today: '0',
   market_cap: '0',
   network_utilization_percentage: 22.56,
diff --git a/stubs/token.ts b/stubs/token.ts
index e60e004bad..1c90f3d16a 100644
--- a/stubs/token.ts
+++ b/stubs/token.ts
@@ -1,4 +1,13 @@
-import type { TokenCounters, TokenHolder, TokenInfo, TokenInstance, TokenType } from 'types/api/token';
+import type {
+  TokenCounters,
+  TokenHolder,
+  TokenHolders,
+  TokenHoldersPagination,
+  TokenInfo,
+  TokenInstance,
+  TokenType,
+} from 'types/api/token';
+import type { TokenInstanceTransferPagination, TokenInstanceTransferResponse } from 'types/api/tokens';
 import type { TokenTransfer, TokenTransferPagination, TokenTransferResponse } from 'types/api/tokenTransfer';
 
 import { ADDRESS_PARAMS, ADDRESS_HASH } from './addressParams';
@@ -31,6 +40,12 @@ export const TOKEN_INFO_ERC_1155: TokenInfo<'ERC-1155'> = {
   type: 'ERC-1155',
 };
 
+export const TOKEN_INFO_ERC_404: TokenInfo<'ERC-404'> = {
+  ...TOKEN_INFO_ERC_20,
+  circulating_market_cap: null,
+  type: 'ERC-404',
+};
+
 export const TOKEN_COUNTERS: TokenCounters = {
   token_holders_count: '123456',
   transfers_count: '123456',
@@ -38,17 +53,41 @@ export const TOKEN_COUNTERS: TokenCounters = {
 
 export const TOKEN_HOLDER_ERC_20: TokenHolder = {
   address: ADDRESS_PARAMS,
-  token: TOKEN_INFO_ERC_20,
   value: '1021378038331138520',
 };
 
 export const TOKEN_HOLDER_ERC_1155: TokenHolder = {
   address: ADDRESS_PARAMS,
-  token: TOKEN_INFO_ERC_1155,
   token_id: '12345',
   value: '1021378038331138520',
 };
 
+export const getTokenHoldersStub = (type?: TokenType, pagination: TokenHoldersPagination | null = null): TokenHolders => {
+  switch (type) {
+    case 'ERC-721':
+      return generateListStub<'token_holders'>(TOKEN_HOLDER_ERC_20, 50, { next_page_params: pagination });
+    case 'ERC-1155':
+      return generateListStub<'token_holders'>(TOKEN_HOLDER_ERC_1155, 50, { next_page_params: pagination });
+    case 'ERC-404':
+      return generateListStub<'token_holders'>(TOKEN_HOLDER_ERC_1155, 50, { next_page_params: pagination });
+    default:
+      return generateListStub<'token_holders'>(TOKEN_HOLDER_ERC_20, 50, { next_page_params: pagination });
+  }
+};
+
+export const getTokenInstanceHoldersStub = (type?: TokenType, pagination: TokenHoldersPagination | null = null): TokenHolders => {
+  switch (type) {
+    case 'ERC-721':
+      return generateListStub<'token_instance_holders'>(TOKEN_HOLDER_ERC_20, 10, { next_page_params: pagination });
+    case 'ERC-1155':
+      return generateListStub<'token_instance_holders'>(TOKEN_HOLDER_ERC_1155, 10, { next_page_params: pagination });
+    case 'ERC-404':
+      return generateListStub<'token_instance_holders'>(TOKEN_HOLDER_ERC_1155, 10, { next_page_params: pagination });
+    default:
+      return generateListStub<'token_instance_holders'>(TOKEN_HOLDER_ERC_20, 10, { next_page_params: pagination });
+  }
+};
+
 export const TOKEN_TRANSFER_ERC_20: TokenTransfer = {
   block_hash: BLOCK_HASH,
   from: ADDRESS_PARAMS,
@@ -83,17 +122,42 @@ export const TOKEN_TRANSFER_ERC_1155: TokenTransfer = {
   token: TOKEN_INFO_ERC_1155,
 };
 
+export const TOKEN_TRANSFER_ERC_404: TokenTransfer = {
+  ...TOKEN_TRANSFER_ERC_20,
+  total: {
+    token_id: '35870',
+    value: '123',
+    decimals: '18',
+  },
+  token: TOKEN_INFO_ERC_404,
+};
+
 export const getTokenTransfersStub = (type?: TokenType, pagination: TokenTransferPagination | null = null): TokenTransferResponse => {
   switch (type) {
     case 'ERC-721':
       return generateListStub<'token_transfers'>(TOKEN_TRANSFER_ERC_721, 50, { next_page_params: pagination });
     case 'ERC-1155':
       return generateListStub<'token_transfers'>(TOKEN_TRANSFER_ERC_1155, 50, { next_page_params: pagination });
+    case 'ERC-404':
+      return generateListStub<'token_transfers'>(TOKEN_TRANSFER_ERC_404, 50, { next_page_params: pagination });
     default:
       return generateListStub<'token_transfers'>(TOKEN_TRANSFER_ERC_20, 50, { next_page_params: pagination });
   }
 };
 
+export const getTokenInstanceTransfersStub = (type?: TokenType, pagination: TokenInstanceTransferPagination | null = null): TokenInstanceTransferResponse => {
+  switch (type) {
+    case 'ERC-721':
+      return generateListStub<'token_instance_transfers'>(TOKEN_TRANSFER_ERC_721, 10, { next_page_params: pagination });
+    case 'ERC-1155':
+      return generateListStub<'token_instance_transfers'>(TOKEN_TRANSFER_ERC_1155, 10, { next_page_params: pagination });
+    case 'ERC-404':
+      return generateListStub<'token_instance_transfers'>(TOKEN_TRANSFER_ERC_404, 10, { next_page_params: pagination });
+    default:
+      return generateListStub<'token_instance_transfers'>(TOKEN_TRANSFER_ERC_20, 10, { next_page_params: pagination });
+  }
+};
+
 export const TOKEN_INSTANCE: TokenInstance = {
   animation_url: null,
   external_app_url: 'https://vipsland.com/nft/collections/genesis/188882',
diff --git a/stubs/userOps.ts b/stubs/userOps.ts
new file mode 100644
index 0000000000..3e2fcbd1c7
--- /dev/null
+++ b/stubs/userOps.ts
@@ -0,0 +1,66 @@
+import type { UserOpsItem, UserOp, UserOpsAccount } from 'types/api/userOps';
+
+import { ADDRESS_HASH } from './addressParams';
+import { BLOCK_HASH } from './block';
+import { TX_HASH } from './tx';
+
+const USER_OP_HASH = '0xb94fab8f31f83001a23e20b2ce3cdcfb284c57a64b9a073e0e09c018bc701978';
+
+export const USER_OPS_ITEM: UserOpsItem = {
+  hash: USER_OP_HASH,
+  block_number: '10356381',
+  transaction_hash: TX_HASH,
+  address: ADDRESS_HASH,
+  timestamp: '2023-12-18T10:48:49.000000Z',
+  status: true,
+  fee: '48285720012071430',
+};
+
+export const USER_OP: UserOp = {
+  hash: USER_OP_HASH,
+  sender: ADDRESS_HASH,
+  nonce: '0x00b',
+  call_data: '0x123',
+  call_gas_limit: '71316',
+  verification_gas_limit: '91551',
+  pre_verification_gas: '53627',
+  max_fee_per_gas: '100000020',
+  max_priority_fee_per_gas: '100000000',
+  signature: '0x000',
+  aggregator: null,
+  aggregator_signature: null,
+  entry_point: ADDRESS_HASH,
+  transaction_hash: TX_HASH,
+  block_number: '10358181',
+  block_hash: BLOCK_HASH,
+  bundler: ADDRESS_HASH,
+  factory: null,
+  paymaster: ADDRESS_HASH,
+  status: true,
+  revert_reason: null,
+  gas: '399596',
+  gas_price: '1575000898',
+  gas_used: '118810',
+  sponsor_type: 'paymaster_sponsor',
+  fee: '17927001792700',
+  timestamp: '2023-12-18T10:48:49.000000Z',
+  user_logs_count: 1,
+  user_logs_start_index: 2,
+  raw: {
+    sender: ADDRESS_HASH,
+    nonce: '1',
+    init_code: '0x',
+    call_data: '0x345',
+    call_gas_limit: '29491',
+    verification_gas_limit: '80734',
+    pre_verification_gas: '3276112',
+    max_fee_per_gas: '309847206',
+    max_priority_fee_per_gas: '100000000',
+    paymaster_and_data: '0x',
+    signature: '0x000',
+  },
+};
+
+export const USER_OPS_ACCOUNT: UserOpsAccount = {
+  total_ops: 1,
+};
diff --git a/stubs/utils.ts b/stubs/utils.ts
index 858f7874ca..ef825f9252 100644
--- a/stubs/utils.ts
+++ b/stubs/utils.ts
@@ -1,9 +1,9 @@
 import type { ArrayElement } from 'types/utils';
 
-import type { PaginatedResources, PaginatedResponse } from 'lib/api/resources';
+import type { PaginatedResources, PaginatedResponse, PaginatedResponseItems } from 'lib/api/resources';
 
 export function generateListStub<Resource extends PaginatedResources>(
-  stub: ArrayElement<PaginatedResponse<Resource>['items']>,
+  stub: ArrayElement<PaginatedResponseItems<Resource>>,
   num = 50,
   rest: Omit<PaginatedResponse<Resource>, 'items'>,
 ) {
diff --git a/stubs/validators.ts b/stubs/validators.ts
new file mode 100644
index 0000000000..1717a59ec0
--- /dev/null
+++ b/stubs/validators.ts
@@ -0,0 +1,16 @@
+import type { Validator, ValidatorsCountersResponse } from 'types/api/validators';
+
+import { ADDRESS_PARAMS } from './addressParams';
+
+export const VALIDATOR: Validator = {
+  address: ADDRESS_PARAMS,
+  blocks_validated_count: 25987,
+  state: 'active',
+};
+
+export const VALIDATORS_COUNTERS: ValidatorsCountersResponse = {
+  active_validators_counter: '42',
+  active_validators_percentage: 7.14,
+  new_validators_counter_24h: '11',
+  validators_counter: '140',
+};
diff --git a/stubs/zkEvmL2.ts b/stubs/zkEvmL2.ts
index d68f1ac9d3..7dea0f57b8 100644
--- a/stubs/zkEvmL2.ts
+++ b/stubs/zkEvmL2.ts
@@ -1,4 +1,4 @@
-import type { ZkEvmL2TxnBatch, ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatch, ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2';
 
 import { TX_HASH } from './tx';
 
diff --git a/stubs/zkSyncL2.ts b/stubs/zkSyncL2.ts
new file mode 100644
index 0000000000..9d3782abcf
--- /dev/null
+++ b/stubs/zkSyncL2.ts
@@ -0,0 +1,27 @@
+import type { ZkSyncBatch, ZkSyncBatchesItem } from 'types/api/zkSyncL2';
+
+import { TX_HASH } from './tx';
+
+export const ZKSYNC_L2_TXN_BATCHES_ITEM: ZkSyncBatchesItem = {
+  commit_transaction_hash: TX_HASH,
+  commit_transaction_timestamp: '2022-03-17T19:33:04.519145Z',
+  execute_transaction_hash: TX_HASH,
+  execute_transaction_timestamp: '2022-03-17T20:49:48.856345Z',
+  number: 8002,
+  prove_transaction_hash: TX_HASH,
+  prove_transaction_timestamp: '2022-03-17T20:49:48.772442Z',
+  status: 'Executed on L1',
+  timestamp: '2022-03-17T17:00:11.000000Z',
+  tx_count: 1215,
+};
+
+export const ZKSYNC_L2_TXN_BATCH: ZkSyncBatch = {
+  ...ZKSYNC_L2_TXN_BATCHES_ITEM,
+  start_block: 1245209,
+  end_block: 1245490,
+  l1_gas_price: '4173068062',
+  l1_tx_count: 0,
+  l2_fair_gas_price: '100000000',
+  l2_tx_count: 287,
+  root_hash: '0x108c635b94f941fcabcb85500daec2f6be4f0747dff649b1cdd9dd7a7a264792',
+};
diff --git a/theme/components/Alert/Alert.ts b/theme/components/Alert/Alert.ts
index c8dfa125b1..457511c2d7 100644
--- a/theme/components/Alert/Alert.ts
+++ b/theme/components/Alert/Alert.ts
@@ -56,10 +56,10 @@ const variantSubtle = definePartsStyle((props) => {
   return {
     container: {
       [$fg.variable]: colorScheme === 'gray' ? 'colors.blackAlpha.800' : `colors.${ colorScheme }.500`,
-      [$bg.variable]: colorScheme === 'gray' ? 'colors.gray.100' : bg.light,
+      [$bg.variable]: colorScheme === 'gray' ? 'colors.blackAlpha.100' : bg.light,
       _dark: {
         [$fg.variable]: colorScheme === 'gray' ? 'colors.whiteAlpha.800' : `colors.${ colorScheme }.200`,
-        [$bg.variable]: colorScheme === 'gray' ? 'colors.gray.800' : bg.dark,
+        [$bg.variable]: colorScheme === 'gray' ? 'colors.whiteAlpha.200' : bg.dark,
       },
     },
   };
diff --git a/theme/components/FormLabel.ts b/theme/components/FormLabel.ts
index 03f86537d6..c95f0e8e7a 100644
--- a/theme/components/FormLabel.ts
+++ b/theme/components/FormLabel.ts
@@ -1,5 +1,5 @@
 import { defineStyle, defineStyleConfig } from '@chakra-ui/styled-system';
-import { getColor, mode } from '@chakra-ui/theme-tools';
+import { getColor } from '@chakra-ui/theme-tools';
 
 import getDefaultFormColors from '../utils/getDefaultFormColors';
 
@@ -20,7 +20,7 @@ const baseStyle = defineStyle({
 const variantFloating = defineStyle((props) => {
   const { theme, backgroundColor } = props;
   const { focusPlaceholderColor } = getDefaultFormColors(props);
-  const bc = backgroundColor || mode('white', 'black')(props);
+  const bc = backgroundColor || 'transparent';
 
   return {
     left: '2px',
diff --git a/theme/global.ts b/theme/global.ts
index 5ddff6bcf7..e50b7eeaf6 100644
--- a/theme/global.ts
+++ b/theme/global.ts
@@ -2,6 +2,7 @@ import type { StyleFunctionProps } from '@chakra-ui/theme-tools';
 import { mode } from '@chakra-ui/theme-tools';
 
 import scrollbar from './foundations/scrollbar';
+import addressEntity from './globals/address-entity';
 import getDefaultTransitionProps from './utils/getDefaultTransitionProps';
 
 const global = (props: StyleFunctionProps) => ({
@@ -23,6 +24,7 @@ const global = (props: StyleFunctionProps) => ({
     w: '100%',
   },
   ...scrollbar(props),
+  ...addressEntity(props),
 });
 
 export default global;
diff --git a/theme/globals/address-entity.ts b/theme/globals/address-entity.ts
new file mode 100644
index 0000000000..25641c3020
--- /dev/null
+++ b/theme/globals/address-entity.ts
@@ -0,0 +1,37 @@
+import { mode } from '@chakra-ui/theme-tools';
+import type { StyleFunctionProps } from '@chakra-ui/theme-tools';
+
+const styles = (props: StyleFunctionProps) => {
+  return {
+    '.address-entity': {
+      '&.address-entity_highlighted': {
+        _before: {
+          content: `" "`,
+          position: 'absolute',
+          py: 1,
+          pl: 1,
+          pr: 0,
+          top: '-5px',
+          left: '-5px',
+          width: `100%`,
+          height: '100%',
+          borderRadius: 'base',
+          borderColor: mode('blue.200', 'blue.600')(props),
+          borderWidth: '1px',
+          borderStyle: 'dashed',
+          bgColor: mode('blue.50', 'blue.900')(props),
+          zIndex: -1,
+        },
+      },
+    },
+    '.address-entity_no-copy': {
+      '&.address-entity_highlighted': {
+        _before: {
+          pr: 2,
+        },
+      },
+    },
+  };
+};
+
+export default styles;
diff --git a/theme/utils/getOutlinedFieldStyles.ts b/theme/utils/getOutlinedFieldStyles.ts
index cae5060e4e..443249ecd1 100644
--- a/theme/utils/getOutlinedFieldStyles.ts
+++ b/theme/utils/getOutlinedFieldStyles.ts
@@ -49,6 +49,13 @@ export default function getOutlinedFieldStyles(props: StyleFunctionProps) {
     },
     // not filled input
     ':placeholder-shown:not(:focus-visible):not(:hover):not([aria-invalid=true])': { borderColor: borderColor || mode('gray.100', 'gray.700')(props) },
+
+    // not filled input with type="date"
+    ':not(:placeholder-shown)[value=""]:not(:focus-visible):not(:hover):not([aria-invalid=true])': {
+      borderColor: borderColor || mode('gray.100', 'gray.700')(props),
+      color: 'gray.500',
+    },
+
     ':-webkit-autofill': { transition: 'background-color 5000s ease-in-out 0s' },
     ':-webkit-autofill:hover': { transition: 'background-color 5000s ease-in-out 0s' },
     ':-webkit-autofill:focus': { transition: 'background-color 5000s ease-in-out 0s' },
diff --git a/tools/scripts/pw.docker.deps.sh b/tools/scripts/pw.docker.deps.sh
new file mode 100755
index 0000000000..719930361f
--- /dev/null
+++ b/tools/scripts/pw.docker.deps.sh
@@ -0,0 +1,3 @@
+#!/bin/bash
+
+yarn install --modules-folder node_modules_linux
diff --git a/tools/scripts/pw.docker.sh b/tools/scripts/pw.docker.sh
index 30179e8c4c..49c763f9ad 100755
--- a/tools/scripts/pw.docker.sh
+++ b/tools/scripts/pw.docker.sh
@@ -1,7 +1,5 @@
 #!/bin/bash
 
-yarn install --modules-folder node_modules_linux
-
 export NODE_PATH=$(pwd)/node_modules_linux
 
 yarn test:pw "$@"
diff --git a/tools/scripts/pw.sh b/tools/scripts/pw.sh
index 22aee344a2..0754f0be1e 100755
--- a/tools/scripts/pw.sh
+++ b/tools/scripts/pw.sh
@@ -10,7 +10,73 @@ dotenv \
 
 yarn svg:build-sprite
 
+# Check if the "--affected" argument is present in the script args
+check_affected_flag() {
+    local affected_flag=false
+
+    for arg in "$@"; do
+        if [[ "$arg" = "--affected"* ]]; then
+            # Extract the value after the equals sign
+            is_affected_value=${is_affected_arg#*=}
+
+            if [ "$is_affected_value" != "false" ]; then
+                affected_flag=true
+            fi
+            
+            break
+        fi
+    done
+
+    echo "$affected_flag"
+}
+
+# Remove the "--affected" argument from the script args
+filter_arguments() {
+    local args=()
+
+    for arg in "$@"; do
+        if [[ "$arg" != "--affected"* ]]; then
+            args+=("$arg")
+        fi
+    done
+
+    echo "${args[@]}"
+}
+
+get_files_to_run() {
+  local is_affected=$1
+  local files_to_run=""
+
+  if [ "$is_affected" = true ]; then
+      affected_tests_file="./playwright/affected-tests.txt"
+
+      if [ -f "$affected_tests_file" ]; then
+            file_content=$(<"$affected_tests_file")
+            files_to_run="${file_content//$'\n'/$' '}"
+
+            if [ -z "$files_to_run" ]; then
+                exit 1
+            fi
+      fi
+  fi
+
+  echo "$files_to_run"
+}
+
+args=$(filter_arguments "$@")
+affected_flag=$(check_affected_flag "$@")
+files_to_run=$(get_files_to_run "$affected_flag")
+if [ $? -eq 1 ]; then
+    echo "No affected tests found in the file. Exiting..."
+    exit 0
+fi
+
+echo "Running Playwright tests with the following arguments: $args"
+echo "Affected flag: $affected_flag"
+echo "Files to run: $files_to_run"
+
 dotenv \
   -v NODE_OPTIONS=\"--max-old-space-size=4096\" \
   -e $config_file \
-  -- playwright test -c playwright-ct.config.ts "$@"
+  -- playwright test -c playwright-ct.config.ts $files_to_run $args
+
diff --git a/types/api/account.ts b/types/api/account.ts
index 101b746ed0..0ae2eeb664 100644
--- a/types/api/account.ts
+++ b/types/api/account.ts
@@ -69,7 +69,7 @@ export type Transactions = Array<Transaction>
 export interface UserInfo {
   name?: string;
   nickname?: string;
-  email: string;
+  email: string | null;
   avatar?: string;
 }
 
diff --git a/types/api/address.ts b/types/api/address.ts
index 7edd55659e..37955b7f28 100644
--- a/types/api/address.ts
+++ b/types/api/address.ts
@@ -12,6 +12,7 @@ export interface Address extends UserTags {
   creator_address_hash: string | null;
   creation_tx_hash: string | null;
   exchange_rate: string | null;
+  ens_domain_name: string | null;
   // TODO: if we are happy with tabs-counters method, should we delete has_something fields?
   has_beacon_chain_withdrawals?: boolean;
   has_custom_methods_read: boolean;
@@ -38,7 +39,7 @@ export interface Address extends UserTags {
 export interface AddressCounters {
   transactions_count: string;
   token_transfers_count: string;
-  gas_usage_count: string;
+  gas_usage_count: string | null;
   validations_count: string | null;
 }
 
diff --git a/types/api/addressParams.ts b/types/api/addressParams.ts
index b2d8aa1ce2..fe8cb3d90c 100644
--- a/types/api/addressParams.ts
+++ b/types/api/addressParams.ts
@@ -15,10 +15,13 @@ export interface UserTags {
   public_tags: Array<AddressTag> | null;
 }
 
-export interface AddressParam extends UserTags {
+export type AddressParamBasic = {
   hash: string;
   implementation_name: string | null;
   name: string | null;
   is_contract: boolean;
   is_verified: boolean | null;
+  ens_domain_name: string | null;
 }
+
+export type AddressParam = UserTags & AddressParamBasic;
diff --git a/types/api/blobs.ts b/types/api/blobs.ts
new file mode 100644
index 0000000000..7b8abb55fd
--- /dev/null
+++ b/types/api/blobs.ts
@@ -0,0 +1,18 @@
+export interface TxBlob {
+  hash: string;
+  blob_data: string | null;
+  kzg_commitment: string | null;
+  kzg_proof: string | null;
+}
+
+export type TxBlobs = {
+  items: Array<TxBlob>;
+  next_page_params: null;
+};
+
+export interface Blob extends TxBlob {
+  transaction_hashes: Array<{
+    block_consensus: boolean;
+    transaction_hash: string;
+  }>;
+}
diff --git a/types/api/block.ts b/types/api/block.ts
index 9ab826c8c4..2fc14d2745 100644
--- a/types/api/block.ts
+++ b/types/api/block.ts
@@ -2,6 +2,8 @@ import type { AddressParam } from 'types/api/addressParams';
 import type { Reward } from 'types/api/reward';
 import type { Transaction } from 'types/api/transaction';
 
+import type { ZkSyncBatchesItem } from './zkSyncL2';
+
 export type BlockType = 'block' | 'reorg' | 'uncle';
 
 export interface Block {
@@ -13,7 +15,7 @@ export interface Block {
   hash: string;
   parent_hash: string;
   difficulty: string;
-  total_difficulty: string;
+  total_difficulty: string | null;
   gas_used: string | null;
   gas_limit: string;
   nonce: string;
@@ -36,6 +38,16 @@ export interface Block {
   bitcoin_merged_mining_merkle_proof?: string | null;
   hash_for_merged_mining?: string | null;
   minimum_gas_price?: string | null;
+  // BLOB FIELDS
+  blob_gas_price?: string;
+  blob_gas_used?: string;
+  burnt_blob_fees?: string;
+  excess_blob_gas?: string;
+  blob_tx_count?: number;
+  // ZKSYNC FIELDS
+  zksync?: Omit<ZkSyncBatchesItem, 'number' | 'tx_count' | 'timestamp'> & {
+    'batch_number': number | null;
+  };
 }
 
 export interface BlocksResponse {
@@ -69,7 +81,7 @@ export type BlockWithdrawalsResponse = {
   next_page_params: {
     index: number;
     items_count: number;
-  };
+  } | null;
 }
 
 export type BlockWithdrawalsItem = {
diff --git a/types/api/charts.ts b/types/api/charts.ts
index 5414f68e60..5d74b38410 100644
--- a/types/api/charts.ts
+++ b/types/api/charts.ts
@@ -1,12 +1,12 @@
 export interface ChartTransactionItem {
   date: string;
-  tx_count: number;
+  tx_count: number | null;
 }
 
 export interface ChartMarketItem {
   date: string;
-  closing_price: string;
-  market_cap?: string;
+  closing_price: string | null;
+  market_cap?: string | null;
   tvl?: string | null;
 }
 
diff --git a/types/api/contract.ts b/types/api/contract.ts
index dd66d0380f..fb85eb9bdf 100644
--- a/types/api/contract.ts
+++ b/types/api/contract.ts
@@ -3,6 +3,22 @@ import type { Abi, AbiType } from 'abitype';
 export type SmartContractMethodArgType = AbiType;
 export type SmartContractMethodStateMutability = 'view' | 'nonpayable' | 'payable';
 
+export type SmartContractLicenseType =
+'none' |
+'unlicense' |
+'mit' |
+'gnu_gpl_v2' |
+'gnu_gpl_v3' |
+'gnu_lgpl_v2_1' |
+'gnu_lgpl_v3' |
+'bsd_2_clause' |
+'bsd_3_clause' |
+'mpl_2_0' |
+'osl_3_0' |
+'apache_2_0' |
+'gnu_agpl_v3' |
+'bsl_1_1';
+
 export interface SmartContract {
   deployed_bytecode: string | null;
   creation_bytecode: string | null;
@@ -37,6 +53,7 @@ export interface SmartContract {
   verified_twin_address_hash: string | null;
   minimal_proxy_address_hash: string | null;
   language: string | null;
+  license_type: SmartContractLicenseType | null;
 }
 
 export type SmartContractDecodedConstructorArg = [
@@ -55,19 +72,18 @@ export interface SmartContractExternalLibrary {
 
 export interface SmartContractMethodBase {
   inputs: Array<SmartContractMethodInput>;
-  outputs: Array<SmartContractMethodOutput>;
+  outputs?: Array<SmartContractMethodOutput>;
   constant: boolean;
   name: string;
   stateMutability: SmartContractMethodStateMutability;
   type: 'function';
   payable: boolean;
   error?: string;
-}
-
-export interface SmartContractReadMethod extends SmartContractMethodBase {
   method_id: string;
 }
 
+export type SmartContractReadMethod = SmartContractMethodBase;
+
 export interface SmartContractWriteFallback {
   payable?: true;
   stateMutability: 'payable';
@@ -85,7 +101,7 @@ export type SmartContractWriteMethod = SmartContractMethodBase | SmartContractWr
 export type SmartContractMethod = SmartContractReadMethod | SmartContractWriteMethod;
 
 export interface SmartContractMethodInput {
-  internalType?: SmartContractMethodArgType;
+  internalType?: string; // there could be any string, e.g "enum MyEnum"
   name: string;
   type: SmartContractMethodArgType;
   components?: Array<SmartContractMethodInput>;
@@ -137,6 +153,7 @@ export interface SmartContractVerificationConfigRaw {
   vyper_compiler_versions: Array<string>;
   vyper_evm_versions: Array<string>;
   is_rust_verifier_microservice_enabled: boolean;
+  license_types: Record<SmartContractLicenseType, number>;
 }
 
 export interface SmartContractVerificationConfig extends SmartContractVerificationConfigRaw {
@@ -161,6 +178,7 @@ export interface SmartContractVerificationError {
 
 export type SolidityscanReport = {
   scan_report: {
+    contractname: string;
     scan_status: string;
     scan_summary: {
       issue_severity_distribution: {
@@ -180,3 +198,26 @@ export type SolidityscanReport = {
     scanner_reference_url: string;
   };
 }
+
+type SmartContractSecurityAudit = {
+  audit_company_name: string;
+  audit_publish_date: string;
+  audit_report_url: string;
+}
+
+export type SmartContractSecurityAudits = {
+  items: Array<SmartContractSecurityAudit>;
+}
+
+export type SmartContractSecurityAuditSubmission = {
+  'address_hash': string;
+  'submitter_name': string;
+  'submitter_email': string;
+  'is_project_owner': boolean;
+  'project_name': string;
+  'project_url': string;
+  'audit_company_name': string;
+  'audit_report_url': string;
+  'audit_publish_date': string;
+  'comment'?: string;
+}
diff --git a/types/api/contracts.ts b/types/api/contracts.ts
index e075f038f0..65fe537568 100644
--- a/types/api/contracts.ts
+++ b/types/api/contracts.ts
@@ -1,4 +1,5 @@
 import type { AddressParam } from './addressParams';
+import type { SmartContractLicenseType } from './contract';
 
 export interface VerifiedContract {
   address: AddressParam;
@@ -10,6 +11,7 @@ export interface VerifiedContract {
   tx_count: number | null;
   verified_at: string;
   market_cap: string | null;
+  license_type: SmartContractLicenseType | null;
 }
 
 export interface VerifiedContractsResponse {
diff --git a/types/api/ens.ts b/types/api/ens.ts
new file mode 100644
index 0000000000..6ee12f846b
--- /dev/null
+++ b/types/api/ens.ts
@@ -0,0 +1,71 @@
+export interface EnsDomain {
+  id: string;
+  name: string;
+  resolved_address: {
+    hash: string;
+  } | null;
+  owner: {
+    hash: string;
+  } | null;
+  wrapped_owner: {
+    hash: string;
+  } | null;
+  registration_date?: string;
+  expiry_date: string | null;
+}
+
+export interface EnsDomainDetailed extends EnsDomain {
+  tokens: Array<{ id: string; contract_hash: string; type: 'NATIVE_DOMAIN_TOKEN' | 'WRAPPED_DOMAIN_TOKEN' }>;
+  registrant: {
+    hash: string;
+  } | null;
+  other_addresses: Record<string, string>;
+}
+
+export interface EnsDomainEvent {
+  transaction_hash: string;
+  timestamp: string;
+  from_address: {
+    hash: string;
+  } | null;
+  action?: string;
+}
+
+export interface EnsAddressLookupResponse {
+  items: Array<EnsDomain>;
+  next_page_params: {
+    page_token: string;
+    page_size: number;
+  } | null;
+}
+
+export interface EnsDomainEventsResponse {
+  items: Array<EnsDomainEvent>;
+}
+
+export interface EnsDomainLookupResponse {
+  items: Array<EnsDomain>;
+  next_page_params: {
+    page_token: string;
+    page_size: number;
+  } | null;
+}
+
+export interface EnsAddressLookupFilters {
+  address: string | null;
+  resolved_to: boolean;
+  owned_by: boolean;
+  only_active: boolean;
+}
+
+export interface EnsDomainLookupFilters {
+  name: string | null;
+  only_active: boolean;
+}
+
+export interface EnsLookupSorting {
+  sort: 'registration_date';
+  order: 'ASC' | 'DESC';
+}
+
+export type EnsDomainLookupFiltersOptions = Array<'resolved_to' | 'owned_by' | 'with_inactive'>;
diff --git a/types/api/l2Deposits.ts b/types/api/l2Deposits.ts
deleted file mode 100644
index 1704414da5..0000000000
--- a/types/api/l2Deposits.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-export type L2DepositsItem = {
-  l1_block_number: number;
-  l1_tx_hash: string;
-  l1_block_timestamp: string;
-  l1_tx_origin: string;
-  l2_tx_gas_limit: string;
-  l2_tx_hash: string;
-}
-
-export type L2DepositsResponse = {
-  items: Array<L2DepositsItem>;
-  next_page_params: {
-    items_count: number;
-    l1_block_number: number;
-    tx_hash: string;
-  };
-}
diff --git a/types/api/l2OutputRoots.ts b/types/api/l2OutputRoots.ts
deleted file mode 100644
index 8bcfe07d75..0000000000
--- a/types/api/l2OutputRoots.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-export type L2OutputRootsItem = {
-  l1_block_number: number;
-  l1_timestamp: string;
-  l1_tx_hash: string;
-  l2_block_number: number;
-  l2_output_index: number;
-  output_root: string;
-}
-
-export type L2OutputRootsResponse = {
-  items: Array<L2OutputRootsItem>;
-  next_page_params: {
-    index: number;
-    items_count: number;
-  };
-}
diff --git a/types/api/l2TxnBatches.ts b/types/api/l2TxnBatches.ts
deleted file mode 100644
index 62f320e14e..0000000000
--- a/types/api/l2TxnBatches.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-export type L2TxnBatchesItem = {
-  epoch_number: number;
-  l1_tx_hashes: Array<string>;
-  l1_timestamp: string;
-  l2_block_number: number;
-  tx_count: number;
-}
-
-export type L2TxnBatchesResponse = {
-  items: Array<L2TxnBatchesItem>;
-  next_page_params: {
-    block_number: number;
-    items_count: number;
-  };
-}
diff --git a/types/api/l2Withdrawals.ts b/types/api/l2Withdrawals.ts
deleted file mode 100644
index e9a9103e79..0000000000
--- a/types/api/l2Withdrawals.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import type { AddressParam } from './addressParams';
-
-export type L2WithdrawalsItem = {
-  'challenge_period_end': string | null;
-  'from': AddressParam | null;
-  'l1_tx_hash': string | null;
-  'l2_timestamp': string | null;
-  'l2_tx_hash': string;
-  'msg_nonce': number;
-  'msg_nonce_version': number;
-  'status': string;
-}
-
-export const WITHDRAWAL_STATUSES = [
-  'Waiting for state root',
-  'Ready to prove',
-  'In challenge period',
-  'Ready for relay',
-  'Relayed',
-] as const;
-
-export type L2WithdrawalStatus = typeof WITHDRAWAL_STATUSES[number];
-
-export type L2WithdrawalsResponse = {
-  items: Array<L2WithdrawalsItem>;
-  'next_page_params': {
-    'items_count': number;
-    'nonce': string;
-  };
-}
diff --git a/types/api/noves.ts b/types/api/noves.ts
new file mode 100644
index 0000000000..1d4b396716
--- /dev/null
+++ b/types/api/noves.ts
@@ -0,0 +1,124 @@
+export interface NovesResponseData {
+  txTypeVersion: number;
+  chain: string;
+  accountAddress: string;
+  classificationData: NovesClassificationData;
+  rawTransactionData: NovesRawTransactionData;
+}
+
+export interface NovesClassificationData {
+  type: string;
+  typeFormatted?: string;
+  description: string;
+  sent: Array<NovesSentReceived>;
+  received: Array<NovesSentReceived>;
+  approved?: Approved;
+  protocol?: {
+    name: string | null;
+  };
+  source: {
+    type: string | null;
+  };
+  message?: string;
+}
+
+export interface Approved {
+  amount: string;
+  spender: string;
+  token?: NovesToken;
+  nft?: NovesNft;
+}
+
+export interface NovesSentReceived {
+  action: string;
+  actionFormatted?: string;
+  amount: string;
+  to: NovesTo;
+  from: NovesFrom;
+  token?: NovesToken;
+  nft?: NovesNft;
+}
+
+export interface NovesToken {
+  symbol: string;
+  name: string;
+  decimals: number;
+  address: string;
+  id?: string;
+}
+
+export interface NovesNft {
+  name: string;
+  id: string;
+  symbol: string;
+  address: string;
+}
+
+export interface NovesFrom {
+  name: string | null;
+  address: string;
+}
+
+export interface NovesTo {
+  name: string | null;
+  address: string | null;
+}
+
+export interface NovesRawTransactionData {
+  transactionHash: string;
+  fromAddress: string;
+  toAddress: string;
+  blockNumber: number;
+  gas: number;
+  gasPrice: number;
+  transactionFee: NovesTransactionFee | number;
+  timestamp: number;
+}
+
+export interface NovesTransactionFee {
+  amount: string;
+  currency?: string;
+  token?: {
+    decimals: number;
+    symbol: string;
+  };
+}
+
+export interface NovesAccountHistoryResponse {
+  hasNextPage: boolean;
+  items: Array<NovesResponseData>;
+  pageNumber: number;
+  pageSize: number;
+  next_page_params?: {
+    startBlock: string;
+    endBlock: string;
+    pageNumber: number;
+    pageSize: number;
+    ignoreTransactions: string;
+    viewAsAccountAddress: string;
+  };
+}
+
+export const NovesHistoryFilterValues = [ 'received', 'sent' ] as const;
+
+export type NovesHistoryFilterValue = typeof NovesHistoryFilterValues[number] | undefined;
+
+export interface NovesHistoryFilters {
+  filter?: NovesHistoryFilterValue;
+}
+
+export interface NovesDescribeResponse {
+  type: string;
+  description: string;
+}
+
+export interface NovesDescribeTxsResponse {
+  txHash: string;
+  type: string;
+  description: string;
+}[];
+
+export interface NovesTxTranslation {
+  data?: NovesDescribeTxsResponse;
+  isLoading: boolean;
+}
diff --git a/types/api/optimisticL2.ts b/types/api/optimisticL2.ts
new file mode 100644
index 0000000000..0d9496d69c
--- /dev/null
+++ b/types/api/optimisticL2.ts
@@ -0,0 +1,80 @@
+import type { AddressParam } from './addressParams';
+
+export type OptimisticL2DepositsItem = {
+  l1_block_number: number;
+  l1_tx_hash: string;
+  l1_block_timestamp: string;
+  l1_tx_origin: string;
+  l2_tx_gas_limit: string;
+  l2_tx_hash: string;
+}
+
+export type OptimisticL2DepositsResponse = {
+  items: Array<OptimisticL2DepositsItem>;
+  next_page_params: {
+    items_count: number;
+    l1_block_number: number;
+    tx_hash: string;
+  };
+}
+
+export type OptimisticL2OutputRootsItem = {
+  l1_block_number: number;
+  l1_timestamp: string;
+  l1_tx_hash: string;
+  l2_block_number: number;
+  l2_output_index: number;
+  output_root: string;
+}
+
+export type OptimisticL2OutputRootsResponse = {
+  items: Array<OptimisticL2OutputRootsItem>;
+  next_page_params: {
+    index: number;
+    items_count: number;
+  };
+}
+
+export type OptimisticL2TxnBatchesItem = {
+  l1_tx_hashes: Array<string>;
+  l1_timestamp: string;
+  l2_block_number: number;
+  tx_count: number;
+}
+
+export type OptimisticL2TxnBatchesResponse = {
+  items: Array<OptimisticL2TxnBatchesItem>;
+  next_page_params: {
+    block_number: number;
+    items_count: number;
+  };
+}
+
+export type OptimisticL2WithdrawalsItem = {
+  'challenge_period_end': string | null;
+  'from': AddressParam | null;
+  'l1_tx_hash': string | null;
+  'l2_timestamp': string | null;
+  'l2_tx_hash': string;
+  'msg_nonce': number;
+  'msg_nonce_version': number;
+  'status': string;
+}
+
+export const WITHDRAWAL_STATUSES = [
+  'Waiting for state root',
+  'Ready to prove',
+  'In challenge period',
+  'Ready for relay',
+  'Relayed',
+] as const;
+
+export type OptimisticL2WithdrawalStatus = typeof WITHDRAWAL_STATUSES[number];
+
+export type OptimisticL2WithdrawalsResponse = {
+  items: Array<OptimisticL2WithdrawalsItem>;
+  'next_page_params': {
+    'items_count': number;
+    'nonce': string;
+  };
+}
diff --git a/types/api/search.ts b/types/api/search.ts
index 46467c3e39..aee756023a 100644
--- a/types/api/search.ts
+++ b/types/api/search.ts
@@ -23,6 +23,12 @@ export interface SearchResultAddressOrContractOrUniversalProfile {
   address: string;
   is_smart_contract_verified: boolean;
   url?: string; // not used by the frontend, we build the url ourselves
+  ens_info?: {
+    address_hash: string;
+    expiry_date?: string;
+    name: string;
+    names_count: number;
+  };
 }
 
 export interface SearchResultLabel {
@@ -35,7 +41,7 @@ export interface SearchResultLabel {
 
 export interface SearchResultBlock {
   type: 'block';
-  block_type?: 'block' | 'reorg';
+  block_type?: 'block' | 'reorg' | 'uncle';
   block_number: number | string;
   block_hash: string;
   timestamp: string;
@@ -49,12 +55,26 @@ export interface SearchResultTx {
   url?: string; // not used by the frontend, we build the url ourselves
 }
 
-export type SearchResultItem =
-    SearchResultToken |
-    SearchResultAddressOrContractOrUniversalProfile |
-    SearchResultBlock |
-    SearchResultTx |
-    SearchResultLabel
+export interface SearchResultBlob {
+  type: 'blob';
+  blob_hash: string;
+  timestamp: null;
+}
+
+export interface SearchResultUserOp {
+  type: 'user_operation';
+  user_operation_hash: string;
+  timestamp: string;
+  url?: string; // not used by the frontend, we build the url ourselves
+}
+
+export type SearchResultItem = SearchResultToken |
+SearchResultAddressOrContractOrUniversalProfile |
+SearchResultBlock |
+SearchResultTx |
+SearchResultLabel |
+SearchResultUserOp |
+SearchResultBlob;
 
 export interface SearchResult {
   items: Array<SearchResultItem>;
@@ -78,5 +98,5 @@ export interface SearchResultFilters {
 export interface SearchRedirectResult {
   parameter: string | null;
   redirect: boolean;
-  type: 'address' | 'block' | 'transaction' | null;
+  type: 'address' | 'block' | 'transaction' | 'user_operation' | 'blob' | null;
 }
diff --git a/types/api/shibarium.ts b/types/api/shibarium.ts
new file mode 100644
index 0000000000..e23d9cf811
--- /dev/null
+++ b/types/api/shibarium.ts
@@ -0,0 +1,33 @@
+import type { AddressParam } from './addressParams';
+
+export type ShibariumDepositsItem = {
+  l1_block_number: number;
+  l1_transaction_hash: string;
+  l2_transaction_hash: string;
+  timestamp: string;
+  user: AddressParam | string;
+}
+
+export type ShibariumDepositsResponse = {
+  items: Array<ShibariumDepositsItem>;
+  next_page_params: {
+    items_count: number;
+    block_number: number;
+  };
+}
+
+export type ShibariumWithdrawalsItem = {
+  l1_transaction_hash: string;
+  l2_block_number: number;
+  l2_transaction_hash: string;
+  timestamp: string;
+  user: AddressParam | string;
+}
+
+export type ShibariumWithdrawalsResponse = {
+  items: Array<ShibariumWithdrawalsItem>;
+  next_page_params: {
+    items_count: number;
+    block_number: number;
+  };
+}
diff --git a/types/api/stats.ts b/types/api/stats.ts
index 7ce179368f..40fe7d34e2 100644
--- a/types/api/stats.ts
+++ b/types/api/stats.ts
@@ -4,10 +4,13 @@ export type HomeStats = {
   total_transactions: string;
   average_block_time: number;
   coin_price: string | null;
+  coin_price_change_percentage: number | null; // e.g -6.22
   total_gas_used: string;
   transactions_today: string;
   gas_used_today: string;
   gas_prices: GasPrices | null;
+  gas_price_updated_at: string | null;
+  gas_prices_update_in: number;
   static_gas_price: string | null;
   market_cap: string;
   network_utilization_percentage: number;
@@ -16,9 +19,17 @@ export type HomeStats = {
 }
 
 export type GasPrices = {
-  average: number | null;
-  fast: number | null;
-  slow: number | null;
+  average: GasPriceInfo | null;
+  fast: GasPriceInfo | null;
+  slow: GasPriceInfo | null;
+}
+
+export interface GasPriceInfo {
+  fiat_price: string | null;
+  price: number | null;
+  time: number | null;
+  base_fee: number | null;
+  priority_fee: number | null;
 }
 
 export type Counters = {
diff --git a/types/api/token.ts b/types/api/token.ts
index 417c74aab6..7cae408f7d 100644
--- a/types/api/token.ts
+++ b/types/api/token.ts
@@ -1,7 +1,7 @@
 import type { TokenInfoApplication } from './account';
 import type { AddressParam } from './addressParams';
 
-export type NFTTokenType = 'ERC-721' | 'ERC-1155';
+export type NFTTokenType = 'ERC-721' | 'ERC-1155' | 'ERC-404';
 export type TokenType = 'ERC-20' | NFTTokenType;
 
 export interface TokenInfo<T extends TokenType = TokenType> {
@@ -39,12 +39,9 @@ export type TokenHolderBase = {
   value: string;
 }
 
-export type TokenHolderERC20ERC721 = TokenHolderBase & {
-  token: TokenInfo<'ERC-20'> | TokenInfo<'ERC-721'>;
-}
+export type TokenHolderERC20ERC721 = TokenHolderBase
 
 export type TokenHolderERC1155 = TokenHolderBase & {
-  token: TokenInfo<'ERC-1155'>;
   token_id: string;
 }
 
diff --git a/types/api/tokenTransfer.ts b/types/api/tokenTransfer.ts
index b1100db636..d0feaa7e2d 100644
--- a/types/api/tokenTransfer.ts
+++ b/types/api/tokenTransfer.ts
@@ -7,15 +7,22 @@ export type Erc20TotalPayload = {
 }
 
 export type Erc721TotalPayload = {
-  token_id: string;
+  token_id: string | null;
 }
 
 export type Erc1155TotalPayload = {
   decimals: string | null;
   value: string;
-  token_id: string;
+  token_id: string | null;
 }
 
+export type Erc404TotalPayload = {
+  decimals: string | null;
+  value: string | null;
+} | {
+  token_id: string | null;
+};
+
 export type TokenTransfer = (
   {
     token: TokenInfo<'ERC-20'>;
@@ -28,6 +35,10 @@ export type TokenTransfer = (
   {
     token: TokenInfo<'ERC-1155'>;
     total: Erc1155TotalPayload;
+  } |
+  {
+    token: TokenInfo<'ERC-404'>;
+    total: Erc404TotalPayload;
   }
 ) & TokenTransferBase
 
diff --git a/types/api/transaction.ts b/types/api/transaction.ts
index c76f2f9a19..8f1fee017e 100644
--- a/types/api/transaction.ts
+++ b/types/api/transaction.ts
@@ -2,10 +2,12 @@ import type { AddressParam } from './addressParams';
 import type { BlockTransactionsResponse } from './block';
 import type { DecodedInput } from './decodedInput';
 import type { Fee } from './fee';
-import type { L2WithdrawalStatus } from './l2Withdrawals';
+import type { NovesTxTranslation } from './noves';
+import type { OptimisticL2WithdrawalStatus } from './optimisticL2';
 import type { TokenInfo } from './token';
 import type { TokenTransfer } from './tokenTransfer';
 import type { TxAction } from './txAction';
+import type { ZkSyncBatchesItem } from './zkSyncL2';
 
 export type TransactionRevertReason = {
   raw: string;
@@ -14,20 +16,26 @@ export type TransactionRevertReason = {
 type WrappedTransactionFields = 'decoded_input' | 'fee' | 'gas_limit' | 'gas_price' | 'hash' | 'max_fee_per_gas' |
 'max_priority_fee_per_gas' | 'method' | 'nonce' | 'raw_input' | 'to' | 'type' | 'value';
 
+export interface OpWithdrawal {
+  l1_transaction_hash: string;
+  nonce: number;
+  status: OptimisticL2WithdrawalStatus;
+}
+
 export type Transaction = {
   to: AddressParam | null;
   created_contract: AddressParam | null;
   hash: string;
   result: string;
   confirmations: number;
-  status: 'ok' | 'error' | null;
+  status: 'ok' | 'error' | null | undefined;
   block: number | null;
   timestamp: string | null;
-  confirmation_duration: Array<number>;
+  confirmation_duration: Array<number> | null;
   from: AddressParam;
   value: string;
   fee: Fee;
-  gas_price: string;
+  gas_price: string | null;
   type: number | null;
   gas_used: string | null;
   gas_limit: string;
@@ -43,7 +51,7 @@ export type Transaction = {
   decoded_input: DecodedInput | null;
   token_transfers: Array<TokenTransfer> | null;
   token_transfers_overflow: boolean;
-  exchange_rate: string;
+  exchange_rate: string | null;
   method: string | null;
   tx_types: Array<TransactionType>;
   tx_tag: string | null;
@@ -54,8 +62,7 @@ export type Transaction = {
   l1_gas_used?: string;
   has_error_in_internal_txs: boolean | null;
   // optimism fields
-  op_withdrawal_status?: L2WithdrawalStatus;
-  op_l1_transaction_hash?: string;
+  op_withdrawals?: Array<OpWithdrawal>;
   // SUAVE fields
   execution_node?: AddressParam | null;
   allowed_peekers?: Array<string>;
@@ -74,6 +81,18 @@ export type Transaction = {
   zkevm_batch_number?: number;
   zkevm_status?: typeof ZKEVM_L2_TX_STATUSES[number];
   zkevm_sequence_hash?: string;
+  // zkSync FIELDS
+  zksync?: Omit<ZkSyncBatchesItem, 'number' | 'tx_count' | 'timestamp'> & {
+    'batch_number': number | null;
+  };
+  // blob tx fields
+  blob_versioned_hashes?: Array<string>;
+  blob_gas_used?: string;
+  blob_gas_price?: string;
+  burnt_blob_fee?: string;
+  max_fee_per_blob_gas?: string;
+  // Noves-fi
+  translation?: NovesTxTranslation;
 }
 
 export const ZKEVM_L2_TX_STATUSES = [ 'Confirmed by Sequencer', 'L1 Confirmed' ];
@@ -99,6 +118,15 @@ export interface TransactionsResponsePending {
   } | null;
 }
 
+export interface TransactionsResponseWithBlobs {
+  items: Array<Transaction>;
+  next_page_params: {
+    block_number: number;
+    index: number;
+    items_count: number;
+  } | null;
+}
+
 export interface TransactionsResponseWatchlist {
   items: Array<Transaction>;
   next_page_params: {
@@ -114,7 +142,8 @@ export type TransactionType = 'rootstock_remasc' |
 'contract_creation' |
 'contract_call' |
 'token_creation' |
-'coin_transfer'
+'coin_transfer' |
+'blob_transaction'
 
 export type TxsResponse = TransactionsResponseValidated | TransactionsResponsePending | BlockTransactionsResponse;
 
diff --git a/types/api/txInterpretation.ts b/types/api/txInterpretation.ts
index be9393203f..87ef1d0dae 100644
--- a/types/api/txInterpretation.ts
+++ b/types/api/txInterpretation.ts
@@ -17,9 +17,11 @@ export type TxInterpretationVariable =
   TxInterpretationVariableCurrency |
   TxInterpretationVariableTimestamp |
   TxInterpretationVariableToken |
-  TxInterpretationVariableAddress;
+  TxInterpretationVariableAddress |
+  TxInterpretationVariableDomain |
+  TxInterpretationVariableMethod;
 
-export type TxInterpretationVariableType = 'string' | 'currency' | 'timestamp' | 'token' | 'address';
+export type TxInterpretationVariableType = 'string' | 'currency' | 'timestamp' | 'token' | 'address' | 'domain' | 'method';
 
 export type TxInterpretationVariableString = {
   type: 'string';
@@ -45,3 +47,13 @@ export type TxInterpretationVariableAddress = {
   type: 'address';
   value: AddressParam;
 }
+
+export type TxInterpretationVariableDomain = {
+  type: 'domain';
+  value: string;
+}
+
+export type TxInterpretationVariableMethod = {
+  type: 'method';
+  value: string;
+}
diff --git a/types/api/txStateChanges.ts b/types/api/txStateChanges.ts
index 459f196aff..284a921699 100644
--- a/types/api/txStateChanges.ts
+++ b/types/api/txStateChanges.ts
@@ -41,6 +41,13 @@ export interface TxStateChangeTokenErc1155 {
   token_id: string;
 }
 
+export interface TxStateChangeTokenErc404 {
+  type: 'token';
+  token: TokenInfo<'ERC-404'>;
+  change: string;
+  token_id: string;
+}
+
 export type TxStateChanges = {
   items: Array<TxStateChange>;
   next_page_params: {
diff --git a/types/api/txsFilters.ts b/types/api/txsFilters.ts
index e34cef83f8..17347c9cdc 100644
--- a/types/api/txsFilters.ts
+++ b/types/api/txsFilters.ts
@@ -4,6 +4,10 @@ export type TTxsFilters = {
   method?: Array<MethodFilter>;
 }
 
-export type TypeFilter = 'token_transfer' | 'contract_creation' | 'contract_call' | 'coin_transfer' | 'token_creation';
+export type TTxsWithBlobsFilters = {
+  type: 'blob_transaction';
+}
+
+export type TypeFilter = 'token_transfer' | 'contract_creation' | 'contract_call' | 'coin_transfer' | 'token_creation' | 'blob_transaction';
 
 export type MethodFilter = 'approve' | 'transfer' | 'multicall' | 'mint' | 'commit';
diff --git a/types/api/userOps.ts b/types/api/userOps.ts
new file mode 100644
index 0000000000..7223f7f68e
--- /dev/null
+++ b/types/api/userOps.ts
@@ -0,0 +1,77 @@
+import type { AddressParamBasic } from './addressParams';
+
+export type UserOpsItem = {
+  hash: string;
+  block_number: string;
+  transaction_hash: string;
+  address: string | AddressParamBasic;
+  timestamp: string;
+  status: boolean;
+  fee: string;
+}
+
+export type UserOpsResponse = {
+  items: Array<UserOpsItem>;
+  next_page_params: {
+    page_token: string;
+    page_size: number;
+  } | null;
+}
+
+export type UserOpSponsorType = 'paymaster_hybrid' | 'paymaster_sponsor' | 'wallet_balance' | 'wallet_deposit';
+
+export type UserOp = {
+  hash: string;
+  sender: string | AddressParamBasic;
+  status: boolean;
+  revert_reason: string | null;
+  timestamp: string | null;
+  fee: string;
+  gas: string;
+  transaction_hash: string;
+  block_number: string;
+  block_hash: string;
+  entry_point: string | AddressParamBasic;
+  call_gas_limit: string;
+  verification_gas_limit: string;
+  pre_verification_gas: string;
+  max_fee_per_gas: string;
+  max_priority_fee_per_gas: string;
+  aggregator: string | null;
+  aggregator_signature: string | null;
+  bundler: string | AddressParamBasic;
+  factory: string | null;
+  paymaster: string | AddressParamBasic | null;
+  sponsor_type: UserOpSponsorType;
+  signature: string;
+  nonce: string;
+  call_data: string;
+  user_logs_start_index: number;
+  user_logs_count: number;
+  raw: {
+    account_gas_limits?: string;
+    call_data: string;
+    call_gas_limit: string;
+    gas_fees?: string;
+    init_code: string;
+    max_fee_per_gas: string;
+    max_priority_fee_per_gas: string;
+    nonce: string;
+    paymaster_and_data: string;
+    pre_verification_gas: string;
+    sender: string;
+    signature: string;
+    verification_gas_limit: string;
+  };
+  gas_price: string;
+  gas_used: string;
+}
+
+export type UserOpsFilters = {
+  transaction_hash?: string;
+  sender?: string;
+}
+
+export type UserOpsAccount = {
+  total_ops: number;
+}
diff --git a/types/api/validators.ts b/types/api/validators.ts
new file mode 100644
index 0000000000..ad6e33de96
--- /dev/null
+++ b/types/api/validators.ts
@@ -0,0 +1,38 @@
+import type { AddressParam } from './addressParams';
+
+export interface Validator {
+  address: AddressParam;
+  blocks_validated_count: number;
+  state: 'active' | 'probation' | 'inactive';
+}
+
+export interface ValidatorsResponse {
+  items: Array<Validator>;
+  next_page_params: {
+    'address_hash': string;
+    'blocks_validated': string;
+    'items_count': string;
+    'state': Validator['state'];
+  } | null;
+}
+
+export interface ValidatorsCountersResponse {
+  active_validators_counter: string;
+  active_validators_percentage: number;
+  new_validators_counter_24h: string;
+  validators_counter: string;
+}
+
+export interface ValidatorsFilters {
+  // address_hash: string | undefined; // right now API doesn't support filtering by address_hash
+  state_filter: Validator['state'] | undefined;
+}
+
+export interface ValidatorsSorting {
+  sort: 'state' | 'blocks_validated';
+  order: 'asc' | 'desc';
+}
+
+export type ValidatorsSortingField = ValidatorsSorting['sort'];
+
+export type ValidatorsSortingValue = `${ ValidatorsSortingField }-${ ValidatorsSorting['order'] }`;
diff --git a/types/api/zkEvmL2TxnBatches.ts b/types/api/zkEvmL2.ts
similarity index 94%
rename from types/api/zkEvmL2TxnBatches.ts
rename to types/api/zkEvmL2.ts
index 3a82b375ae..df80185cf6 100644
--- a/types/api/zkEvmL2TxnBatches.ts
+++ b/types/api/zkEvmL2.ts
@@ -5,7 +5,7 @@ export type ZkEvmL2TxnBatchesItem = {
   verify_tx_hash: string | null;
   sequence_tx_hash: string | null;
   status: string;
-  timestamp: string;
+  timestamp: string | null;
   tx_count: number;
 }
 
@@ -26,7 +26,7 @@ export type ZkEvmL2TxnBatch = {
   sequence_tx_hash: string;
   state_root: string;
   status: typeof ZKEVM_L2_TX_BATCH_STATUSES[number];
-  timestamp: string;
+  timestamp: string | null;
   transactions: Array<string>;
   verify_tx_hash: string;
 }
diff --git a/types/api/zkSyncL2.ts b/types/api/zkSyncL2.ts
new file mode 100644
index 0000000000..4d038477ff
--- /dev/null
+++ b/types/api/zkSyncL2.ts
@@ -0,0 +1,52 @@
+import type { Transaction } from './transaction';
+
+export const ZKSYNC_L2_TX_BATCH_STATUSES = [
+  'Processed on L2' as const,
+  'Sealed on L2' as const,
+  'Sent to L1' as const,
+  'Validated on L1' as const,
+  'Executed on L1' as const,
+];
+
+export type ZkSyncBatchStatus = typeof ZKSYNC_L2_TX_BATCH_STATUSES[number];
+
+export interface ZkSyncBatchesItem {
+  commit_transaction_hash: string | null;
+  commit_transaction_timestamp: string | null;
+  execute_transaction_hash: string | null;
+  execute_transaction_timestamp: string | null;
+  number: number;
+  prove_transaction_hash: string | null;
+  prove_transaction_timestamp: string | null;
+  status: ZkSyncBatchStatus;
+  timestamp: string;
+  tx_count: number;
+}
+
+export type ZkSyncBatchesResponse = {
+  items: Array<ZkSyncBatchesItem>;
+  next_page_params: {
+    number: number;
+    items_count: number;
+  } | null;
+}
+
+export interface ZkSyncBatch extends Omit<ZkSyncBatchesItem, 'tx_count'> {
+  start_block: number;
+  end_block: number;
+  l1_gas_price: string;
+  l1_tx_count: number;
+  l2_fair_gas_price: string;
+  l2_tx_count: number;
+  root_hash: string;
+}
+
+export type ZkSyncBatchTxs = {
+  items: Array<Transaction>;
+  next_page_params: {
+    batch_number: string;
+    block_number: number;
+    index: number;
+    items_count: number;
+  } | null;
+}
diff --git a/types/client/adProviders.ts b/types/client/adProviders.ts
index 0ae135eff9..ac0418496d 100644
--- a/types/client/adProviders.ts
+++ b/types/client/adProviders.ts
@@ -1,7 +1,10 @@
 import type { ArrayElement } from 'types/utils';
 
-export const SUPPORTED_AD_BANNER_PROVIDERS = [ 'slise', 'adbutler', 'coinzilla', 'none' ] as const;
+export const SUPPORTED_AD_BANNER_PROVIDERS = [ 'slise', 'adbutler', 'coinzilla', 'hype', 'getit', 'none' ] as const;
 export type AdBannerProviders = ArrayElement<typeof SUPPORTED_AD_BANNER_PROVIDERS>;
 
+export const SUPPORTED_AD_BANNER_ADDITIONAL_PROVIDERS = [ 'adbutler' ] as const;
+export type AdBannerAdditionalProviders = ArrayElement<typeof SUPPORTED_AD_BANNER_ADDITIONAL_PROVIDERS>;
+
 export const SUPPORTED_AD_TEXT_PROVIDERS = [ 'coinzilla', 'none' ] as const;
 export type AdTextProviders = ArrayElement<typeof SUPPORTED_AD_TEXT_PROVIDERS>;
diff --git a/types/client/contract.ts b/types/client/contract.ts
new file mode 100644
index 0000000000..63116a4072
--- /dev/null
+++ b/types/client/contract.ts
@@ -0,0 +1,14 @@
+import type { SmartContractLicenseType } from 'types/api/contract';
+
+export interface ContractCodeIde {
+  title: string;
+  url: string;
+  icon_url: string;
+}
+
+export interface ContractLicense {
+  type: SmartContractLicenseType;
+  url: string;
+  label: string;
+  title: string;
+}
diff --git a/types/client/gasTracker.ts b/types/client/gasTracker.ts
new file mode 100644
index 0000000000..f998202e95
--- /dev/null
+++ b/types/client/gasTracker.ts
@@ -0,0 +1,6 @@
+export const GAS_UNITS = [
+  'usd',
+  'gwei',
+] as const;
+
+export type GasUnit = typeof GAS_UNITS[number];
diff --git a/types/client/marketplace.ts b/types/client/marketplace.ts
index 766e2e4885..9063f538af 100644
--- a/types/client/marketplace.ts
+++ b/types/client/marketplace.ts
@@ -1,3 +1,5 @@
+import type { SolidityscanReport } from 'types/api/contract';
+
 export type MarketplaceAppPreview = {
   id: string;
   external?: boolean;
@@ -7,18 +9,62 @@ export type MarketplaceAppPreview = {
   shortDescription: string;
   categories: Array<string>;
   url: string;
+  internalWallet?: boolean;
+  priority?: number;
+}
+
+export type MarketplaceAppSocialInfo = {
+  twitter?: string;
+  telegram?: string;
+  github?: string | Array<string>;
+  discord?: string;
 }
 
-export type MarketplaceAppOverview = MarketplaceAppPreview & {
+export type MarketplaceAppOverview = MarketplaceAppPreview & MarketplaceAppSocialInfo & {
   author: string;
   description: string;
   site?: string;
-  twitter?: string;
-  telegram?: string;
-  github?: string;
+}
+
+export type MarketplaceAppWithSecurityReport = MarketplaceAppOverview & {
+  securityReport?: MarketplaceAppSecurityReport;
 }
 
 export enum MarketplaceCategory {
-  ALL = 'All apps',
+  ALL = 'All',
   FAVORITES = 'Favorites',
 }
+
+export enum ContractListTypes {
+  ANALYZED = 'Analyzed',
+  ALL = 'All',
+  VERIFIED = 'Verified',
+}
+
+export enum MarketplaceDisplayType {
+  DEFAULT = 'default',
+  SCORES = 'scores',
+}
+
+export type MarketplaceAppSecurityReport = {
+  overallInfo: {
+    verifiedNumber: number;
+    totalContractsNumber: number;
+    solidityScanContractsNumber: number;
+    securityScore: number;
+    totalIssues?: number;
+    issueSeverityDistribution: SolidityscanReport['scan_report']['scan_summary']['issue_severity_distribution'];
+  };
+  contractsData: Array<{
+    address: string;
+    isVerified: boolean;
+    solidityScanReport?: SolidityscanReport['scan_report'] | null;
+  }>;
+}
+
+export type MarketplaceAppSecurityReportRaw = {
+  appName: string;
+  chainsData: {
+    [chainId: string]: MarketplaceAppSecurityReport;
+  };
+}
diff --git a/types/client/rollup.ts b/types/client/rollup.ts
new file mode 100644
index 0000000000..3e5e5da91d
--- /dev/null
+++ b/types/client/rollup.ts
@@ -0,0 +1,10 @@
+import type { ArrayElement } from 'types/utils';
+
+export const ROLLUP_TYPES = [
+  'optimistic',
+  'shibarium',
+  'zkEvm',
+  'zkSync',
+] as const;
+
+export type RollupType = ArrayElement<typeof ROLLUP_TYPES>;
diff --git a/types/client/txInterpretation.ts b/types/client/txInterpretation.ts
index e264b267bc..23f55ed217 100644
--- a/types/client/txInterpretation.ts
+++ b/types/client/txInterpretation.ts
@@ -2,6 +2,7 @@ import type { ArrayElement } from 'types/utils';
 
 export const PROVIDERS = [
   'blockscout',
+  'noves',
   'none',
 ] as const;
 
diff --git a/types/client/validators.ts b/types/client/validators.ts
new file mode 100644
index 0000000000..9fdc949d5d
--- /dev/null
+++ b/types/client/validators.ts
@@ -0,0 +1,7 @@
+import type { ArrayElement } from 'types/utils';
+
+export const VALIDATORS_CHAIN_TYPE = [
+  'stability',
+] as const;
+
+export type ValidatorsChainType = ArrayElement<typeof VALIDATORS_CHAIN_TYPE>;
diff --git a/types/networks.ts b/types/networks.ts
index dbc505d51a..159f506634 100644
--- a/types/networks.ts
+++ b/types/networks.ts
@@ -13,6 +13,7 @@ export interface FeaturedNetwork {
 }
 
 export interface NetworkExplorer {
+  logo?: string;
   title: string;
   baseUrl: string;
   paths: {
diff --git a/types/utils.ts b/types/utils.ts
index 6a41f16f0c..06bb70df3e 100644
--- a/types/utils.ts
+++ b/types/utils.ts
@@ -7,3 +7,7 @@ export type ExcludeNull<T> = T extends null ? never : T;
 export type ExcludeUndefined<T> = T extends undefined ? never : T;
 
 export type KeysOfObjectOrNull<T> = keyof ExcludeNull<T>;
+
+/** Combines members of an intersection into a readable type. */
+// https://twitter.com/mattpocockuk/status/1622730173446557697?s=20&t=NdpAcmEFXY01xkqU3KO0Mg
+export type Evaluate<Type> = { [key in keyof Type]: Type[key] } & unknown
diff --git a/types/web3.ts b/types/web3.ts
new file mode 100644
index 0000000000..1eab7a8cfa
--- /dev/null
+++ b/types/web3.ts
@@ -0,0 +1,65 @@
+// copied from node_modules/@wagmi/core/src/connectors/injected.ts
+import type { EIP1193Provider } from 'viem';
+
+import type { Evaluate } from './utils';
+
+type WalletProviderFlags =
+  | 'isApexWallet'
+  | 'isAvalanche'
+  | 'isBackpack'
+  | 'isBifrost'
+  | 'isBitKeep'
+  | 'isBitski'
+  | 'isBlockWallet'
+  | 'isBraveWallet'
+  | 'isCoinbaseWallet'
+  | 'isDawn'
+  | 'isEnkrypt'
+  | 'isExodus'
+  | 'isFrame'
+  | 'isFrontier'
+  | 'isGamestop'
+  | 'isHyperPay'
+  | 'isImToken'
+  | 'isKuCoinWallet'
+  | 'isMathWallet'
+  | 'isMetaMask'
+  | 'isOkxWallet'
+  | 'isOKExWallet'
+  | 'isOneInchAndroidWallet'
+  | 'isOneInchIOSWallet'
+  | 'isOpera'
+  | 'isPhantom'
+  | 'isPortal'
+  | 'isRabby'
+  | 'isRainbow'
+  | 'isStatus'
+  | 'isTally'
+  | 'isTokenPocket'
+  | 'isTokenary'
+  | 'isTrust'
+  | 'isTrustWallet'
+  | 'isXDEFI'
+  | 'isZerion'
+
+export type WalletProvider = Evaluate<
+EIP1193Provider & {
+  [key in WalletProviderFlags]?: true | undefined
+} & {
+  providers?: Array<WalletProvider> | undefined;
+
+  /** Only exists in MetaMask as of 2022/04/03 */
+  _events?: { connect?: (() => void) | undefined } | undefined;
+
+  /** Only exists in MetaMask as of 2022/04/03 */
+  _state?:
+  | {
+    accounts?: Array<string>;
+    initialized?: boolean;
+    isConnected?: boolean;
+    isPermanentlyDisconnected?: boolean;
+    isUnlocked?: boolean;
+  }
+  | undefined;
+}
+>
diff --git a/ui/address/AddressAccountHistory.tsx b/ui/address/AddressAccountHistory.tsx
new file mode 100644
index 0000000000..5b7cf3aa7e
--- /dev/null
+++ b/ui/address/AddressAccountHistory.tsx
@@ -0,0 +1,125 @@
+import { Box, Hide, Show, Table,
+  Tbody, Th, Tr } from '@chakra-ui/react';
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import type { NovesHistoryFilterValue } from 'types/api/noves';
+import { NovesHistoryFilterValues } from 'types/api/noves';
+
+import getFilterValueFromQuery from 'lib/getFilterValueFromQuery';
+import getQueryParamString from 'lib/router/getQueryParamString';
+import { NOVES_TRANSLATE } from 'stubs/noves/NovesTranslate';
+import { generateListStub } from 'stubs/utils';
+import AddressAccountHistoryTableItem from 'ui/address/accountHistory/AddressAccountHistoryTableItem';
+import ActionBar from 'ui/shared/ActionBar';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+import { getFromToValue } from 'ui/shared/Noves/utils';
+import Pagination from 'ui/shared/pagination/Pagination';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import TheadSticky from 'ui/shared/TheadSticky';
+
+import AddressAccountHistoryListItem from './accountHistory/AddressAccountHistoryListItem';
+import AccountHistoryFilter from './AddressAccountHistoryFilter';
+
+const getFilterValue = (getFilterValueFromQuery<NovesHistoryFilterValue>).bind(null, NovesHistoryFilterValues);
+
+type Props = {
+  scrollRef?: React.RefObject<HTMLDivElement>;
+}
+
+const AddressAccountHistory = ({ scrollRef }: Props) => {
+  const router = useRouter();
+
+  const currentAddress = getQueryParamString(router.query.hash).toLowerCase();
+
+  const [ filterValue, setFilterValue ] = React.useState<NovesHistoryFilterValue>(getFilterValue(router.query.filter));
+
+  const { data, isError, pagination, isPlaceholderData } = useQueryWithPages({
+    resourceName: 'noves_address_history',
+    pathParams: { address: currentAddress },
+    scrollRef,
+    options: {
+      placeholderData: generateListStub<'noves_address_history'>(NOVES_TRANSLATE, 10, { hasNextPage: false, pageNumber: 1, pageSize: 10 }),
+    },
+  });
+
+  const handleFilterChange = React.useCallback((val: string | Array<string>) => {
+
+    const newVal = getFilterValue(val);
+    setFilterValue(newVal);
+  }, [ ]);
+
+  const actionBar = (
+    <ActionBar mt={ -6 } pb={{ base: 6, md: 5 }}>
+      <AccountHistoryFilter
+        defaultFilter={ filterValue }
+        onFilterChange={ handleFilterChange }
+        isActive={ Boolean(filterValue) }
+        isLoading={ pagination.isLoading }
+      />
+
+      <Pagination ml={{ base: 'auto', lg: 8 }} { ...pagination }/>
+    </ActionBar>
+  );
+
+  const filteredData = isPlaceholderData ? data?.items : data?.items.filter(i => filterValue ? getFromToValue(i, currentAddress) === filterValue : i);
+
+  const content = (
+    <Box position="relative">
+      <Hide above="lg" ssr={ false }>
+        { filteredData?.map((item, i) => (
+          <AddressAccountHistoryListItem
+            key={ `${ i }-${ item.rawTransactionData.transactionHash }` }
+            tx={ item }
+            currentAddress={ currentAddress }
+            isPlaceholderData={ isPlaceholderData }
+          />
+        )) }
+      </Hide>
+
+      <Show above="lg" ssr={ false }>
+        <Table variant="simple" >
+          <TheadSticky top={ 75 }>
+            <Tr>
+              <Th width="120px">
+                  Age
+              </Th>
+              <Th>
+                  Action
+              </Th>
+              <Th width="320px">
+                  From/To
+              </Th>
+            </Tr>
+          </TheadSticky>
+          <Tbody maxWidth="full">
+            { filteredData?.map((item, i) => (
+              <AddressAccountHistoryTableItem
+                key={ `${ i }-${ item.rawTransactionData.transactionHash }` }
+                tx={ item }
+                currentAddress={ currentAddress }
+                isPlaceholderData={ isPlaceholderData }
+              />
+            )) }
+          </Tbody>
+        </Table>
+      </Show>
+    </Box>
+  );
+
+  return (
+    <DataListDisplay
+      isError={ isError }
+      items={ filteredData }
+      emptyText="There are no transactions."
+      content={ content }
+      actionBar={ actionBar }
+      filterProps={{
+        hasActiveFilters: Boolean(filterValue),
+        emptyFilteredText: 'No match found for current filter',
+      }}
+    />
+  );
+};
+
+export default AddressAccountHistory;
diff --git a/ui/address/AddressAccountHistoryFilter.tsx b/ui/address/AddressAccountHistoryFilter.tsx
new file mode 100644
index 0000000000..d66519d635
--- /dev/null
+++ b/ui/address/AddressAccountHistoryFilter.tsx
@@ -0,0 +1,55 @@
+import {
+  Menu,
+  MenuButton,
+  MenuList,
+  MenuOptionGroup,
+  MenuItemOption,
+  useDisclosure,
+} from '@chakra-ui/react';
+import React from 'react';
+
+import type { NovesHistoryFilterValue } from 'types/api/noves';
+
+import useIsInitialLoading from 'lib/hooks/useIsInitialLoading';
+import FilterButton from 'ui/shared/filters/FilterButton';
+
+interface Props {
+  isActive: boolean;
+  defaultFilter: NovesHistoryFilterValue;
+  onFilterChange: (nextValue: string | Array<string>) => void;
+  isLoading?: boolean;
+}
+
+const AccountHistoryFilter = ({ onFilterChange, defaultFilter, isActive, isLoading }: Props) => {
+  const { isOpen, onToggle } = useDisclosure();
+  const isInitialLoading = useIsInitialLoading(isLoading);
+
+  const onCloseMenu = React.useCallback(() => {
+    if (isOpen) {
+      onToggle();
+    }
+  }, [ isOpen, onToggle ]);
+
+  return (
+    <Menu isOpen={ isOpen } onClose={ onCloseMenu }>
+      <MenuButton onClick={ onToggle }>
+        <FilterButton
+          isActive={ isOpen || isActive }
+          isLoading={ isInitialLoading }
+          onClick={ onToggle }
+          appliedFiltersNum={ isActive ? 1 : 0 }
+          as="div"
+        />
+      </MenuButton>
+      <MenuList zIndex={ 2 }>
+        <MenuOptionGroup defaultValue={ defaultFilter || 'all' } type="radio" onChange={ onFilterChange }>
+          <MenuItemOption value="all">All</MenuItemOption>
+          <MenuItemOption value="received">Received from</MenuItemOption>
+          <MenuItemOption value="sent">Sent to</MenuItemOption>
+        </MenuOptionGroup>
+      </MenuList>
+    </Menu>
+  );
+};
+
+export default React.memo(AccountHistoryFilter);
diff --git a/ui/address/AddressBlocksValidated.tsx b/ui/address/AddressBlocksValidated.tsx
index 2d65532d8e..b72ef4776e 100644
--- a/ui/address/AddressBlocksValidated.tsx
+++ b/ui/address/AddressBlocksValidated.tsx
@@ -10,6 +10,7 @@ import config from 'configs/app';
 import { getResourceKey } from 'lib/api/useApiQuery';
 import useSocketChannel from 'lib/socket/useSocketChannel';
 import useSocketMessage from 'lib/socket/useSocketMessage';
+import { currencyUnits } from 'lib/units';
 import { BLOCK } from 'stubs/block';
 import { generateListStub } from 'stubs/utils';
 import ActionBar from 'ui/shared/ActionBar';
@@ -95,7 +96,7 @@ const AddressBlocksValidated = ({ scrollRef }: Props) => {
               <Th width="16%">Txn</Th>
               <Th width="25%">Gas used</Th>
               { !config.UI.views.block.hiddenFields?.total_reward &&
-              <Th width="25%" isNumeric>Reward { config.chain.currency.symbol }</Th> }
+              <Th width="25%" isNumeric>Reward { currencyUnits.ether }</Th> }
             </Tr>
           </Thead>
           <Tbody>
diff --git a/ui/address/AddressDetails.pw.tsx b/ui/address/AddressDetails.pw.tsx
index 2b7d3ce97e..310c175141 100644
--- a/ui/address/AddressDetails.pw.tsx
+++ b/ui/address/AddressDetails.pw.tsx
@@ -1,11 +1,8 @@
 import { test, expect } from '@playwright/experimental-ct-react';
-import type { UseQueryResult } from '@tanstack/react-query';
 import React from 'react';
-import type { WindowProvider } from 'wagmi';
 
-import type { Address } from 'types/api/address';
+import type { WalletProvider } from 'types/web3';
 
-import type { ResourceError } from 'lib/api/resources';
 import * as addressMock from 'mocks/address/address';
 import * as countersMock from 'mocks/address/counters';
 import * as tokensMock from 'mocks/address/tokens';
@@ -15,6 +12,7 @@ import * as configs from 'playwright/utils/configs';
 
 import AddressDetails from './AddressDetails';
 import MockAddressPage from './testUtils/MockAddressPage';
+import type { AddressQuery } from './utils/useAddressQuery';
 
 const ADDRESS_HASH = addressMock.hash;
 const API_URL_ADDRESS = buildApiUrl('address', { hash: ADDRESS_HASH });
@@ -22,6 +20,7 @@ const API_URL_COUNTERS = buildApiUrl('address_counters', { hash: ADDRESS_HASH })
 const API_URL_TOKENS_ERC20 = buildApiUrl('address_tokens', { hash: ADDRESS_HASH }) + '?type=ERC-20';
 const API_URL_TOKENS_ERC721 = buildApiUrl('address_tokens', { hash: ADDRESS_HASH }) + '?type=ERC-721';
 const API_URL_TOKENS_ER1155 = buildApiUrl('address_tokens', { hash: ADDRESS_HASH }) + '?type=ERC-1155';
+const API_URL_TOKENS_ERC404 = buildApiUrl('address_tokens', { hash: ADDRESS_HASH }) + '?type=ERC-404';
 const hooksConfig = {
   router: {
     query: { hash: ADDRESS_HASH },
@@ -40,7 +39,7 @@ test('contract +@mobile', async({ mount, page }) => {
 
   const component = await mount(
     <TestApp>
-      <AddressDetails addressQuery={{ data: addressMock.contract } as UseQueryResult<Address, ResourceError>}/>
+      <AddressDetails addressQuery={{ data: addressMock.contract } as AddressQuery}/>
     </TestApp>,
     { hooksConfig },
   );
@@ -72,17 +71,21 @@ test('token', async({ mount, page }) => {
     status: 200,
     body: JSON.stringify(tokensMock.erc1155List),
   }), { times: 1 });
+  await page.route(API_URL_TOKENS_ERC404, async(route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(tokensMock.erc404List),
+  }), { times: 1 });
 
   await page.evaluate(() => {
     window.ethereum = {
       providers: [ { isMetaMask: true, _events: {} } ],
-    }as WindowProvider;
+    } as WalletProvider;
   });
 
   const component = await mount(
     <TestApp>
       <MockAddressPage>
-        <AddressDetails addressQuery={{ data: addressMock.token } as UseQueryResult<Address, ResourceError>}/>
+        <AddressDetails addressQuery={{ data: addressMock.token } as AddressQuery}/>
       </MockAddressPage>
     </TestApp>,
     { hooksConfig },
@@ -106,7 +109,7 @@ test('validator +@mobile', async({ mount, page }) => {
 
   const component = await mount(
     <TestApp>
-      <AddressDetails addressQuery={{ data: addressMock.validator } as UseQueryResult<Address, ResourceError>}/>
+      <AddressDetails addressQuery={{ data: addressMock.validator } as AddressQuery}/>
     </TestApp>,
     { hooksConfig },
   );
diff --git a/ui/address/AddressDetails.tsx b/ui/address/AddressDetails.tsx
index c0e690b889..662fd86a70 100644
--- a/ui/address/AddressDetails.tsx
+++ b/ui/address/AddressDetails.tsx
@@ -1,15 +1,12 @@
 import { Box, Text, Grid } from '@chakra-ui/react';
-import type { UseQueryResult } from '@tanstack/react-query';
 import { useRouter } from 'next/router';
 import React from 'react';
 
-import type { Address as TAddress } from 'types/api/address';
-
-import type { ResourceError } from 'lib/api/resources';
-import useApiQuery from 'lib/api/useApiQuery';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import getQueryParamString from 'lib/router/getQueryParamString';
-import { ADDRESS_COUNTERS } from 'stubs/address';
 import AddressCounterItem from 'ui/address/details/AddressCounterItem';
+import ServiceDegradationWarning from 'ui/shared/alerts/ServiceDegradationWarning';
+import isCustomAppError from 'ui/shared/AppError/isCustomAppError';
 import DataFetchAlert from 'ui/shared/DataFetchAlert';
 import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
 import DetailsSponsoredItem from 'ui/shared/DetailsSponsoredItem';
@@ -20,9 +17,11 @@ import TxEntity from 'ui/shared/entities/tx/TxEntity';
 import AddressBalance from './details/AddressBalance';
 import AddressNameInfo from './details/AddressNameInfo';
 import TokenSelect from './tokenSelect/TokenSelect';
+import useAddressCountersQuery from './utils/useAddressCountersQuery';
+import type { AddressQuery } from './utils/useAddressQuery';
 
 interface Props {
-  addressQuery: UseQueryResult<TAddress, ResourceError>;
+  addressQuery: AddressQuery;
   scrollRef?: React.RefObject<HTMLDivElement>;
 }
 
@@ -31,12 +30,9 @@ const AddressDetails = ({ addressQuery, scrollRef }: Props) => {
 
   const addressHash = getQueryParamString(router.query.hash);
 
-  const countersQuery = useApiQuery('address_counters', {
-    pathParams: { hash: addressHash },
-    queryOptions: {
-      enabled: Boolean(addressHash) && Boolean(addressQuery.data),
-      placeholderData: ADDRESS_COUNTERS,
-    },
+  const countersQuery = useAddressCountersQuery({
+    hash: addressHash,
+    addressQuery,
   });
 
   const handleCounterItemClick = React.useCallback(() => {
@@ -46,7 +42,7 @@ const AddressDetails = ({ addressQuery, scrollRef }: Props) => {
     }, 500);
   }, [ scrollRef ]);
 
-  const errorData = React.useMemo(() => ({
+  const error404Data = React.useMemo(() => ({
     hash: addressHash || '',
     is_contract: false,
     implementation_name: null,
@@ -64,153 +60,163 @@ const AddressDetails = ({ addressQuery, scrollRef }: Props) => {
     has_validated_blocks: false,
   }), [ addressHash ]);
 
-  const is404Error = addressQuery.isError && 'status' in addressQuery.error && addressQuery.error.status === 404;
-  const is422Error = addressQuery.isError && 'status' in addressQuery.error && addressQuery.error.status === 422;
-
-  if (addressQuery.isError && is422Error) {
-    throw Error('Address fetch error', { cause: addressQuery.error as unknown as Error });
+  // error handling (except 404 codes)
+  if (addressQuery.isError) {
+    if (isCustomAppError(addressQuery.error)) {
+      const is404Error = addressQuery.isError && 'status' in addressQuery.error && addressQuery.error.status === 404;
+      if (!is404Error) {
+        throwOnResourceLoadError(addressQuery);
+      }
+    } else {
+      return <DataFetchAlert/>;
+    }
   }
 
-  if (addressQuery.isError && !is404Error) {
-    return <DataFetchAlert/>;
-  }
-
-  const data = addressQuery.isError ? errorData : addressQuery.data;
+  const data = addressQuery.isError ? error404Data : addressQuery.data;
 
   if (!data) {
     return null;
   }
 
   return (
-    <Grid
-      columnGap={ 8 }
-      rowGap={{ base: 1, lg: 3 }}
-      templateColumns={{ base: 'minmax(0, 1fr)', lg: 'auto minmax(0, 1fr)' }} overflow="hidden"
-    >
-      <AddressNameInfo data={ data } isLoading={ addressQuery.isPlaceholderData }/>
-      { data.is_contract && data.creation_tx_hash && data.creator_address_hash && (
-        <DetailsInfoItem
-          title="Creator"
-          hint="Transaction and address of creation"
-          isLoading={ addressQuery.isPlaceholderData }
-        >
-          <AddressEntity
-            address={{ hash: data.creator_address_hash }}
-            truncation="constant"
-            noIcon
-          />
-          <Text whiteSpace="pre"> at txn </Text>
-          <TxEntity hash={ data.creation_tx_hash } truncation="constant" noIcon noCopy={ false }/>
-        </DetailsInfoItem>
-      ) }
-      { data.is_contract && data.implementation_address && (
-        <DetailsInfoItem
-          title="Implementation"
-          hint="Implementation address of the proxy contract"
-          columnGap={ 1 }
-        >
-          <AddressEntity
-            address={{ hash: data.implementation_address, name: data.implementation_name, is_contract: true }}
-            isLoading={ addressQuery.isPlaceholderData }
-            noIcon
-          />
-        </DetailsInfoItem>
-      ) }
-      <AddressBalance data={ data } isLoading={ addressQuery.isPlaceholderData }/>
-      { data.has_tokens && (
-        <DetailsInfoItem
-          title="Tokens"
-          hint="All tokens in the account and total value"
-          alignSelf="center"
-          py={ 0 }
-        >
-          { addressQuery.data ? <TokenSelect onClick={ handleCounterItemClick }/> : <Box py="6px">0</Box> }
-        </DetailsInfoItem>
-      ) }
-      <DetailsInfoItem
-        title="Transactions"
-        hint="Number of transactions related to this address"
-        isLoading={ addressQuery.isPlaceholderData || countersQuery.isPlaceholderData }
+    <>
+      { addressQuery.isDegradedData && <ServiceDegradationWarning isLoading={ addressQuery.isPlaceholderData } mb={ 6 }/> }
+      <Grid
+        columnGap={ 8 }
+        rowGap={{ base: 1, lg: 3 }}
+        templateColumns={{ base: 'minmax(0, 1fr)', lg: 'auto minmax(0, 1fr)' }} overflow="hidden"
       >
-        { addressQuery.data ? (
-          <AddressCounterItem
-            prop="transactions_count"
-            query={ countersQuery }
-            address={ data.hash }
-            onClick={ handleCounterItemClick }
-            isAddressQueryLoading={ addressQuery.isPlaceholderData }
-          />
-        ) :
-          0 }
-      </DetailsInfoItem>
-      { data.has_token_transfers && (
-        <DetailsInfoItem
-          title="Transfers"
-          hint="Number of transfers to/from this address"
-          isLoading={ addressQuery.isPlaceholderData || countersQuery.isPlaceholderData }
-        >
-          { addressQuery.data ? (
-            <AddressCounterItem
-              prop="token_transfers_count"
-              query={ countersQuery }
-              address={ data.hash }
-              onClick={ handleCounterItemClick }
-              isAddressQueryLoading={ addressQuery.isPlaceholderData }
+        <AddressNameInfo data={ data } isLoading={ addressQuery.isPlaceholderData }/>
+        { data.is_contract && data.creation_tx_hash && data.creator_address_hash && (
+          <DetailsInfoItem
+            title="Creator"
+            hint="Transaction and address of creation"
+            isLoading={ addressQuery.isPlaceholderData }
+          >
+            <AddressEntity
+              address={{ hash: data.creator_address_hash }}
+              truncation="constant"
+              noIcon
             />
-          ) :
-            0 }
-        </DetailsInfoItem>
-      ) }
-      <DetailsInfoItem
-        title="Gas used"
-        hint="Gas used by the address"
-        isLoading={ addressQuery.isPlaceholderData || countersQuery.isPlaceholderData }
-      >
-        { addressQuery.data ? (
-          <AddressCounterItem
-            prop="gas_usage_count"
-            query={ countersQuery }
-            address={ data.hash }
-            onClick={ handleCounterItemClick }
-            isAddressQueryLoading={ addressQuery.isPlaceholderData }
-          />
-        ) :
-          0 }
-      </DetailsInfoItem>
-      { data.has_validated_blocks && (
+            <Text whiteSpace="pre"> at txn </Text>
+            <TxEntity hash={ data.creation_tx_hash } truncation="constant" noIcon noCopy={ false }/>
+          </DetailsInfoItem>
+        ) }
+        { data.is_contract && data.implementation_address && (
+          <DetailsInfoItem
+            title="Implementation"
+            hint="Implementation address of the proxy contract"
+            columnGap={ 1 }
+          >
+            <AddressEntity
+              address={{ hash: data.implementation_address, name: data.implementation_name, is_contract: true }}
+              isLoading={ addressQuery.isPlaceholderData }
+              noIcon
+            />
+          </DetailsInfoItem>
+        ) }
+        <AddressBalance data={ data } isLoading={ addressQuery.isPlaceholderData }/>
+        { data.has_tokens && (
+          <DetailsInfoItem
+            title="Tokens"
+            hint="All tokens in the account and total value"
+            alignSelf="center"
+            py={ 0 }
+          >
+            { addressQuery.data ? <TokenSelect onClick={ handleCounterItemClick }/> : <Box py="6px">0</Box> }
+          </DetailsInfoItem>
+        ) }
         <DetailsInfoItem
-          title="Blocks validated"
-          hint="Number of blocks validated by this validator"
+          title="Transactions"
+          hint="Number of transactions related to this address"
           isLoading={ addressQuery.isPlaceholderData || countersQuery.isPlaceholderData }
         >
           { addressQuery.data ? (
             <AddressCounterItem
-              prop="validations_count"
+              prop="transactions_count"
               query={ countersQuery }
               address={ data.hash }
               onClick={ handleCounterItemClick }
               isAddressQueryLoading={ addressQuery.isPlaceholderData }
+              isDegradedData={ addressQuery.isDegradedData }
             />
           ) :
             0 }
         </DetailsInfoItem>
-      ) }
-      { data.block_number_balance_updated_at && (
-        <DetailsInfoItem
-          title="Last balance update"
-          hint="Block number in which the address was updated"
-          alignSelf="center"
-          py={{ base: '2px', lg: 1 }}
-          isLoading={ addressQuery.isPlaceholderData }
-        >
-          <BlockEntity
-            number={ data.block_number_balance_updated_at }
+        { data.has_token_transfers && (
+          <DetailsInfoItem
+            title="Transfers"
+            hint="Number of transfers to/from this address"
+            isLoading={ addressQuery.isPlaceholderData || countersQuery.isPlaceholderData }
+          >
+            { addressQuery.data ? (
+              <AddressCounterItem
+                prop="token_transfers_count"
+                query={ countersQuery }
+                address={ data.hash }
+                onClick={ handleCounterItemClick }
+                isAddressQueryLoading={ addressQuery.isPlaceholderData }
+                isDegradedData={ addressQuery.isDegradedData }
+              />
+            ) :
+              0 }
+          </DetailsInfoItem>
+        ) }
+        { countersQuery.data?.gas_usage_count && (
+          <DetailsInfoItem
+            title="Gas used"
+            hint="Gas used by the address"
+            isLoading={ addressQuery.isPlaceholderData || countersQuery.isPlaceholderData }
+          >
+            { addressQuery.data ? (
+              <AddressCounterItem
+                prop="gas_usage_count"
+                query={ countersQuery }
+                address={ data.hash }
+                onClick={ handleCounterItemClick }
+                isAddressQueryLoading={ addressQuery.isPlaceholderData }
+                isDegradedData={ addressQuery.isDegradedData }
+              />
+            ) :
+              0 }
+          </DetailsInfoItem>
+        ) }
+        { data.has_validated_blocks && (
+          <DetailsInfoItem
+            title="Blocks validated"
+            hint="Number of blocks validated by this validator"
+            isLoading={ addressQuery.isPlaceholderData || countersQuery.isPlaceholderData }
+          >
+            { addressQuery.data ? (
+              <AddressCounterItem
+                prop="validations_count"
+                query={ countersQuery }
+                address={ data.hash }
+                onClick={ handleCounterItemClick }
+                isAddressQueryLoading={ addressQuery.isPlaceholderData }
+                isDegradedData={ addressQuery.isDegradedData }
+              />
+            ) :
+              0 }
+          </DetailsInfoItem>
+        ) }
+        { data.block_number_balance_updated_at && (
+          <DetailsInfoItem
+            title="Last balance update"
+            hint="Block number in which the address was updated"
+            alignSelf="center"
+            py={{ base: '2px', lg: 1 }}
             isLoading={ addressQuery.isPlaceholderData }
-          />
-        </DetailsInfoItem>
-      ) }
-      <DetailsSponsoredItem isLoading={ addressQuery.isPlaceholderData }/>
-    </Grid>
+          >
+            <BlockEntity
+              number={ data.block_number_balance_updated_at }
+              isLoading={ addressQuery.isPlaceholderData }
+            />
+          </DetailsInfoItem>
+        ) }
+        <DetailsSponsoredItem isLoading={ addressQuery.isPlaceholderData }/>
+      </Grid>
+    </>
   );
 };
 
diff --git a/ui/address/AddressTokens.pw.tsx b/ui/address/AddressTokens.pw.tsx
index 7ee5556986..514b3aa7ad 100644
--- a/ui/address/AddressTokens.pw.tsx
+++ b/ui/address/AddressTokens.pw.tsx
@@ -37,6 +37,10 @@ const test = base.extend({
       items: [ tokensMock.erc1155a, tokensMock.erc1155b ],
       next_page_params: nextPageParams,
     };
+    const response404 = {
+      items: [ tokensMock.erc404a, tokensMock.erc404b ],
+      next_page_params: nextPageParams,
+    };
 
     await page.route(API_URL_ADDRESS, (route) => route.fulfill({
       status: 200,
@@ -54,6 +58,10 @@ const test = base.extend({
       status: 200,
       body: JSON.stringify(response1155),
     }));
+    await page.route(API_URL_TOKENS + '?type=ERC-404', (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(response404),
+    }));
     await page.route(API_URL_NFT, (route) => route.fulfill({
       status: 200,
       body: JSON.stringify(tokensMock.nfts),
@@ -217,6 +225,10 @@ base.describe('update balances via socket', () => {
       items: [ tokensMock.erc1155a ],
       next_page_params: null,
     };
+    const response404 = {
+      items: [ tokensMock.erc404a ],
+      next_page_params: null,
+    };
 
     await page.route(API_URL_ADDRESS, (route) => route.fulfill({
       status: 200,
@@ -234,6 +246,10 @@ base.describe('update balances via socket', () => {
       status: 200,
       body: JSON.stringify(response1155),
     }));
+    await page.route(API_URL_TOKENS + '?type=ERC-404', (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(response404),
+    }));
 
     const component = await mount(
       <TestApp withSocket>
@@ -248,6 +264,7 @@ base.describe('update balances via socket', () => {
     await page.waitForResponse(API_URL_TOKENS + '?type=ERC-20');
     await page.waitForResponse(API_URL_TOKENS + '?type=ERC-721');
     await page.waitForResponse(API_URL_TOKENS + '?type=ERC-1155');
+    await page.waitForResponse(API_URL_TOKENS + '?type=ERC-404');
 
     await expect(component).toHaveScreenshot();
 
diff --git a/ui/address/AddressTxs.tsx b/ui/address/AddressTxs.tsx
index cc21c355df..d272982c71 100644
--- a/ui/address/AddressTxs.tsx
+++ b/ui/address/AddressTxs.tsx
@@ -20,6 +20,7 @@ import Pagination from 'ui/shared/pagination/Pagination';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import getSortParamsFromValue from 'ui/shared/sort/getSortParamsFromValue';
 import getSortValueFromQuery from 'ui/shared/sort/getSortValueFromQuery';
+import { sortTxsFromSocket } from 'ui/txs/sortTxs';
 import TxsWithAPISorting from 'ui/txs/TxsWithAPISorting';
 import { SORT_OPTIONS } from 'ui/txs/useTxsSort';
 
@@ -85,7 +86,7 @@ const AddressTxs = ({ scrollRef, overloadCount = OVERLOAD_COUNT }: Props) => {
     addressTxsQuery.onFilterChange({ filter: newVal });
   }, [ addressTxsQuery ]);
 
-  const handleNewSocketMessage: SocketMessage.AddressTxs['handler'] = (payload) => {
+  const handleNewSocketMessage: SocketMessage.AddressTxs['handler'] = React.useCallback((payload) => {
     setSocketAlert('');
 
     queryClient.setQueryData(
@@ -123,10 +124,10 @@ const AddressTxs = ({ scrollRef, overloadCount = OVERLOAD_COUNT }: Props) => {
           items: [
             ...newItems,
             ...prevData.items,
-          ],
+          ].sort(sortTxsFromSocket(sort)),
         };
       });
-  };
+  }, [ currentAddress, filterValue, overloadCount, queryClient, sort ]);
 
   const handleSocketClose = React.useCallback(() => {
     setSocketAlert('Connection is lost. Please refresh the page to load new transactions.');
diff --git a/ui/address/AddressTxsFilter.tsx b/ui/address/AddressTxsFilter.tsx
index 1b8ead77ff..c566f1d91e 100644
--- a/ui/address/AddressTxsFilter.tsx
+++ b/ui/address/AddressTxsFilter.tsx
@@ -38,8 +38,8 @@ const AddressTxsFilter = ({ onFilterChange, defaultFilter, isActive, isLoading }
       <MenuList zIndex={ 2 }>
         <MenuOptionGroup defaultValue={ defaultFilter || 'all' } title="Address" type="radio" onChange={ onFilterChange }>
           <MenuItemOption value="all">All</MenuItemOption>
-          <MenuItemOption value="from">From</MenuItemOption>
-          <MenuItemOption value="to">To</MenuItemOption>
+          <MenuItemOption value="from">Outgoing transactions</MenuItemOption>
+          <MenuItemOption value="to">Incoming transactions</MenuItemOption>
         </MenuOptionGroup>
       </MenuList>
     </Menu>
diff --git a/ui/address/AddressUserOps.tsx b/ui/address/AddressUserOps.tsx
new file mode 100644
index 0000000000..7c93c83b47
--- /dev/null
+++ b/ui/address/AddressUserOps.tsx
@@ -0,0 +1,35 @@
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import getQueryParamString from 'lib/router/getQueryParamString';
+import { USER_OPS_ITEM } from 'stubs/userOps';
+import { generateListStub } from 'stubs/utils';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import UserOpsContent from 'ui/userOps/UserOpsContent';
+
+type Props = {
+  scrollRef?: React.RefObject<HTMLDivElement>;
+}
+
+const AddressUserOps = ({ scrollRef }: Props) => {
+  const router = useRouter();
+
+  const hash = getQueryParamString(router.query.hash);
+
+  const userOpsQuery = useQueryWithPages({
+    resourceName: 'user_ops',
+    scrollRef,
+    options: {
+      enabled: Boolean(hash),
+      placeholderData: generateListStub<'user_ops'>(USER_OPS_ITEM, 50, { next_page_params: {
+        page_token: '10355938,0x5956a847d8089e254e02e5111cad6992b99ceb9e5c2dc4343fd53002834c4dc6',
+        page_size: 50,
+      } }),
+    },
+    filters: { sender: hash },
+  });
+
+  return <UserOpsContent query={ userOpsQuery } showSender={ false }/>;
+};
+
+export default AddressUserOps;
diff --git a/ui/address/AddressWithdrawals.tsx b/ui/address/AddressWithdrawals.tsx
index 5deaedc52d..bbc61e8730 100644
--- a/ui/address/AddressWithdrawals.tsx
+++ b/ui/address/AddressWithdrawals.tsx
@@ -9,8 +9,8 @@ import ActionBar from 'ui/shared/ActionBar';
 import DataListDisplay from 'ui/shared/DataListDisplay';
 import Pagination from 'ui/shared/pagination/Pagination';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
-import WithdrawalsListItem from 'ui/withdrawals/WithdrawalsListItem';
-import WithdrawalsTable from 'ui/withdrawals/WithdrawalsTable';
+import BeaconChainWithdrawalsListItem from 'ui/withdrawals/beaconChain/BeaconChainWithdrawalsListItem';
+import BeaconChainWithdrawalsTable from 'ui/withdrawals/beaconChain/BeaconChainWithdrawalsTable';
 
 const AddressWithdrawals = ({ scrollRef }: {scrollRef?: React.RefObject<HTMLDivElement>}) => {
   const router = useRouter();
@@ -32,7 +32,7 @@ const AddressWithdrawals = ({ scrollRef }: {scrollRef?: React.RefObject<HTMLDivE
     <>
       <Show below="lg" ssr={ false }>
         { data.items.map((item, index) => (
-          <WithdrawalsListItem
+          <BeaconChainWithdrawalsListItem
             key={ item.index + Number(isPlaceholderData ? index : '') }
             item={ item }
             view="address"
@@ -41,7 +41,7 @@ const AddressWithdrawals = ({ scrollRef }: {scrollRef?: React.RefObject<HTMLDivE
         )) }
       </Show>
       <Hide below="lg" ssr={ false }>
-        <WithdrawalsTable items={ data.items } view="address" top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
+        <BeaconChainWithdrawalsTable items={ data.items } view="address" top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
       </Hide>
     </>
   ) : null ;
diff --git a/ui/address/SolidityscanReport.tsx b/ui/address/SolidityscanReport.tsx
index 8fe817d4fd..7032ffcd99 100644
--- a/ui/address/SolidityscanReport.tsx
+++ b/ui/address/SolidityscanReport.tsx
@@ -1,72 +1,22 @@
-import {
-  Box,
-  Flex,
-  Text,
-  Grid,
-  Button,
-  chakra,
-  Popover,
-  PopoverTrigger,
-  PopoverBody,
-  PopoverContent,
-  useDisclosure,
-  Skeleton,
-  Center,
-  useColorModeValue,
-} from '@chakra-ui/react';
+import { Box, Text, chakra, Icon, Popover, PopoverTrigger, PopoverContent, PopoverBody, useDisclosure } from '@chakra-ui/react';
 import React from 'react';
 
-import { SolidityscanReport } from 'types/api/contract';
-
+// This icon doesn't work properly when it is in the sprite
+// Probably because of the gradient
+// eslint-disable-next-line no-restricted-imports
+import solidityScanIcon from 'icons/brands/solidity_scan.svg';
 import useApiQuery from 'lib/api/useApiQuery';
 import { SOLIDITYSCAN_REPORT } from 'stubs/contract';
-import IconSvg from 'ui/shared/IconSvg';
 import LinkExternal from 'ui/shared/LinkExternal';
-
-type DistributionItem = {
-  id: keyof SolidityscanReport['scan_report']['scan_summary']['issue_severity_distribution'];
-  name: string;
-  color: string;
-}
-
-const DISTRIBUTION_ITEMS: Array<DistributionItem> = [
-  { id: 'critical', name: 'Critical', color: '#891F11' },
-  { id: 'high', name: 'High', color: '#EC672C' },
-  { id: 'medium', name: 'Medium', color: '#FBE74D' },
-  { id: 'low', name: 'Low', color: '#68C88E' },
-  { id: 'informational', name: 'Informational', color: '#A3AEBE' },
-  { id: 'gas', name: 'Gas', color: '#A47585' },
-];
+import SolidityscanReportButton from 'ui/shared/solidityscanReport/SolidityscanReportButton';
+import SolidityscanReportDetails from 'ui/shared/solidityscanReport/SolidityscanReportDetails';
+import SolidityscanReportScore from 'ui/shared/solidityscanReport/SolidityscanReportScore';
 
 interface Props {
   className?: string;
   hash: string;
 }
 
-type ItemProps = {
-  item: DistributionItem;
-  vulnerabilities: SolidityscanReport['scan_report']['scan_summary']['issue_severity_distribution'];
-  vulnerabilitiesCount: number;
-}
-
-const SolidityScanReportItem = ({ item, vulnerabilities, vulnerabilitiesCount }: ItemProps) => {
-  const bgBar = useColorModeValue('blackAlpha.50', 'whiteAlpha.50');
-  const yetAnotherGrayColor = useColorModeValue('gray.400', 'gray.500');
-
-  return (
-    <>
-      <Box w={ 3 } h={ 3 } bg={ item.color } borderRadius="6px" mr={ 2 }></Box>
-      <Flex justifyContent="space-between" mr={ 3 }>
-        <Text>{ item.name }</Text>
-        <Text color={ vulnerabilities[item.id] > 0 ? 'text' : yetAnotherGrayColor }>{ vulnerabilities[item.id] }</Text>
-      </Flex>
-      <Box bg={ bgBar } h="10px" borderRadius="8px">
-        <Box bg={ item.color } w={ vulnerabilities[item.id] / vulnerabilitiesCount } h="10px" borderRadius="8px"/>
-      </Box>
-    </>
-  );
-};
-
 const SolidityscanReport = ({ className, hash }: Props) => {
   const { isOpen, onToggle, onClose } = useDisclosure();
 
@@ -80,31 +30,10 @@ const SolidityscanReport = ({ className, hash }: Props) => {
 
   const score = Number(data?.scan_report.scan_summary.score_v2);
 
-  const chartGrayColor = useColorModeValue('gray.100', 'gray.700');
-  const yetAnotherGrayColor = useColorModeValue('gray.400', 'gray.500');
-  const popoverBgColor = useColorModeValue('white', 'gray.900');
-
-  const greatScoreColor = useColorModeValue('green.600', 'green.400');
-  const averageScoreColor = useColorModeValue('purple.600', 'purple.400');
-  const lowScoreColor = useColorModeValue('red.600', 'red.400');
-
   if (isError || !score) {
     return null;
   }
 
-  let scoreColor;
-  let scoreLevel;
-  if (score >= 80) {
-    scoreColor = greatScoreColor;
-    scoreLevel = 'GREAT';
-  } else if (score >= 30) {
-    scoreColor = averageScoreColor;
-    scoreLevel = 'AVERAGE';
-  } else {
-    scoreColor = lowScoreColor;
-    scoreLevel = 'LOW';
-  }
-
   const vulnerabilities = data?.scan_report.scan_summary.issue_severity_distribution;
   const vulnerabilitiesCounts = vulnerabilities ? Object.values(vulnerabilities) : [];
   const vulnerabilitiesCount = vulnerabilitiesCounts.reduce((acc, val) => acc + val, 0);
@@ -112,57 +41,25 @@ const SolidityscanReport = ({ className, hash }: Props) => {
   return (
     <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy>
       <PopoverTrigger>
-        <Skeleton isLoaded={ !isPlaceholderData }>
-          <Button
-            className={ className }
-            color={ scoreColor }
-            size="sm"
-            variant="outline"
-            colorScheme="gray"
-            onClick={ onToggle }
-            aria-label="SolidityScan score"
-            fontWeight={ 500 }
-            px={ 2 }
-            h="32px"
-            flexShrink={ 0 }
-          >
-            <IconSvg name={ score < 80 ? 'score/score-not-ok' : 'score/score-ok' } boxSize={ 5 } mr={ 1 }/>
-            { score }
-          </Button>
-        </Skeleton>
+        <SolidityscanReportButton
+          className={ className }
+          score={ score }
+          isLoading={ isPlaceholderData }
+          onClick={ onToggle }
+        />
       </PopoverTrigger>
       <PopoverContent w={{ base: '100vw', lg: '328px' }}>
         <PopoverBody px="26px" py="20px" fontSize="sm">
-          <Box mb={ 5 }>Contract analyzed for 140+ vulnerability patterns by SolidityScan</Box>
-          <Flex alignItems="center" mb={ 5 }>
-            <Box
-              w={ 12 }
-              h={ 12 }
-              bgGradient={ `conic-gradient(${ scoreColor } 0, ${ scoreColor } ${ score }%, ${ chartGrayColor } 0, ${ chartGrayColor } 100%)` }
-              borderRadius="24px"
-              position="relative"
-              mr={ 3 }
-            >
-              <Center position="absolute" w="38px" h="38px" top="5px" right="5px" bg={ popoverBgColor } borderRadius="20px">
-                <IconSvg name={ score < 80 ? 'score/score-not-ok' : 'score/score-ok' } boxSize={ 5 } color={ scoreColor }/>
-              </Center>
-            </Box>
-            <Box>
-              <Flex>
-                <Text color={ scoreColor } fontSize="lg" fontWeight={ 500 }>{ score }</Text>
-                <Text color={ yetAnotherGrayColor } fontSize="lg" fontWeight={ 500 } whiteSpace="pre"> / 100</Text>
-              </Flex>
-              <Text color={ scoreColor } fontWeight={ 500 }>Security score is { scoreLevel }</Text>
-            </Box>
-          </Flex>
+          <Box mb={ 5 } lineHeight="25px">
+            Contract analyzed for 140+ vulnerability patterns by
+            <Icon as={ solidityScanIcon } mr={ 1 } ml="6px" w="23px" h="20px" display="inline-block" verticalAlign="middle"/>
+            <Text fontWeight={ 600 } display="inline-block">SolidityScan</Text>
+          </Box>
+          <SolidityscanReportScore score={ score } mb={ 5 }/>
           { vulnerabilities && vulnerabilitiesCount > 0 && (
             <Box mb={ 5 }>
               <Text py="7px" variant="secondary" fontSize="xs" fontWeight={ 500 }>Vulnerabilities distribution</Text>
-              <Grid templateColumns="20px 1fr 100px" alignItems="center" rowGap={ 2 }>
-                { DISTRIBUTION_ITEMS.map(item => (
-                  <SolidityScanReportItem item={ item } key={ item.id } vulnerabilities={ vulnerabilities } vulnerabilitiesCount={ vulnerabilitiesCount }/>
-                )) }
-              </Grid>
+              <SolidityscanReportDetails vulnerabilities={ vulnerabilities } vulnerabilitiesCount={ vulnerabilitiesCount }/>
             </Box>
           ) }
           <LinkExternal href={ data?.scan_report.scanner_reference_url }>View full report</LinkExternal>
diff --git a/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png b/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png
index 39d86ce69b..bb79528b20 100644
Binary files a/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png and b/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png differ
diff --git a/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_default_base-view-dark-mode-mobile-1.png b/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_default_base-view-dark-mode-mobile-1.png
index 2e8c7bf712..da77d32fc9 100644
Binary files a/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_default_base-view-dark-mode-mobile-1.png and b/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_default_base-view-dark-mode-mobile-1.png differ
diff --git a/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_mobile_base-view-dark-mode-mobile-1.png b/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_mobile_base-view-dark-mode-mobile-1.png
index 931f7e7b41..fad359546d 100644
Binary files a/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_mobile_base-view-dark-mode-mobile-1.png and b/ui/address/__screenshots__/AddressCoinBalance.pw.tsx_mobile_base-view-dark-mode-mobile-1.png differ
diff --git a/ui/address/__screenshots__/AddressDetails.pw.tsx_default_token-1.png b/ui/address/__screenshots__/AddressDetails.pw.tsx_default_token-1.png
index 28d70e3dfe..a41b419d9b 100644
Binary files a/ui/address/__screenshots__/AddressDetails.pw.tsx_default_token-1.png and b/ui/address/__screenshots__/AddressDetails.pw.tsx_default_token-1.png differ
diff --git a/ui/address/__screenshots__/AddressInternalTxs.pw.tsx_default_base-view-mobile-1.png b/ui/address/__screenshots__/AddressInternalTxs.pw.tsx_default_base-view-mobile-1.png
index 2d36b1a5a8..4f76f75b60 100644
Binary files a/ui/address/__screenshots__/AddressInternalTxs.pw.tsx_default_base-view-mobile-1.png and b/ui/address/__screenshots__/AddressInternalTxs.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/address/__screenshots__/AddressInternalTxs.pw.tsx_mobile_base-view-mobile-1.png b/ui/address/__screenshots__/AddressInternalTxs.pw.tsx_mobile_base-view-mobile-1.png
index 51fdeb8eb8..46777342c1 100644
Binary files a/ui/address/__screenshots__/AddressInternalTxs.pw.tsx_mobile_base-view-mobile-1.png and b/ui/address/__screenshots__/AddressInternalTxs.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_mobile-with-token-filter-and-no-pagination-1.png b/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_mobile-with-token-filter-and-no-pagination-1.png
index 53d53b249c..9a5fc4ea5d 100644
Binary files a/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_mobile-with-token-filter-and-no-pagination-1.png and b/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_mobile-with-token-filter-and-no-pagination-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_mobile-with-token-filter-and-pagination-1.png b/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_mobile-with-token-filter-and-pagination-1.png
index ebb49117dd..bd3982620b 100644
Binary files a/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_mobile-with-token-filter-and-pagination-1.png and b/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_mobile-with-token-filter-and-pagination-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_with-token-filter-and-no-pagination-1.png b/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_with-token-filter-and-no-pagination-1.png
index c7d9422137..dcdcb70660 100644
Binary files a/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_with-token-filter-and-no-pagination-1.png and b/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_with-token-filter-and-no-pagination-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_with-token-filter-and-pagination-1.png b/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_with-token-filter-and-pagination-1.png
index 6ce1cc6b65..0356e2f168 100644
Binary files a/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_with-token-filter-and-pagination-1.png and b/ui/address/__screenshots__/AddressTokenTransfers.pw.tsx_default_with-token-filter-and-pagination-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_collections-dark-mode-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_collections-dark-mode-1.png
index 2cfbdaf3a7..1d67d2892f 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_collections-dark-mode-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_collections-dark-mode-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_erc20-dark-mode-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_erc20-dark-mode-1.png
index 988d310f09..e76a9f9d38 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_erc20-dark-mode-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_erc20-dark-mode-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_nfts-dark-mode-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_nfts-dark-mode-1.png
index ff3f91748f..b1f612387b 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_nfts-dark-mode-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_dark-color-mode_nfts-dark-mode-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_collections-dark-mode-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_collections-dark-mode-1.png
index 185fa05a5c..a114a18ba5 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_collections-dark-mode-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_collections-dark-mode-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_erc20-dark-mode-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_erc20-dark-mode-1.png
index 5cb20256d2..e44974d63e 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_erc20-dark-mode-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_erc20-dark-mode-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-collections-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-collections-1.png
index d2aacbe810..0fcb08e5b0 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-collections-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-collections-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-erc20-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-erc20-1.png
index 9325e2a5b4..ac6aa9b71b 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-erc20-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-erc20-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-nfts-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-nfts-1.png
index cb01e73aa2..eca7f88c7f 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-nfts-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_mobile-nfts-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_nfts-dark-mode-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_nfts-dark-mode-1.png
index f4ca1946ec..875ce58c10 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_nfts-dark-mode-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_nfts-dark-mode-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_update-balances-via-socket-1.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_update-balances-via-socket-1.png
index fab130576d..f911c3a3b4 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_update-balances-via-socket-1.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_update-balances-via-socket-1.png differ
diff --git a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_update-balances-via-socket-2.png b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_update-balances-via-socket-2.png
index 4ada42569e..d879fbdd4b 100644
Binary files a/ui/address/__screenshots__/AddressTokens.pw.tsx_default_update-balances-via-socket-2.png and b/ui/address/__screenshots__/AddressTokens.pw.tsx_default_update-balances-via-socket-2.png differ
diff --git a/ui/address/__screenshots__/AddressTxs.pw.tsx_default_base-view-mobile-1.png b/ui/address/__screenshots__/AddressTxs.pw.tsx_default_base-view-mobile-1.png
index e993699729..26e56490ac 100644
Binary files a/ui/address/__screenshots__/AddressTxs.pw.tsx_default_base-view-mobile-1.png and b/ui/address/__screenshots__/AddressTxs.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/address/__screenshots__/AddressTxs.pw.tsx_default_base-view-screen-xl-1.png b/ui/address/__screenshots__/AddressTxs.pw.tsx_default_base-view-screen-xl-1.png
index f6e0c639a8..7432110133 100644
Binary files a/ui/address/__screenshots__/AddressTxs.pw.tsx_default_base-view-screen-xl-1.png and b/ui/address/__screenshots__/AddressTxs.pw.tsx_default_base-view-screen-xl-1.png differ
diff --git a/ui/address/__screenshots__/AddressTxs.pw.tsx_mobile_base-view-mobile-1.png b/ui/address/__screenshots__/AddressTxs.pw.tsx_mobile_base-view-mobile-1.png
index 9ec178775e..03bc8552cd 100644
Binary files a/ui/address/__screenshots__/AddressTxs.pw.tsx_mobile_base-view-mobile-1.png and b/ui/address/__screenshots__/AddressTxs.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_dark-color-mode_average-report-dark-mode-mobile-1.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_dark-color-mode_average-report-dark-mode-mobile-1.png
index f193eca4d4..cb130891fb 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_dark-color-mode_average-report-dark-mode-mobile-1.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_dark-color-mode_average-report-dark-mode-mobile-1.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_dark-color-mode_average-report-dark-mode-mobile-2.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_dark-color-mode_average-report-dark-mode-mobile-2.png
index b0bb931d9e..d78deab48d 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_dark-color-mode_average-report-dark-mode-mobile-2.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_dark-color-mode_average-report-dark-mode-mobile-2.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_average-report-dark-mode-mobile-1.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_average-report-dark-mode-mobile-1.png
index 671a01cb38..0462c76ca1 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_average-report-dark-mode-mobile-1.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_average-report-dark-mode-mobile-1.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_average-report-dark-mode-mobile-2.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_average-report-dark-mode-mobile-2.png
index e3a2f18abc..276b22360a 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_average-report-dark-mode-mobile-2.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_average-report-dark-mode-mobile-2.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_great-report-1.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_great-report-1.png
index f75f69bc5b..2cf3772046 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_great-report-1.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_great-report-1.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_great-report-2.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_great-report-2.png
index 3668c60f8f..d971302d11 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_great-report-2.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_great-report-2.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_low-report-1.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_low-report-1.png
index 69e2567395..89796e448b 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_low-report-1.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_low-report-1.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_low-report-2.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_low-report-2.png
index 3017e1181c..d504869f2c 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_low-report-2.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_default_low-report-2.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_mobile_average-report-dark-mode-mobile-1.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_mobile_average-report-dark-mode-mobile-1.png
index 5e7f44de24..9441baa4ca 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_mobile_average-report-dark-mode-mobile-1.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_mobile_average-report-dark-mode-mobile-1.png differ
diff --git a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_mobile_average-report-dark-mode-mobile-2.png b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_mobile_average-report-dark-mode-mobile-2.png
index 4c8850cc5f..766d68a40e 100644
Binary files a/ui/address/__screenshots__/SolidityscanReport.pw.tsx_mobile_average-report-dark-mode-mobile-2.png and b/ui/address/__screenshots__/SolidityscanReport.pw.tsx_mobile_average-report-dark-mode-mobile-2.png differ
diff --git a/ui/address/accountHistory/AddressAccountHistoryListItem.tsx b/ui/address/accountHistory/AddressAccountHistoryListItem.tsx
new file mode 100644
index 0000000000..46cf969932
--- /dev/null
+++ b/ui/address/accountHistory/AddressAccountHistoryListItem.tsx
@@ -0,0 +1,66 @@
+import { Box, Flex, Skeleton, Text } from '@chakra-ui/react';
+import React, { useMemo } from 'react';
+
+import type { NovesResponseData } from 'types/api/noves';
+
+import dayjs from 'lib/date/dayjs';
+import IconSvg from 'ui/shared/IconSvg';
+import LinkInternal from 'ui/shared/LinkInternal';
+import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
+import NovesFromTo from 'ui/shared/Noves/NovesFromTo';
+
+type Props = {
+  isPlaceholderData: boolean;
+  tx: NovesResponseData;
+  currentAddress: string;
+};
+
+const AddressAccountHistoryListItem = (props: Props) => {
+
+  const parsedDescription = useMemo(() => {
+    const description = props.tx.classificationData.description;
+
+    return description.endsWith('.') ? description.substring(0, description.length - 1) : description;
+  }, [ props.tx.classificationData.description ]);
+
+  return (
+    <ListItemMobile rowGap={ 4 } w="full">
+      <Skeleton borderRadius="sm" isLoaded={ !props.isPlaceholderData } w="full">
+        <Flex justifyContent="space-between" w="full">
+          <Flex columnGap={ 2 }>
+            <IconSvg
+              name="lightning"
+              height="5"
+              width="5"
+              color="gray.500"
+              _dark={{ color: 'gray.400' }}
+            />
+
+            <Text fontSize="sm" fontWeight={ 500 }>
+                Action
+            </Text>
+          </Flex>
+          <Text color="text_secondary" fontSize="sm" fontWeight={ 500 }>
+            { dayjs(props.tx.rawTransactionData.timestamp * 1000).fromNow() }
+          </Text>
+        </Flex>
+      </Skeleton>
+      <Skeleton borderRadius="sm" isLoaded={ !props.isPlaceholderData }>
+        <LinkInternal
+          href={ `/tx/${ props.tx.rawTransactionData.transactionHash }` }
+          fontWeight="bold"
+          whiteSpace="break-spaces"
+          wordBreak="break-word"
+        >
+          { parsedDescription }
+        </LinkInternal>
+      </Skeleton>
+
+      <Box maxW="full">
+        <NovesFromTo txData={ props.tx } currentAddress={ props.currentAddress } isLoaded={ !props.isPlaceholderData }/>
+      </Box>
+    </ListItemMobile>
+  );
+};
+
+export default React.memo(AddressAccountHistoryListItem);
diff --git a/ui/address/accountHistory/AddressAccountHistoryTableItem.tsx b/ui/address/accountHistory/AddressAccountHistoryTableItem.tsx
new file mode 100644
index 0000000000..c3aa61a283
--- /dev/null
+++ b/ui/address/accountHistory/AddressAccountHistoryTableItem.tsx
@@ -0,0 +1,66 @@
+import { Td, Tr, Skeleton, Text, Box } from '@chakra-ui/react';
+import React, { useMemo } from 'react';
+
+import type { NovesResponseData } from 'types/api/noves';
+
+import dayjs from 'lib/date/dayjs';
+import IconSvg from 'ui/shared/IconSvg';
+import LinkInternal from 'ui/shared/LinkInternal';
+import NovesFromTo from 'ui/shared/Noves/NovesFromTo';
+
+type Props = {
+  isPlaceholderData: boolean;
+  tx: NovesResponseData;
+  currentAddress: string;
+};
+
+const AddressAccountHistoryTableItem = (props: Props) => {
+
+  const parsedDescription = useMemo(() => {
+    const description = props.tx.classificationData.description;
+
+    return description.endsWith('.') ? description.substring(0, description.length - 1) : description;
+  }, [ props.tx.classificationData.description ]);
+
+  return (
+    <Tr>
+      <Td px={ 3 } py="18px" fontSize="sm" >
+        <Skeleton borderRadius="sm" flexShrink={ 0 } isLoaded={ !props.isPlaceholderData }>
+          <Text as="span" color="text_secondary">
+            { dayjs(props.tx.rawTransactionData.timestamp * 1000).fromNow() }
+          </Text>
+        </Skeleton>
+      </Td>
+      <Td px={ 3 } py="18px" fontSize="sm" >
+        <Skeleton borderRadius="sm" isLoaded={ !props.isPlaceholderData }>
+          <Box display="flex">
+            <IconSvg
+              name="lightning"
+              height="5"
+              width="5"
+              color="gray.500"
+              mr="8px"
+              _dark={{ color: 'gray.400' }}
+            />
+
+            <LinkInternal
+              href={ `/tx/${ props.tx.rawTransactionData.transactionHash }` }
+              fontWeight="bold"
+              whiteSpace="break-spaces"
+              wordBreak="break-word"
+            >
+              { parsedDescription }
+            </LinkInternal>
+          </Box>
+        </Skeleton>
+      </Td>
+      <Td px={ 3 } py="18px" fontSize="sm">
+        <Box flexShrink={ 0 } >
+          <NovesFromTo txData={ props.tx } currentAddress={ props.currentAddress } isLoaded={ !props.isPlaceholderData }/>
+        </Box>
+      </Td>
+    </Tr>
+  );
+};
+
+export default React.memo(AddressAccountHistoryTableItem);
diff --git a/ui/address/blocksValidated/AddressBlocksValidatedListItem.tsx b/ui/address/blocksValidated/AddressBlocksValidatedListItem.tsx
index 2db323a79c..6627e72d61 100644
--- a/ui/address/blocksValidated/AddressBlocksValidatedListItem.tsx
+++ b/ui/address/blocksValidated/AddressBlocksValidatedListItem.tsx
@@ -7,6 +7,7 @@ import type { Block } from 'types/api/block';
 import config from 'configs/app';
 import getBlockTotalReward from 'lib/block/getBlockTotalReward';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
+import { currencyUnits } from 'lib/units';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
 import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
 import Utilization from 'ui/shared/Utilization/Utilization';
@@ -42,15 +43,17 @@ const AddressBlocksValidatedListItem = (props: Props) => {
       <Flex columnGap={ 2 } w="100%">
         <Skeleton isLoaded={ !props.isLoading } fontWeight={ 500 } flexShrink={ 0 }>Gas used</Skeleton>
         <Skeleton isLoaded={ !props.isLoading } color="text_secondary">{ BigNumber(props.gas_used || 0).toFormat() }</Skeleton>
-        <Utilization
-          colorScheme="gray"
-          value={ BigNumber(props.gas_used || 0).dividedBy(BigNumber(props.gas_limit)).toNumber() }
-          isLoading={ props.isLoading }
-        />
+        { props.gas_used && props.gas_used !== '0' && (
+          <Utilization
+            colorScheme="gray"
+            value={ BigNumber(props.gas_used || 0).dividedBy(BigNumber(props.gas_limit)).toNumber() }
+            isLoading={ props.isLoading }
+          />
+        ) }
       </Flex>
       { !config.UI.views.block.hiddenFields?.total_reward && (
         <Flex columnGap={ 2 } w="100%">
-          <Skeleton isLoaded={ !props.isLoading } fontWeight={ 500 } flexShrink={ 0 }>Reward { config.chain.currency.symbol }</Skeleton>
+          <Skeleton isLoaded={ !props.isLoading } fontWeight={ 500 } flexShrink={ 0 }>Reward { currencyUnits.ether }</Skeleton>
           <Skeleton isLoaded={ !props.isLoading } color="text_secondary">{ totalReward.toFixed() }</Skeleton>
         </Flex>
       ) }
diff --git a/ui/address/blocksValidated/AddressBlocksValidatedTableItem.tsx b/ui/address/blocksValidated/AddressBlocksValidatedTableItem.tsx
index b2ca7b4e79..d6e68dfded 100644
--- a/ui/address/blocksValidated/AddressBlocksValidatedTableItem.tsx
+++ b/ui/address/blocksValidated/AddressBlocksValidatedTableItem.tsx
@@ -46,11 +46,13 @@ const AddressBlocksValidatedTableItem = (props: Props) => {
           <Skeleton isLoaded={ !props.isLoading } flexBasis="80px">
             { BigNumber(props.gas_used || 0).toFormat() }
           </Skeleton>
-          <Utilization
-            colorScheme="gray"
-            value={ BigNumber(props.gas_used || 0).dividedBy(BigNumber(props.gas_limit)).toNumber() }
-            isLoading={ props.isLoading }
-          />
+          { props.gas_used && props.gas_used !== '0' && (
+            <Utilization
+              colorScheme="gray"
+              value={ BigNumber(props.gas_used).dividedBy(BigNumber(props.gas_limit)).toNumber() }
+              isLoading={ props.isLoading }
+            />
+          ) }
         </Flex>
       </Td>
       { !config.UI.views.block.hiddenFields?.total_reward && (
diff --git a/ui/address/coinBalance/AddressCoinBalanceChart.tsx b/ui/address/coinBalance/AddressCoinBalanceChart.tsx
index 483de97796..4e551f1e8b 100644
--- a/ui/address/coinBalance/AddressCoinBalanceChart.tsx
+++ b/ui/address/coinBalance/AddressCoinBalanceChart.tsx
@@ -3,6 +3,7 @@ import React from 'react';
 
 import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';
+import { currencyUnits } from 'lib/units';
 import ChartWidget from 'ui/shared/chart/ChartWidget';
 
 interface Props {
@@ -26,7 +27,7 @@ const AddressCoinBalanceChart = ({ addressHash }: Props) => {
       items={ items }
       isLoading={ isPending }
       h="300px"
-      units={ config.chain.currency.symbol }
+      units={ currencyUnits.ether }
     />
   );
 };
diff --git a/ui/address/coinBalance/AddressCoinBalanceHistory.tsx b/ui/address/coinBalance/AddressCoinBalanceHistory.tsx
index 8672520b18..31be2c4006 100644
--- a/ui/address/coinBalance/AddressCoinBalanceHistory.tsx
+++ b/ui/address/coinBalance/AddressCoinBalanceHistory.tsx
@@ -5,8 +5,8 @@ import React from 'react';
 import type { AddressCoinBalanceHistoryResponse } from 'types/api/address';
 import type { PaginationParams } from 'ui/shared/pagination/types';
 
-import config from 'configs/app';
 import type { ResourceError } from 'lib/api/resources';
+import { currencyUnits } from 'lib/units';
 import ActionBar from 'ui/shared/ActionBar';
 import DataListDisplay from 'ui/shared/DataListDisplay';
 import Pagination from 'ui/shared/pagination/Pagination';
@@ -32,7 +32,7 @@ const AddressCoinBalanceHistory = ({ query }: Props) => {
               <Th width="20%">Block</Th>
               <Th width="20%">Txn</Th>
               <Th width="20%">Age</Th>
-              <Th width="20%" isNumeric pr={ 1 }>Balance { config.chain.currency.symbol }</Th>
+              <Th width="20%" isNumeric pr={ 1 }>Balance { currencyUnits.ether }</Th>
               <Th width="20%" isNumeric>Delta</Th>
             </Tr>
           </Thead>
diff --git a/ui/address/coinBalance/AddressCoinBalanceListItem.tsx b/ui/address/coinBalance/AddressCoinBalanceListItem.tsx
index f92ce41215..19ebf6f420 100644
--- a/ui/address/coinBalance/AddressCoinBalanceListItem.tsx
+++ b/ui/address/coinBalance/AddressCoinBalanceListItem.tsx
@@ -4,9 +4,9 @@ import React from 'react';
 
 import type { AddressCoinBalanceHistoryItem } from 'types/api/address';
 
-import config from 'configs/app';
 import { WEI, ZERO } from 'lib/consts';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
+import { currencyUnits } from 'lib/units';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
 import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
@@ -25,7 +25,7 @@ const AddressCoinBalanceListItem = (props: Props) => {
     <ListItemMobile rowGap={ 2 } isAnimated>
       <Flex justifyContent="space-between" w="100%">
         <Skeleton isLoaded={ !props.isLoading } fontWeight={ 600 }>
-          { BigNumber(props.value).div(WEI).dp(8).toFormat() } { config.chain.currency.symbol }
+          { BigNumber(props.value).div(WEI).dp(8).toFormat() } { currencyUnits.ether }
         </Skeleton>
         <Skeleton isLoaded={ !props.isLoading }>
           <Stat flexGrow="0">
diff --git a/ui/address/contract/ContractCode.pw.tsx b/ui/address/contract/ContractCode.pw.tsx
index 52c7fc9682..cbd660a941 100644
--- a/ui/address/contract/ContractCode.pw.tsx
+++ b/ui/address/contract/ContractCode.pw.tsx
@@ -2,16 +2,20 @@ import { test as base, expect } from '@playwright/experimental-ct-react';
 import React from 'react';
 
 import * as addressMock from 'mocks/address/address';
+import { contractAudits } from 'mocks/contract/audits';
 import * as contractMock from 'mocks/contract/info';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
 import * as socketServer from 'playwright/fixtures/socketServer';
 import TestApp from 'playwright/TestApp';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
 import MockAddressPage from 'ui/address/testUtils/MockAddressPage';
 
 import ContractCode from './ContractCode';
 
 const addressHash = 'hash';
 const CONTRACT_API_URL = buildApiUrl('contract', { hash: addressHash });
+const CONTRACT_AUDITS_API_URL = buildApiUrl('contract_security_audits', { hash: addressHash });
 const hooksConfig = {
   router: {
     query: { hash: addressHash },
@@ -122,6 +126,9 @@ test('verified with multiple sources', async({ mount, page }) => {
 
   await page.getByRole('button', { name: 'View external libraries' }).click();
   await expect(section).toHaveScreenshot();
+
+  await page.getByRole('button', { name: 'Open source code in IDE' }).click();
+  await expect(section).toHaveScreenshot();
 });
 
 test('verified via sourcify', async({ mount, page }) => {
@@ -226,3 +233,54 @@ test('non verified', async({ mount, page }) => {
 
   await expect(component).toHaveScreenshot();
 });
+
+test.describe('with audits feature', () => {
+
+  const withAuditsTest = test.extend({
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    context: contextWithEnvs(configs.UIEnvs.hasContractAuditReports) as any,
+  });
+
+  withAuditsTest('no audits', async({ mount, page }) => {
+    await page.route(CONTRACT_API_URL, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(contractMock.verified),
+    }));
+    await page.route(CONTRACT_AUDITS_API_URL, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify({ items: [] }),
+    }));
+    await page.route('https://cdn.jsdelivr.net/npm/monaco-editor@0.33.0/**', (route) => route.abort());
+
+    const component = await mount(
+      <TestApp>
+        <ContractCode addressHash={ addressHash } noSocket/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+
+  withAuditsTest('has audits', async({ mount, page }) => {
+    await page.route(CONTRACT_API_URL, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(contractMock.verified),
+    }));
+    await page.route(CONTRACT_AUDITS_API_URL, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(contractAudits),
+    }));
+
+    await page.route('https://cdn.jsdelivr.net/npm/monaco-editor@0.33.0/**', (route) => route.abort());
+
+    const component = await mount(
+      <TestApp>
+        <ContractCode addressHash={ addressHash } noSocket/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+});
diff --git a/ui/address/contract/ContractCode.tsx b/ui/address/contract/ContractCode.tsx
index cfa2e5f003..7b77ebe3b5 100644
--- a/ui/address/contract/ContractCode.tsx
+++ b/ui/address/contract/ContractCode.tsx
@@ -7,7 +7,9 @@ import type { Address as AddressInfo } from 'types/api/address';
 
 import { route } from 'nextjs-routes';
 
+import config from 'configs/app';
 import useApiQuery, { getResourceKey } from 'lib/api/useApiQuery';
+import { CONTRACT_LICENSES } from 'lib/contracts/licenses';
 import dayjs from 'lib/date/dayjs';
 import useSocketChannel from 'lib/socket/useSocketChannel';
 import useSocketMessage from 'lib/socket/useSocketMessage';
@@ -18,6 +20,7 @@ import LinkExternal from 'ui/shared/LinkExternal';
 import LinkInternal from 'ui/shared/LinkInternal';
 import RawDataSnippet from 'ui/shared/RawDataSnippet';
 
+import ContractSecurityAudits from './ContractSecurityAudits';
 import ContractSourceCode from './ContractSourceCode';
 
 type Props = {
@@ -26,10 +29,17 @@ type Props = {
   noSocket?: boolean;
 }
 
-const InfoItem = chakra(({ label, value, className, isLoading }: { label: string; value: string; className?: string; isLoading: boolean }) => (
+type InfoItemProps = {
+  label: string;
+  content: string | React.ReactNode;
+  className?: string;
+  isLoading: boolean;
+}
+
+const InfoItem = chakra(({ label, content, className, isLoading }: InfoItemProps) => (
   <GridItem display="flex" columnGap={ 6 } wordBreak="break-all" className={ className } alignItems="baseline">
     <Skeleton isLoaded={ !isLoading } w="170px" flexShrink={ 0 } fontWeight={ 500 }>{ label }</Skeleton>
-    <Skeleton isLoaded={ !isLoading }>{ value }</Skeleton>
+    <Skeleton isLoaded={ !isLoading }>{ content }</Skeleton>
   </GridItem>
 ));
 
@@ -109,6 +119,23 @@ const ContractCode = ({ addressHash, noSocket }: Props) => {
     </Button>
   );
 
+  const licenseLink = (() => {
+    if (!data?.license_type) {
+      return null;
+    }
+
+    const license = CONTRACT_LICENSES.find((license) => license.type === data.license_type);
+    if (!license || license.type === 'none') {
+      return null;
+    }
+
+    return (
+      <LinkExternal href={ license.url }>
+        { license.label }
+      </LinkExternal>
+    );
+  })();
+
   const constructorArgs = (() => {
     if (!data?.decoded_constructor_args) {
       return data?.constructor_args;
@@ -221,15 +248,23 @@ const ContractCode = ({ addressHash, noSocket }: Props) => {
       </Flex>
       { data?.is_verified && (
         <Grid templateColumns={{ base: '1fr', lg: '1fr 1fr' }} rowGap={ 4 } columnGap={ 6 } mb={ 8 }>
-          { data.name && <InfoItem label="Contract name" value={ data.name } isLoading={ isPlaceholderData }/> }
-          { data.compiler_version && <InfoItem label="Compiler version" value={ data.compiler_version } isLoading={ isPlaceholderData }/> }
-          { data.evm_version && <InfoItem label="EVM version" value={ data.evm_version } textTransform="capitalize" isLoading={ isPlaceholderData }/> }
+          { data.name && <InfoItem label="Contract name" content={ data.name } isLoading={ isPlaceholderData }/> }
+          { data.compiler_version && <InfoItem label="Compiler version" content={ data.compiler_version } isLoading={ isPlaceholderData }/> }
+          { data.evm_version && <InfoItem label="EVM version" content={ data.evm_version } textTransform="capitalize" isLoading={ isPlaceholderData }/> }
+          { licenseLink && <InfoItem label="License" content={ licenseLink } isLoading={ isPlaceholderData }/> }
           { typeof data.optimization_enabled === 'boolean' &&
-            <InfoItem label="Optimization enabled" value={ data.optimization_enabled ? 'true' : 'false' } isLoading={ isPlaceholderData }/> }
-          { data.optimization_runs && <InfoItem label="Optimization runs" value={ String(data.optimization_runs) } isLoading={ isPlaceholderData }/> }
+            <InfoItem label="Optimization enabled" content={ data.optimization_enabled ? 'true' : 'false' } isLoading={ isPlaceholderData }/> }
+          { data.optimization_runs && <InfoItem label="Optimization runs" content={ String(data.optimization_runs) } isLoading={ isPlaceholderData }/> }
           { data.verified_at &&
-            <InfoItem label="Verified at" value={ dayjs(data.verified_at).format('llll') } wordBreak="break-word" isLoading={ isPlaceholderData }/> }
-          { data.file_path && <InfoItem label="Contract file path" value={ data.file_path } wordBreak="break-word" isLoading={ isPlaceholderData }/> }
+            <InfoItem label="Verified at" content={ dayjs(data.verified_at).format('llll') } wordBreak="break-word" isLoading={ isPlaceholderData }/> }
+          { data.file_path && <InfoItem label="Contract file path" content={ data.file_path } wordBreak="break-word" isLoading={ isPlaceholderData }/> }
+          { config.UI.hasContractAuditReports && (
+            <InfoItem
+              label="Security audit"
+              content={ <ContractSecurityAudits addressHash={ addressHash }/> }
+              isLoading={ isPlaceholderData }
+            />
+          ) }
         </Grid>
       ) }
       <Flex flexDir="column" rowGap={ 6 }>
diff --git a/ui/address/contract/ContractCodeIdes.tsx b/ui/address/contract/ContractCodeIdes.tsx
new file mode 100644
index 0000000000..5207f74c68
--- /dev/null
+++ b/ui/address/contract/ContractCodeIdes.tsx
@@ -0,0 +1,75 @@
+import { Flex, Button, chakra, Popover, PopoverTrigger, PopoverBody, PopoverContent, useDisclosure, Image, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import config from 'configs/app';
+import IconSvg from 'ui/shared/IconSvg';
+import LinkExternal from 'ui/shared/LinkExternal';
+
+interface Props {
+  className?: string;
+  hash: string;
+}
+
+const ContractCodeIde = ({ className, hash }: Props) => {
+  const { isOpen, onToggle, onClose } = useDisclosure();
+  const defaultIconColor = useColorModeValue('gray.600', 'gray.500');
+
+  const ideLinks = React.useMemo(() => {
+    return config.UI.ides.items
+      .map((ide) => {
+        const url = decodeURIComponent(ide.url.replace('{hash}', hash).replace('{domain}', config.app.host || ''));
+        const icon = 'icon_url' in ide ?
+          <Image boxSize={ 5 } mr={ 2 } src={ ide.icon_url } alt={ `${ ide.title } icon` }/> :
+          <IconSvg name="ABI_slim" boxSize={ 5 } color={ defaultIconColor } mr={ 2 }/>;
+
+        return (
+          <LinkExternal key={ ide.title } href={ url } display="inline-flex" alignItems="center">
+            { icon }
+            { ide.title }
+          </LinkExternal>
+        );
+      });
+  }, [ defaultIconColor, hash ]);
+
+  if (ideLinks.length === 0) {
+    return null;
+  }
+
+  return (
+    <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy>
+      <PopoverTrigger>
+        <Button
+          className={ className }
+          size="sm"
+          variant="outline"
+          colorScheme="gray"
+          onClick={ onToggle }
+          aria-label="Open source code in IDE"
+          fontWeight={ 500 }
+          px={ 2 }
+          h="32px"
+          flexShrink={ 0 }
+        >
+          <span>Open in</span>
+          <IconSvg name="arrows/east-mini" transform={ isOpen ? 'rotate(90deg)' : 'rotate(-90deg)' } transitionDuration="faster" boxSize={ 5 }/>
+        </Button>
+      </PopoverTrigger>
+      <PopoverContent w="240px">
+        <PopoverBody >
+          <chakra.span color="text_secondary" fontSize="xs">Redactors</chakra.span>
+          <Flex
+            flexDir="column"
+            alignItems="flex-start"
+            columnGap={ 6 }
+            rowGap={ 3 }
+            mt={ 3 }
+          >
+            { ideLinks }
+          </Flex>
+        </PopoverBody>
+      </PopoverContent>
+    </Popover>
+  );
+};
+
+export default React.memo(chakra(ContractCodeIde));
diff --git a/ui/address/contract/ContractConnectWallet.tsx b/ui/address/contract/ContractConnectWallet.tsx
index 1673030a76..9263495bce 100644
--- a/ui/address/contract/ContractConnectWallet.tsx
+++ b/ui/address/contract/ContractConnectWallet.tsx
@@ -1,47 +1,25 @@
 import { Alert, Button, Flex } from '@chakra-ui/react';
-import { useWeb3Modal, useWeb3ModalState } from '@web3modal/wagmi/react';
 import React from 'react';
-import { useAccount, useDisconnect } from 'wagmi';
 
 import useIsMobile from 'lib/hooks/useIsMobile';
-import * as mixpanel from 'lib/mixpanel/index';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import useWallet from 'ui/snippets/walletMenu/useWallet';
 
 const ContractConnectWallet = () => {
-  const { open } = useWeb3Modal();
-  const { open: isOpen } = useWeb3ModalState();
-  const { disconnect } = useDisconnect();
+  const { isModalOpening, isModalOpen, connect, disconnect, address, isWalletConnected } = useWallet({ source: 'Smart contracts' });
   const isMobile = useIsMobile();
-  const [ isModalOpening, setIsModalOpening ] = React.useState(false);
-
-  const handleConnect = React.useCallback(async() => {
-    setIsModalOpening(true);
-    await open();
-    setIsModalOpening(false);
-    mixpanel.logEvent(mixpanel.EventTypes.WALLET_CONNECT, { Source: 'Smart contracts', Status: 'Started' });
-  }, [ open ]);
-
-  const handleAccountConnected = React.useCallback(({ isReconnected }: { isReconnected: boolean }) => {
-    !isReconnected && mixpanel.logEvent(mixpanel.EventTypes.WALLET_CONNECT, { Source: 'Smart contracts', Status: 'Connected' });
-  }, []);
-
-  const handleDisconnect = React.useCallback(() => {
-    disconnect();
-  }, [ disconnect ]);
-
-  const { address, isDisconnected } = useAccount({ onConnect: handleAccountConnected });
 
   const content = (() => {
-    if (isDisconnected || !address) {
+    if (!isWalletConnected) {
       return (
         <>
           <span>Disconnected</span>
           <Button
             ml={ 3 }
-            onClick={ handleConnect }
+            onClick={ connect }
             size="sm"
             variant="outline"
-            isLoading={ isModalOpening || isOpen }
+            isLoading={ isModalOpening || isModalOpen }
             loadingText="Connect wallet"
           >
               Connect wallet
@@ -61,7 +39,7 @@ const ContractConnectWallet = () => {
             ml={ 2 }
           />
         </Flex>
-        <Button onClick={ handleDisconnect } size="sm" variant="outline">Disconnect</Button>
+        <Button onClick={ disconnect } size="sm" variant="outline">Disconnect</Button>
       </Flex>
     );
   })();
diff --git a/ui/address/contract/ContractMethodCallable.tsx b/ui/address/contract/ContractMethodCallable.tsx
deleted file mode 100644
index 2009317ffc..0000000000
--- a/ui/address/contract/ContractMethodCallable.tsx
+++ /dev/null
@@ -1,187 +0,0 @@
-import { Box, Button, chakra, Flex } from '@chakra-ui/react';
-import React from 'react';
-import type { SubmitHandler } from 'react-hook-form';
-import { useForm, FormProvider } from 'react-hook-form';
-
-import type { MethodFormFields, ContractMethodCallResult } from './types';
-import type { SmartContractMethodInput, SmartContractMethod } from 'types/api/contract';
-
-import config from 'configs/app';
-import * as mixpanel from 'lib/mixpanel/index';
-import IconSvg from 'ui/shared/IconSvg';
-
-import ContractMethodCallableRow from './ContractMethodCallableRow';
-import { formatFieldValues, transformFieldsToArgs } from './utils';
-
-interface ResultComponentProps<T extends SmartContractMethod> {
-  item: T;
-  result: ContractMethodCallResult<T>;
-  onSettle: () => void;
-}
-
-interface Props<T extends SmartContractMethod> {
-  data: T;
-  onSubmit: (data: T, args: Array<string | Array<unknown>>) => Promise<ContractMethodCallResult<T>>;
-  resultComponent: (props: ResultComponentProps<T>) => JSX.Element | null;
-  isWrite?: boolean;
-}
-
-// groupName%groupIndex:inputName%inputIndex
-const getFormFieldName = (input: { index: number; name: string }, group?: { index: number; name: string }) =>
-  `${ group ? `${ group.name }%${ group.index }:` : '' }${ input.name || 'input' }%${ input.index }`;
-
-const ContractMethodCallable = <T extends SmartContractMethod>({ data, onSubmit, resultComponent: ResultComponent, isWrite }: Props<T>) => {
-
-  const [ result, setResult ] = React.useState<ContractMethodCallResult<T>>();
-  const [ isLoading, setLoading ] = React.useState(false);
-
-  const inputs: Array<SmartContractMethodInput> = React.useMemo(() => {
-    return [
-      ...('inputs' in data ? data.inputs : []),
-      ...('stateMutability' in data && data.stateMutability === 'payable' ? [ {
-        name: `Send native ${ config.chain.currency.symbol }`,
-        type: 'uint256' as const,
-        internalType: 'uint256' as const,
-        fieldType: 'native_coin' as const,
-      } ] : []),
-    ];
-  }, [ data ]);
-
-  const formApi = useForm<MethodFormFields>({
-    mode: 'onBlur',
-  });
-
-  const handleTxSettle = React.useCallback(() => {
-    setLoading(false);
-  }, []);
-
-  const handleFormChange = React.useCallback(() => {
-    result && setResult(undefined);
-  }, [ result ]);
-
-  const onFormSubmit: SubmitHandler<MethodFormFields> = React.useCallback(async(formData) => {
-    const formattedData = formatFieldValues(formData, inputs);
-    const args = transformFieldsToArgs(formattedData);
-
-    setResult(undefined);
-    setLoading(true);
-
-    onSubmit(data, args)
-      .then((result) => {
-        setResult(result);
-      })
-      .catch((error) => {
-        setResult(error?.error || error?.data || (error?.reason && { message: error.reason }) || error);
-        setLoading(false);
-      })
-      .finally(() => {
-        mixpanel.logEvent(mixpanel.EventTypes.CONTRACT_INTERACTION, {
-          'Method type': isWrite ? 'Write' : 'Read',
-          'Method name': 'name' in data ? data.name : 'Fallback',
-        });
-      });
-  }, [ inputs, onSubmit, data, isWrite ]);
-
-  return (
-    <Box>
-      <FormProvider { ...formApi }>
-        <chakra.form
-          noValidate
-          onSubmit={ formApi.handleSubmit(onFormSubmit) }
-          onChange={ handleFormChange }
-        >
-          <Flex
-            flexDir="column"
-            rowGap={ 3 }
-            mb={ 3 }
-            _empty={{ display: 'none' }}
-          >
-            { inputs.map((input, index) => {
-              const fieldName = getFormFieldName({ name: input.name, index });
-
-              if (input.type === 'tuple' && input.components) {
-                return (
-                  <React.Fragment key={ fieldName }>
-                    { index !== 0 && <><Box h={{ base: 0, lg: 3 }}/><div/></> }
-                    <Box
-                      fontWeight={ 500 }
-                      lineHeight="20px"
-                      py={{ lg: '6px' }}
-                      fontSize="sm"
-                      wordBreak="break-word"
-                    >
-                      { input.name } ({ input.type })
-                    </Box>
-                    { input.components.map((component, componentIndex) => {
-                      const fieldName = getFormFieldName(
-                        { name: component.name, index: componentIndex },
-                        { name: input.name, index },
-                      );
-
-                      return (
-                        <ContractMethodCallableRow
-                          key={ fieldName }
-                          fieldName={ fieldName }
-                          argName={ component.name }
-                          argType={ component.type }
-                          isDisabled={ isLoading }
-                          onChange={ handleFormChange }
-                          isGrouped
-                        />
-                      );
-                    }) }
-                    { index !== inputs.length - 1 && <><Box h={{ base: 0, lg: 3 }}/><div/></> }
-                  </React.Fragment>
-                );
-              }
-
-              return (
-                <ContractMethodCallableRow
-                  key={ fieldName }
-                  fieldName={ fieldName }
-                  fieldType={ input.fieldType }
-                  argName={ input.name }
-                  argType={ input.type }
-                  isDisabled={ isLoading }
-                  isOptional={ input.fieldType === 'native_coin' && inputs.length > 1 }
-                  onChange={ handleFormChange }
-                />
-              );
-            }) }
-          </Flex>
-          <Button
-            isLoading={ isLoading }
-            loadingText={ isWrite ? 'Write' : 'Read' }
-            variant="outline"
-            size="sm"
-            flexShrink={ 0 }
-            width="min-content"
-            px={ 4 }
-            type="submit"
-          >
-            { isWrite ? 'Write' : 'Read' }
-          </Button>
-        </chakra.form>
-      </FormProvider>
-      { 'outputs' in data && !isWrite && data.outputs.length > 0 && (
-        <Flex mt={ 3 } fontSize="sm">
-          <IconSvg name="arrows/down-right" boxSize={ 5 } mr={ 1 }/>
-          <p>
-            { data.outputs.map(({ type, name }, index) => {
-              return (
-                <>
-                  <chakra.span fontWeight={ 500 }>{ name } </chakra.span>
-                  <span>{ name ? `(${ type })` : type }</span>
-                  { index < data.outputs.length - 1 && <span>, </span> }
-                </>
-              );
-            }) }
-          </p>
-        </Flex>
-      ) }
-      { result && <ResultComponent item={ data } result={ result } onSettle={ handleTxSettle }/> }
-    </Box>
-  );
-};
-
-export default React.memo(ContractMethodCallable) as typeof ContractMethodCallable;
diff --git a/ui/address/contract/ContractMethodCallableRow.tsx b/ui/address/contract/ContractMethodCallableRow.tsx
deleted file mode 100644
index 2cc01d7861..0000000000
--- a/ui/address/contract/ContractMethodCallableRow.tsx
+++ /dev/null
@@ -1,84 +0,0 @@
-import { Box, Flex, useColorModeValue } from '@chakra-ui/react';
-import React from 'react';
-import { useFormContext } from 'react-hook-form';
-
-import type { MethodFormFields } from './types';
-import type { SmartContractMethodArgType, SmartContractMethodInput } from 'types/api/contract';
-
-import ContractMethodField from './ContractMethodField';
-import ContractMethodFieldArray from './ContractMethodFieldArray';
-import { ARRAY_REGEXP } from './utils';
-
-interface Props {
-  fieldName: string;
-  fieldType?: SmartContractMethodInput['fieldType'];
-  argName: string;
-  argType: SmartContractMethodArgType;
-  onChange: () => void;
-  isDisabled: boolean;
-  isGrouped?: boolean;
-  isOptional?: boolean;
-}
-
-const ContractMethodCallableRow = ({ argName, fieldName, fieldType, argType, onChange, isDisabled, isGrouped, isOptional }: Props) => {
-  const { control, getValues, setValue } = useFormContext<MethodFormFields>();
-  const arrayTypeMatch = argType.match(ARRAY_REGEXP);
-  const nativeCoinFieldBgColor = useColorModeValue('blackAlpha.50', 'whiteAlpha.100');
-
-  const content = arrayTypeMatch ? (
-    <ContractMethodFieldArray
-      name={ fieldName }
-      argType={ arrayTypeMatch[1] as SmartContractMethodArgType }
-      size={ Number(arrayTypeMatch[2] || Infinity) }
-      control={ control }
-      setValue={ setValue }
-      getValues={ getValues }
-      isDisabled={ isDisabled }
-      onChange={ onChange }
-    />
-  ) : (
-    <ContractMethodField
-      name={ fieldName }
-      argType={ argType }
-      placeholder={ argType }
-      control={ control }
-      setValue={ setValue }
-      getValues={ getValues }
-      isDisabled={ isDisabled }
-      isOptional={ isOptional }
-      onChange={ onChange }
-    />
-  );
-
-  const isNativeCoinField = fieldType === 'native_coin';
-
-  return (
-    <Flex
-      flexDir={{ base: 'column', lg: 'row' }}
-      columnGap={ 3 }
-      rowGap={{ base: 2, lg: 0 }}
-      bgColor={ isNativeCoinField ? nativeCoinFieldBgColor : undefined }
-      py={ isNativeCoinField ? 1 : undefined }
-      px={ isNativeCoinField ? '6px' : undefined }
-      mx={ isNativeCoinField ? '-6px' : undefined }
-      borderRadius="base"
-    >
-      <Box
-        position="relative"
-        fontWeight={ 500 }
-        lineHeight="20px"
-        py={{ lg: '6px' }}
-        fontSize="sm"
-        color={ isGrouped ? 'text_secondary' : 'initial' }
-        wordBreak="break-word"
-        w={{ lg: '250px' }}
-        flexShrink={ 0 }
-      >
-        { argName }{ isOptional ? '' : '*' } ({ argType })
-      </Box>
-      { content }
-    </Flex>
-  );
-};
-
-export default React.memo(ContractMethodCallableRow);
diff --git a/ui/address/contract/ContractMethodConstant.tsx b/ui/address/contract/ContractMethodConstant.tsx
index 568f4b2ee5..016668e89b 100644
--- a/ui/address/contract/ContractMethodConstant.tsx
+++ b/ui/address/contract/ContractMethodConstant.tsx
@@ -2,11 +2,12 @@ import { Checkbox, Flex, chakra } from '@chakra-ui/react';
 import BigNumber from 'bignumber.js';
 import type { ChangeEvent } from 'react';
 import React from 'react';
+import { getAddress } from 'viem';
 
 import type { SmartContractMethodOutput } from 'types/api/contract';
 
-import config from 'configs/app';
 import { WEI } from 'lib/consts';
+import { currencyUnits } from 'lib/units';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 
 function castValueToString(value: number | string | boolean | object | bigint | undefined): string {
@@ -32,17 +33,17 @@ interface Props {
 
 const ContractMethodStatic = ({ data }: Props) => {
   const [ value, setValue ] = React.useState<string>(castValueToString(data.value));
-  const [ label, setLabel ] = React.useState('WEI');
+  const [ label, setLabel ] = React.useState(currencyUnits.wei.toUpperCase());
 
   const handleCheckboxChange = React.useCallback((event: ChangeEvent<HTMLInputElement>) => {
     const initialValue = castValueToString(data.value);
 
     if (event.target.checked) {
       setValue(BigNumber(initialValue).div(WEI).toFixed());
-      setLabel(config.chain.currency.symbol || 'ETH');
+      setLabel(currencyUnits.ether.toUpperCase());
     } else {
       setValue(BigNumber(initialValue).toFixed());
-      setLabel('WEI');
+      setLabel(currencyUnits.wei.toUpperCase());
     }
   }, [ data.value ]);
 
@@ -50,7 +51,7 @@ const ContractMethodStatic = ({ data }: Props) => {
     if (typeof data.value === 'string' && data.type === 'address' && data.value) {
       return (
         <AddressEntity
-          address={{ hash: data.value }}
+          address={{ hash: getAddress(data.value) }}
           noIcon
         />
       );
diff --git a/ui/address/contract/ContractMethodField.tsx b/ui/address/contract/ContractMethodField.tsx
deleted file mode 100644
index 47837114f6..0000000000
--- a/ui/address/contract/ContractMethodField.tsx
+++ /dev/null
@@ -1,192 +0,0 @@
-import {
-  Box,
-  FormControl,
-  Input,
-  InputGroup,
-  InputRightElement,
-  useColorModeValue,
-} from '@chakra-ui/react';
-import React from 'react';
-import type { Control, ControllerRenderProps, FieldError, UseFormGetValues, UseFormSetValue, UseFormStateReturn } from 'react-hook-form';
-import { Controller } from 'react-hook-form';
-import { NumericFormat } from 'react-number-format';
-import { isAddress, isHex, getAddress } from 'viem';
-
-import type { MethodFormFields } from './types';
-import type { SmartContractMethodArgType } from 'types/api/contract';
-
-import ClearButton from 'ui/shared/ClearButton';
-
-import ContractMethodFieldZeroes from './ContractMethodFieldZeroes';
-import { INT_REGEXP, BYTES_REGEXP, getIntBoundaries, formatBooleanValue } from './utils';
-
-interface Props {
-  name: string;
-  index?: number;
-  groupName?: string;
-  placeholder: string;
-  argType: SmartContractMethodArgType;
-  control: Control<MethodFormFields>;
-  setValue: UseFormSetValue<MethodFormFields>;
-  getValues: UseFormGetValues<MethodFormFields>;
-  isDisabled: boolean;
-  isOptional?: boolean;
-  onChange: () => void;
-}
-
-const ContractMethodField = ({ control, name, groupName, index, argType, placeholder, setValue, getValues, isDisabled, isOptional, onChange }: Props) => {
-  const ref = React.useRef<HTMLInputElement>(null);
-  const bgColor = useColorModeValue('white', 'black');
-
-  const handleClear = React.useCallback(() => {
-    setValue(name, '');
-    onChange();
-    ref.current?.focus();
-  }, [ name, onChange, setValue ]);
-
-  const handleAddZeroesClick = React.useCallback((power: number) => {
-    const value = groupName && index !== undefined ? getValues()[groupName][index] : getValues()[name];
-    const zeroes = Array(power).fill('0').join('');
-    const newValue = value ? value + zeroes : '1' + zeroes;
-    setValue(name, newValue);
-    onChange();
-  }, [ getValues, groupName, index, name, onChange, setValue ]);
-
-  const intMatch = React.useMemo(() => {
-    const match = argType.match(INT_REGEXP);
-    if (!match) {
-      return null;
-    }
-
-    const [ , isUnsigned, power = '256' ] = match;
-    const [ min, max ] = getIntBoundaries(Number(power), Boolean(isUnsigned));
-
-    return { isUnsigned, power, min, max };
-  }, [ argType ]);
-
-  const bytesMatch = React.useMemo(() => {
-    return argType.match(BYTES_REGEXP);
-  }, [ argType ]);
-
-  const renderInput = React.useCallback((
-    { field, formState }: { field: ControllerRenderProps<MethodFormFields>; formState: UseFormStateReturn<MethodFormFields> },
-  ) => {
-    const error: FieldError | undefined = index !== undefined && groupName !== undefined ?
-      (formState.errors[groupName] as unknown as Array<FieldError>)?.[index] :
-      formState.errors[name];
-
-    // show control for all inputs which allows to insert 10^18 or greater numbers
-    const hasZerosControl = intMatch && Number(intMatch.power) >= 64;
-
-    return (
-      <Box w="100%">
-        <FormControl
-          id={ name }
-          isDisabled={ isDisabled }
-        >
-          <InputGroup size="xs">
-            <Input
-              { ...field }
-              { ...(intMatch ? {
-                as: NumericFormat,
-                thousandSeparator: ' ',
-                decimalScale: 0,
-                allowNegative: !intMatch.isUnsigned,
-              } : {}) }
-              ref={ ref }
-              isInvalid={ Boolean(error) }
-              required={ !isOptional }
-              placeholder={ placeholder }
-              paddingRight={ hasZerosControl ? '120px' : '40px' }
-              autoComplete="off"
-              bgColor={ bgColor }
-            />
-            <InputRightElement w="auto" right={ 1 }>
-              { typeof field.value === 'string' && field.value.replace('\n', '') && <ClearButton onClick={ handleClear } isDisabled={ isDisabled }/> }
-              { hasZerosControl && <ContractMethodFieldZeroes onClick={ handleAddZeroesClick } isDisabled={ isDisabled }/> }
-            </InputRightElement>
-          </InputGroup>
-        </FormControl>
-        { error && <Box color="error" fontSize="sm" mt={ 1 }>{ error.message }</Box> }
-      </Box>
-    );
-  }, [ index, groupName, name, intMatch, isDisabled, isOptional, placeholder, bgColor, handleClear, handleAddZeroesClick ]);
-
-  const validate = React.useCallback((_value: string | Array<string> | undefined) => {
-    if (typeof _value === 'object' || !_value) {
-      return;
-    }
-
-    const value = _value.replace('\n', '');
-
-    if (!value && !isOptional) {
-      return 'Field is required';
-    }
-
-    if (argType === 'address') {
-      if (!isAddress(value)) {
-        return 'Invalid address format';
-      }
-
-      // all lowercase addresses are valid
-      const isInLowerCase = value === value.toLowerCase();
-      if (isInLowerCase) {
-        return true;
-      }
-
-      // check if address checksum is valid
-      return getAddress(value) === value ? true : 'Invalid address checksum';
-    }
-
-    if (intMatch) {
-      const formattedValue = Number(value.replace(/\s/g, ''));
-
-      if (Object.is(formattedValue, NaN)) {
-        return 'Invalid integer format';
-      }
-
-      if (formattedValue > intMatch.max || formattedValue < intMatch.min) {
-        const lowerBoundary = intMatch.isUnsigned ? '0' : `-1 * 2 ^ ${ Number(intMatch.power) / 2 }`;
-        const upperBoundary = intMatch.isUnsigned ? `2 ^ ${ intMatch.power } - 1` : `2 ^ ${ Number(intMatch.power) / 2 } - 1`;
-        return `Value should be in range from "${ lowerBoundary }" to "${ upperBoundary }" inclusively`;
-      }
-
-      return true;
-    }
-
-    if (argType === 'bool') {
-      const formattedValue = formatBooleanValue(value);
-      if (formattedValue === undefined) {
-        return 'Invalid boolean format. Allowed values: 0, 1, true, false';
-      }
-    }
-
-    if (bytesMatch) {
-      const [ , length ] = bytesMatch;
-
-      if (!isHex(value)) {
-        return 'Invalid bytes format';
-      }
-
-      if (length) {
-        const valueLengthInBytes = value.replace('0x', '').length / 2;
-        return valueLengthInBytes !== Number(length) ? `Value should be ${ length } bytes in length` : true;
-      }
-
-      return true;
-    }
-
-    return true;
-  }, [ isOptional, argType, intMatch, bytesMatch ]);
-
-  return (
-    <Controller
-      name={ name }
-      control={ control }
-      render={ renderInput }
-      rules={{ required: isOptional ? false : 'Field is required', validate }}
-    />
-  );
-};
-
-export default React.memo(ContractMethodField);
diff --git a/ui/address/contract/ContractMethodFieldArray.tsx b/ui/address/contract/ContractMethodFieldArray.tsx
deleted file mode 100644
index 35018b2f7f..0000000000
--- a/ui/address/contract/ContractMethodFieldArray.tsx
+++ /dev/null
@@ -1,106 +0,0 @@
-import { Flex, IconButton } from '@chakra-ui/react';
-import React from 'react';
-import type { Control, UseFormGetValues, UseFormSetValue } from 'react-hook-form';
-import { useFieldArray } from 'react-hook-form';
-
-import type { MethodFormFields } from './types';
-import type { SmartContractMethodArgType } from 'types/api/contract';
-
-import IconSvg from 'ui/shared/IconSvg';
-
-import ContractMethodField from './ContractMethodField';
-
-interface Props {
-  name: string;
-  size: number;
-  argType: SmartContractMethodArgType;
-  control: Control<MethodFormFields>;
-  setValue: UseFormSetValue<MethodFormFields>;
-  getValues: UseFormGetValues<MethodFormFields>;
-  isDisabled: boolean;
-  onChange: () => void;
-}
-
-const ContractMethodFieldArray = ({ control, name, setValue, getValues, isDisabled, argType, onChange, size }: Props) => {
-  const { fields, append, remove } = useFieldArray({
-    name: name as never,
-    control,
-  });
-
-  React.useEffect(() => {
-    if (fields.length === 0) {
-      if (size === Infinity) {
-        append('');
-      } else {
-        for (let i = 0; i < size - 1; i++) {
-          // a little hack to append multiple empty fields in the array
-          // had to adjust code in ContractMethodField as well
-          append('\n');
-        }
-      }
-    }
-
-  }, [ fields.length, append, size ]);
-
-  const handleAddButtonClick = React.useCallback(() => {
-    append('');
-  }, [ append ]);
-
-  const handleRemoveButtonClick = React.useCallback((event: React.MouseEvent<HTMLButtonElement>) => {
-    const itemIndex = event.currentTarget.getAttribute('data-index');
-    if (itemIndex) {
-      remove(Number(itemIndex));
-    }
-  }, [ remove ]);
-
-  return (
-    <Flex flexDir="column" rowGap={ 3 } w="100%">
-      { fields.map((field, index, array) => {
-        return (
-          <Flex key={ field.id } columnGap={ 3 }>
-            <ContractMethodField
-              name={ `${ name }[${ index }]` }
-              groupName={ name }
-              index={ index }
-              argType={ argType }
-              placeholder={ argType }
-              control={ control }
-              setValue={ setValue }
-              getValues={ getValues }
-              isDisabled={ isDisabled }
-              onChange={ onChange }
-            />
-            { array.length > 1 && size === Infinity && (
-              <IconButton
-                aria-label="remove"
-                data-index={ index }
-                variant="outline"
-                w="30px"
-                h="30px"
-                flexShrink={ 0 }
-                onClick={ handleRemoveButtonClick }
-                icon={ <IconSvg name="minus" boxSize={ 4 }/> }
-                isDisabled={ isDisabled }
-              />
-            ) }
-            { index === array.length - 1 && size === Infinity && (
-              <IconButton
-                aria-label="add"
-                data-index={ index }
-                variant="outline"
-                w="30px"
-                h="30px"
-                flexShrink={ 0 }
-                onClick={ handleAddButtonClick }
-                icon={ <IconSvg name="plus" boxSize={ 4 }/> }
-                isDisabled={ isDisabled }
-              />
-            ) }
-          </Flex>
-        );
-      }) }
-    </Flex>
-  );
-};
-
-export default React.memo(ContractMethodFieldArray);
diff --git a/ui/address/contract/ContractMethodsAccordionItem.tsx b/ui/address/contract/ContractMethodsAccordionItem.tsx
index d69222cdad..b30c0d998b 100644
--- a/ui/address/contract/ContractMethodsAccordionItem.tsx
+++ b/ui/address/contract/ContractMethodsAccordionItem.tsx
@@ -45,50 +45,54 @@ const ContractMethodsAccordionItem = <T extends SmartContractMethod>({ data, ind
 
   return (
     <AccordionItem as="section" _first={{ borderTopWidth: 0 }} _last={{ borderBottomWidth: 0 }}>
-      <Element as="h2" name={ 'method_id' in data ? `method_${ data.method_id }` : '' }>
-        <AccordionButton px={ 0 } py={ 3 } _hover={{ bgColor: 'inherit' }} wordBreak="break-all" textAlign="left">
-          { 'method_id' in data && (
-            <Tooltip label={ hasCopied ? 'Copied!' : 'Copy link' } isOpen={ isOpen || hasCopied } onClose={ onClose }>
-              <Box
-                boxSize={ 5 }
-                color="text_secondary"
-                _hover={{ color: 'link_hovered' }}
-                mr={ 2 }
-                onClick={ handleCopyLinkClick }
-                onMouseEnter={ onOpen }
-                onMouseLeave={ onClose }
-              >
-                <IconSvg name="link" boxSize={ 5 }/>
+      { ({ isExpanded }) => (
+        <>
+          <Element as="h2" name={ 'method_id' in data ? `method_${ data.method_id }` : '' }>
+            <AccordionButton px={ 0 } py={ 3 } _hover={{ bgColor: 'inherit' }} wordBreak="break-all" textAlign="left" as="div" cursor="pointer">
+              { 'method_id' in data && (
+                <Tooltip label={ hasCopied ? 'Copied!' : 'Copy link' } isOpen={ isOpen || hasCopied } onClose={ onClose }>
+                  <Box
+                    boxSize={ 5 }
+                    color="text_secondary"
+                    _hover={{ color: 'link_hovered' }}
+                    mr={ 2 }
+                    onClick={ handleCopyLinkClick }
+                    onMouseEnter={ onOpen }
+                    onMouseLeave={ onClose }
+                  >
+                    <IconSvg name="link" boxSize={ 5 }/>
+                  </Box>
+                </Tooltip>
+              ) }
+              <Box as="span" fontWeight={ 500 } mr={ 1 }>
+                { index + 1 }. { data.type === 'fallback' || data.type === 'receive' ? data.type : data.name }
               </Box>
-            </Tooltip>
-          ) }
-          <Box as="span" fontWeight={ 500 } mr={ 1 }>
-            { index + 1 }. { data.type === 'fallback' || data.type === 'receive' ? data.type : data.name }
-          </Box>
-          { data.type === 'fallback' && (
-            <Hint
-              label={
-                `The fallback function is executed on a call to the contract if none of the other functions match 
+              { data.type === 'fallback' && (
+                <Hint
+                  label={
+                    `The fallback function is executed on a call to the contract if none of the other functions match 
                     the given function signature, or if no data was supplied at all and there is no receive Ether function. 
                     The fallback function always receives data, but in order to also receive Ether it must be marked payable.`
-              }/>
-          ) }
-          { data.type === 'receive' && (
-            <Hint
-              label={
-                `The receive function is executed on a call to the contract with empty calldata. 
+                  }/>
+              ) }
+              { data.type === 'receive' && (
+                <Hint
+                  label={
+                    `The receive function is executed on a call to the contract with empty calldata. 
                     This is the function that is executed on plain Ether transfers (e.g. via .send() or .transfer()). 
                     If no such function exists, but a payable fallback function exists, the fallback function will be called on a plain Ether transfer. 
                     If neither a receive Ether nor a payable fallback function is present, 
                     the contract cannot receive Ether through regular transactions and throws an exception.`
-              }/>
-          ) }
-          <AccordionIcon/>
-        </AccordionButton>
-      </Element>
-      <AccordionPanel pb={ 4 } pr={ 0 } pl="28px" w="calc(100% - 6px)">
-        { renderContent(data, index, id) }
-      </AccordionPanel>
+                  }/>
+              ) }
+              <AccordionIcon transform={ isExpanded ? 'rotate(0deg)' : 'rotate(-90deg)' } color="gray.500"/>
+            </AccordionButton>
+          </Element>
+          <AccordionPanel pb={ 4 } pr={ 0 } pl="28px" w="calc(100% - 6px)">
+            { renderContent(data, index, id) }
+          </AccordionPanel>
+        </>
+      ) }
     </AccordionItem>
   );
 };
diff --git a/ui/address/contract/ContractRead.pw.tsx b/ui/address/contract/ContractRead.pw.tsx
index d540c1c07e..1dc215d070 100644
--- a/ui/address/contract/ContractRead.pw.tsx
+++ b/ui/address/contract/ContractRead.pw.tsx
@@ -37,7 +37,7 @@ test('base view +@mobile +@dark-mode', async({ mount, page }) => {
 
   await expect(component).toHaveScreenshot();
 
-  await component.getByPlaceholder(/address/i).type('0xa113Ce24919C08a26C952E81681dAc861d6a2466');
+  await component.getByPlaceholder(/address/i).fill('0xa113Ce24919C08a26C952E81681dAc861d6a2466');
   await component.getByText(/read/i).click();
 
   await component.getByText(/wei/i).click();
diff --git a/ui/address/contract/ContractRead.tsx b/ui/address/contract/ContractRead.tsx
index 88330196ea..7a2fd94ded 100644
--- a/ui/address/contract/ContractRead.tsx
+++ b/ui/address/contract/ContractRead.tsx
@@ -14,9 +14,9 @@ import DataFetchAlert from 'ui/shared/DataFetchAlert';
 import ContractConnectWallet from './ContractConnectWallet';
 import ContractCustomAbiAlert from './ContractCustomAbiAlert';
 import ContractImplementationAddress from './ContractImplementationAddress';
-import ContractMethodCallable from './ContractMethodCallable';
 import ContractMethodConstant from './ContractMethodConstant';
 import ContractReadResult from './ContractReadResult';
+import ContractMethodForm from './methodForm/ContractMethodForm';
 import useWatchAccount from './useWatchAccount';
 
 const ContractRead = () => {
@@ -40,7 +40,7 @@ const ContractRead = () => {
     },
   });
 
-  const handleMethodFormSubmit = React.useCallback(async(item: SmartContractReadMethod, args: Array<string | Array<unknown>>) => {
+  const handleMethodFormSubmit = React.useCallback(async(item: SmartContractReadMethod, args: Array<unknown>) => {
     return apiFetch<'contract_method_query', SmartContractQueryMethodRead>('contract_method_query', {
       pathParams: { hash: addressHash },
       queryParams: {
@@ -63,7 +63,7 @@ const ContractRead = () => {
       return <Alert status="error" fontSize="sm" wordBreak="break-word">{ item.error }</Alert>;
     }
 
-    if (item.outputs.some(({ value }) => value !== undefined && value !== null)) {
+    if (item.outputs?.some(({ value }) => value !== undefined && value !== null)) {
       return (
         <Flex flexDir="column" rowGap={ 1 }>
           { item.outputs.map((output, index) => <ContractMethodConstant key={ index } data={ output }/>) }
@@ -72,11 +72,12 @@ const ContractRead = () => {
     }
 
     return (
-      <ContractMethodCallable
+      <ContractMethodForm
         key={ id + '_' + index }
         data={ item }
         onSubmit={ handleMethodFormSubmit }
         resultComponent={ ContractReadResult }
+        methodType="read"
       />
     );
   }, [ handleMethodFormSubmit ]);
diff --git a/ui/address/contract/ContractSecurityAudits.tsx b/ui/address/contract/ContractSecurityAudits.tsx
new file mode 100644
index 0000000000..cac7c356b0
--- /dev/null
+++ b/ui/address/contract/ContractSecurityAudits.tsx
@@ -0,0 +1,81 @@
+import { Box, Button, useDisclosure } from '@chakra-ui/react';
+import React from 'react';
+
+import type { SmartContractSecurityAuditSubmission } from 'types/api/contract';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import dayjs from 'lib/date/dayjs';
+import ContainerWithScrollY from 'ui/shared/ContainerWithScrollY';
+import FormModal from 'ui/shared/FormModal';
+import LinkExternal from 'ui/shared/LinkExternal';
+
+import ContractSubmitAuditForm from './contractSubmitAuditForm/ContractSubmitAuditForm';
+
+const SCROLL_GRADIENT_HEIGHT = 24;
+
+type Props = {
+  addressHash?: string;
+}
+
+const ContractSecurityAudits = ({ addressHash }: Props) => {
+  const { data, isPlaceholderData } = useApiQuery('contract_security_audits', {
+    pathParams: { hash: addressHash },
+    queryOptions: {
+      refetchOnMount: false,
+      placeholderData: { items: [] },
+      enabled: Boolean(addressHash),
+    },
+  });
+
+  const containerRef = React.useRef<HTMLDivElement>(null);
+  const [ hasScroll, setHasScroll ] = React.useState(false);
+
+  React.useEffect(() => {
+    if (!containerRef.current) {
+      return;
+    }
+
+    setHasScroll(containerRef.current.scrollHeight >= containerRef.current.clientHeight + SCROLL_GRADIENT_HEIGHT / 2);
+  }, []);
+
+  const formTitle = 'Submit audit';
+
+  const modalProps = useDisclosure();
+
+  const renderForm = React.useCallback(() => {
+    return <ContractSubmitAuditForm address={ addressHash } onSuccess={ modalProps.onClose }/>;
+  }, [ addressHash, modalProps.onClose ]);
+
+  return (
+    <>
+      <Button variant="outline" size="sm" onClick={ modalProps.onOpen }>Submit audit</Button>
+      { data?.items && data.items.length > 0 && (
+        <Box position="relative">
+          <ContainerWithScrollY
+            gradientHeight={ SCROLL_GRADIENT_HEIGHT }
+            hasScroll={ hasScroll }
+            rowGap={ 1 }
+            w="100%"
+            maxH="80px"
+            ref={ containerRef }
+            mt={ 2 }
+          >
+            { data.items.map(item => (
+              <LinkExternal href={ item.audit_report_url } key={ item.audit_company_name + item.audit_publish_date } isLoading={ isPlaceholderData }>
+                { `${ item.audit_company_name }, ${ dayjs(item.audit_publish_date).format('MMM DD, YYYY') }` }
+              </LinkExternal>
+            )) }
+          </ContainerWithScrollY>
+        </Box>
+      ) }
+      <FormModal<SmartContractSecurityAuditSubmission>
+        isOpen={ modalProps.isOpen }
+        onClose={ modalProps.onClose }
+        title={ formTitle }
+        renderForm={ renderForm }
+      />
+    </>
+  );
+};
+
+export default React.memo(ContractSecurityAudits);
diff --git a/ui/address/contract/ContractSourceCode.tsx b/ui/address/contract/ContractSourceCode.tsx
index 1130b47a2b..d1ca1cba9f 100644
--- a/ui/address/contract/ContractSourceCode.tsx
+++ b/ui/address/contract/ContractSourceCode.tsx
@@ -13,6 +13,7 @@ import LinkInternal from 'ui/shared/LinkInternal';
 import CodeEditor from 'ui/shared/monaco/CodeEditor';
 import formatFilePath from 'ui/shared/monaco/utils/formatFilePath';
 
+import ContractCodeIdes from './ContractCodeIdes';
 import ContractExternalLibraries from './ContractExternalLibraries';
 
 const SOURCE_CODE_OPTIONS = [
@@ -118,6 +119,8 @@ const ContractSourceCode = ({ address, implementationAddress }: Props) => {
     <CopyToClipboard text={ activeContractData[0].source_code } isLoading={ isLoading } ml={{ base: 'auto', lg: diagramLink ? '0' : 'auto' }}/> :
     null;
 
+  const ides = sourceType === 'secondary' ? <ContractCodeIdes hash={ implementationAddress }/> : <ContractCodeIdes hash={ address }/>;
+
   const handleSelectChange = React.useCallback((event: React.ChangeEvent<HTMLSelectElement>) => {
     setSourceType(event.target.value as SourceCodeType);
   }, []);
@@ -162,6 +165,7 @@ const ContractSourceCode = ({ address, implementationAddress }: Props) => {
             libraries={ primaryContractQuery.data?.external_libraries ?? undefined }
             language={ primaryContractQuery.data?.language ?? undefined }
             mainFile={ primaryEditorData[0]?.file_path }
+            contractName={ primaryContractQuery.data?.name || undefined }
           />
         </Box>
         { secondaryEditorData && (
@@ -172,6 +176,7 @@ const ContractSourceCode = ({ address, implementationAddress }: Props) => {
               libraries={ secondaryContractQuery.data?.external_libraries ?? undefined }
               language={ secondaryContractQuery.data?.language ?? undefined }
               mainFile={ secondaryEditorData?.[0]?.file_path }
+              contractName={ secondaryContractQuery.data?.name || undefined }
             />
           </Box>
         ) }
@@ -190,6 +195,7 @@ const ContractSourceCode = ({ address, implementationAddress }: Props) => {
         { editorSourceTypeSelector }
         { externalLibraries }
         { diagramLink }
+        { ides }
         { copyToClipboard }
       </Flex>
       { content }
diff --git a/ui/address/contract/ContractWrite.tsx b/ui/address/contract/ContractWrite.tsx
index b199b99291..1b282fb508 100644
--- a/ui/address/contract/ContractWrite.tsx
+++ b/ui/address/contract/ContractWrite.tsx
@@ -1,6 +1,6 @@
 import { useRouter } from 'next/router';
 import React from 'react';
-import { useAccount, useWalletClient, useNetwork, useSwitchNetwork } from 'wagmi';
+import { useAccount, useWalletClient, useSwitchChain } from 'wagmi';
 
 import type { SmartContractWriteMethod } from 'types/api/contract';
 
@@ -14,16 +14,15 @@ import DataFetchAlert from 'ui/shared/DataFetchAlert';
 import ContractConnectWallet from './ContractConnectWallet';
 import ContractCustomAbiAlert from './ContractCustomAbiAlert';
 import ContractImplementationAddress from './ContractImplementationAddress';
-import ContractMethodCallable from './ContractMethodCallable';
 import ContractWriteResult from './ContractWriteResult';
+import ContractMethodForm from './methodForm/ContractMethodForm';
 import useContractAbi from './useContractAbi';
 import { getNativeCoinValue, prepareAbi } from './utils';
 
 const ContractWrite = () => {
   const { data: walletClient } = useWalletClient();
-  const { isConnected } = useAccount();
-  const { chain } = useNetwork();
-  const { switchNetworkAsync } = useSwitchNetwork();
+  const { isConnected, chainId } = useAccount();
+  const { switchChainAsync } = useSwitchChain();
 
   const router = useRouter();
 
@@ -39,18 +38,19 @@ const ContractWrite = () => {
     },
     queryOptions: {
       enabled: Boolean(addressHash),
+      refetchOnMount: false,
     },
   });
 
   const contractAbi = useContractAbi({ addressHash, isProxy, isCustomAbi });
 
-  const handleMethodFormSubmit = React.useCallback(async(item: SmartContractWriteMethod, args: Array<string | Array<unknown>>) => {
+  const handleMethodFormSubmit = React.useCallback(async(item: SmartContractWriteMethod, args: Array<unknown>) => {
     if (!isConnected) {
       throw new Error('Wallet is not connected');
     }
 
-    if (chain?.id && String(chain.id) !== config.chain.id) {
-      await switchNetworkAsync?.(Number(config.chain.id));
+    if (chainId && String(chainId) !== config.chain.id) {
+      await switchChainAsync?.({ chainId: Number(config.chain.id) });
     }
 
     if (!contractAbi) {
@@ -66,34 +66,35 @@ const ContractWrite = () => {
       return { hash };
     }
 
-    const _args = 'stateMutability' in item && item.stateMutability === 'payable' ? args.slice(0, -1) : args;
-    const value = 'stateMutability' in item && item.stateMutability === 'payable' ? getNativeCoinValue(args[args.length - 1]) : undefined;
     const methodName = item.name;
 
     if (!methodName) {
       throw new Error('Method name is not defined');
     }
 
+    const _args = args.slice(0, item.inputs.length);
+    const value = getNativeCoinValue(args[item.inputs.length]);
     const abi = prepareAbi(contractAbi, item);
+
     const hash = await walletClient?.writeContract({
       args: _args,
       abi,
       functionName: methodName,
       address: addressHash as `0x${ string }`,
-      value: value as undefined,
+      value,
     });
 
     return { hash };
-  }, [ isConnected, chain, contractAbi, walletClient, addressHash, switchNetworkAsync ]);
+  }, [ isConnected, chainId, contractAbi, walletClient, addressHash, switchChainAsync ]);
 
   const renderItemContent = React.useCallback((item: SmartContractWriteMethod, index: number, id: number) => {
     return (
-      <ContractMethodCallable
+      <ContractMethodForm
         key={ id + '_' + index }
         data={ item }
         onSubmit={ handleMethodFormSubmit }
         resultComponent={ ContractWriteResult }
-        isWrite
+        methodType="write"
       />
     );
   }, [ handleMethodFormSubmit ]);
diff --git a/ui/address/contract/ContractWriteResult.tsx b/ui/address/contract/ContractWriteResult.tsx
index 9fed0e271e..3cc755d131 100644
--- a/ui/address/contract/ContractWriteResult.tsx
+++ b/ui/address/contract/ContractWriteResult.tsx
@@ -1,22 +1,19 @@
 import React from 'react';
-import { useWaitForTransaction } from 'wagmi';
+import { useWaitForTransactionReceipt } from 'wagmi';
 
+import type { ResultComponentProps } from './methodForm/types';
 import type { ContractMethodWriteResult } from './types';
+import type { SmartContractWriteMethod } from 'types/api/contract';
 
 import ContractWriteResultDumb from './ContractWriteResultDumb';
 
-interface Props {
-  result: ContractMethodWriteResult;
-  onSettle: () => void;
-}
-
-const ContractWriteResult = ({ result, onSettle }: Props) => {
+const ContractWriteResult = ({ result, onSettle }: ResultComponentProps<SmartContractWriteMethod>) => {
   const txHash = result && 'hash' in result ? result.hash as `0x${ string }` : undefined;
-  const txInfo = useWaitForTransaction({
+  const txInfo = useWaitForTransactionReceipt({
     hash: txHash,
   });
 
-  return <ContractWriteResultDumb result={ result } onSettle={ onSettle } txInfo={ txInfo }/>;
+  return <ContractWriteResultDumb result={ result as ContractMethodWriteResult } onSettle={ onSettle } txInfo={ txInfo }/>;
 };
 
-export default React.memo(ContractWriteResult);
+export default React.memo(ContractWriteResult) as typeof ContractWriteResult;
diff --git a/ui/address/contract/ContractWriteResultDumb.pw.tsx b/ui/address/contract/ContractWriteResultDumb.pw.tsx
index e082542ff0..e916ab90c6 100644
--- a/ui/address/contract/ContractWriteResultDumb.pw.tsx
+++ b/ui/address/contract/ContractWriteResultDumb.pw.tsx
@@ -8,7 +8,7 @@ import ContractWriteResultDumb from './ContractWriteResultDumb';
 test('loading', async({ mount }) => {
   const props = {
     txInfo: {
-      status: 'loading' as const,
+      status: 'pending' as const,
       error: null,
     },
     result: {
diff --git a/ui/address/contract/ContractWriteResultDumb.tsx b/ui/address/contract/ContractWriteResultDumb.tsx
index 6e734f93a1..3b898fb570 100644
--- a/ui/address/contract/ContractWriteResultDumb.tsx
+++ b/ui/address/contract/ContractWriteResultDumb.tsx
@@ -11,7 +11,7 @@ interface Props {
   result: ContractMethodWriteResult;
   onSettle: () => void;
   txInfo: {
-    status: 'loading' | 'success' | 'error' | 'idle';
+    status: 'loading' | 'success' | 'error' | 'idle' | 'pending';
     error: Error | null;
   };
 }
@@ -20,7 +20,7 @@ const ContractWriteResultDumb = ({ result, onSettle, txInfo }: Props) => {
   const txHash = result && 'hash' in result ? result.hash : undefined;
 
   React.useEffect(() => {
-    if (txInfo.status !== 'loading') {
+    if (txInfo.status !== 'pending') {
       onSettle();
     }
   }, [ onSettle, txInfo.status ]);
@@ -55,7 +55,7 @@ const ContractWriteResultDumb = ({ result, onSettle, txInfo }: Props) => {
         );
       }
 
-      case 'loading': {
+      case 'pending': {
         return (
           <>
             <Spinner size="sm" mr={ 3 }/>
diff --git a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_dark-color-mode_full-view-mobile-dark-mode-1.png b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_dark-color-mode_full-view-mobile-dark-mode-1.png
index 83a535fb47..d4e7526c59 100644
Binary files a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_dark-color-mode_full-view-mobile-dark-mode-1.png and b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_dark-color-mode_full-view-mobile-dark-mode-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_full-view-mobile-dark-mode-1.png b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_full-view-mobile-dark-mode-1.png
index feebd79abc..f11a52a153 100644
Binary files a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_full-view-mobile-dark-mode-1.png and b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_full-view-mobile-dark-mode-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-changed-byte-code-socket-1.png b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-changed-byte-code-socket-1.png
index ebfb1ecda6..6c88ba36e0 100644
Binary files a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-changed-byte-code-socket-1.png and b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-changed-byte-code-socket-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-1.png b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-1.png
index cf4254a29e..1fa16c4e84 100644
Binary files a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-1.png and b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-2.png b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-2.png
index ebd69ae75f..1305877878 100644
Binary files a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-2.png and b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-2.png differ
diff --git a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-3.png b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-3.png
new file mode 100644
index 0000000000..ff7ca931ce
Binary files /dev/null and b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_verified-with-multiple-sources-3.png differ
diff --git a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_with-audits-feature-has-audits-1.png b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_with-audits-feature-has-audits-1.png
new file mode 100644
index 0000000000..191d800a72
Binary files /dev/null and b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_with-audits-feature-has-audits-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_with-audits-feature-no-audits-1.png b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_with-audits-feature-no-audits-1.png
new file mode 100644
index 0000000000..ab936fc8f6
Binary files /dev/null and b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_default_with-audits-feature-no-audits-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_mobile_full-view-mobile-dark-mode-1.png b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_mobile_full-view-mobile-dark-mode-1.png
index 132e7a0f89..539f531700 100644
Binary files a/ui/address/contract/__screenshots__/ContractCode.pw.tsx_mobile_full-view-mobile-dark-mode-1.png and b/ui/address/contract/__screenshots__/ContractCode.pw.tsx_mobile_full-view-mobile-dark-mode-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png
index 57d28fdef2..f19ba84553 100644
Binary files a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png and b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-2.png b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-2.png
index 89504d9220..9402cd11fc 100644
Binary files a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-2.png and b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-2.png differ
diff --git a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_default_base-view-mobile-dark-mode-1.png b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_default_base-view-mobile-dark-mode-1.png
index 17168a8434..82900c2f57 100644
Binary files a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_default_base-view-mobile-dark-mode-1.png and b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_default_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_default_base-view-mobile-dark-mode-2.png b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_default_base-view-mobile-dark-mode-2.png
index 3a22929ac6..635406e6f5 100644
Binary files a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_default_base-view-mobile-dark-mode-2.png and b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_default_base-view-mobile-dark-mode-2.png differ
diff --git a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_mobile_base-view-mobile-dark-mode-1.png b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_mobile_base-view-mobile-dark-mode-1.png
index 0da704eaba..930ca02a9e 100644
Binary files a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_mobile_base-view-mobile-dark-mode-1.png and b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_mobile_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_mobile_base-view-mobile-dark-mode-2.png b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_mobile_base-view-mobile-dark-mode-2.png
index 3a72b3d0b0..b5d534a0d0 100644
Binary files a/ui/address/contract/__screenshots__/ContractRead.pw.tsx_mobile_base-view-mobile-dark-mode-2.png and b/ui/address/contract/__screenshots__/ContractRead.pw.tsx_mobile_base-view-mobile-dark-mode-2.png differ
diff --git a/ui/address/contract/__screenshots__/ContractWrite.pw.tsx_default_base-view-mobile-1.png b/ui/address/contract/__screenshots__/ContractWrite.pw.tsx_default_base-view-mobile-1.png
index eee1a2a500..e58e9c4755 100644
Binary files a/ui/address/contract/__screenshots__/ContractWrite.pw.tsx_default_base-view-mobile-1.png and b/ui/address/contract/__screenshots__/ContractWrite.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/address/contract/__screenshots__/ContractWrite.pw.tsx_mobile_base-view-mobile-1.png b/ui/address/contract/__screenshots__/ContractWrite.pw.tsx_mobile_base-view-mobile-1.png
index 5724e9b234..c9a99a0bfb 100644
Binary files a/ui/address/contract/__screenshots__/ContractWrite.pw.tsx_mobile_base-view-mobile-1.png and b/ui/address/contract/__screenshots__/ContractWrite.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/address/contract/contractSubmitAuditForm/ContractSubmitAuditForm.pw.tsx b/ui/address/contract/contractSubmitAuditForm/ContractSubmitAuditForm.pw.tsx
new file mode 100644
index 0000000000..d82adea521
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/ContractSubmitAuditForm.pw.tsx
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import TestApp from 'playwright/TestApp';
+
+import ContractSubmitAuditForm from './ContractSubmitAuditForm';
+
+test('base view', async({ mount }) => {
+
+  const component = await mount(
+    <TestApp>
+      { /* eslint-disable-next-line react/jsx-no-bind */ }
+      <ContractSubmitAuditForm address="hash" onSuccess={ () => {} }/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/address/contract/contractSubmitAuditForm/ContractSubmitAuditForm.tsx b/ui/address/contract/contractSubmitAuditForm/ContractSubmitAuditForm.tsx
new file mode 100644
index 0000000000..b03d4884cc
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/ContractSubmitAuditForm.tsx
@@ -0,0 +1,124 @@
+import { Button, VStack } from '@chakra-ui/react';
+import React from 'react';
+import type { SubmitHandler } from 'react-hook-form';
+import { useForm } from 'react-hook-form';
+
+import type { SmartContractSecurityAuditSubmission } from 'types/api/contract';
+
+import type { ResourceError } from 'lib/api/resources';
+import useApiFetch from 'lib/api/useApiFetch';
+import useToast from 'lib/hooks/useToast';
+
+import AuditComment from './fields/AuditComment';
+import AuditCompanyName from './fields/AuditCompanyName';
+import AuditProjectName from './fields/AuditProjectName';
+import AuditProjectUrl from './fields/AuditProjectUrl';
+import AuditReportDate from './fields/AuditReportDate';
+import AuditReportUrl from './fields/AuditReportUrl';
+import AuditSubmitterEmail from './fields/AuditSubmitterEmail';
+import AuditSubmitterIsOwner from './fields/AuditSubmitterIsOwner';
+import AuditSubmitterName from './fields/AuditSubmitterName';
+
+interface Props {
+  address?: string;
+  onSuccess: () => void;
+}
+
+export type Inputs = {
+  submitter_name: string;
+  submitter_email: string;
+  is_project_owner: boolean;
+  project_name: string;
+  project_url: string;
+  audit_company_name: string;
+  audit_report_url: string;
+  audit_publish_date: string;
+  comment?: string;
+}
+
+type AuditSubmissionErrors = {
+  errors: Record<keyof Inputs, Array<string>>;
+}
+
+const ContractSubmitAuditForm = ({ address, onSuccess }: Props) => {
+  const containerRef = React.useRef<HTMLFormElement>(null);
+
+  const apiFetch = useApiFetch();
+  const toast = useToast();
+
+  const { handleSubmit, formState, control, setError } = useForm<Inputs>({
+    mode: 'onTouched',
+    defaultValues: { is_project_owner: false },
+  });
+
+  const onFormSubmit: SubmitHandler<Inputs> = React.useCallback(async(data) => {
+    try {
+      await apiFetch<'contract_security_audits', SmartContractSecurityAuditSubmission, AuditSubmissionErrors>('contract_security_audits', {
+        pathParams: { hash: address },
+        fetchParams: {
+          method: 'POST',
+          body: data,
+        },
+      });
+
+      toast({
+        position: 'top-right',
+        title: 'Success',
+        description: 'Your audit report has been successfully submitted for review',
+        status: 'success',
+        variant: 'subtle',
+        isClosable: true,
+      });
+
+      onSuccess();
+
+    } catch (_error) {
+      const error = _error as ResourceError<AuditSubmissionErrors>;
+      // add scroll to the error field
+      const errorMap = error?.payload?.errors;
+      if (errorMap && Object.keys(errorMap).length) {
+        (Object.keys(errorMap) as Array<keyof Inputs>).forEach((errorField) => {
+          setError(errorField, { type: 'custom', message: errorMap[errorField].join(', ') });
+        });
+      } else {
+        toast({
+          position: 'top-right',
+          title: 'Error',
+          description: (_error as ResourceError<{ message: string }>)?.payload?.message || 'Something went wrong. Try again later.',
+          status: 'error',
+          variant: 'subtle',
+          isClosable: true,
+        });
+      }
+    }
+  }, [ apiFetch, address, toast, setError, onSuccess ]);
+
+  return (
+    <form noValidate onSubmit={ handleSubmit(onFormSubmit) } autoComplete="off" ref={ containerRef }>
+      <VStack gap={ 5 }>
+        <AuditSubmitterName control={ control }/>
+        <AuditSubmitterEmail control={ control }/>
+        <AuditSubmitterIsOwner control={ control }/>
+        <AuditProjectName control={ control }/>
+        <AuditProjectUrl control={ control }/>
+        <AuditCompanyName control={ control }/>
+        <AuditReportUrl control={ control }/>
+        <AuditReportDate control={ control }/>
+
+        <AuditComment control={ control }/>
+      </VStack>
+      <Button
+        type="submit"
+        size="lg"
+        mt={ 8 }
+        isLoading={ formState.isSubmitting }
+        loadingText="Send request"
+        isDisabled={ !formState.isDirty }
+      >
+        Send request
+      </Button>
+    </form>
+  );
+};
+
+export default React.memo(ContractSubmitAuditForm);
diff --git a/ui/address/contract/contractSubmitAuditForm/__screenshots__/ContractSubmitAuditForm.pw.tsx_default_base-view-1.png b/ui/address/contract/contractSubmitAuditForm/__screenshots__/ContractSubmitAuditForm.pw.tsx_default_base-view-1.png
new file mode 100644
index 0000000000..c5a18bad26
Binary files /dev/null and b/ui/address/contract/contractSubmitAuditForm/__screenshots__/ContractSubmitAuditForm.pw.tsx_default_base-view-1.png differ
diff --git a/ui/address/contract/contractSubmitAuditForm/fields/AuditComment.tsx b/ui/address/contract/contractSubmitAuditForm/fields/AuditComment.tsx
new file mode 100644
index 0000000000..918a496dea
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/fields/AuditComment.tsx
@@ -0,0 +1,40 @@
+import { FormControl, Textarea } from '@chakra-ui/react';
+import React from 'react';
+import type { Control, ControllerProps } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+import type { Inputs } from '../ContractSubmitAuditForm';
+
+interface Props {
+  control: Control<Inputs>;
+}
+
+const AuditComment = ({ control }: Props) => {
+  const renderControl: ControllerProps<Inputs, 'comment'>['render'] = React.useCallback(({ field, fieldState }) => {
+    return (
+      <FormControl variant="floating" id={ field.name }>
+        <Textarea
+          { ...field }
+          isInvalid={ Boolean(fieldState.error) }
+          autoComplete="off"
+          maxH="160px"
+          maxLength={ 300 }
+        />
+        <InputPlaceholder text="Comment" error={ fieldState.error }/>
+      </FormControl>
+    );
+  }, [ ]);
+
+  return (
+    <Controller
+      name="comment"
+      control={ control }
+      render={ renderControl }
+      rules={{ maxLength: 300 }}
+    />
+  );
+};
+
+export default React.memo(AuditComment);
diff --git a/ui/address/contract/contractSubmitAuditForm/fields/AuditCompanyName.tsx b/ui/address/contract/contractSubmitAuditForm/fields/AuditCompanyName.tsx
new file mode 100644
index 0000000000..0e093bd7b6
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/fields/AuditCompanyName.tsx
@@ -0,0 +1,39 @@
+import { FormControl, Input } from '@chakra-ui/react';
+import React from 'react';
+import type { Control, ControllerProps } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+import type { Inputs } from '../ContractSubmitAuditForm';
+
+interface Props {
+  control: Control<Inputs>;
+}
+
+const AuditCompanyName = ({ control }: Props) => {
+  const renderControl: ControllerProps<Inputs, 'audit_company_name'>['render'] = React.useCallback(({ field, fieldState }) => {
+    return (
+      <FormControl variant="floating" id={ field.name } isRequired>
+        <Input
+          { ...field }
+          required
+          isInvalid={ Boolean(fieldState.error) }
+          autoComplete="off"
+        />
+        <InputPlaceholder text="Audit company name" error={ fieldState.error }/>
+      </FormControl>
+    );
+  }, [ ]);
+
+  return (
+    <Controller
+      name="audit_company_name"
+      control={ control }
+      render={ renderControl }
+      rules={{ required: true }}
+    />
+  );
+};
+
+export default React.memo(AuditCompanyName);
diff --git a/ui/address/contract/contractSubmitAuditForm/fields/AuditProjectName.tsx b/ui/address/contract/contractSubmitAuditForm/fields/AuditProjectName.tsx
new file mode 100644
index 0000000000..0542688dcd
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/fields/AuditProjectName.tsx
@@ -0,0 +1,39 @@
+import { FormControl, Input } from '@chakra-ui/react';
+import React from 'react';
+import type { Control, ControllerProps } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+import type { Inputs } from '../ContractSubmitAuditForm';
+
+interface Props {
+  control: Control<Inputs>;
+}
+
+const AuditProjectName = ({ control }: Props) => {
+  const renderControl: ControllerProps<Inputs, 'project_name'>['render'] = React.useCallback(({ field, fieldState }) => {
+    return (
+      <FormControl variant="floating" id={ field.name } isRequired>
+        <Input
+          { ...field }
+          required
+          isInvalid={ Boolean(fieldState.error) }
+          autoComplete="off"
+        />
+        <InputPlaceholder text="Project name" error={ fieldState.error }/>
+      </FormControl>
+    );
+  }, [ ]);
+
+  return (
+    <Controller
+      name="project_name"
+      control={ control }
+      render={ renderControl }
+      rules={{ required: true }}
+    />
+  );
+};
+
+export default React.memo(AuditProjectName);
diff --git a/ui/address/contract/contractSubmitAuditForm/fields/AuditProjectUrl.tsx b/ui/address/contract/contractSubmitAuditForm/fields/AuditProjectUrl.tsx
new file mode 100644
index 0000000000..ad21c21895
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/fields/AuditProjectUrl.tsx
@@ -0,0 +1,40 @@
+import { FormControl, Input } from '@chakra-ui/react';
+import React from 'react';
+import type { Control, ControllerProps } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import { validator as validateUrl } from 'lib/validations/url';
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+import type { Inputs } from '../ContractSubmitAuditForm';
+
+interface Props {
+  control: Control<Inputs>;
+}
+
+const AuditProjectUrl = ({ control }: Props) => {
+  const renderControl: ControllerProps<Inputs, 'project_url'>['render'] = React.useCallback(({ field, fieldState }) => {
+    return (
+      <FormControl variant="floating" id={ field.name } isRequired>
+        <Input
+          { ...field }
+          required
+          isInvalid={ Boolean(fieldState.error) }
+          autoComplete="off"
+        />
+        <InputPlaceholder text="Project URL" error={ fieldState.error }/>
+      </FormControl>
+    );
+  }, [ ]);
+
+  return (
+    <Controller
+      name="project_url"
+      control={ control }
+      render={ renderControl }
+      rules={{ required: true, validate: { url: validateUrl } }}
+    />
+  );
+};
+
+export default React.memo(AuditProjectUrl);
diff --git a/ui/address/contract/contractSubmitAuditForm/fields/AuditReportDate.tsx b/ui/address/contract/contractSubmitAuditForm/fields/AuditReportDate.tsx
new file mode 100644
index 0000000000..cf02d6f7af
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/fields/AuditReportDate.tsx
@@ -0,0 +1,42 @@
+import { FormControl, Input } from '@chakra-ui/react';
+import React from 'react';
+import type { Control, ControllerProps } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import dayjs from 'lib/date/dayjs';
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+import type { Inputs } from '../ContractSubmitAuditForm';
+
+interface Props {
+  control: Control<Inputs>;
+}
+
+const AuditCompanyName = ({ control }: Props) => {
+  const renderControl: ControllerProps<Inputs, 'audit_publish_date'>['render'] = React.useCallback(({ field, fieldState }) => {
+    return (
+      <FormControl variant="floating" id={ field.name } isRequired>
+        <Input
+          { ...field }
+          required
+          isInvalid={ Boolean(fieldState.error) }
+          autoComplete="off"
+          type="date"
+          max={ dayjs().format('YYYY-MM-DD') }
+        />
+        <InputPlaceholder text="Audit publish date" error={ fieldState.error }/>
+      </FormControl>
+    );
+  }, [ ]);
+
+  return (
+    <Controller
+      name="audit_publish_date"
+      control={ control }
+      render={ renderControl }
+      rules={{ required: true }}
+    />
+  );
+};
+
+export default React.memo(AuditCompanyName);
diff --git a/ui/address/contract/contractSubmitAuditForm/fields/AuditReportUrl.tsx b/ui/address/contract/contractSubmitAuditForm/fields/AuditReportUrl.tsx
new file mode 100644
index 0000000000..b59e65be2e
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/fields/AuditReportUrl.tsx
@@ -0,0 +1,40 @@
+import { FormControl, Input } from '@chakra-ui/react';
+import React from 'react';
+import type { Control, ControllerProps } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import { validator as validateUrl } from 'lib/validations/url';
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+import type { Inputs } from '../ContractSubmitAuditForm';
+
+interface Props {
+  control: Control<Inputs>;
+}
+
+const AuditReportUrl = ({ control }: Props) => {
+  const renderControl: ControllerProps<Inputs, 'audit_report_url'>['render'] = React.useCallback(({ field, fieldState }) => {
+    return (
+      <FormControl variant="floating" id={ field.name } isRequired>
+        <Input
+          { ...field }
+          required
+          isInvalid={ Boolean(fieldState.error) }
+          autoComplete="off"
+        />
+        <InputPlaceholder text="Audit report URL" error={ fieldState.error }/>
+      </FormControl>
+    );
+  }, [ ]);
+
+  return (
+    <Controller
+      name="audit_report_url"
+      control={ control }
+      render={ renderControl }
+      rules={{ required: true, validate: { url: validateUrl } }}
+    />
+  );
+};
+
+export default React.memo(AuditReportUrl);
diff --git a/ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterEmail.tsx b/ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterEmail.tsx
new file mode 100644
index 0000000000..4e72e01ab1
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterEmail.tsx
@@ -0,0 +1,39 @@
+import { FormControl, Input } from '@chakra-ui/react';
+import React from 'react';
+import type { Control, ControllerProps } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import { EMAIL_REGEXP } from 'lib/validations/email';
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+import type { Inputs } from '../ContractSubmitAuditForm';
+
+interface Props {
+  control: Control<Inputs>;
+}
+
+const AuditSubmitterEmail = ({ control }: Props) => {
+  const renderControl: ControllerProps<Inputs, 'submitter_email'>['render'] = React.useCallback(({ field, fieldState }) => {
+    return (
+      <FormControl variant="floating" id={ field.name } isRequired>
+        <Input
+          { ...field }
+          required
+          isInvalid={ Boolean(fieldState.error) }
+        />
+        <InputPlaceholder text="Submitter email" error={ fieldState.error }/>
+      </FormControl>
+    );
+  }, [ ]);
+
+  return (
+    <Controller
+      name="submitter_email"
+      control={ control }
+      render={ renderControl }
+      rules={{ required: true, pattern: EMAIL_REGEXP }}
+    />
+  );
+};
+
+export default React.memo(AuditSubmitterEmail);
diff --git a/ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterIsOwner.tsx b/ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterIsOwner.tsx
new file mode 100644
index 0000000000..dab568b92d
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterIsOwner.tsx
@@ -0,0 +1,35 @@
+import { FormControl } from '@chakra-ui/react';
+import React from 'react';
+import type { Control, ControllerProps } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import CheckboxInput from 'ui/shared/CheckboxInput';
+
+import type { Inputs } from '../ContractSubmitAuditForm';
+
+interface Props {
+  control: Control<Inputs>;
+}
+
+const AuditSubmitterIsOwner = ({ control }: Props) => {
+  const renderControl: ControllerProps<Inputs, 'is_project_owner'>['render'] = React.useCallback(({ field }) => {
+    return (
+      <FormControl id={ field.name }>
+        <CheckboxInput<Inputs, 'is_project_owner'>
+          text="I'm the contract owner"
+          field={ field }
+        />
+      </FormControl>
+    );
+  }, [ ]);
+
+  return (
+    <Controller
+      name="is_project_owner"
+      control={ control }
+      render={ renderControl }
+    />
+  );
+};
+
+export default React.memo(AuditSubmitterIsOwner);
diff --git a/ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterName.tsx b/ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterName.tsx
new file mode 100644
index 0000000000..c5b9376c6d
--- /dev/null
+++ b/ui/address/contract/contractSubmitAuditForm/fields/AuditSubmitterName.tsx
@@ -0,0 +1,38 @@
+import { FormControl, Input } from '@chakra-ui/react';
+import React from 'react';
+import type { Control, ControllerProps } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+import type { Inputs } from '../ContractSubmitAuditForm';
+
+interface Props {
+  control: Control<Inputs>;
+}
+
+const AuditSubmitterName = ({ control }: Props) => {
+  const renderControl: ControllerProps<Inputs, 'submitter_name'>['render'] = React.useCallback(({ field, fieldState }) => {
+    return (
+      <FormControl variant="floating" id={ field.name } isRequired>
+        <Input
+          { ...field }
+          required
+          isInvalid={ Boolean(fieldState.error) }
+        />
+        <InputPlaceholder text="Submitter name" error={ fieldState.error }/>
+      </FormControl>
+    );
+  }, [ ]);
+
+  return (
+    <Controller
+      name="submitter_name"
+      control={ control }
+      render={ renderControl }
+      rules={{ required: true }}
+    />
+  );
+};
+
+export default React.memo(AuditSubmitterName);
diff --git a/ui/address/contract/methodForm/ContractMethodArrayButton.tsx b/ui/address/contract/methodForm/ContractMethodArrayButton.tsx
new file mode 100644
index 0000000000..a39df7c926
--- /dev/null
+++ b/ui/address/contract/methodForm/ContractMethodArrayButton.tsx
@@ -0,0 +1,31 @@
+import { IconButton, chakra } from '@chakra-ui/react';
+import React from 'react';
+
+import IconSvg from 'ui/shared/IconSvg';
+
+interface Props {
+  index: number;
+  onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
+  isDisabled?: boolean;
+  type: 'add' | 'remove';
+  className?: string;
+}
+
+const ContractMethodArrayButton = ({ className, type, index, onClick, isDisabled }: Props) => {
+  return (
+    <IconButton
+      className={ className }
+      aria-label={ type }
+      data-index={ index }
+      variant="outline"
+      w="20px"
+      h="20px"
+      flexShrink={ 0 }
+      onClick={ onClick }
+      icon={ <IconSvg name={ type === 'remove' ? 'minus' : 'plus' } boxSize={ 3 }/> }
+      isDisabled={ isDisabled }
+    />
+  );
+};
+
+export default React.memo(chakra(ContractMethodArrayButton));
diff --git a/ui/address/contract/methodForm/ContractMethodFieldAccordion.tsx b/ui/address/contract/methodForm/ContractMethodFieldAccordion.tsx
new file mode 100644
index 0000000000..93084f71de
--- /dev/null
+++ b/ui/address/contract/methodForm/ContractMethodFieldAccordion.tsx
@@ -0,0 +1,51 @@
+import { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, Box, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import ContractMethodArrayButton from './ContractMethodArrayButton';
+
+export interface Props {
+  label: string;
+  level: number;
+  children: React.ReactNode;
+  onAddClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+  onRemoveClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+  index?: number;
+  isInvalid?: boolean;
+}
+
+const ContractMethodFieldAccordion = ({ label, level, children, onAddClick, onRemoveClick, index, isInvalid }: Props) => {
+  const bgColorLevel0 = useColorModeValue('blackAlpha.50', 'whiteAlpha.50');
+  const bgColor = useColorModeValue('whiteAlpha.700', 'blackAlpha.700');
+
+  return (
+    <Accordion allowToggle w="100%" bgColor={ level === 0 ? bgColorLevel0 : bgColor } borderRadius="base">
+      <AccordionItem _first={{ borderTopWidth: 0 }} _last={{ borderBottomWidth: 0 }}>
+        { ({ isExpanded }) => (
+          <>
+            <AccordionButton
+              as="div"
+              cursor="pointer"
+              px="6px"
+              py="6px"
+              wordBreak="break-all"
+              textAlign="left"
+              _hover={{ bgColor: 'inherit' }}
+            >
+              <AccordionIcon transform={ isExpanded ? 'rotate(0deg)' : 'rotate(-90deg)' } color="gray.500"/>
+              <Box fontSize="sm" lineHeight={ 5 } fontWeight={ 700 } mr="auto" ml={ 1 } color={ isInvalid ? 'error' : undefined }>
+                { label }
+              </Box>
+              { onRemoveClick && <ContractMethodArrayButton index={ index } onClick={ onRemoveClick } type="remove"/> }
+              { onAddClick && <ContractMethodArrayButton index={ index } onClick={ onAddClick } type="add" ml={ 2 }/> }
+            </AccordionButton>
+            <AccordionPanel display="flex" flexDir="column" rowGap={ 1 } pl="18px" pr="6px">
+              { children }
+            </AccordionPanel>
+          </>
+        ) }
+      </AccordionItem>
+    </Accordion>
+  );
+};
+
+export default React.memo(ContractMethodFieldAccordion);
diff --git a/ui/address/contract/methodForm/ContractMethodFieldInput.tsx b/ui/address/contract/methodForm/ContractMethodFieldInput.tsx
new file mode 100644
index 0000000000..1a899f65bd
--- /dev/null
+++ b/ui/address/contract/methodForm/ContractMethodFieldInput.tsx
@@ -0,0 +1,106 @@
+import { Box, Flex, FormControl, Input, InputGroup, InputRightElement, chakra, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+import { useController, useFormContext } from 'react-hook-form';
+import { NumericFormat } from 'react-number-format';
+
+import type { SmartContractMethodInput } from 'types/api/contract';
+
+import ClearButton from 'ui/shared/ClearButton';
+
+import ContractMethodFieldLabel from './ContractMethodFieldLabel';
+import ContractMethodMultiplyButton from './ContractMethodMultiplyButton';
+import useArgTypeMatchInt from './useArgTypeMatchInt';
+import useFormatFieldValue from './useFormatFieldValue';
+import useValidateField from './useValidateField';
+
+interface Props {
+  data: SmartContractMethodInput;
+  hideLabel?: boolean;
+  path: string;
+  className?: string;
+  isDisabled: boolean;
+  level: number;
+}
+
+const ContractMethodFieldInput = ({ data, hideLabel, path: name, className, isDisabled, level }: Props) => {
+  const ref = React.useRef<HTMLInputElement>(null);
+
+  const isNativeCoin = data.fieldType === 'native_coin';
+  const isOptional = isNativeCoin;
+
+  const argTypeMatchInt = useArgTypeMatchInt({ argType: data.type });
+  const validate = useValidateField({ isOptional, argType: data.type, argTypeMatchInt });
+  const format = useFormatFieldValue({ argType: data.type, argTypeMatchInt });
+
+  const { control, setValue, getValues } = useFormContext();
+  const { field, fieldState } = useController({ control, name, rules: { validate } });
+
+  const inputBgColor = useColorModeValue('white', 'black');
+  const nativeCoinRowBgColor = useColorModeValue('gray.100', 'gray.700');
+
+  const hasMultiplyButton = argTypeMatchInt && Number(argTypeMatchInt.power) >= 64;
+
+  const handleChange = React.useCallback((event: React.ChangeEvent<HTMLInputElement>) => {
+    const formattedValue = format(event.target.value);
+    field.onChange(formattedValue); // data send back to hook form
+    setValue(name, formattedValue); // UI state
+  }, [ field, name, setValue, format ]);
+
+  const handleClear = React.useCallback(() => {
+    setValue(name, '');
+    ref.current?.focus();
+  }, [ name, setValue ]);
+
+  const handleMultiplyButtonClick = React.useCallback((power: number) => {
+    const zeroes = Array(power).fill('0').join('');
+    const value = getValues(name);
+    const newValue = format(value ? value + zeroes : '1' + zeroes);
+    setValue(name, newValue);
+  }, [ format, getValues, name, setValue ]);
+
+  const error = fieldState.error;
+
+  return (
+    <Flex
+      className={ className }
+      flexDir={{ base: 'column', md: 'row' }}
+      alignItems="flex-start"
+      columnGap={ 3 }
+      w="100%"
+      bgColor={ isNativeCoin ? nativeCoinRowBgColor : undefined }
+      borderRadius="base"
+      px="6px"
+      py={ isNativeCoin ? 1 : 0 }
+    >
+      { !hideLabel && <ContractMethodFieldLabel data={ data } isOptional={ isOptional } level={ level }/> }
+      <FormControl isDisabled={ isDisabled }>
+        <InputGroup size="xs">
+          <Input
+            { ...field }
+            { ...(argTypeMatchInt ? {
+              as: NumericFormat,
+              thousandSeparator: ' ',
+              decimalScale: 0,
+              allowNegative: !argTypeMatchInt.isUnsigned,
+            } : {}) }
+            ref={ ref }
+            onChange={ handleChange }
+            required={ !isOptional }
+            isInvalid={ Boolean(error) }
+            placeholder={ data.type }
+            autoComplete="off"
+            bgColor={ inputBgColor }
+            paddingRight={ hasMultiplyButton ? '120px' : '40px' }
+          />
+          <InputRightElement w="auto" right={ 1 }>
+            { field.value !== undefined && field.value !== '' && <ClearButton onClick={ handleClear } isDisabled={ isDisabled }/> }
+            { hasMultiplyButton && <ContractMethodMultiplyButton onClick={ handleMultiplyButtonClick } isDisabled={ isDisabled }/> }
+          </InputRightElement>
+        </InputGroup>
+        { error && <Box color="error" fontSize="sm" lineHeight={ 5 } mt={ 1 }>{ error.message }</Box> }
+      </FormControl>
+    </Flex>
+  );
+};
+
+export default React.memo(chakra(ContractMethodFieldInput));
diff --git a/ui/address/contract/methodForm/ContractMethodFieldInputArray.tsx b/ui/address/contract/methodForm/ContractMethodFieldInputArray.tsx
new file mode 100644
index 0000000000..85a2611e90
--- /dev/null
+++ b/ui/address/contract/methodForm/ContractMethodFieldInputArray.tsx
@@ -0,0 +1,147 @@
+import { Flex } from '@chakra-ui/react';
+import React from 'react';
+import { useFormContext } from 'react-hook-form';
+
+import type { SmartContractMethodInput, SmartContractMethodArgType } from 'types/api/contract';
+
+import ContractMethodArrayButton from './ContractMethodArrayButton';
+import type { Props as AccordionProps } from './ContractMethodFieldAccordion';
+import ContractMethodFieldAccordion from './ContractMethodFieldAccordion';
+import ContractMethodFieldInput from './ContractMethodFieldInput';
+import ContractMethodFieldInputTuple from './ContractMethodFieldInputTuple';
+import ContractMethodFieldLabel from './ContractMethodFieldLabel';
+import { getFieldLabel } from './utils';
+
+interface Props extends Pick<AccordionProps, 'onAddClick' | 'onRemoveClick' | 'index'> {
+  data: SmartContractMethodInput;
+  level: number;
+  basePath: string;
+  isDisabled: boolean;
+}
+
+const ContractMethodFieldInputArray = ({ data, level, basePath, onAddClick, onRemoveClick, index: parentIndex, isDisabled }: Props) => {
+  const { formState: { errors } } = useFormContext();
+  const fieldsWithErrors = Object.keys(errors);
+  const isInvalid = fieldsWithErrors.some((field) => field.startsWith(basePath));
+
+  const [ registeredIndices, setRegisteredIndices ] = React.useState([ 0 ]);
+
+  const handleAddButtonClick = React.useCallback((event: React.MouseEvent<HTMLButtonElement>) => {
+    event.preventDefault();
+    setRegisteredIndices((prev) => [ ...prev, prev[prev.length - 1] + 1 ]);
+  }, []);
+
+  const handleRemoveButtonClick = React.useCallback((event: React.MouseEvent<HTMLButtonElement>) => {
+    event.preventDefault();
+    const itemIndex = event.currentTarget.getAttribute('data-index');
+    if (itemIndex) {
+      setRegisteredIndices((prev) => prev.filter((index) => index !== Number(itemIndex)));
+    }
+  }, [ ]);
+
+  const getItemData = (index: number) => {
+    const childrenType = data.type.slice(0, -2) as SmartContractMethodArgType;
+    const childrenInternalType = data.internalType?.slice(0, parentIndex !== undefined ? -4 : -2).replaceAll('struct ', '');
+
+    const namePostfix = childrenInternalType ? ' ' + childrenInternalType : '';
+    const nameParentIndex = parentIndex !== undefined ? `${ parentIndex + 1 }.` : '';
+    const nameIndex = index + 1;
+
+    return {
+      ...data,
+      type: childrenType,
+      name: `#${ nameParentIndex + nameIndex }${ namePostfix }`,
+    };
+  };
+  const isNestedArray = data.type.includes('[][]');
+
+  if (isNestedArray) {
+    return (
+      <ContractMethodFieldAccordion
+        level={ level }
+        label={ getFieldLabel(data) }
+        isInvalid={ isInvalid }
+      >
+        { registeredIndices.map((registeredIndex, index) => {
+          const itemData = getItemData(index);
+
+          return (
+            <ContractMethodFieldInputArray
+              key={ registeredIndex }
+              data={ itemData }
+              basePath={ `${ basePath }:${ registeredIndex }` }
+              level={ level + 1 }
+              onAddClick={ index === registeredIndices.length - 1 ? handleAddButtonClick : undefined }
+              onRemoveClick={ registeredIndices.length > 1 ? handleRemoveButtonClick : undefined }
+              index={ registeredIndex }
+              isDisabled={ isDisabled }
+            />
+          );
+        }) }
+      </ContractMethodFieldAccordion>
+    );
+  }
+
+  const isTupleArray = data.type.includes('tuple');
+
+  if (isTupleArray) {
+    return (
+      <ContractMethodFieldAccordion
+        level={ level }
+        label={ getFieldLabel(data) }
+        onAddClick={ onAddClick }
+        onRemoveClick={ onRemoveClick }
+        index={ parentIndex }
+        isInvalid={ isInvalid }
+      >
+        { registeredIndices.map((registeredIndex, index) => {
+          const itemData = getItemData(index);
+
+          return (
+            <ContractMethodFieldInputTuple
+              key={ registeredIndex }
+              data={ itemData }
+              basePath={ `${ basePath }:${ registeredIndex }` }
+              level={ level + 1 }
+              onAddClick={ index === registeredIndices.length - 1 ? handleAddButtonClick : undefined }
+              onRemoveClick={ registeredIndices.length > 1 ? handleRemoveButtonClick : undefined }
+              index={ registeredIndex }
+              isDisabled={ isDisabled }
+            />
+          );
+        }) }
+      </ContractMethodFieldAccordion>
+    );
+  }
+
+  // primitive value array
+  return (
+    <Flex flexDir={{ base: 'column', md: 'row' }} alignItems="flex-start" columnGap={ 3 } px="6px">
+      <ContractMethodFieldLabel data={ data } level={ level }/>
+      <Flex flexDir="column" rowGap={ 1 } w="100%">
+        { registeredIndices.map((registeredIndex, index) => {
+          const itemData = getItemData(index);
+
+          return (
+            <Flex key={ registeredIndex } alignItems="flex-start" columnGap={ 3 }>
+              <ContractMethodFieldInput
+                data={ itemData }
+                hideLabel
+                path={ `${ basePath }:${ index }` }
+                level={ level }
+                px={ 0 }
+                isDisabled={ isDisabled }
+              />
+              { registeredIndices.length > 1 &&
+                <ContractMethodArrayButton index={ registeredIndex } onClick={ handleRemoveButtonClick } type="remove" my="6px"/> }
+              { index === registeredIndices.length - 1 &&
+                <ContractMethodArrayButton index={ registeredIndex } onClick={ handleAddButtonClick } type="add" my="6px"/> }
+            </Flex>
+          );
+        }) }
+      </Flex>
+    </Flex>
+  );
+};
+
+export default React.memo(ContractMethodFieldInputArray);
diff --git a/ui/address/contract/methodForm/ContractMethodFieldInputTuple.tsx b/ui/address/contract/methodForm/ContractMethodFieldInputTuple.tsx
new file mode 100644
index 0000000000..79adfb0d8a
--- /dev/null
+++ b/ui/address/contract/methodForm/ContractMethodFieldInputTuple.tsx
@@ -0,0 +1,72 @@
+import React from 'react';
+import { useFormContext } from 'react-hook-form';
+
+import type { SmartContractMethodInput } from 'types/api/contract';
+
+import type { Props as AccordionProps } from './ContractMethodFieldAccordion';
+import ContractMethodFieldAccordion from './ContractMethodFieldAccordion';
+import ContractMethodFieldInput from './ContractMethodFieldInput';
+import ContractMethodFieldInputArray from './ContractMethodFieldInputArray';
+import { ARRAY_REGEXP, getFieldLabel } from './utils';
+
+interface Props extends Pick<AccordionProps, 'onAddClick' | 'onRemoveClick' | 'index'> {
+  data: SmartContractMethodInput;
+  basePath: string;
+  level: number;
+  isDisabled: boolean;
+}
+
+const ContractMethodFieldInputTuple = ({ data, basePath, level, isDisabled, ...accordionProps }: Props) => {
+  const { formState: { errors } } = useFormContext();
+  const fieldsWithErrors = Object.keys(errors);
+  const isInvalid = fieldsWithErrors.some((field) => field.startsWith(basePath));
+
+  return (
+    <ContractMethodFieldAccordion
+      { ...accordionProps }
+      level={ level }
+      label={ getFieldLabel(data) }
+      isInvalid={ isInvalid }
+    >
+      { data.components?.map((component, index) => {
+        if (component.components && component.type === 'tuple') {
+          return (
+            <ContractMethodFieldInputTuple
+              key={ index }
+              data={ component }
+              basePath={ `${ basePath }:${ index }` }
+              level={ level + 1 }
+              isDisabled={ isDisabled }
+            />
+          );
+        }
+
+        const arrayMatch = component.type.match(ARRAY_REGEXP);
+        if (arrayMatch) {
+          const [ , itemType ] = arrayMatch;
+          return (
+            <ContractMethodFieldInputArray
+              key={ index }
+              data={ component }
+              basePath={ `${ basePath }:${ index }` }
+              level={ itemType === 'tuple' ? level + 1 : level }
+              isDisabled={ isDisabled }
+            />
+          );
+        }
+
+        return (
+          <ContractMethodFieldInput
+            key={ index }
+            data={ component }
+            path={ `${ basePath }:${ index }` }
+            isDisabled={ isDisabled }
+            level={ level }
+          />
+        );
+      }) }
+    </ContractMethodFieldAccordion>
+  );
+};
+
+export default React.memo(ContractMethodFieldInputTuple);
diff --git a/ui/address/contract/methodForm/ContractMethodFieldLabel.tsx b/ui/address/contract/methodForm/ContractMethodFieldLabel.tsx
new file mode 100644
index 0000000000..ea2b4be02c
--- /dev/null
+++ b/ui/address/contract/methodForm/ContractMethodFieldLabel.tsx
@@ -0,0 +1,32 @@
+import { Box, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import type { SmartContractMethodInput } from 'types/api/contract';
+
+import { getFieldLabel } from './utils';
+
+interface Props {
+  data: SmartContractMethodInput;
+  isOptional?: boolean;
+  level: number;
+}
+
+const ContractMethodFieldLabel = ({ data, isOptional, level }: Props) => {
+  const color = useColorModeValue('blackAlpha.600', 'whiteAlpha.600');
+
+  return (
+    <Box
+      w="250px"
+      fontSize="sm"
+      lineHeight={ 5 }
+      py="6px"
+      flexShrink={ 0 }
+      fontWeight={ 500 }
+      color={ level > 1 ? color : undefined }
+    >
+      { getFieldLabel(data, !isOptional) }
+    </Box>
+  );
+};
+
+export default React.memo(ContractMethodFieldLabel);
diff --git a/ui/address/contract/methodForm/ContractMethodForm.pw.tsx b/ui/address/contract/methodForm/ContractMethodForm.pw.tsx
new file mode 100644
index 0000000000..2fd5fbb589
--- /dev/null
+++ b/ui/address/contract/methodForm/ContractMethodForm.pw.tsx
@@ -0,0 +1,135 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import type { SmartContractWriteMethod } from 'types/api/contract';
+
+import TestApp from 'playwright/TestApp';
+
+import ContractMethodForm from './ContractMethodForm';
+
+const onSubmit = () => Promise.resolve({ hash: '0x0000' as `0x${ string }` });
+const resultComponent = () => null;
+
+const data: SmartContractWriteMethod = {
+  inputs: [
+    // TUPLE
+    {
+      components: [
+        { internalType: 'address', name: 'offerToken', type: 'address' },
+        { internalType: 'uint256', name: 'offerIdentifier', type: 'uint256' },
+        { internalType: 'enum BasicOrderType', name: 'basicOrderType', type: 'uint8' },
+        {
+          components: [
+            { internalType: 'uint256', name: 'amount', type: 'uint256' },
+            { internalType: 'address payable', name: 'recipient', type: 'address' },
+          ],
+          internalType: 'struct AdditionalRecipient[]',
+          name: 'additionalRecipients',
+          type: 'tuple[]',
+        },
+        { internalType: 'bytes', name: 'signature', type: 'bytes' },
+      ],
+      internalType: 'struct BasicOrderParameters',
+      name: 'parameters',
+      type: 'tuple',
+    },
+
+    // NESTED ARRAY OF TUPLES
+    {
+      components: [
+        {
+          internalType: 'uint256',
+          name: 'orderIndex',
+          type: 'uint256',
+        },
+        {
+          internalType: 'uint256',
+          name: 'itemIndex',
+          type: 'uint256',
+        },
+      ],
+      internalType: 'struct FulfillmentComponent[][]',
+      name: '',
+      type: 'tuple[][]',
+    },
+
+    // LITERALS
+    { internalType: 'bytes32', name: 'fulfillerConduitKey', type: 'bytes32' },
+    { internalType: 'address', name: 'recipient', type: 'address' },
+    { internalType: 'uint256', name: 'maximumFulfilled', type: 'uint256' },
+    { internalType: 'int8[]', name: 'criteriaProof', type: 'int8[]' },
+  ],
+  method_id: '87201b41',
+  name: 'fulfillAvailableAdvancedOrders',
+  outputs: [
+    { internalType: 'bool[]', name: '', type: 'bool[]' },
+    {
+      components: [
+        {
+          components: [
+            { internalType: 'enum ItemType', name: 'itemType', type: 'uint8' },
+            { internalType: 'address', name: 'token', type: 'address' },
+            { internalType: 'uint256', name: 'identifier', type: 'uint256' },
+            { internalType: 'uint256', name: 'amount', type: 'uint256' },
+            { internalType: 'address payable', name: 'recipient', type: 'address' },
+          ],
+          internalType: 'struct ReceivedItem',
+          name: 'item',
+          type: 'tuple',
+        },
+        { internalType: 'address', name: 'offerer', type: 'address' },
+        { internalType: 'bytes32', name: 'conduitKey', type: 'bytes32' },
+      ],
+      internalType: 'struct Execution[]',
+      name: '',
+      type: 'tuple[]',
+    },
+  ],
+  stateMutability: 'payable',
+  type: 'function',
+  payable: true,
+  constant: false,
+};
+
+test('base view +@mobile +@dark-mode', async({ mount }) => {
+
+  const component = await mount(
+    <TestApp>
+      <ContractMethodForm<SmartContractWriteMethod>
+        data={ data }
+        onSubmit={ onSubmit }
+        resultComponent={ resultComponent }
+        methodType="write"
+      />
+    </TestApp>,
+  );
+
+  // fill top level fields
+  await component.getByPlaceholder('address').last().fill('0x0000');
+  await component.getByPlaceholder('uint256').last().fill('42');
+  await component.getByRole('button', { name: '×' }).last().click();
+  await component.getByPlaceholder('bytes32').last().fill('aa');
+  await component.getByRole('button', { name: 'add' }).last().click();
+  await component.getByRole('button', { name: 'add' }).last().click();
+  await component.getByPlaceholder('int8', { exact: true }).first().fill('1');
+  await component.getByPlaceholder('int8', { exact: true }).last().fill('3');
+
+  // expand all sections
+  await component.getByText('parameters').click();
+  await component.getByText('additionalRecipients').click();
+  await component.getByText('#1 AdditionalRecipient').click();
+  await component.getByRole('button', { name: 'add' }).first().click();
+  await component.getByPlaceholder('uint256').nth(1).fill('42');
+  await component.getByPlaceholder('address').nth(1).fill('0xd789a607CEac2f0E14867de4EB15b15C9FFB5859');
+
+  await component.getByText('struct FulfillmentComponent[][]').click();
+  await component.getByRole('button', { name: 'add' }).nth(1).click();
+  await component.getByText('#1 FulfillmentComponent[]').click();
+  await component.getByText('#1.1 FulfillmentComponent').click();
+  await component.getByRole('button', { name: 'add' }).nth(1).click();
+
+  // submit form
+  await component.getByRole('button', { name: 'Write' }).click();
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/address/contract/methodForm/ContractMethodForm.tsx b/ui/address/contract/methodForm/ContractMethodForm.tsx
new file mode 100644
index 0000000000..d1e969b334
--- /dev/null
+++ b/ui/address/contract/methodForm/ContractMethodForm.tsx
@@ -0,0 +1,128 @@
+import { Box, Button, Flex, chakra } from '@chakra-ui/react';
+import _mapValues from 'lodash/mapValues';
+import React from 'react';
+import type { SubmitHandler } from 'react-hook-form';
+import { useForm, FormProvider } from 'react-hook-form';
+
+import type { ContractMethodCallResult } from '../types';
+import type { ResultComponentProps } from './types';
+import type { SmartContractMethod, SmartContractMethodInput } from 'types/api/contract';
+
+import config from 'configs/app';
+import * as mixpanel from 'lib/mixpanel/index';
+
+import ContractMethodFieldInput from './ContractMethodFieldInput';
+import ContractMethodFieldInputArray from './ContractMethodFieldInputArray';
+import ContractMethodFieldInputTuple from './ContractMethodFieldInputTuple';
+import ContractMethodFormOutputs from './ContractMethodFormOutputs';
+import { ARRAY_REGEXP, transformFormDataToMethodArgs } from './utils';
+import type { ContractMethodFormFields } from './utils';
+
+interface Props<T extends SmartContractMethod> {
+  data: T;
+  onSubmit: (data: T, args: Array<unknown>) => Promise<ContractMethodCallResult<T>>;
+  resultComponent: (props: ResultComponentProps<T>) => JSX.Element | null;
+  methodType: 'read' | 'write';
+}
+
+const ContractMethodForm = <T extends SmartContractMethod>({ data, onSubmit, resultComponent: ResultComponent, methodType }: Props<T>) => {
+
+  const [ result, setResult ] = React.useState<ContractMethodCallResult<T>>();
+  const [ isLoading, setLoading ] = React.useState(false);
+
+  const formApi = useForm<ContractMethodFormFields>({
+    mode: 'all',
+    shouldUnregister: true,
+  });
+
+  const onFormSubmit: SubmitHandler<ContractMethodFormFields> = React.useCallback(async(formData) => {
+    // The API used for reading from contracts expects all values to be strings.
+    const formattedData = methodType === 'read' ?
+      _mapValues(formData, (value) => value !== undefined ? String(value) : undefined) :
+      formData;
+    const args = transformFormDataToMethodArgs(formattedData);
+
+    setResult(undefined);
+    setLoading(true);
+
+    onSubmit(data, args)
+      .then((result) => {
+        setResult(result);
+      })
+      .catch((error) => {
+        setResult(error?.error || error?.data || (error?.reason && { message: error.reason }) || error);
+        setLoading(false);
+      })
+      .finally(() => {
+        mixpanel.logEvent(mixpanel.EventTypes.CONTRACT_INTERACTION, {
+          'Method type': methodType === 'write' ? 'Write' : 'Read',
+          'Method name': 'name' in data ? data.name : 'Fallback',
+        });
+      });
+  }, [ data, methodType, onSubmit ]);
+
+  const handleTxSettle = React.useCallback(() => {
+    setLoading(false);
+  }, []);
+
+  const handleFormChange = React.useCallback(() => {
+    result && setResult(undefined);
+  }, [ result ]);
+
+  const inputs: Array<SmartContractMethodInput> = React.useMemo(() => {
+    return [
+      ...('inputs' in data ? data.inputs : []),
+      ...('stateMutability' in data && data.stateMutability === 'payable' ? [ {
+        name: `Send native ${ config.chain.currency.symbol || 'coin' }`,
+        type: 'uint256' as const,
+        internalType: 'uint256' as const,
+        fieldType: 'native_coin' as const,
+      } ] : []),
+    ];
+  }, [ data ]);
+
+  const outputs = 'outputs' in data && data.outputs ? data.outputs : [];
+
+  return (
+    <Box>
+      <FormProvider { ...formApi }>
+        <chakra.form
+          noValidate
+          onSubmit={ formApi.handleSubmit(onFormSubmit) }
+          onChange={ handleFormChange }
+        >
+          <Flex flexDir="column" rowGap={ 3 } mb={ 6 } _empty={{ display: 'none' }}>
+            { inputs.map((input, index) => {
+              if (input.components && input.type === 'tuple') {
+                return <ContractMethodFieldInputTuple key={ index } data={ input } basePath={ `${ index }` } level={ 0 } isDisabled={ isLoading }/>;
+              }
+
+              const arrayMatch = input.type.match(ARRAY_REGEXP);
+              if (arrayMatch) {
+                return <ContractMethodFieldInputArray key={ index } data={ input } basePath={ `${ index }` } level={ 0 } isDisabled={ isLoading }/>;
+              }
+
+              return <ContractMethodFieldInput key={ index } data={ input } path={ `${ index }` } isDisabled={ isLoading } level={ 0 }/>;
+            }) }
+          </Flex>
+          <Button
+            isLoading={ isLoading }
+            loadingText={ methodType === 'write' ? 'Write' : 'Read' }
+            variant="outline"
+            size="sm"
+            flexShrink={ 0 }
+            width="min-content"
+            px={ 4 }
+            type="submit"
+          >
+            { methodType === 'write' ? 'Write' : 'Read' }
+          </Button>
+        </chakra.form>
+      </FormProvider>
+      { methodType === 'read' && <ContractMethodFormOutputs data={ outputs }/> }
+      { result && <ResultComponent item={ data } result={ result } onSettle={ handleTxSettle }/> }
+    </Box>
+  );
+};
+
+export default React.memo(ContractMethodForm) as typeof ContractMethodForm;
diff --git a/ui/address/contract/methodForm/ContractMethodFormOutputs.tsx b/ui/address/contract/methodForm/ContractMethodFormOutputs.tsx
new file mode 100644
index 0000000000..9876266514
--- /dev/null
+++ b/ui/address/contract/methodForm/ContractMethodFormOutputs.tsx
@@ -0,0 +1,35 @@
+import { Flex, chakra } from '@chakra-ui/react';
+import React from 'react';
+
+import type { SmartContractMethodOutput } from 'types/api/contract';
+
+import IconSvg from 'ui/shared/IconSvg';
+
+interface Props {
+  data: Array<SmartContractMethodOutput>;
+}
+
+const ContractMethodFormOutputs = ({ data }: Props) => {
+  if (data.length === 0) {
+    return null;
+  }
+
+  return (
+    <Flex mt={ 3 } fontSize="sm">
+      <IconSvg name="arrows/down-right" boxSize={ 5 } mr={ 1 }/>
+      <p>
+        { data.map(({ type, name }, index) => {
+          return (
+            <React.Fragment key={ index }>
+              <chakra.span fontWeight={ 500 }>{ name } </chakra.span>
+              <span>{ name ? `(${ type })` : type }</span>
+              { index < data.length - 1 && <span>, </span> }
+            </React.Fragment>
+          );
+        }) }
+      </p>
+    </Flex>
+  );
+};
+
+export default React.memo(ContractMethodFormOutputs);
diff --git a/ui/address/contract/ContractMethodFieldZeroes.tsx b/ui/address/contract/methodForm/ContractMethodMultiplyButton.tsx
similarity index 89%
rename from ui/address/contract/ContractMethodFieldZeroes.tsx
rename to ui/address/contract/methodForm/ContractMethodMultiplyButton.tsx
index 1c0bfc9852..7b12ab727e 100644
--- a/ui/address/contract/ContractMethodFieldZeroes.tsx
+++ b/ui/address/contract/methodForm/ContractMethodMultiplyButton.tsx
@@ -21,7 +21,7 @@ interface Props {
   isDisabled?: boolean;
 }
 
-const ContractMethodFieldZeroes = ({ onClick, isDisabled }: Props) => {
+const ContractMethodMultiplyButton = ({ onClick, isDisabled }: Props) => {
   const [ selectedOption, setSelectedOption ] = React.useState<number | undefined>(18);
   const [ customValue, setCustomValue ] = React.useState<number>();
   const { isOpen, onToggle, onClose } = useDisclosure();
@@ -78,7 +78,14 @@ const ContractMethodFieldZeroes = ({ onClick, isDisabled }: Props) => {
             onClick={ onToggle }
             isDisabled={ isDisabled }
           >
-            <IconSvg name="arrows/east-mini" transform={ isOpen ? 'rotate(90deg)' : 'rotate(-90deg)' } boxSize={ 6 }/>
+            <IconSvg
+              name="arrows/east-mini"
+              transitionDuration="fast"
+              transitionProperty="transform"
+              transitionTimingFunction="ease-in-out"
+              transform={ isOpen ? 'rotate(90deg)' : 'rotate(-90deg)' }
+              boxSize={ 6 }
+            />
           </Button>
         </PopoverTrigger>
         <Portal>
@@ -126,4 +133,4 @@ const ContractMethodFieldZeroes = ({ onClick, isDisabled }: Props) => {
   );
 };
 
-export default React.memo(ContractMethodFieldZeroes);
+export default React.memo(ContractMethodMultiplyButton);
diff --git a/ui/address/contract/methodForm/__screenshots__/ContractMethodForm.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png b/ui/address/contract/methodForm/__screenshots__/ContractMethodForm.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..0efe77db56
Binary files /dev/null and b/ui/address/contract/methodForm/__screenshots__/ContractMethodForm.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/address/contract/methodForm/__screenshots__/ContractMethodForm.pw.tsx_default_base-view-mobile-dark-mode-1.png b/ui/address/contract/methodForm/__screenshots__/ContractMethodForm.pw.tsx_default_base-view-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..c5bc0169c9
Binary files /dev/null and b/ui/address/contract/methodForm/__screenshots__/ContractMethodForm.pw.tsx_default_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/address/contract/methodForm/__screenshots__/ContractMethodForm.pw.tsx_mobile_base-view-mobile-dark-mode-1.png b/ui/address/contract/methodForm/__screenshots__/ContractMethodForm.pw.tsx_mobile_base-view-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..c386ad9a29
Binary files /dev/null and b/ui/address/contract/methodForm/__screenshots__/ContractMethodForm.pw.tsx_mobile_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/address/contract/methodForm/types.ts b/ui/address/contract/methodForm/types.ts
new file mode 100644
index 0000000000..845d6d3621
--- /dev/null
+++ b/ui/address/contract/methodForm/types.ts
@@ -0,0 +1,8 @@
+import type { ContractMethodCallResult } from '../types';
+import type { SmartContractMethod } from 'types/api/contract';
+
+export interface ResultComponentProps<T extends SmartContractMethod> {
+  item: T;
+  result: ContractMethodCallResult<T>;
+  onSettle: () => void;
+}
diff --git a/ui/address/contract/methodForm/useArgTypeMatchInt.tsx b/ui/address/contract/methodForm/useArgTypeMatchInt.tsx
new file mode 100644
index 0000000000..fa6b994021
--- /dev/null
+++ b/ui/address/contract/methodForm/useArgTypeMatchInt.tsx
@@ -0,0 +1,26 @@
+import type { SmartContractMethodArgType } from 'types/api/contract';
+
+import { INT_REGEXP, getIntBoundaries } from './utils';
+
+interface Params {
+  argType: SmartContractMethodArgType;
+}
+
+export interface MatchInt {
+  isUnsigned: boolean;
+  power: string;
+  min: bigint;
+  max: bigint;
+}
+
+export default function useArgTypeMatchInt({ argType }: Params): MatchInt | null {
+  const match = argType.match(INT_REGEXP);
+  if (!match) {
+    return null;
+  }
+
+  const [ , isUnsigned, power = '256' ] = match;
+  const [ min, max ] = getIntBoundaries(Number(power), Boolean(isUnsigned));
+
+  return { isUnsigned: Boolean(isUnsigned), power, min, max };
+}
diff --git a/ui/address/contract/methodForm/useFormatFieldValue.tsx b/ui/address/contract/methodForm/useFormatFieldValue.tsx
new file mode 100644
index 0000000000..6c82c682b3
--- /dev/null
+++ b/ui/address/contract/methodForm/useFormatFieldValue.tsx
@@ -0,0 +1,46 @@
+import React from 'react';
+
+import type { SmartContractMethodArgType } from 'types/api/contract';
+
+import type { MatchInt } from './useArgTypeMatchInt';
+
+interface Params {
+  argType: SmartContractMethodArgType;
+  argTypeMatchInt: MatchInt | null;
+}
+
+export default function useFormatFieldValue({ argType, argTypeMatchInt }: Params) {
+
+  return React.useCallback((value: string | undefined) => {
+    if (!value) {
+      return;
+    }
+
+    if (argTypeMatchInt) {
+      // we have to store all numbers as strings to avoid precision loss
+      // and we cannot store them as BigInt because the NumberFormat component will not work properly
+      // so we just remove all white spaces here otherwise the `viem` library will throw an error on attempt to write value to a contract
+      const formattedString = value.replace(/\s/g, '');
+      return formattedString;
+    }
+
+    if (argType === 'bool') {
+      const formattedValue = value.toLowerCase();
+
+      switch (formattedValue) {
+        case 'true': {
+          return true;
+        }
+
+        case 'false':{
+          return false;
+        }
+
+        default:
+          return value;
+      }
+    }
+
+    return value;
+  }, [ argType, argTypeMatchInt ]);
+}
diff --git a/ui/address/contract/methodForm/useValidateField.tsx b/ui/address/contract/methodForm/useValidateField.tsx
new file mode 100644
index 0000000000..5151cffcba
--- /dev/null
+++ b/ui/address/contract/methodForm/useValidateField.tsx
@@ -0,0 +1,88 @@
+import React from 'react';
+import { getAddress, isAddress, isHex } from 'viem';
+
+import type { SmartContractMethodArgType } from 'types/api/contract';
+
+import type { MatchInt } from './useArgTypeMatchInt';
+import { BYTES_REGEXP } from './utils';
+
+interface Params {
+  argType: SmartContractMethodArgType;
+  argTypeMatchInt: MatchInt | null;
+  isOptional: boolean;
+}
+
+export default function useValidateField({ isOptional, argType, argTypeMatchInt }: Params) {
+
+  const bytesMatch = React.useMemo(() => {
+    return argType.match(BYTES_REGEXP);
+  }, [ argType ]);
+
+  // some values are formatted before they are sent to the validator
+  // see ./useFormatFieldValue.tsx hook
+  return React.useCallback((value: string | boolean | undefined) => {
+    if (value === undefined || value === '') {
+      return isOptional ? true : 'Field is required';
+    }
+
+    if (argType === 'address') {
+      if (typeof value !== 'string' || !isAddress(value)) {
+        return 'Invalid address format';
+      }
+
+      // all lowercase addresses are valid
+      const isInLowerCase = value === value.toLowerCase();
+      if (isInLowerCase) {
+        return true;
+      }
+
+      // check if address checksum is valid
+      return getAddress(value) === value ? true : 'Invalid address checksum';
+    }
+
+    if (argTypeMatchInt) {
+      const valueBi = (() => {
+        try {
+          return BigInt(value);
+        } catch (error) {
+          return null;
+        }
+      })();
+
+      if (typeof value !== 'string' || valueBi === null) {
+        return 'Invalid integer format';
+      }
+
+      if (valueBi > argTypeMatchInt.max || valueBi < argTypeMatchInt.min) {
+        const lowerBoundary = argTypeMatchInt.isUnsigned ? '0' : `-1 * 2 ^ ${ Number(argTypeMatchInt.power) - 1 }`;
+        const upperBoundary = argTypeMatchInt.isUnsigned ? `2 ^ ${ argTypeMatchInt.power } - 1` : `2 ^ ${ Number(argTypeMatchInt.power) - 1 } - 1`;
+        return `Value should be in range from "${ lowerBoundary }" to "${ upperBoundary }" inclusively`;
+      }
+
+      return true;
+    }
+
+    if (argType === 'bool') {
+      if (typeof value !== 'boolean') {
+        return 'Invalid boolean format. Allowed values: true, false';
+      }
+    }
+
+    if (bytesMatch) {
+      const [ , length ] = bytesMatch;
+
+      if (!isHex(value)) {
+        return 'Invalid bytes format';
+      }
+
+      if (length) {
+        const valueLengthInBytes = value.replace('0x', '').length / 2;
+        return valueLengthInBytes !== Number(length) ? `Value should be ${ length } bytes in length` : true;
+      }
+
+      return true;
+    }
+
+    return true;
+  }, [ isOptional, argType, argTypeMatchInt, bytesMatch ]);
+}
diff --git a/ui/address/contract/methodForm/utils.test.ts b/ui/address/contract/methodForm/utils.test.ts
new file mode 100644
index 0000000000..f49b3fe9f9
--- /dev/null
+++ b/ui/address/contract/methodForm/utils.test.ts
@@ -0,0 +1,49 @@
+import { transformFormDataToMethodArgs } from './utils';
+
+describe('transformFormDataToMethodArgs', () => {
+  it('should transform form data to method args array', () => {
+    const formData = {
+      '1': '1',
+      '2': '2',
+      '0:1': '0:1',
+      '0:0:0': '0:0:0',
+      '0:0:1:0': '0:0:1:0',
+      '0:0:1:3': '0:0:1:3',
+      '0:0:2:1:0': '0:0:2:1:0',
+      '0:0:2:1:1': '0:0:2:1:1',
+      '0:0:2:2:0': '0:0:2:2:0',
+      '0:0:2:2:2': '0:0:2:2:2',
+      '0:0:2:5:3': '0:0:2:5:3',
+      '0:0:2:5:8': '0:0:2:5:8',
+    };
+    const result = transformFormDataToMethodArgs(formData);
+    expect(result).toEqual([
+      [
+        [
+          '0:0:0',
+          [
+            '0:0:1:0',
+            '0:0:1:3',
+          ],
+          [
+            [
+              '0:0:2:1:0',
+              '0:0:2:1:1',
+            ],
+            [
+              '0:0:2:2:0',
+              '0:0:2:2:2',
+            ],
+            [
+              '0:0:2:5:3',
+              '0:0:2:5:8',
+            ],
+          ],
+        ],
+        '0:1',
+      ],
+      '1',
+      '2',
+    ]);
+  });
+});
diff --git a/ui/address/contract/methodForm/utils.ts b/ui/address/contract/methodForm/utils.ts
new file mode 100644
index 0000000000..61515577d3
--- /dev/null
+++ b/ui/address/contract/methodForm/utils.ts
@@ -0,0 +1,47 @@
+import _set from 'lodash/set';
+
+import type { SmartContractMethodInput } from 'types/api/contract';
+
+export type ContractMethodFormFields = Record<string, string | boolean | undefined>;
+
+export const INT_REGEXP = /^(u)?int(\d+)?$/i;
+
+export const BYTES_REGEXP = /^bytes(\d+)?$/i;
+
+export const ARRAY_REGEXP = /^(.*)\[(\d*)\]$/;
+
+export const getIntBoundaries = (power: number, isUnsigned: boolean) => {
+  const maxUnsigned = BigInt(2 ** power);
+  const max = isUnsigned ? maxUnsigned - BigInt(1) : maxUnsigned / BigInt(2) - BigInt(1);
+  const min = isUnsigned ? BigInt(0) : -maxUnsigned / BigInt(2);
+  return [ min, max ];
+};
+
+export function transformFormDataToMethodArgs(formData: ContractMethodFormFields) {
+  const result: Array<unknown> = [];
+
+  for (const field in formData) {
+    const value = formData[field];
+    if (value !== undefined) {
+      _set(result, field.replaceAll(':', '.'), value);
+    }
+  }
+
+  return filterOurEmptyItems(result);
+}
+
+function filterOurEmptyItems(array: Array<unknown>): Array<unknown> {
+  // The undefined value may occur in two cases:
+  //    1. When an optional form field is left blank by the user.
+  //        The only optional field is the native coin value, which is safely handled in the form submit handler.
+  //    2. When the user adds and removes items from a field array.
+  //        In this scenario, empty items need to be filtered out to maintain the correct sequence of arguments.
+  return array
+    .map((item) => Array.isArray(item) ? filterOurEmptyItems(item) : item)
+    .filter((item) => item !== undefined);
+}
+
+export function getFieldLabel(input: SmartContractMethodInput, isRequired?: boolean) {
+  const name = input.name || input.internalType || '<unnamed argument>';
+  return `${ name } (${ input.type })${ isRequired ? '*' : '' }`;
+}
diff --git a/ui/address/contract/types.ts b/ui/address/contract/types.ts
index b076f30f78..26753dcbf1 100644
--- a/ui/address/contract/types.ts
+++ b/ui/address/contract/types.ts
@@ -1,4 +1,4 @@
-import type { SmartContractQueryMethodRead, SmartContractMethod } from 'types/api/contract';
+import type { SmartContractQueryMethodRead, SmartContractMethod, SmartContractReadMethod } from 'types/api/contract';
 
 import type { ResourceError } from 'lib/api/resources';
 
@@ -12,4 +12,4 @@ export type ContractMethodReadResult = SmartContractQueryMethodRead | ResourceEr
 export type ContractMethodWriteResult = Error | { hash: `0x${ string }` | undefined } | undefined;
 
 export type ContractMethodCallResult<T extends SmartContractMethod> =
-    T extends { method_id: string } ? ContractMethodReadResult : ContractMethodWriteResult;
+    T extends SmartContractReadMethod ? ContractMethodReadResult : ContractMethodWriteResult;
diff --git a/ui/address/contract/useContractAbi.tsx b/ui/address/contract/useContractAbi.tsx
index 7f85bb4d8e..d2bd337951 100644
--- a/ui/address/contract/useContractAbi.tsx
+++ b/ui/address/contract/useContractAbi.tsx
@@ -50,7 +50,7 @@ export default function useContractAbi({ addressHash, isProxy, isCustomAbi }: Pa
     }
 
     if (isCustomAbi) {
-      return customInfo;
+      return customInfo as Abi;
     }
 
     return contractInfo?.abi ?? undefined;
diff --git a/ui/address/contract/useWatchAccount.tsx b/ui/address/contract/useWatchAccount.tsx
index d4035e6ce5..ac19b2f55e 100644
--- a/ui/address/contract/useWatchAccount.tsx
+++ b/ui/address/contract/useWatchAccount.tsx
@@ -1,24 +1,31 @@
 import { watchAccount, getAccount } from '@wagmi/core';
 import React from 'react';
+import type { Config } from 'wagmi';
+import { useConfig } from 'wagmi';
 
-export function getWalletAccount() {
+export function getWalletAccount(config: Config) {
   try {
-    return getAccount();
+    return getAccount(config);
   } catch (error) {
     return null;
   }
 }
 
 export default function useWatchAccount() {
-  const [ account, setAccount ] = React.useState(getWalletAccount());
+  const config = useConfig();
+  const [ account, setAccount ] = React.useState(getWalletAccount(config));
 
   React.useEffect(() => {
     if (!account) {
       return;
     }
 
-    return watchAccount(setAccount);
-  }, [ account ]);
+    return watchAccount(config, {
+      onChange(account) {
+        setAccount(account);
+      },
+    });
+  }, [ account, config ]);
 
   return account;
 }
diff --git a/ui/address/contract/utils.test.ts b/ui/address/contract/utils.test.ts
index da20410583..47e12d3b67 100644
--- a/ui/address/contract/utils.test.ts
+++ b/ui/address/contract/utils.test.ts
@@ -1,6 +1,4 @@
-import type { SmartContractMethodInput } from 'types/api/contract';
-
-import { prepareAbi, transformFieldsToArgs, formatFieldValues } from './utils';
+import { prepareAbi } from './utils';
 
 describe('function prepareAbi()', () => {
   const commonAbi = [
@@ -48,6 +46,7 @@ describe('function prepareAbi()', () => {
     type: 'function' as const,
     constant: false,
     payable: true,
+    method_id: '0x2e0e2d3e',
   };
 
   it('if there is only one method with provided name, does nothing', () => {
@@ -100,100 +99,3 @@ describe('function prepareAbi()', () => {
     expect(item).toEqual(commonAbi[2]);
   });
 });
-
-describe('function formatFieldValues()', () => {
-  const formFields = {
-    '_tx%0:nonce%0': '1 000 000 000 000 000 000',
-    '_tx%0:sender%1': '0xB375d4150A853482f25E3922A4C64c6C4fF6Ae3c',
-    '_tx%0:targets%2': [
-      '1',
-      'true',
-    ],
-    '_l2OutputIndex%1': '0xaeff',
-    '_paused%2': '0',
-    '_withdrawalProof%3': [
-      '0x0f',
-      '0x02',
-    ],
-  };
-
-  const inputs: Array<SmartContractMethodInput> = [
-    {
-      components: [
-        { internalType: 'uint256', name: 'nonce', type: 'uint256' },
-        { internalType: 'address', name: 'sender', type: 'address' },
-        { internalType: 'bool[]', name: 'targets', type: 'bool[]' },
-      ],
-      internalType: 'tuple',
-      name: '_tx',
-      type: 'tuple',
-    },
-    { internalType: 'bytes32', name: '_l2OutputIndex', type: 'bytes32' },
-    {
-      internalType: 'bool',
-      name: '_paused',
-      type: 'bool',
-    },
-    {
-      internalType: 'bytes32[]',
-      name: '_withdrawalProof',
-      type: 'bytes32[]',
-    },
-  ];
-
-  it('converts values to correct format', () => {
-    const result = formatFieldValues(formFields, inputs);
-    expect(result).toEqual({
-      '_tx%0:nonce%0': '1000000000000000000',
-      '_tx%0:sender%1': '0xB375d4150A853482f25E3922A4C64c6C4fF6Ae3c',
-      '_tx%0:targets%2': [
-        true,
-        true,
-      ],
-      '_l2OutputIndex%1': '0xaeff',
-      '_paused%2': false,
-      '_withdrawalProof%3': [
-        '0x0f',
-        '0x02',
-      ],
-    });
-  });
-
-  it('converts nested array string representation to correct format', () => {
-    const formFields = {
-      '_withdrawalProof%0': '[ [ 1 ], [ 2, 3 ], [ 4 ]]',
-    };
-    const inputs: Array<SmartContractMethodInput> = [
-      { internalType: 'uint[][]', name: '_withdrawalProof', type: 'uint[][]' },
-    ];
-    const result = formatFieldValues(formFields, inputs);
-
-    expect(result).toEqual({
-      '_withdrawalProof%0': [ [ 1 ], [ 2, 3 ], [ 4 ] ],
-    });
-  });
-});
-
-describe('function transformFieldsToArgs()', () => {
-  it('groups struct and array fields', () => {
-    const formFields = {
-      '_paused%2': 'primitive_1',
-      '_l2OutputIndex%1': 'primitive_0',
-      '_tx%0:nonce%0': 'struct_0',
-      '_tx%0:sender%1': 'struct_1',
-      '_tx%0:target%2': [ 'struct_2_0', 'struct_2_1' ],
-      '_withdrawalProof%3': [
-        'array_0',
-        'array_1',
-      ],
-    };
-
-    const args = transformFieldsToArgs(formFields);
-    expect(args).toEqual([
-      [ 'struct_0', 'struct_1', [ 'struct_2_0', 'struct_2_1' ] ],
-      'primitive_0',
-      'primitive_1',
-      [ 'array_0', 'array_1' ],
-    ]);
-  });
-});
diff --git a/ui/address/contract/utils.ts b/ui/address/contract/utils.ts
index dad1c293f9..8fa04e839c 100644
--- a/ui/address/contract/utils.ts
+++ b/ui/address/contract/utils.ts
@@ -1,68 +1,15 @@
 import type { Abi } from 'abitype';
-import _mapValues from 'lodash/mapValues';
 
-import type { MethodArgType, MethodFormFields, MethodFormFieldsFormatted } from './types';
-import type { SmartContractMethodArgType, SmartContractMethodInput, SmartContractWriteMethod } from 'types/api/contract';
+import type { SmartContractWriteMethod } from 'types/api/contract';
 
-export const INT_REGEXP = /^(u)?int(\d+)?$/i;
-
-export const BYTES_REGEXP = /^bytes(\d+)?$/i;
-
-export const ARRAY_REGEXP = /^(.*)\[(\d*)\]$/;
-
-export const getIntBoundaries = (power: number, isUnsigned: boolean) => {
-  const maxUnsigned = 2 ** power;
-  const max = isUnsigned ? maxUnsigned - 1 : maxUnsigned / 2 - 1;
-  const min = isUnsigned ? 0 : -maxUnsigned / 2;
-  return [ min, max ];
-};
-
-export const formatBooleanValue = (value: string) => {
-  const formattedValue = value.toLowerCase();
-
-  switch (formattedValue) {
-    case 'true':
-    case '1': {
-      return 'true';
-    }
-
-    case 'false':
-    case '0': {
-      return 'false';
-    }
-
-    default:
-      return;
-  }
-};
-
-export const getNativeCoinValue = (value: string | Array<unknown>) => {
-  const _value = Array.isArray(value) ? value[0] : value;
-
-  if (typeof _value !== 'string') {
+export const getNativeCoinValue = (value: unknown) => {
+  if (typeof value !== 'string') {
     return BigInt(0);
   }
 
-  return BigInt(_value);
+  return BigInt(value);
 };
 
-interface ExtendedError extends Error {
-  detectedNetwork?: {
-    chain: number;
-    name: string;
-  };
-  reason?: string;
-}
-
-export function isExtendedError(error: unknown): error is ExtendedError {
-  return (
-    typeof error === 'object' &&
-    error !== null &&
-    'message' in error &&
-    typeof (error as Record<string, unknown>).message === 'string'
-  );
-}
-
 export function prepareAbi(abi: Abi, item: SmartContractWriteMethod): Abi {
   if ('name' in item) {
     const hasMethodsWithSameName = abi.filter((abiItem) => 'name' in abiItem ? abiItem.name === item.name : false).length > 1;
@@ -91,106 +38,3 @@ export function prepareAbi(abi: Abi, item: SmartContractWriteMethod): Abi {
 
   return abi;
 }
-
-function getFieldType(fieldName: string, inputs: Array<SmartContractMethodInput>) {
-  const chunks = fieldName.split(':');
-
-  if (chunks.length === 1) {
-    const [ , index ] = chunks[0].split('%');
-    return inputs[Number(index)].type;
-  } else {
-    const group = chunks[0].split('%');
-    const input = chunks[1].split('%');
-
-    return inputs[Number(group[1])].components?.[Number(input[1])].type;
-  }
-}
-
-function parseArrayValue(value: string) {
-  try {
-    const parsedResult = JSON.parse(value);
-    if (Array.isArray(parsedResult)) {
-      return parsedResult as Array<string>;
-    }
-    throw new Error('Not an array');
-  } catch (error) {
-    return '';
-  }
-}
-
-function castValue(value: string, type: SmartContractMethodArgType) {
-  if (type === 'bool') {
-    return formatBooleanValue(value) === 'true';
-  }
-
-  const intMatch = type.match(INT_REGEXP);
-  if (intMatch) {
-    return value.replaceAll(' ', '');
-  }
-
-  const isNestedArray = (type.match(/\[/g) || []).length > 1;
-  if (isNestedArray) {
-    return parseArrayValue(value) || value;
-  }
-
-  return value;
-}
-
-export function formatFieldValues(formFields: MethodFormFields, inputs: Array<SmartContractMethodInput>) {
-  const formattedFields = _mapValues(formFields, (value, key) => {
-    const type = getFieldType(key, inputs);
-
-    if (!type) {
-      return value;
-    }
-
-    if (Array.isArray(value)) {
-      const arrayMatch = type.match(ARRAY_REGEXP);
-
-      if (arrayMatch) {
-        return value.map((item) => castValue(item, arrayMatch[1] as SmartContractMethodArgType));
-      }
-
-      return value;
-    }
-
-    return castValue(value, type);
-  });
-
-  return formattedFields;
-}
-
-export function transformFieldsToArgs(formFields: MethodFormFieldsFormatted) {
-  const unGroupedFields = Object.entries(formFields)
-    .reduce((
-      result: Record<string, MethodArgType>,
-      [ key, value ]: [ string, MethodArgType ],
-    ) => {
-      const chunks = key.split(':');
-
-      if (chunks.length > 1) {
-        const groupKey = chunks[0];
-        const [ , fieldIndex ] = chunks[1].split('%');
-
-        if (result[groupKey] === undefined) {
-          result[groupKey] = [];
-        }
-
-        (result[groupKey] as Array<MethodArgType>)[Number(fieldIndex)] = value;
-        return result;
-      }
-
-      result[key] = value;
-      return result;
-    }, {});
-
-  const args = (Object.entries(unGroupedFields)
-    .map(([ key, value ]) => {
-      const [ , index ] = key.split('%');
-      return [ Number(index), value ];
-    }) as Array<[ number, string | Array<string> ]>)
-    .sort((a, b) => a[0] - b[0])
-    .map(([ , value ]) => value);
-
-  return args;
-}
diff --git a/ui/address/details/AddressBalance.tsx b/ui/address/details/AddressBalance.tsx
index 7118cca378..37450d3325 100644
--- a/ui/address/details/AddressBalance.tsx
+++ b/ui/address/details/AddressBalance.tsx
@@ -8,6 +8,7 @@ import config from 'configs/app';
 import { getResourceKey } from 'lib/api/useApiQuery';
 import useSocketChannel from 'lib/socket/useSocketChannel';
 import useSocketMessage from 'lib/socket/useSocketMessage';
+import { currencyUnits } from 'lib/units';
 import CurrencyValue from 'ui/shared/CurrencyValue';
 import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
 
@@ -66,7 +67,7 @@ const AddressBalance = ({ data, isLoading }: Props) => {
   return (
     <DetailsInfoItem
       title="Balance"
-      hint={ `Address balance in ${ config.chain.currency.symbol }. Doesn't include ERC20, ERC721 and ERC1155 tokens` }
+      hint={ `Address balance in ${ currencyUnits.ether }. Doesn't include ERC20, ERC721 and ERC1155 tokens` }
       flexWrap="nowrap"
       alignItems="flex-start"
       isLoading={ isLoading }
@@ -75,7 +76,7 @@ const AddressBalance = ({ data, isLoading }: Props) => {
         value={ data.coin_balance || '0' }
         exchangeRate={ data.exchange_rate }
         decimals={ String(config.chain.currency.decimals) }
-        currency={ config.chain.currency.symbol }
+        currency={ currencyUnits.ether }
         accuracyUsd={ 2 }
         accuracy={ 8 }
         flexWrap="wrap"
diff --git a/ui/address/details/AddressCounterItem.tsx b/ui/address/details/AddressCounterItem.tsx
index 21156b2cd8..39af50f2df 100644
--- a/ui/address/details/AddressCounterItem.tsx
+++ b/ui/address/details/AddressCounterItem.tsx
@@ -16,6 +16,7 @@ interface Props {
   address: string;
   onClick: () => void;
   isAddressQueryLoading: boolean;
+  isDegradedData: boolean;
 }
 
 const PROP_TO_TAB = {
@@ -24,7 +25,7 @@ const PROP_TO_TAB = {
   validations_count: 'blocks_validated',
 };
 
-const AddressCounterItem = ({ prop, query, address, onClick, isAddressQueryLoading }: Props) => {
+const AddressCounterItem = ({ prop, query, address, onClick, isAddressQueryLoading, isDegradedData }: Props) => {
   if (query.isPlaceholderData || isAddressQueryLoading) {
     return <Skeleton h={ 5 } w="80px" borderRadius="full"/>;
   }
@@ -44,6 +45,11 @@ const AddressCounterItem = ({ prop, query, address, onClick, isAddressQueryLoadi
       if (data === '0') {
         return <span>0</span>;
       }
+
+      if (isDegradedData) {
+        return <span>{ Number(data).toLocaleString() }</span>;
+      }
+
       return (
         <LinkInternal href={ route({ pathname: '/address/[hash]', query: { hash: address, tab: PROP_TO_TAB[prop] } }) } onClick={ onClick }>
           { Number(data).toLocaleString() }
diff --git a/ui/address/ensDomains/AddressEnsDomains.pw.tsx b/ui/address/ensDomains/AddressEnsDomains.pw.tsx
new file mode 100644
index 0000000000..8f75aede6d
--- /dev/null
+++ b/ui/address/ensDomains/AddressEnsDomains.pw.tsx
@@ -0,0 +1,37 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import config from 'configs/app';
+import * as ensDomainMock from 'mocks/ens/domain';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+
+import AddressEnsDomains from './AddressEnsDomains';
+
+const ADDRESS_HASH = ensDomainMock.ensDomainA.owner?.hash ?? '';
+const ADDRESSES_LOOKUP_API_URL = buildApiUrl('addresses_lookup', { chainId: config.chain.id }) +
+  `?address=${ ADDRESS_HASH }&resolved_to=true&owned_by=true&only_active=true&order=ASC`;
+
+test('base view', async({ mount, page }) => {
+  await page.route(ADDRESSES_LOOKUP_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify({
+      items: [
+        ensDomainMock.ensDomainA,
+        ensDomainMock.ensDomainB,
+        ensDomainMock.ensDomainC,
+        ensDomainMock.ensDomainD,
+      ],
+    }),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <AddressEnsDomains addressHash={ ADDRESS_HASH } mainDomainName={ ensDomainMock.ensDomainA.name }/>
+    </TestApp>,
+  );
+
+  await component.getByText('4').click();
+
+  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 550, height: 350 } });
+});
diff --git a/ui/address/ensDomains/AddressEnsDomains.tsx b/ui/address/ensDomains/AddressEnsDomains.tsx
new file mode 100644
index 0000000000..af57b5bd20
--- /dev/null
+++ b/ui/address/ensDomains/AddressEnsDomains.tsx
@@ -0,0 +1,156 @@
+import { Box, Button, chakra, Flex, Grid, Hide, Popover, PopoverBody, PopoverContent, PopoverTrigger, Show, Skeleton, useDisclosure } from '@chakra-ui/react';
+import _clamp from 'lodash/clamp';
+import React from 'react';
+
+import type { EnsDomain } from 'types/api/ens';
+
+import { route } from 'nextjs-routes';
+
+import config from 'configs/app';
+import useApiQuery from 'lib/api/useApiQuery';
+import dayjs from 'lib/date/dayjs';
+import EnsEntity from 'ui/shared/entities/ens/EnsEntity';
+import IconSvg from 'ui/shared/IconSvg';
+import LinkInternal from 'ui/shared/LinkInternal';
+
+interface Props {
+  addressHash: string;
+  mainDomainName: string | null;
+}
+
+const DomainsGrid = ({ data }: { data: Array<EnsDomain> }) => {
+  return (
+    <Grid
+      templateColumns={{ base: `repeat(${ _clamp(data.length, 1, 2) }, 1fr)`, lg: `repeat(${ _clamp(data.length, 1, 3) }, 1fr)` }}
+      columnGap={ 8 }
+      rowGap={ 4 }
+      mt={ 2 }
+    >
+      { data.slice(0, 9).map((domain) => <EnsEntity key={ domain.id } name={ domain.name } noCopy/>) }
+    </Grid>
+  );
+};
+
+const AddressEnsDomains = ({ addressHash, mainDomainName }: Props) => {
+  const { isOpen, onToggle, onClose } = useDisclosure();
+
+  const { data, isPending, isError } = useApiQuery('addresses_lookup', {
+    pathParams: { chainId: config.chain.id },
+    queryParams: {
+      address: addressHash,
+      resolved_to: true,
+      owned_by: true,
+      only_active: true,
+      order: 'ASC',
+    },
+  });
+
+  if (isError) {
+    return null;
+  }
+
+  if (isPending) {
+    return <Skeleton h={ 8 } w={{ base: '50px', xl: '120px' }} borderRadius="base"/>;
+  }
+
+  if (data.items.length === 0) {
+    return null;
+  }
+
+  const mainDomain = data.items.find((domain) => domain.name === mainDomainName);
+  const ownedDomains = data.items.filter((domain) => {
+    if (domain.name === mainDomainName) {
+      return false;
+    }
+
+    // exclude resolved address
+    if (domain.resolved_address && domain.resolved_address.hash.toLowerCase() === addressHash.toLowerCase()) {
+      return false;
+    }
+
+    if (domain.owner && domain.owner.hash.toLowerCase() === addressHash.toLowerCase()) {
+      return true;
+    }
+
+    // include wrapped owner
+    if (domain.wrapped_owner?.hash.toLowerCase() === addressHash.toLowerCase()) {
+      return !domain.resolved_address || domain.resolved_address.hash.toLowerCase() !== addressHash.toLowerCase();
+    }
+
+    return false;
+  });
+  const resolvedDomains = data.items.filter((domain) =>
+    domain.resolved_address &&
+    domain.resolved_address.hash.toLowerCase() === addressHash.toLowerCase() &&
+    domain.name !== mainDomainName,
+  );
+
+  const totalRecords = data.items.length > 40 ? '40+' : data.items.length;
+
+  return (
+    <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy>
+      <PopoverTrigger>
+        <Button
+          size="sm"
+          variant="outline"
+          colorScheme="gray"
+          onClick={ onToggle }
+          aria-label="Address domains"
+          fontWeight={ 500 }
+          px={ 2 }
+          h="32px"
+          flexShrink={ 0 }
+        >
+          <IconSvg name="ENS_slim" boxSize={ 5 }/>
+          <Show above="xl">
+            <chakra.span ml={ 1 }>{ totalRecords } Domain{ data.items.length > 1 ? 's' : '' }</chakra.span>
+          </Show>
+          <Hide above="xl">
+            <chakra.span ml={ 1 }>{ totalRecords }</chakra.span>
+          </Hide>
+        </Button>
+      </PopoverTrigger>
+      <PopoverContent w={{ base: '100vw', lg: '500px' }}>
+        <PopoverBody px={ 6 } py={ 5 } fontSize="sm" display="flex" flexDir="column" rowGap={ 5 } alignItems="flex-start">
+          { mainDomain && (
+            <Box w="100%">
+              <chakra.span color="text_secondary" fontSize="xs">Primary*</chakra.span>
+              <Flex alignItems="center" fontSize="md" mt={ 2 }>
+                <EnsEntity name={ mainDomain.name } fontWeight={ 600 } noCopy/>
+                { mainDomain.expiry_date &&
+                    <chakra.span color="text_secondary" whiteSpace="pre"> (expires { dayjs(mainDomain.expiry_date).fromNow() })</chakra.span> }
+              </Flex>
+            </Box>
+          ) }
+          { ownedDomains.length > 0 && (
+            <div>
+              <chakra.span color="text_secondary" fontSize="xs">Owned by this address</chakra.span>
+              <DomainsGrid data={ ownedDomains }/>
+            </div>
+          ) }
+          { resolvedDomains.length > 0 && (
+            <div>
+              <chakra.span color="text_secondary" fontSize="xs">Resolved to this address</chakra.span>
+              <DomainsGrid data={ resolvedDomains }/>
+            </div>
+          ) }
+          { (ownedDomains.length > 9 || resolvedDomains.length > 9) && (
+            <LinkInternal
+              href={ route({ pathname: '/name-domains', query: { owned_by: 'true', resolved_to: 'true', address: addressHash } }) }
+            >
+              <span> More results</span>
+              <chakra.span color="text_secondary"> ({ totalRecords })</chakra.span>
+            </LinkInternal>
+          ) }
+          { mainDomain && (
+            <chakra.span fontSize="xs" mt={ -1 }>
+              *A domain name is not necessarily held by a person popularly associated with the name
+            </chakra.span>
+          ) }
+        </PopoverBody>
+      </PopoverContent>
+    </Popover>
+  );
+};
+
+export default React.memo(AddressEnsDomains);
diff --git a/ui/address/ensDomains/__screenshots__/AddressEnsDomains.pw.tsx_default_base-view-1.png b/ui/address/ensDomains/__screenshots__/AddressEnsDomains.pw.tsx_default_base-view-1.png
new file mode 100644
index 0000000000..7f5315bbb9
Binary files /dev/null and b/ui/address/ensDomains/__screenshots__/AddressEnsDomains.pw.tsx_default_base-view-1.png differ
diff --git a/ui/address/internals/AddressIntTxsListItem.tsx b/ui/address/internals/AddressIntTxsListItem.tsx
index 463a7a053c..4b0861e706 100644
--- a/ui/address/internals/AddressIntTxsListItem.tsx
+++ b/ui/address/internals/AddressIntTxsListItem.tsx
@@ -1,4 +1,4 @@
-import { Flex, Box, HStack, Skeleton } from '@chakra-ui/react';
+import { Flex, HStack, Skeleton } from '@chakra-ui/react';
 import BigNumber from 'bignumber.js';
 import React from 'react';
 
@@ -6,12 +6,11 @@ import type { InternalTransaction } from 'types/api/internalTransaction';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
+import { currencyUnits } from 'lib/units';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import Tag from 'ui/shared/chakra/Tag';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import IconSvg from 'ui/shared/IconSvg';
-import InOutTag from 'ui/shared/InOutTag';
 import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
 import TxStatus from 'ui/shared/statusTag/TxStatus';
 import { TX_INTERNALS_ITEMS } from 'ui/tx/internals/utils';
@@ -35,9 +34,6 @@ const TxInternalsListItem = ({
   const typeTitle = TX_INTERNALS_ITEMS.find(({ id }) => id === type)?.title;
   const toData = to ? to : createdContract;
 
-  const isOut = Boolean(currentAddress && currentAddress === from.hash);
-  const isIn = Boolean(currentAddress && currentAddress === toData?.hash);
-
   return (
     <ListItemMobile rowGap={ 3 }>
       <Flex columnGap={ 2 }>
@@ -49,7 +45,7 @@ const TxInternalsListItem = ({
           hash={ txnHash }
           isLoading={ isLoading }
           fontWeight={ 700 }
-          truncation="constant"
+          truncation="constant_long"
         />
         <Skeleton isLoaded={ !isLoading } color="text_secondary" fontWeight="400" fontSize="sm">
           <span>{ dayjs(timestamp).fromNow() }</span>
@@ -65,30 +61,15 @@ const TxInternalsListItem = ({
           lineHeight={ 5 }
         />
       </HStack>
-      <Box w="100%" display="flex" columnGap={ 3 }>
-        <AddressEntity
-          address={ from }
-          isLoading={ isLoading }
-          noLink={ isOut }
-          noCopy={ isOut }
-          width="calc((100% - 48px) / 2)"
-        />
-        { (isIn || isOut) ?
-          <InOutTag isIn={ isIn } isOut={ isOut } isLoading={ isLoading }/> :
-          <IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" isLoading={ isLoading }/>
-        }
-        { toData && (
-          <AddressEntity
-            address={ toData }
-            isLoading={ isLoading }
-            noLink={ isIn }
-            noCopy={ isIn }
-            width="calc((100% - 48px) / 2)"
-          />
-        ) }
-      </Box>
+      <AddressFromTo
+        from={ from }
+        to={ toData }
+        current={ currentAddress }
+        isLoading={ isLoading }
+        w="100%"
+      />
       <HStack spacing={ 3 }>
-        <Skeleton isLoaded={ !isLoading } fontSize="sm" fontWeight={ 500 }>Value { config.chain.currency.symbol }</Skeleton>
+        <Skeleton isLoaded={ !isLoading } fontSize="sm" fontWeight={ 500 }>Value { currencyUnits.ether }</Skeleton>
         <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary" minW={ 6 }>
           <span>{ BigNumber(value).div(BigNumber(10 ** config.chain.currency.decimals)).toFormat() }</span>
         </Skeleton>
diff --git a/ui/address/internals/AddressIntTxsTable.tsx b/ui/address/internals/AddressIntTxsTable.tsx
index e17bacb44f..83e0f13f7a 100644
--- a/ui/address/internals/AddressIntTxsTable.tsx
+++ b/ui/address/internals/AddressIntTxsTable.tsx
@@ -3,7 +3,8 @@ import React from 'react';
 
 import type { InternalTransaction } from 'types/api/internalTransaction';
 
-import config from 'configs/app';
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
+import { currencyUnits } from 'lib/units';
 import { default as Thead } from 'ui/shared/TheadSticky';
 
 import AddressIntTxsTableItem from './AddressIntTxsTableItem';
@@ -16,31 +17,32 @@ interface Props {
 
 const AddressIntTxsTable = ({ data, currentAddress, isLoading }: Props) => {
   return (
-    <Table variant="simple" size="sm">
-      <Thead top={ 80 }>
-        <Tr>
-          <Th width="15%">Parent txn hash</Th>
-          <Th width="15%">Type</Th>
-          <Th width="10%">Block</Th>
-          <Th width="20%">From</Th>
-          <Th width="48px" px={ 0 }/>
-          <Th width="20%">To</Th>
-          <Th width="20%" isNumeric>
-            Value { config.chain.currency.symbol }
-          </Th>
-        </Tr>
-      </Thead>
-      <Tbody>
-        { data.map((item, index) => (
-          <AddressIntTxsTableItem
-            key={ item.transaction_hash + '_' + index }
-            { ...item }
-            currentAddress={ currentAddress }
-            isLoading={ isLoading }
-          />
-        )) }
-      </Tbody>
-    </Table>
+    <AddressHighlightProvider>
+      <Table variant="simple" size="sm">
+        <Thead top={ 80 }>
+          <Tr>
+            <Th width="15%">Parent txn hash</Th>
+            <Th width="15%">Type</Th>
+            <Th width="10%">Block</Th>
+            <Th width="40%">From/To</Th>
+            <Th width="20%" isNumeric>
+              Value { currencyUnits.ether }
+            </Th>
+          </Tr>
+        </Thead>
+        <Tbody>
+          { data.map((item, index) => (
+            <AddressIntTxsTableItem
+              key={ item.transaction_hash + '_' + index }
+              { ...item }
+              currentAddress={ currentAddress }
+              isLoading={ isLoading }
+            />
+          )) }
+        </Tbody>
+      </Table>
+    </AddressHighlightProvider>
+
   );
 };
 
diff --git a/ui/address/internals/AddressIntTxsTableItem.tsx b/ui/address/internals/AddressIntTxsTableItem.tsx
index 443b7217fe..49f83d5100 100644
--- a/ui/address/internals/AddressIntTxsTableItem.tsx
+++ b/ui/address/internals/AddressIntTxsTableItem.tsx
@@ -6,12 +6,10 @@ import type { InternalTransaction } from 'types/api/internalTransaction';
 
 import config from 'configs/app';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import Tag from 'ui/shared/chakra/Tag';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import IconSvg from 'ui/shared/IconSvg';
-import InOutTag from 'ui/shared/InOutTag';
 import TxStatus from 'ui/shared/statusTag/TxStatus';
 import { TX_INTERNALS_ITEMS } from 'ui/tx/internals/utils';
 
@@ -34,9 +32,6 @@ const AddressIntTxsTableItem = ({
   const typeTitle = TX_INTERNALS_ITEMS.find(({ id }) => id === type)?.title;
   const toData = to ? to : createdContract;
 
-  const isOut = Boolean(currentAddress && currentAddress === from.hash);
-  const isIn = Boolean(currentAddress && currentAddress === toData?.hash);
-
   const timeAgo = useTimeAgoIncrement(timestamp, true);
 
   return (
@@ -48,6 +43,7 @@ const AddressIntTxsTableItem = ({
             isLoading={ isLoading }
             fontWeight={ 700 }
             noIcon
+            truncation="constant_long"
           />
           { timestamp && (
             <Skeleton isLoaded={ !isLoading } color="text_secondary" fontWeight="400" fontSize="sm">
@@ -77,29 +73,13 @@ const AddressIntTxsTableItem = ({
         />
       </Td>
       <Td verticalAlign="middle">
-        <AddressEntity
-          address={ from }
+        <AddressFromTo
+          from={ from }
+          to={ toData }
+          current={ currentAddress }
           isLoading={ isLoading }
-          noLink={ isOut }
-          noCopy={ isOut }
         />
       </Td>
-      <Td px={ 0 } verticalAlign="middle">
-        { (isIn || isOut) ?
-          <InOutTag isIn={ isIn } isOut={ isOut } isLoading={ isLoading } w="100%"/> :
-          <IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" isLoading={ isLoading }/>
-        }
-      </Td>
-      <Td verticalAlign="middle">
-        { toData && (
-          <AddressEntity
-            address={ toData }
-            isLoading={ isLoading }
-            noLink={ isIn }
-            noCopy={ isIn }
-          />
-        ) }
-      </Td>
       <Td isNumeric verticalAlign="middle">
         <Skeleton isLoaded={ !isLoading } display="inline-block" minW={ 6 }>
           { BigNumber(value).div(BigNumber(10 ** config.chain.currency.decimals)).toFormat() }
diff --git a/ui/address/tokenSelect/TokenSelect.pw.tsx b/ui/address/tokenSelect/TokenSelect.pw.tsx
index d2a810c981..e58975e540 100644
--- a/ui/address/tokenSelect/TokenSelect.pw.tsx
+++ b/ui/address/tokenSelect/TokenSelect.pw.tsx
@@ -14,6 +14,7 @@ const ASSET_URL = tokenInfoERC20a.icon_url as string;
 const TOKENS_ERC20_API_URL = buildApiUrl('address_tokens', { hash: '1' }) + '?type=ERC-20';
 const TOKENS_ERC721_API_URL = buildApiUrl('address_tokens', { hash: '1' }) + '?type=ERC-721';
 const TOKENS_ER1155_API_URL = buildApiUrl('address_tokens', { hash: '1' }) + '?type=ERC-1155';
+const TOKENS_ER404_API_URL = buildApiUrl('address_tokens', { hash: '1' }) + '?type=ERC-404';
 const ADDRESS_API_URL = buildApiUrl('address', { hash: '1' });
 const hooksConfig = {
   router: {
@@ -46,6 +47,10 @@ const test = base.extend({
       status: 200,
       body: JSON.stringify(tokensMock.erc1155List),
     }), { times: 1 });
+    await page.route(TOKENS_ER404_API_URL, async(route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(tokensMock.erc404List),
+    }), { times: 1 });
 
     use(page);
   },
@@ -148,7 +153,7 @@ base('long values', async({ mount, page }) => {
   }), { times: 1 });
   await page.route(TOKENS_ERC20_API_URL, async(route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({ items: [ tokensMock.erc20LongSymbol ] }),
+    body: JSON.stringify({ items: [ tokensMock.erc20LongSymbol, tokensMock.erc20BigAmount ] }),
   }), { times: 1 });
   await page.route(TOKENS_ERC721_API_URL, async(route) => route.fulfill({
     status: 200,
@@ -158,6 +163,10 @@ base('long values', async({ mount, page }) => {
     status: 200,
     body: JSON.stringify({ items: [ tokensMock.erc1155LongId ] }),
   }), { times: 1 });
+  await page.route(TOKENS_ER404_API_URL, async(route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(tokensMock.erc404List),
+  }), { times: 1 });
 
   await mount(
     <TestApp>
diff --git a/ui/address/tokenSelect/TokenSelectButton.tsx b/ui/address/tokenSelect/TokenSelectButton.tsx
index d58fdacea3..773c06569c 100644
--- a/ui/address/tokenSelect/TokenSelectButton.tsx
+++ b/ui/address/tokenSelect/TokenSelectButton.tsx
@@ -3,6 +3,7 @@ import React from 'react';
 
 import type { FormattedData } from './types';
 
+import { space } from 'lib/html-entities';
 import * as mixpanel from 'lib/mixpanel/index';
 import IconSvg from 'ui/shared/IconSvg';
 
@@ -42,10 +43,19 @@ const TokenSelectButton = ({ isOpen, isLoading, onClick, data }: Props, ref: Rea
       >
         <IconSvg name="tokens" boxSize={ 4 } mr={ 2 }/>
         <Text fontWeight={ 600 }>{ prefix }{ num }</Text>
-        <Text whiteSpace="pre" variant="secondary" fontWeight={ 400 }> ({ prefix }${ usd.toFormat(2) })</Text>
+        <Text
+          whiteSpace="pre"
+          variant="secondary"
+          fontWeight={ 400 }
+          maxW={{ base: 'calc(100vw - 230px)', lg: '500px' }}
+          overflow="hidden"
+          textOverflow="ellipsis"
+        >
+          { space }({ prefix }${ usd.toFormat(2) })
+        </Text>
         <IconSvg name="arrows/east-mini" transform={ isOpen ? 'rotate(90deg)' : 'rotate(-90deg)' } transitionDuration="faster" boxSize={ 5 } ml={ 3 }/>
       </Button>
-      { isLoading && !isOpen && <Skeleton h="100%" w="100%" position="absolute" top={ 0 } left={ 0 } bgColor={ skeletonBgColor }/> }
+      { isLoading && !isOpen && <Skeleton h="100%" w="100%" position="absolute" top={ 0 } left={ 0 } bgColor={ skeletonBgColor } borderRadius="base"/> }
     </Box>
   );
 };
diff --git a/ui/address/tokenSelect/TokenSelectDesktop.tsx b/ui/address/tokenSelect/TokenSelectDesktop.tsx
index 629fa5fda3..858bb5a443 100644
--- a/ui/address/tokenSelect/TokenSelectDesktop.tsx
+++ b/ui/address/tokenSelect/TokenSelectDesktop.tsx
@@ -1,4 +1,4 @@
-import { useColorModeValue, Popover, PopoverTrigger, PopoverContent, PopoverBody, useDisclosure } from '@chakra-ui/react';
+import { Popover, PopoverTrigger, PopoverContent, PopoverBody, useDisclosure } from '@chakra-ui/react';
 import React from 'react';
 
 import type { FormattedData } from './types';
@@ -15,8 +15,6 @@ interface Props {
 const TokenSelectDesktop = ({ data, isLoading }: Props) => {
   const { isOpen, onToggle, onClose } = useDisclosure();
 
-  const bgColor = useColorModeValue('white', 'gray.900');
-
   const result = useTokenSelect(data);
 
   return (
@@ -25,7 +23,7 @@ const TokenSelectDesktop = ({ data, isLoading }: Props) => {
         <TokenSelectButton isOpen={ isOpen } onClick={ onToggle } data={ result.data } isLoading={ isLoading }/>
       </PopoverTrigger>
       <PopoverContent w="355px" maxH="450px" overflowY="scroll">
-        <PopoverBody px={ 4 } py={ 6 } bgColor={ bgColor } boxShadow="2xl" >
+        <PopoverBody px={ 4 } py={ 6 } boxShadow="2xl" >
           <TokenSelectMenu { ...result }/>
         </PopoverBody>
       </PopoverContent>
diff --git a/ui/address/tokenSelect/TokenSelectItem.tsx b/ui/address/tokenSelect/TokenSelectItem.tsx
index bd9b9ea007..fc7d6cde27 100644
--- a/ui/address/tokenSelect/TokenSelectItem.tsx
+++ b/ui/address/tokenSelect/TokenSelectItem.tsx
@@ -1,9 +1,10 @@
-import { chakra, Flex, Text, useColorModeValue } from '@chakra-ui/react';
+import { chakra, Flex, useColorModeValue } from '@chakra-ui/react';
 import BigNumber from 'bignumber.js';
 import React from 'react';
 
 import { route } from 'nextjs-routes';
 
+import getCurrencyValue from 'lib/getCurrencyValue';
 import TokenEntity from 'ui/shared/entities/token/TokenEntity';
 import LinkInternal from 'ui/shared/LinkInternal';
 import TruncatedValue from 'ui/shared/TruncatedValue';
@@ -45,6 +46,25 @@ const TokenSelectItem = ({ data }: Props) => {
           </>
         );
       }
+      case 'ERC-404': {
+        return (
+          <>
+            { data.token_id !== null && (
+              <chakra.span textOverflow="ellipsis" overflow="hidden" mr={ 6 }>
+                #{ data.token_id || 0 }
+              </chakra.span>
+            ) }
+            { data.value !== null && (
+              <span>
+                { data.token.decimals ?
+                  getCurrencyValue({ value: data.value, decimals: data.token.decimals, accuracy: 2 }).valueStr :
+                  BigNumber(data.value).toFormat()
+                }
+              </span>
+            ) }
+          </>
+        );
+      }
     }
   })();
 
@@ -62,7 +82,7 @@ const TokenSelectItem = ({ data }: Props) => {
       _hover={{
         bgColor: useColorModeValue('blue.50', 'gray.800'),
       }}
-      color="initial"
+      color="unset"
       fontSize="sm"
       href={ url }
     >
@@ -73,8 +93,11 @@ const TokenSelectItem = ({ data }: Props) => {
           noCopy
           noLink
           fontWeight={ 700 }
+          mr={ 2 }
         />
-        { data.usd && <Text fontWeight={ 700 } ml="auto">${ data.usd.toFormat(2) }</Text> }
+        { data.usd && (
+          <TruncatedValue value={ `$${ data.usd.toFormat(2) }` } fontWeight={ 700 } minW="120px" ml="auto" textAlign="right"/>
+        ) }
       </Flex>
       <Flex alignItems="center" justifyContent="space-between" w="100%" whiteSpace="nowrap">
         { secondRow }
diff --git a/ui/address/tokenSelect/TokenSelectMenu.tsx b/ui/address/tokenSelect/TokenSelectMenu.tsx
index d247a0e3cd..22f87950ed 100644
--- a/ui/address/tokenSelect/TokenSelectMenu.tsx
+++ b/ui/address/tokenSelect/TokenSelectMenu.tsx
@@ -16,12 +16,13 @@ interface Props {
   searchTerm: string;
   erc20sort: Sort;
   erc1155sort: Sort;
+  erc404sort: Sort;
   filteredData: FormattedData;
   onInputChange: (event: ChangeEvent<HTMLInputElement>) => void;
   onSortClick: (event: React.SyntheticEvent) => void;
 }
 
-const TokenSelectMenu = ({ erc20sort, erc1155sort, filteredData, onInputChange, onSortClick, searchTerm }: Props) => {
+const TokenSelectMenu = ({ erc20sort, erc1155sort, erc404sort, filteredData, onInputChange, onSortClick, searchTerm }: Props) => {
   const searchIconColor = useColorModeValue('blackAlpha.600', 'whiteAlpha.600');
   const inputBorderColor = useColorModeValue('blackAlpha.100', 'whiteAlpha.200');
 
@@ -43,15 +44,17 @@ const TokenSelectMenu = ({ erc20sort, erc1155sort, filteredData, onInputChange,
       </InputGroup>
       <Flex flexDir="column" rowGap={ 6 }>
         { Object.entries(filteredData).sort(sortTokenGroups).map(([ tokenType, tokenInfo ]) => {
-
           if (tokenInfo.items.length === 0) {
             return null;
           }
 
           const type = tokenType as TokenType;
-          const arrowTransform = (type === 'ERC-1155' && erc1155sort === 'desc') || (type === 'ERC-20' && erc20sort === 'desc') ?
-            'rotate(90deg)' :
-            'rotate(-90deg)';
+          const arrowTransform =
+            (type === 'ERC-1155' && erc1155sort === 'desc') ||
+            (type === 'ERC-404' && erc404sort === 'desc') ||
+            (type === 'ERC-20' && erc20sort === 'desc') ?
+              'rotate(90deg)' :
+              'rotate(-90deg)';
           const sortDirection: Sort = (() => {
             switch (type) {
               case 'ERC-1155':
@@ -62,7 +65,10 @@ const TokenSelectMenu = ({ erc20sort, erc1155sort, filteredData, onInputChange,
                 return 'desc';
             }
           })();
-          const hasSort = type === 'ERC-1155' || (type === 'ERC-20' && tokenInfo.items.some(({ usd }) => usd));
+          const hasSort =
+            (type === 'ERC-404' && tokenInfo.items.some(item => item.value)) ||
+            type === 'ERC-1155' ||
+            (type === 'ERC-20' && tokenInfo.items.some(({ usd }) => usd));
           const numPrefix = tokenInfo.isOverflow ? '>' : '';
 
           return (
diff --git a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_dark-color-mode_base-view-dark-mode-1.png b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_dark-color-mode_base-view-dark-mode-1.png
index 9dba7e43bb..0f13fc0097 100644
Binary files a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_dark-color-mode_base-view-dark-mode-1.png and b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_dark-color-mode_base-view-dark-mode-1.png differ
diff --git a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_dark-color-mode_base-view-dark-mode-2.png b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_dark-color-mode_base-view-dark-mode-2.png
index 0079d7d3db..dc1db04181 100644
Binary files a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_dark-color-mode_base-view-dark-mode-2.png and b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_dark-color-mode_base-view-dark-mode-2.png differ
diff --git a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_base-view-dark-mode-1.png b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_base-view-dark-mode-1.png
index 6b7fa96751..90b6524154 100644
Binary files a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_base-view-dark-mode-1.png and b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_base-view-dark-mode-1.png differ
diff --git a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_base-view-dark-mode-2.png b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_base-view-dark-mode-2.png
index 464e028a1c..df33a35e69 100644
Binary files a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_base-view-dark-mode-2.png and b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_base-view-dark-mode-2.png differ
diff --git a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_filter-1.png b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_filter-1.png
index f2151d30c1..97f8b096bc 100644
Binary files a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_filter-1.png and b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_filter-1.png differ
diff --git a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_long-values-1.png b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_long-values-1.png
index 523b23617f..1f59eeb768 100644
Binary files a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_long-values-1.png and b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_long-values-1.png differ
diff --git a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_mobile-base-view-1.png b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_mobile-base-view-1.png
index 98ab4ea3a3..924dca0642 100644
Binary files a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_mobile-base-view-1.png and b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_mobile-base-view-1.png differ
diff --git a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_sort-1.png b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_sort-1.png
index c276436451..56f4a24113 100644
Binary files a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_sort-1.png and b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_sort-1.png differ
diff --git a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_sort-2.png b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_sort-2.png
index 10c6465fa7..0638c45f9e 100644
Binary files a/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_sort-2.png and b/ui/address/tokenSelect/__screenshots__/TokenSelect.pw.tsx_default_sort-2.png differ
diff --git a/ui/address/tokenSelect/useTokenSelect.ts b/ui/address/tokenSelect/useTokenSelect.ts
index da268d248e..95346e25c3 100644
--- a/ui/address/tokenSelect/useTokenSelect.ts
+++ b/ui/address/tokenSelect/useTokenSelect.ts
@@ -10,6 +10,7 @@ import { filterTokens } from '../utils/tokenUtils';
 export default function useTokenSelect(data: FormattedData) {
   const [ searchTerm, setSearchTerm ] = React.useState('');
   const [ erc1155sort, setErc1155Sort ] = React.useState<Sort>('desc');
+  const [ erc404sort, setErc404Sort ] = React.useState<Sort>('desc');
   const [ erc20sort, setErc20Sort ] = React.useState<Sort>('desc');
 
   const onInputChange = React.useCallback((event: ChangeEvent<HTMLInputElement>) => {
@@ -21,6 +22,9 @@ export default function useTokenSelect(data: FormattedData) {
     if (tokenType === 'ERC-1155') {
       setErc1155Sort((prevValue) => prevValue === 'desc' ? 'asc' : 'desc');
     }
+    if (tokenType === 'ERC-404') {
+      setErc404Sort((prevValue) => prevValue === 'desc' ? 'asc' : 'desc');
+    }
     if (tokenType === 'ERC-20') {
       setErc20Sort((prevValue) => prevValue === 'desc' ? 'asc' : 'desc');
     }
@@ -37,6 +41,7 @@ export default function useTokenSelect(data: FormattedData) {
     searchTerm,
     erc20sort,
     erc1155sort,
+    erc404sort,
     onInputChange,
     onSortClick,
     data,
diff --git a/ui/address/tokens/AddressCollections.tsx b/ui/address/tokens/AddressCollections.tsx
index 96b8326116..2be76c5c87 100644
--- a/ui/address/tokens/AddressCollections.tsx
+++ b/ui/address/tokens/AddressCollections.tsx
@@ -33,7 +33,7 @@ const AddressCollections = ({ collectionsQuery, address, hasActiveFilters }: Pro
     </ActionBar>
   );
 
-  const content = data?.items ? data?.items.map((item, index) => {
+  const content = data?.items ? data?.items.filter((item) => item.token_instances.length > 0).map((item, index) => {
     const collectionUrl = route({
       pathname: '/token/[hash]',
       query: {
diff --git a/ui/address/tokens/ERC20TokensListItem.tsx b/ui/address/tokens/ERC20TokensListItem.tsx
index 3f5c79893c..6f9e9845af 100644
--- a/ui/address/tokens/ERC20TokensListItem.tsx
+++ b/ui/address/tokens/ERC20TokensListItem.tsx
@@ -46,17 +46,17 @@ const ERC20TokensListItem = ({ token, value, isLoading }: Props) => {
           </Skeleton>
         </HStack>
       ) }
-      <HStack spacing={ 3 }>
+      <HStack spacing={ 3 } alignItems="baseline">
         <Skeleton isLoaded={ !isLoading } fontSize="sm" fontWeight={ 500 }>Quantity</Skeleton>
-        <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary">
+        <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary" whiteSpace="pre-wrap" wordBreak="break-word">
           <span>{ tokenQuantity }</span>
         </Skeleton>
       </HStack>
       { tokenValue !== undefined && (
-        <HStack spacing={ 3 }>
+        <HStack spacing={ 3 } alignItems="baseline">
           <Skeleton isLoaded={ !isLoading } fontSize="sm" fontWeight={ 500 }>Value</Skeleton>
-          <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary">
-            <span>{ tokenValue }</span>
+          <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary" whiteSpace="pre-wrap" wordBreak="break-word">
+            <span>${ tokenValue }</span>
           </Skeleton>
         </HStack>
       ) }
diff --git a/ui/address/tokens/ERC20TokensTableItem.tsx b/ui/address/tokens/ERC20TokensTableItem.tsx
index ed78abcfd5..d1d8457457 100644
--- a/ui/address/tokens/ERC20TokensTableItem.tsx
+++ b/ui/address/tokens/ERC20TokensTableItem.tsx
@@ -43,6 +43,7 @@ const ERC20TokensTableItem = ({
           <AddressEntity
             address={{ hash: token.address }}
             isLoading={ isLoading }
+            truncation="constant"
             noIcon
           />
           <AddressAddToWallet token={ token } ml={ 4 } isLoading={ isLoading } opacity="0"/>
diff --git a/ui/address/tokens/NFTItem.tsx b/ui/address/tokens/NFTItem.tsx
index 50a33ab73b..9ed44b2248 100644
--- a/ui/address/tokens/NFTItem.tsx
+++ b/ui/address/tokens/NFTItem.tsx
@@ -5,6 +5,7 @@ import type { AddressNFT } from 'types/api/address';
 
 import { route } from 'nextjs-routes';
 
+import getCurrencyValue from 'lib/getCurrencyValue';
 import NftEntity from 'ui/shared/entities/nft/NftEntity';
 import TokenEntity from 'ui/shared/entities/token/TokenEntity';
 import NftMedia from 'ui/shared/nft/NftMedia';
@@ -14,6 +15,7 @@ import NFTItemContainer from './NFTItemContainer';
 type Props = AddressNFT & { isLoading: boolean; withTokenLink?: boolean };
 
 const NFTItem = ({ token, value, isLoading, withTokenLink, ...tokenInstance }: Props) => {
+  const valueResult = token.decimals && value ? getCurrencyValue({ value, decimals: token.decimals, accuracy: 2 }).valueStr : value;
   const tokenInstanceLink = tokenInstance.id ?
     route({ pathname: '/token/[hash]/instance/[id]', query: { hash: token.address, id: tokenInstance.id } }) :
     undefined;
@@ -26,17 +28,23 @@ const NFTItem = ({ token, value, isLoading, withTokenLink, ...tokenInstance }: P
       <Link href={ isLoading ? undefined : tokenInstanceLink }>
         <NftMedia
           mb="18px"
-          url={ tokenInstance?.animation_url || tokenInstance?.image_url || null }
+          animationUrl={ tokenInstance?.animation_url ?? null }
+          imageUrl={ tokenInstance?.image_url ?? null }
           isLoading={ isLoading }
         />
       </Link>
-      <Flex justifyContent="space-between" w="100%">
+      <Flex justifyContent="space-between" w="100%" flexWrap="wrap">
         <Flex ml={ 1 } overflow="hidden">
           <Text whiteSpace="pre" variant="secondary">ID# </Text>
           <NftEntity hash={ token.address } id={ tokenInstance.id } isLoading={ isLoading } noIcon/>
         </Flex>
-        <Skeleton isLoaded={ !isLoading }>
-          { Number(value) > 1 && <Flex><Text variant="secondary" whiteSpace="pre">Qty </Text>{ value }</Flex> }
+        <Skeleton isLoaded={ !isLoading } overflow="hidden" ml={ 1 }>
+          { valueResult && (
+            <Flex>
+              <Text variant="secondary" whiteSpace="pre">Qty </Text>
+              <Text overflow="hidden" wordBreak="break-all">{ valueResult }</Text>
+            </Flex>
+          ) }
         </Skeleton>
       </Flex>
       { withTokenLink && (
diff --git a/ui/address/tokens/TokenBalances.tsx b/ui/address/tokens/TokenBalances.tsx
index a22a1e8dc6..76f8ef75e5 100644
--- a/ui/address/tokens/TokenBalances.tsx
+++ b/ui/address/tokens/TokenBalances.tsx
@@ -6,6 +6,7 @@ import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';
 import { ZERO } from 'lib/consts';
 import getCurrencyValue from 'lib/getCurrencyValue';
+import { currencyUnits } from 'lib/units';
 import DataFetchAlert from 'ui/shared/DataFetchAlert';
 
 import { getTokensTotalInfo } from '../utils/tokenUtils';
@@ -52,8 +53,8 @@ const TokenBalances = () => {
         isLoading={ addressQuery.isPending || tokenQuery.isPending }
       />
       <TokenBalancesItem
-        name={ `${ config.chain.currency.symbol } Balance` }
-        value={ (!nativeUsd.eq(ZERO) ? `$${ nativeUsd.toFormat(2) } USD | ` : '') + `${ nativeValue } ${ config.chain.currency.symbol }` }
+        name={ `${ currencyUnits.ether } Balance` }
+        value={ (!nativeUsd.eq(ZERO) ? `$${ nativeUsd.toFormat(2) } USD | ` : '') + `${ nativeValue } ${ currencyUnits.ether }` }
         isLoading={ addressQuery.isPending || tokenQuery.isPending }
       />
       <TokenBalancesItem
diff --git a/ui/address/tokens/TokenBalancesItem.tsx b/ui/address/tokens/TokenBalancesItem.tsx
index 7bf61d1860..fcd3c08752 100644
--- a/ui/address/tokens/TokenBalancesItem.tsx
+++ b/ui/address/tokens/TokenBalancesItem.tsx
@@ -9,10 +9,10 @@ const TokenBalancesItem = ({ name, value, isLoading }: {name: string; value: str
 
   return (
     <Flex p={ 5 } bgColor={ bgColor } borderRadius="16px" alignItems="center">
-      <IconSvg name="wallet" boxSize="30px" mr={ 3 }/>
+      <IconSvg name="wallet" boxSize="30px" mr={ 3 } flexShrink={ 0 }/>
       <Box>
         <Text variant="secondary" fontSize="xs">{ name }</Text>
-        <Skeleton isLoaded={ !isLoading } fontWeight="500">{ value }</Skeleton>
+        <Skeleton isLoaded={ !isLoading } fontWeight="500" whiteSpace="pre-wrap" wordBreak="break-word">{ value }</Skeleton>
       </Box>
     </Flex>
   );
diff --git a/ui/address/utils/tokenUtils.ts b/ui/address/utils/tokenUtils.ts
index 67f2e52c2e..b204166a18 100644
--- a/ui/address/utils/tokenUtils.ts
+++ b/ui/address/utils/tokenUtils.ts
@@ -22,13 +22,13 @@ export interface TokenSelectDataItem {
 
 type TokenGroup = [string, TokenSelectDataItem];
 
-const TOKEN_GROUPS_ORDER: Array<TokenType> = [ 'ERC-20', 'ERC-721', 'ERC-1155' ];
+const TOKEN_GROUPS_ORDER: Array<TokenType> = [ 'ERC-20', 'ERC-721', 'ERC-1155', 'ERC-404' ];
 
 export const sortTokenGroups = (groupA: TokenGroup, groupB: TokenGroup) => {
   return TOKEN_GROUPS_ORDER.indexOf(groupA[0] as TokenType) > TOKEN_GROUPS_ORDER.indexOf(groupB[0] as TokenType) ? 1 : -1;
 };
 
-const sortErc1155Tokens = (sort: Sort) => (dataA: AddressTokenBalance, dataB: AddressTokenBalance) => {
+const sortErc1155or404Tokens = (sort: Sort) => (dataA: AddressTokenBalance, dataB: AddressTokenBalance) => {
   if (dataA.value === dataB.value) {
     return 0;
   }
@@ -38,6 +38,7 @@ const sortErc1155Tokens = (sort: Sort) => (dataA: AddressTokenBalance, dataB: Ad
 
   return Number(dataA.value) > Number(dataB.value) ? 1 : -1;
 };
+
 const sortErc20Tokens = (sort: Sort) => (dataA: TokenEnhancedData, dataB: TokenEnhancedData) => {
   if (!dataA.usd && !dataB.usd) {
     return 0;
@@ -63,7 +64,8 @@ const sortErc721Tokens = () => () => 0;
 export const sortingFns = {
   'ERC-20': sortErc20Tokens,
   'ERC-721': sortErc721Tokens,
-  'ERC-1155': sortErc1155Tokens,
+  'ERC-1155': sortErc1155or404Tokens,
+  'ERC-404': sortErc1155or404Tokens,
 };
 
 export const filterTokens = (searchTerm: string) => ({ token }: AddressTokenBalance) => {
diff --git a/ui/address/utils/useAddressCountersQuery.ts b/ui/address/utils/useAddressCountersQuery.ts
new file mode 100644
index 0000000000..c0dc4ee995
--- /dev/null
+++ b/ui/address/utils/useAddressCountersQuery.ts
@@ -0,0 +1,74 @@
+import type { UseQueryResult } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query';
+
+import type { AddressCounters } from 'types/api/address';
+
+import type { ResourceError } from 'lib/api/resources';
+import useApiQuery from 'lib/api/useApiQuery';
+import { publicClient } from 'lib/web3/client';
+import { ADDRESS_COUNTERS } from 'stubs/address';
+import { GET_TRANSACTIONS_COUNT } from 'stubs/RPC';
+
+import type { AddressQuery } from './useAddressQuery';
+
+type RpcResponseType = [
+  number | null,
+];
+
+export type AddressCountersQuery = UseQueryResult<AddressCounters, ResourceError<{ status: number }>> & {
+  isDegradedData: boolean;
+};
+
+interface Params {
+  hash: string;
+  addressQuery: AddressQuery;
+}
+
+export default function useAddressQuery({ hash, addressQuery }: Params): AddressCountersQuery {
+  const enabled = Boolean(hash) && !addressQuery.isPlaceholderData;
+
+  const apiQuery = useApiQuery<'address_counters', { status: number }>('address_counters', {
+    pathParams: { hash },
+    queryOptions: {
+      enabled: enabled && !addressQuery.isDegradedData,
+      placeholderData: ADDRESS_COUNTERS,
+      refetchOnMount: false,
+    },
+  });
+
+  const rpcQuery = useQuery<RpcResponseType, unknown, AddressCounters | null>({
+    queryKey: [ 'RPC', 'address_counters', { hash } ],
+    queryFn: async() => {
+      if (!publicClient) {
+        throw new Error('No public RPC client');
+      }
+
+      const txCount = publicClient.getTransactionCount({ address: hash as `0x${ string }` }).catch(() => null);
+
+      return Promise.all([
+        txCount,
+      ]);
+    },
+    select: (response) => {
+      const [ txCount ] = response;
+      return {
+        transactions_count: txCount?.toString() ?? '0',
+        token_transfers_count: '0',
+        gas_usage_count: null,
+        validations_count: null,
+      };
+    },
+    placeholderData: [ GET_TRANSACTIONS_COUNT ],
+    enabled: enabled && (addressQuery.isDegradedData || apiQuery.isError),
+    retry: false,
+    refetchOnMount: false,
+  });
+
+  const isRpcQuery = Boolean((addressQuery.isDegradedData || apiQuery.isError) && rpcQuery.data && publicClient);
+  const query = isRpcQuery ? rpcQuery as UseQueryResult<AddressCounters, ResourceError<{ status: number }>> : apiQuery;
+
+  return {
+    ...query,
+    isDegradedData: isRpcQuery,
+  };
+}
diff --git a/ui/address/utils/useAddressQuery.ts b/ui/address/utils/useAddressQuery.ts
new file mode 100644
index 0000000000..141ce56d72
--- /dev/null
+++ b/ui/address/utils/useAddressQuery.ts
@@ -0,0 +1,131 @@
+import type { UseQueryResult } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query';
+import React from 'react';
+
+import type { Address } from 'types/api/address';
+
+import type { ResourceError } from 'lib/api/resources';
+import useApiQuery from 'lib/api/useApiQuery';
+import { retry } from 'lib/api/useQueryClientConfig';
+import { SECOND } from 'lib/consts';
+import { publicClient } from 'lib/web3/client';
+import { ADDRESS_INFO } from 'stubs/address';
+import { GET_BALANCE } from 'stubs/RPC';
+
+type RpcResponseType = [
+    bigint | null,
+];
+
+export type AddressQuery = UseQueryResult<Address, ResourceError<{ status: number }>> & {
+  isDegradedData: boolean;
+};
+
+interface Params {
+  hash: string;
+}
+
+export default function useAddressQuery({ hash }: Params): AddressQuery {
+  const [ isRefetchEnabled, setRefetchEnabled ] = React.useState(false);
+
+  const apiQuery = useApiQuery<'address', { status: number }>('address', {
+    pathParams: { hash },
+    queryOptions: {
+      enabled: Boolean(hash),
+      placeholderData: ADDRESS_INFO,
+      refetchOnMount: false,
+      retry: (failureCount, error) => {
+        if (isRefetchEnabled) {
+          return false;
+        }
+
+        return retry(failureCount, error);
+      },
+      refetchInterval: (): number | false => {
+        return isRefetchEnabled ? 15 * SECOND : false;
+      },
+    },
+  });
+
+  const rpcQuery = useQuery<RpcResponseType, unknown, Address | null>({
+    queryKey: [ 'RPC', 'address', { hash } ],
+    queryFn: async() => {
+      if (!publicClient) {
+        throw new Error('No public RPC client');
+      }
+
+      const balance = publicClient.getBalance({ address: hash as `0x${ string }` }).catch(() => null);
+
+      return Promise.all([
+        balance,
+      ]);
+    },
+    select: (response) => {
+      const [ balance ] = response;
+
+      if (!balance) {
+        return null;
+      }
+
+      return {
+        hash,
+        block_number_balance_updated_at: null,
+        coin_balance: balance.toString(),
+        creator_address_hash: null,
+        creation_tx_hash: null,
+        exchange_rate: null,
+        ens_domain_name: null,
+        has_custom_methods_read: false,
+        has_custom_methods_write: false,
+        has_decompiled_code: false,
+        has_logs: false,
+        has_methods_read: false,
+        has_methods_read_proxy: false,
+        has_methods_write: false,
+        has_methods_write_proxy: false,
+        has_token_transfers: false,
+        has_tokens: false,
+        has_validated_blocks: false,
+        implementation_address: null,
+        implementation_name: null,
+        is_contract: false,
+        is_verified: false,
+        name: null,
+        token: null,
+        watchlist_address_id: null,
+        private_tags: null,
+        public_tags: null,
+        watchlist_names: null,
+      };
+    },
+    placeholderData: [ GET_BALANCE ],
+    enabled: apiQuery.isError || apiQuery.errorUpdateCount > 0,
+    retry: false,
+    refetchOnMount: false,
+  });
+
+  React.useEffect(() => {
+    if (apiQuery.isPlaceholderData || !publicClient) {
+      return;
+    }
+
+    if (apiQuery.isError && apiQuery.errorUpdateCount === 1) {
+      setRefetchEnabled(true);
+    } else if (!apiQuery.isError) {
+      setRefetchEnabled(false);
+    }
+  }, [ apiQuery.errorUpdateCount, apiQuery.isError, apiQuery.isPlaceholderData ]);
+
+  React.useEffect(() => {
+    if (!rpcQuery.isPlaceholderData && !rpcQuery.data) {
+      setRefetchEnabled(false);
+    }
+  }, [ rpcQuery.data, rpcQuery.isPlaceholderData ]);
+
+  const isRpcQuery = Boolean((apiQuery.isError || apiQuery.isPlaceholderData) && apiQuery.errorUpdateCount > 0 && rpcQuery.data && publicClient);
+  const query = isRpcQuery ? rpcQuery as UseQueryResult<Address, ResourceError<{ status: number }>> : apiQuery;
+
+  return {
+    ...query,
+    isDegradedData: isRpcQuery,
+  };
+}
diff --git a/ui/address/utils/useFetchTokens.ts b/ui/address/utils/useFetchTokens.ts
index 9b5bcda583..53055d9ced 100644
--- a/ui/address/utils/useFetchTokens.ts
+++ b/ui/address/utils/useFetchTokens.ts
@@ -36,6 +36,11 @@ export default function useFetchTokens({ hash }: Props) {
     queryParams: { type: 'ERC-1155' },
     queryOptions: { enabled: Boolean(hash), refetchOnMount: false },
   });
+  const erc404query = useApiQuery('address_tokens', {
+    pathParams: { hash },
+    queryParams: { type: 'ERC-404' },
+    queryOptions: { enabled: Boolean(hash), refetchOnMount: false },
+  });
 
   const queryClient = useQueryClient();
 
@@ -78,6 +83,10 @@ export default function useFetchTokens({ hash }: Props) {
     updateTokensData('ERC-1155', payload);
   }, [ updateTokensData ]);
 
+  const handleTokenBalancesErc404Message: SocketMessage.AddressTokenBalancesErc1155['handler'] = React.useCallback((payload) => {
+    updateTokensData('ERC-404', payload);
+  }, [ updateTokensData ]);
+
   const channel = useSocketChannel({
     topic: `addresses:${ hash?.toLowerCase() }`,
     isDisabled: Boolean(hash) && (erc20query.isPlaceholderData || erc721query.isPlaceholderData || erc1155query.isPlaceholderData),
@@ -98,6 +107,11 @@ export default function useFetchTokens({ hash }: Props) {
     event: 'updated_token_balances_erc_1155',
     handler: handleTokenBalancesErc1155Message,
   });
+  useSocketMessage({
+    channel,
+    event: 'updated_token_balances_erc_404',
+    handler: handleTokenBalancesErc404Message,
+  });
 
   const data = React.useMemo(() => {
     return {
@@ -113,12 +127,16 @@ export default function useFetchTokens({ hash }: Props) {
         items: erc1155query.data?.items.map(calculateUsdValue) || [],
         isOverflow: Boolean(erc1155query.data?.next_page_params),
       },
+      'ERC-404': {
+        items: erc404query.data?.items.map(calculateUsdValue) || [],
+        isOverflow: Boolean(erc1155query.data?.next_page_params),
+      },
     };
-  }, [ erc1155query.data, erc20query.data, erc721query.data ]);
+  }, [ erc1155query.data, erc20query.data, erc721query.data, erc404query.data ]);
 
   return {
-    isPending: erc20query.isPending || erc721query.isPending || erc1155query.isPending,
-    isError: erc20query.isError || erc721query.isError || erc1155query.isError,
+    isPending: erc20query.isPending || erc721query.isPending || erc1155query.isPending || erc404query.isPending,
+    isError: erc20query.isError || erc721query.isError || erc1155query.isError || erc404query.isError,
     data,
   };
 }
diff --git a/ui/addressVerification/steps/AddressVerificationStepSignature.tsx b/ui/addressVerification/steps/AddressVerificationStepSignature.tsx
index 0c779f4880..9db7f2dd97 100644
--- a/ui/addressVerification/steps/AddressVerificationStepSignature.tsx
+++ b/ui/addressVerification/steps/AddressVerificationStepSignature.tsx
@@ -80,15 +80,7 @@ const AddressVerificationStepSignature = ({ address, signingMessage, contractCre
 
   const onSubmit = handleSubmit(onFormSubmit);
 
-  const { signMessage, isLoading: isSigning } = useSignMessage({
-    onSuccess: (data) => {
-      setValue('signature', data);
-      onSubmit();
-    },
-    onError: (error) => {
-      return setError('root', { type: 'SIGNING_FAIL', message: (error as Error)?.message || 'Oops! Something went wrong' });
-    },
-  });
+  const { signMessage, isPending: isSigning } = useSignMessage();
 
   const handleSignMethodChange = React.useCallback((value: typeof signMethod) => {
     setSignMethod(value);
@@ -108,8 +100,16 @@ const AddressVerificationStepSignature = ({ address, signingMessage, contractCre
     }
 
     const message = getValues('message');
-    signMessage({ message });
-  }, [ clearErrors, isConnected, getValues, signMessage, setError ]);
+    signMessage({ message }, {
+      onSuccess: (data) => {
+        setValue('signature', data);
+        onSubmit();
+      },
+      onError: (error) => {
+        return setError('root', { type: 'SIGNING_FAIL', message: (error as Error)?.message || 'Oops! Something went wrong' });
+      },
+    });
+  }, [ clearErrors, isConnected, getValues, signMessage, setError, setValue, onSubmit ]);
 
   const handleManualSignClick = React.useCallback(() => {
     clearErrors('root');
@@ -157,7 +157,7 @@ const AddressVerificationStepSignature = ({ address, signingMessage, contractCre
       }
       case 'INVALID_SIGNER_ERROR': {
         const signer = shortenString(formState.errors.root.message || '');
-        const expectedSigners = [ contractCreator, contractOwner ].filter(Boolean).map(shortenString).join(', ');
+        const expectedSigners = [ contractCreator, contractOwner ].filter(Boolean).map(s => shortenString(s)).join(', ');
         return (
           <Box>
             <span>This address </span>
@@ -219,7 +219,7 @@ const AddressVerificationStepSignature = ({ address, signingMessage, contractCre
         { !noWeb3Provider && (
           <RadioGroup onChange={ handleSignMethodChange } value={ signMethod } display="flex" flexDir="column" rowGap={ 4 }>
             <Radio value="wallet">Sign via Web3 wallet</Radio>
-            <Radio value="manually">Sign manually</Radio>
+            <Radio value="manual">Sign manually</Radio>
           </RadioGroup>
         ) }
         { signMethod === 'manual' && <AddressVerificationFieldSignature formState={ formState } control={ control }/> }
diff --git a/ui/addressVerification/steps/__screenshots__/AddressVerificationStepSignature.pw.tsx_default_INVALID-SIGNER-ERROR-view-mobile-1.png b/ui/addressVerification/steps/__screenshots__/AddressVerificationStepSignature.pw.tsx_default_INVALID-SIGNER-ERROR-view-mobile-1.png
index 7e0ca0fc1b..b3529890dc 100644
Binary files a/ui/addressVerification/steps/__screenshots__/AddressVerificationStepSignature.pw.tsx_default_INVALID-SIGNER-ERROR-view-mobile-1.png and b/ui/addressVerification/steps/__screenshots__/AddressVerificationStepSignature.pw.tsx_default_INVALID-SIGNER-ERROR-view-mobile-1.png differ
diff --git a/ui/addresses/AddressesListItem.tsx b/ui/addresses/AddressesListItem.tsx
index b3d584863a..d147ff7970 100644
--- a/ui/addresses/AddressesListItem.tsx
+++ b/ui/addresses/AddressesListItem.tsx
@@ -6,6 +6,7 @@ import type { AddressesItem } from 'types/api/addresses';
 
 import config from 'configs/app';
 import { ZERO } from 'lib/consts';
+import { currencyUnits } from 'lib/units';
 import Tag from 'ui/shared/chakra/Tag';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
@@ -34,6 +35,7 @@ const AddressesListItem = ({
           isLoading={ isLoading }
           fontWeight={ 700 }
           mr={ 2 }
+          truncation="constant"
         />
         <Skeleton isLoaded={ !isLoading } fontSize="sm" ml="auto" minW={ 6 } color="text_secondary">
           <span>{ index }</span>
@@ -42,9 +44,9 @@ const AddressesListItem = ({
       { item.public_tags !== null && item.public_tags.length > 0 && item.public_tags.map(tag => (
         <Tag key={ tag.label } isLoading={ isLoading }>{ tag.display_name }</Tag>
       )) }
-      <HStack spacing={ 3 }>
-        <Skeleton isLoaded={ !isLoading } fontSize="sm" fontWeight={ 500 }>{ `Balance ${ config.chain.currency.symbol }` }</Skeleton>
-        <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary">
+      <HStack spacing={ 3 } maxW="100%" alignItems="flex-start">
+        <Skeleton isLoaded={ !isLoading } fontSize="sm" fontWeight={ 500 } flexShrink={ 0 }>{ `Balance ${ currencyUnits.ether }` }</Skeleton>
+        <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary" minW="0" whiteSpace="pre-wrap">
           <span>{ addressBalance.dp(8).toFormat() }</span>
         </Skeleton>
       </HStack>
diff --git a/ui/addresses/AddressesTable.tsx b/ui/addresses/AddressesTable.tsx
index 610d3e58cb..60634f96c7 100644
--- a/ui/addresses/AddressesTable.tsx
+++ b/ui/addresses/AddressesTable.tsx
@@ -4,8 +4,8 @@ import React from 'react';
 
 import type { AddressesItem } from 'types/api/addresses';
 
-import config from 'configs/app';
 import { ZERO } from 'lib/consts';
+import { currencyUnits } from 'lib/units';
 import { default as Thead } from 'ui/shared/TheadSticky';
 
 import AddressesTableItem from './AddressesTableItem';
@@ -27,7 +27,7 @@ const AddressesTable = ({ items, totalSupply, pageStartIndex, top, isLoading }:
           <Th width="64px">Rank</Th>
           <Th width={ hasPercentage ? '30%' : '40%' }>Address</Th>
           <Th width="20%" pl={ 10 }>Public tag</Th>
-          <Th width={ hasPercentage ? '20%' : '25%' } isNumeric>{ `Balance ${ config.chain.currency.symbol }` }</Th>
+          <Th width={ hasPercentage ? '20%' : '25%' } isNumeric>{ `Balance ${ currencyUnits.ether }` }</Th>
           { hasPercentage && <Th width="15%" isNumeric>Percentage</Th> }
           <Th width="15%" isNumeric>Txn count</Th>
         </Tr>
diff --git a/ui/addresses/AddressesTableItem.tsx b/ui/addresses/AddressesTableItem.tsx
index 05f2f0ce0a..6210fd0134 100644
--- a/ui/addresses/AddressesTableItem.tsx
+++ b/ui/addresses/AddressesTableItem.tsx
@@ -34,11 +34,12 @@ const AddressesTableItem = ({
           { index }
         </Skeleton>
       </Td>
-      <Td verticalAlign="middle">
+      <Td>
         <AddressEntity
           address={ item }
           isLoading={ isLoading }
           fontWeight={ 700 }
+          my="2px"
         />
       </Td>
       <Td pl={ 10 }>
@@ -47,7 +48,7 @@ const AddressesTableItem = ({
         )) : null }
       </Td>
       <Td isNumeric>
-        <Skeleton isLoaded={ !isLoading } display="inline-block">
+        <Skeleton isLoaded={ !isLoading } display="inline-block" maxW="100%">
           <Text lineHeight="24px" as="span">{ addressBalanceChunks[0] }</Text>
           { addressBalanceChunks[1] && <Text lineHeight="24px" as="span">.</Text> }
           <Text lineHeight="24px" variant="secondary" as="span">{ addressBalanceChunks[1] }</Text>
diff --git a/ui/blob/BlobData.pw.tsx b/ui/blob/BlobData.pw.tsx
new file mode 100644
index 0000000000..487ad0e69c
--- /dev/null
+++ b/ui/blob/BlobData.pw.tsx
@@ -0,0 +1,53 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import TestApp from 'playwright/TestApp';
+
+import BlobData from './BlobData';
+import imageBlobWithZeroesBytes from './image_with_zeroes.blob';
+
+test.use({ viewport: { width: 500, height: 300 } });
+
+test('text', async({ mount }) => {
+  // eslint-disable-next-line max-len
+  const data = '0xE2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A280E2A3A4E2A1B6E2A0BFE2A0BFE2A0B7E2A3B6E2A384E2A080E2A080E2A080E2A080E2A0800AE2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A3B0E2A1BFE2A081E2A080E2A080E2A280E2A380E2A180E2A099E2A3B7E2A180E2A080E2A080E2A0800AE2A080E2A080E2A080E2A180E2A080E2A080E2A080E2A080E2A080E2A2A0E2A3BFE2A081E2A080E2A080E2A080E2A098E2A0BFE2A083E2A080E2A2B8E2A3BFE2A3BFE2A3BFE2A3BF0AE2A080E2A3A0E2A1BFE2A09BE2A2B7E2A3A6E2A180E2A080E2A080E2A088E2A3BFE2A184E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A3B8E2A3BFE2A3BFE2A3BFE2A09F0AE2A2B0E2A1BFE2A081E2A080E2A080E2A099E2A2BFE2A3A6E2A3A4E2A3A4E2A3BCE2A3BFE2A384E2A080E2A080E2A080E2A080E2A080E2A2B4E2A19FE2A09BE2A08BE2A081E2A0800AE2A3BFE2A087E2A080E2A080E2A080E2A080E2A080E2A089E2A089E2A089E2A089E2A089E2A081E2A080E2A080E2A080E2A080E2A080E2A088E2A3BFE2A180E2A080E2A080E2A0800AE2A3BFE2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A2B9E2A187E2A080E2A080E2A0800AE2A3BFE2A186E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A3BCE2A187E2A080E2A080E2A0800AE2A0B8E2A3B7E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A2A0E2A1BFE2A080E2A080E2A080E2A0800AE2A080E2A0B9E2A3B7E2A3A4E2A380E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A080E2A380E2A3B0E2A1BFE2A081E2A080E2A080E2A080E2A0800AE2A080E2A080E2A080E2A089E2A099E2A09BE2A0BFE2A0B6E2A3B6E2A3B6E2A3B6E2A3B6E2A3B6E2A0B6E2A0BFE2A09FE2A09BE2A089E2A080E2A080E2A080E2A080E2A080E2A080';
+
+  const component = await mount(
+    <TestApp>
+      <BlobData hash="0x01" data={ data }/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+
+  await component.locator('select').selectOption('UTF-8');
+
+  await expect(component).toHaveScreenshot();
+});
+
+test('image', async({ mount }) => {
+  // eslint-disable-next-line max-len
+  const data = '0x89504E470D0A1A0A0000000D494844520000003C0000003C0403000000C8D2C4410000000467414D410000B18F0BFC6105000000017352474200AECE1CE900000027504C54454C69712B6CB02A6CB02B6CB02B6CB02B6CB02B6CB02B6CB02B6CB02B6CB02B6CB02B6CB02B6CB0F4205A540000000C74524E5300ED2F788CD91B99475C09B969CFA99D0000004F7A5458745261772070726F66696C65207479706520697074630000789CE3CA2C2849E6520003230B2E630B1323134B9314031320448034C3640323B35420CBD8D4C8C4CCC41CC407CB8048A04A2E0028950EE32A226D1F0000000970485973000084DF000084DF0195C81C33000000F24944415438CB636000018E983367CE482780D90CDA40F6991D0C4820152472A60ACCE6DA03629F4E40929E03961602B39964C09C0624691B24690E88F48461215D03160903B3D962C01C07842C2758C341A80643B0B40484C3646C6C5C78E6E016171723A8E215262EEE31670E161B1B7731304C05AB155EC08002C0D172E6F80206884DBB50651938CF4003FE0CBA4390E3C56064482F53525252C329CD562A2828283A0197340B22AAB0494332C311FCD2C747A547A58996C69998D8F12745B68DA0846C85331B2CEAE8E8681A81D91F8B348C4605D0527B02A4283FA88026CD05163EAAC0900ED21EC9800EC0C2110C002BBA9FE999B920330000000049454E44AE426082';
+
+  const component = await mount(
+    <TestApp>
+      <BlobData hash="0x01" data={ data }/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+
+  await component.locator('select').selectOption('Base64');
+
+  await expect(component).toHaveScreenshot();
+});
+
+test('image blob with zeroes bytes', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <BlobData hash="0x01" data={ imageBlobWithZeroesBytes }/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/blob/BlobData.tsx b/ui/blob/BlobData.tsx
new file mode 100644
index 0000000000..da7980c84c
--- /dev/null
+++ b/ui/blob/BlobData.tsx
@@ -0,0 +1,135 @@
+import { Flex, GridItem, Select, Skeleton, Button } from '@chakra-ui/react';
+import React from 'react';
+
+import * as blobUtils from 'lib/blob';
+import removeNonSignificantZeroBytes from 'lib/blob/removeNonSignificantZeroBytes';
+import bytesToBase64 from 'lib/bytesToBase64';
+import downloadBlob from 'lib/downloadBlob';
+import hexToBase64 from 'lib/hexToBase64';
+import hexToBytes from 'lib/hexToBytes';
+import hexToUtf8 from 'lib/hexToUtf8';
+import CopyToClipboard from 'ui/shared/CopyToClipboard';
+import RawDataSnippet from 'ui/shared/RawDataSnippet';
+
+import BlobDataImage from './BlobDataImage';
+
+const FORMATS = [ 'Image', 'Raw', 'UTF-8', 'Base64' ] as const;
+
+type Format = typeof FORMATS[number];
+
+interface Props {
+  data: string;
+  hash: string;
+  isLoading?: boolean;
+}
+
+const BlobData = ({ data, isLoading, hash }: Props) => {
+  const [ format, setFormat ] = React.useState<Format>('Raw');
+
+  const guessedType = React.useMemo(() => {
+    if (isLoading) {
+      return;
+    }
+    return blobUtils.guessDataType(data);
+  }, [ data, isLoading ]);
+
+  const isImage = guessedType?.mime?.startsWith('image/');
+  const formats = isImage ? FORMATS : FORMATS.filter((format) => format !== 'Image');
+
+  React.useEffect(() => {
+    if (isImage) {
+      setFormat('Image');
+    }
+  }, [ isImage ]);
+
+  const handleSelectChange = React.useCallback((event: React.ChangeEvent<HTMLSelectElement>) => {
+    setFormat(event.target.value as Format);
+  }, []);
+
+  const handleDownloadButtonClick = React.useCallback(() => {
+    const fileBlob = (() => {
+      switch (format) {
+        case 'Image': {
+          const bytes = new Uint8Array(hexToBytes(data));
+          const filteredBytes = removeNonSignificantZeroBytes(bytes);
+          return new Blob([ filteredBytes ], { type: guessedType?.mime });
+        }
+        case 'UTF-8': {
+          return new Blob([ hexToUtf8(data) ], { type: guessedType?.mime ?? 'text/plain' });
+        }
+        case 'Base64': {
+          return new Blob([ hexToBase64(data) ], { type: 'application/octet-stream' });
+        }
+        case 'Raw': {
+          return new Blob([ data ], { type: 'application/octet-stream' });
+        }
+      }
+    })();
+    const fileName = `blob_${ hash }`;
+
+    downloadBlob(fileBlob, fileName);
+  }, [ data, format, guessedType, hash ]);
+
+  const content = (() => {
+    switch (format) {
+      case 'Image': {
+        if (!guessedType?.mime?.startsWith('image/')) {
+          return <RawDataSnippet data="Not an image" showCopy={ false } isLoading={ isLoading }/>;
+        }
+
+        const bytes = new Uint8Array(hexToBytes(data));
+        const filteredBytes = removeNonSignificantZeroBytes(bytes);
+        const base64 = bytesToBase64(filteredBytes);
+
+        const imgSrc = `data:${ guessedType.mime };base64,${ base64 }`;
+
+        return <BlobDataImage src={ imgSrc }/>;
+      }
+      case 'UTF-8':
+        return <RawDataSnippet data={ hexToUtf8(data) } showCopy={ false } isLoading={ isLoading } contentProps={{ wordBreak: 'break-word' }}/>;
+      case 'Base64':
+        return <RawDataSnippet data={ hexToBase64(data) } showCopy={ false } isLoading={ isLoading }/>;
+      case 'Raw':
+        return <RawDataSnippet data={ data } showCopy={ false } isLoading={ isLoading }/>;
+      default:
+        return <span/>;
+    }
+  })();
+
+  return (
+    <GridItem colSpan={{ base: undefined, lg: 2 }} mt={{ base: 3, lg: 2 }}>
+      <Flex alignItems="center" mb={ 3 }>
+        <Skeleton fontWeight={{ base: 700, lg: 500 }} isLoaded={ !isLoading }>
+            Blob data
+        </Skeleton>
+        <Skeleton ml={ 5 } isLoaded={ !isLoading }>
+          <Select
+            size="xs"
+            borderRadius="base"
+            value={ format }
+            onChange={ handleSelectChange }
+            focusBorderColor="none"
+            w="auto"
+          >
+            { formats.map((format) => (
+              <option key={ format } value={ format }>{ format }</option>
+            )) }
+          </Select>
+        </Skeleton>
+        <Skeleton ml="auto" mr={ 3 } isLoaded={ !isLoading }>
+          <Button
+            variant="outline"
+            size="sm"
+            onClick={ handleDownloadButtonClick }
+          >
+            Download
+          </Button>
+        </Skeleton>
+        <CopyToClipboard text={ data } isLoading={ isLoading }/>
+      </Flex>
+      { content }
+    </GridItem>
+  );
+};
+
+export default React.memo(BlobData);
diff --git a/ui/blob/BlobDataImage.tsx b/ui/blob/BlobDataImage.tsx
new file mode 100644
index 0000000000..8cc8e54323
--- /dev/null
+++ b/ui/blob/BlobDataImage.tsx
@@ -0,0 +1,31 @@
+import { Image, Center, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+interface Props {
+  src: string;
+}
+
+const BlobDataImage = ({ src }: Props) => {
+  const bgColor = useColorModeValue('blackAlpha.50', 'whiteAlpha.50');
+
+  return (
+    <Center
+      bgColor={ bgColor }
+      p={ 4 }
+      minH="200px"
+      w="100%"
+      borderRadius="md"
+    >
+      <Image
+        src={ src }
+        objectFit="contain"
+        maxW="100%"
+        maxH="100%"
+        objectPosition="center"
+        alt="Blob image representation"
+      />
+    </Center>
+  );
+};
+
+export default React.memo(BlobDataImage);
diff --git a/ui/blob/BlobInfo.tsx b/ui/blob/BlobInfo.tsx
new file mode 100644
index 0000000000..4f93cf3756
--- /dev/null
+++ b/ui/blob/BlobInfo.tsx
@@ -0,0 +1,92 @@
+import { Alert, Grid, GridItem, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { Blob } from 'types/api/blobs';
+
+import CopyToClipboard from 'ui/shared/CopyToClipboard';
+import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
+import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
+import DetailsSponsoredItem from 'ui/shared/DetailsSponsoredItem';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+
+import BlobData from './BlobData';
+
+interface Props {
+  data: Blob;
+  isLoading?: boolean;
+}
+
+const BlobInfo = ({ data, isLoading }: Props) => {
+  return (
+    <Grid
+      columnGap={ 8 }
+      rowGap={ 3 }
+      templateColumns={{ base: 'minmax(0, 1fr)', lg: '216px minmax(728px, auto)' }}
+    >
+      { !data.blob_data && (
+        <GridItem colSpan={{ base: undefined, lg: 2 }} mb={ 3 }>
+          <Skeleton isLoaded={ !isLoading }>
+            <Alert status="warning">This blob is not yet indexed</Alert>
+          </Skeleton>
+        </GridItem>
+      ) }
+      { data.kzg_proof && (
+        <DetailsInfoItem
+          title="Proof"
+          hint="Zero knowledge proof. Allows for quick verification of commitment"
+          isLoading={ isLoading }
+        >
+          <Skeleton isLoaded={ !isLoading } overflow="hidden" whiteSpace="pre-wrap" wordBreak="break-all" lineHeight={ 6 } my="-2px">
+            { data.kzg_proof }
+            <CopyToClipboard text={ data.kzg_proof } isLoading={ isLoading }/>
+          </Skeleton>
+        </DetailsInfoItem>
+      ) }
+      { data.kzg_commitment && (
+        <DetailsInfoItem
+          title="Commitment"
+          hint="Commitment to the data in the blob"
+          isLoading={ isLoading }
+        >
+          <Skeleton isLoaded={ !isLoading } overflow="hidden" whiteSpace="pre-wrap" wordBreak="break-all" lineHeight={ 6 } my="-2px">
+            { data.kzg_commitment }
+            <CopyToClipboard text={ data.kzg_commitment } isLoading={ isLoading }/>
+          </Skeleton>
+        </DetailsInfoItem>
+      ) }
+      { data.blob_data && (
+        <DetailsInfoItem
+          title="Size, bytes"
+          hint="Blob size in bytes"
+          isLoading={ isLoading }
+        >
+          <Skeleton isLoaded={ !isLoading } overflow="hidden" whiteSpace="pre-wrap" wordBreak="break-all">
+            { (data.blob_data.replace('0x', '').length / 2).toLocaleString() }
+          </Skeleton>
+        </DetailsInfoItem>
+      ) }
+
+      { data.blob_data && <DetailsInfoItemDivider/> }
+
+      { data.transaction_hashes[0] && (
+        <DetailsInfoItem
+          title="Transaction hash"
+          hint="Hash of the transaction with this blob"
+          isLoading={ isLoading }
+        >
+          <TxEntity hash={ data.transaction_hashes[0].transaction_hash } isLoading={ isLoading } noIcon noCopy={ false }/>
+        </DetailsInfoItem>
+      ) }
+      <DetailsSponsoredItem isLoading={ isLoading }/>
+
+      { data.blob_data && (
+        <>
+          <DetailsInfoItemDivider/>
+          <BlobData data={ data.blob_data } hash={ data.hash } isLoading={ isLoading }/>
+        </>
+      ) }
+    </Grid>
+  );
+};
+
+export default React.memo(BlobInfo);
diff --git a/ui/blob/__screenshots__/BlobData.pw.tsx_default_image-1.png b/ui/blob/__screenshots__/BlobData.pw.tsx_default_image-1.png
new file mode 100644
index 0000000000..b5bc4b859e
Binary files /dev/null and b/ui/blob/__screenshots__/BlobData.pw.tsx_default_image-1.png differ
diff --git a/ui/blob/__screenshots__/BlobData.pw.tsx_default_image-2.png b/ui/blob/__screenshots__/BlobData.pw.tsx_default_image-2.png
new file mode 100644
index 0000000000..47262e6684
Binary files /dev/null and b/ui/blob/__screenshots__/BlobData.pw.tsx_default_image-2.png differ
diff --git a/ui/blob/__screenshots__/BlobData.pw.tsx_default_image-blob-with-zeroes-bytes-1.png b/ui/blob/__screenshots__/BlobData.pw.tsx_default_image-blob-with-zeroes-bytes-1.png
new file mode 100644
index 0000000000..653421e4cb
Binary files /dev/null and b/ui/blob/__screenshots__/BlobData.pw.tsx_default_image-blob-with-zeroes-bytes-1.png differ
diff --git a/ui/blob/__screenshots__/BlobData.pw.tsx_default_text-1.png b/ui/blob/__screenshots__/BlobData.pw.tsx_default_text-1.png
new file mode 100644
index 0000000000..42f8f62146
Binary files /dev/null and b/ui/blob/__screenshots__/BlobData.pw.tsx_default_text-1.png differ
diff --git a/ui/blob/__screenshots__/BlobData.pw.tsx_default_text-2.png b/ui/blob/__screenshots__/BlobData.pw.tsx_default_text-2.png
new file mode 100644
index 0000000000..888fdc8cf7
Binary files /dev/null and b/ui/blob/__screenshots__/BlobData.pw.tsx_default_text-2.png differ
diff --git a/ui/blob/image_with_zeroes.blob.ts b/ui/blob/image_with_zeroes.blob.ts
new file mode 100644
index 0000000000..7c9eb4ed8a
--- /dev/null
+++ b/ui/blob/image_with_zeroes.blob.ts
@@ -0,0 +1,3 @@
+// eslint-disable-next-line max-len
+const data = '0x00ffd8ffe000104a46494600010100000100010000ffe201d84943435f50524f0046494c45000101000001c800000000043000006d6e74725247422058595a200007e0000100010000000000006163737000000000000000000000000000000000000000000000000000000000010000f6d6000100000000d32d00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000964657363000000f0000000247258595a0000000114000000146758595a00000128000000146258595a0000013c000000001477747074000001500000001472545243000001640000002867545243000000016400000028625452430000016400000028637072740000018c0000003c6d006c756300000000000000010000000c656e5553000000080000001c00730052000047004258595a200000000000006fa2000038f50000039058595a200000000000000062990000b785000018da58595a2000000000000024a000000f84000000b6cf58595a20000000000000f6d6000100000000d32d70617261000000000000040000000266660000f2a700000d59000013d000000a5b0000000000000000006d6c756300000000000000010000000c656e5553000000200000001c004700006f006f0067006c006500200049006e0063002e00200032003000310036ffdb00004300010101010101010101010101010101010101010101010101010101010001010101010101010101010101010101010101010101010101010101010101000101010101ffdb004301010101010101010101010101010101010101010101000101010101010101010101010101010101010101010101010101010101010100010101010101010101010101ffc0001108019001900301110002110103110100ffc4001f000100010402030100000000000000000000010708090a02060305000b04ffc4005d100001020404040306030603020809080b0102030405112100000607310841516112718109131491a1f0b1c1d10a151622e1f117233218422400333952627278b619373843778293b7c225264853565792a22735444754668300a3a6b3d3ffc4001d01010001040301000000000000000000000001020304050006070809ffc4005911000102040305060404030600080b06070102110003040021053141061251617107138191a1f022b1c1d1081432e11542f1162333526200722443455382a2b2c2252634353654739293b3d2094463647583171827658400a4b4ffda000c03010002110311003f00f9ff00e1086108610861086108610800610861086108610861086108610861086108610861089009200049240000a90024d80005c926c00df084558cbba17ab39a12f392cc913965860b617113a6d900cbacb85c5bed8f855cf5d9718ff76ec33adc47c0089f8473dda62bdc975af100f68ecc762bdaa6d7bab04d88c6d720212b15988c8460943312b240322b71a9009414d544149de4534d9cb40214b4a52a04e42296a267e892beaa1b83c0aca4001f0262ba48b832cd1125a5664ce52293b6e309794893c0c74fe2185b90c8750010afa229597d80fb710a5c2c5a9889898768b6a7e15e8e6d480aefdc03f05500b715a8913768f69f67b0044d4854c91452ab31daea6743f773656ee1744b9a0085ba2677188ce921b7a5cf999466230b9a5b7e6211c4005645bfe887d0ddb90098ac328e1074ca022988999cc3354f10cbcd38a80899841414be29b4a00758008bfddd2d8799fbb75cf12d2a829a413cda3c2d871641717dcf83fe0b3b3ca3005489b8d6d16d4e32b96a42a648a799876174751ba0efa264b45155d62252cd00da4e212a6a47c226b82a8c94e172436fae6288cd8a520f8312c7929f9c54d9003e81e8fc8e3188e82c8727887e1d4e2da44e171f9860c8792a496df96cfe3200672e8b4a02c86be2a15f5364256921d4058ed2c33f0d7d896173a4cf93b0f400953364a8a93fc4f12c6b1294b371fdf52d76273e8a7062fb9369d6870e120b0018c84d0d2a588940917f894a5798258f421a3bbc3e47c9708971a82c9d94e0009a796a5b8c40e5b92c14329c340a57c3c2c0b4cd7c206cd800505a829d834900d9bf675429228b60762e912e1ff2fb2f824a2a2d62a32e892a592c03a892460065b2bc24491949943a4b40f908ecd05596c3220e5c7e020db484370b0558580066d09144a10c31eeda4a40164a52001602d8e4b47856154084caa2c330fa2900681ba89749474d4c8400186e2644a9694a4337c2001c85a2e04a40609481c0000005f3b08e44a9649528a89a9a935249352493526db9a81ccf218cf76b0006004e437239002d7f10fd44c1254829285149dea0d0835352082286b7fa0c0a8100cc039f4661c5f33d0daed7844468332865c1cc7fe1f06e27c0e42c6ffc2a19006850f0a92b61ef78d292454292a41143420d71afabc2f0aaf96b955d8661f500d2d60854baba2a6a996a49674a913a5ad2a0cee0821b94414a55fa9292f9b80005fcfa08eaf1191f2545a5b6e33276548e6597038db11d96e4b1d0c8580521007f0f1502f326809176c8a1db738e3757d9bf6775c9ddaed81d8caa4dca454600cbe09354330e83328894a80243a485072c43806d99124e72651eb2d07e623a0044e340f47a7919111d1b90e4ec3f12a694e264eb8ecbd069f749424261e5b20008b96cba110b4a007be1211953854b714af7ab2b3d7d897e1afb13c526ce9f003b61a969a74e502bfe1b8963585ca410024095494388c8a392180f864d3a1200a3bca52092a2ab2aa1a55124ca009ff2a9691e49501e914d271c20699c7c5300d132c986699121f79c7132f8698c146cbe15a536434c41fef296c44cfddb6e0000b52e36691aeb892a6fc68252b4756631f82deceeb173a6e0db43b55832a60015aa5c99d370ec528e41206ea25cb99454b58a96955c89d884e98a0e0cc4820008c7561720beeae625f4252a03901ba0f9a89e714767bc1966886f7aacb79c0064538436ca9d4a26f031f21887968875b8b8665308acc10fef9d884a2161170011150d0ce9703d14fc0b614074ced07e0ab6e28933e66ce6d3ecf63e89482b009522b65d66055d52420932a54a2313a144e52c044bfcc6252649077d73a58b004632f0b9a1f726216da17413d07c41faa80e7142f316866ace574b4e4cf24400e1f65e2b098892a19cc4c3650a61bff852e42f4c7e03de3912d370ff001c2100be2dcf78985f7c5977c1d05b4dd8a76a9b22cac6f6231b4482852cd661d4e900c6e865a52529267d6e0b32be9a9492a1ba8aa9b256b0e509525248c3994b51002bf5ca5b66e91be9039946f01e244527208241041048208a10458820dc106c0041db1d5d18f11842184218421842184218421842184218421842184218421800421842184218421842184218421842184218421842184218421842184218420018421842184218422a8e46d19d45d42532ee5fcbd12995b8eb2854fa69596c0095b6dd70a16fb7171090b98221802e453528666318d202690ca5baca1cecbd0087ec83b44ed0d6856ccecd56d450929dfc62b0270ec1a5a7bc12d6b4e235a6004c8aa54924aa6d3d09aaab4a4129a75581bf2a9a7ceff0e5923fcc7e147fef001b1e81cf28bbaca1c1ac860fe162f3be658c9d4436e30fbf2991342592b516005d5a9d827665121e99c74245a12d256f4343c8631a429f6d95a1d2d44b7ebf00d8cfc1661b23b9a9dbdda99d5d304c94b5e15b352ff29464215bcb953716af0092baaa8953834b589141874f969dfeeea1331485cbd94ac2d22f3a613fe996001878a9572fc920f3e173f9534e7246486d94655caf27943ac174a63da854bd003757be429b703b3a8b311367d25b5bad21b7a356d36dbcf36ca1b6dd712bf50056c9f655d9cec3a65ff66764b06a09f294568c46653ff10c592a50209fe2d80081aac482589025a6a84b46f10842428bec65d3c894dddcb4a48fe66757fef100757ac77420f5efb5458d76a57ccd6b5fa760ef8d3ede3c1b2fb5a2f44786b6002079803a9a53cc7dd6c6adf19be8c731a7b2dab5816684026d7adabe95fa9b0079dcf3e51bde570efc3d2f9dc8c9f83a005bd48af3a1f3048b1dbd79d70de00033d7e5e0e0e87a65704420523bf7f4a505297e74dfd70df1a7cf4624f21a8200097b4214a509bd0d4501277b6d4b0006f5e83960142e35676e99872cc46bfd0059003a5efb11b0e7bec7e408248186f747b105ede0dcdf4b36908537dc53e4007f1b75df7aee5586f86f3cbf766f9bf1b420050dab737f974a5ae79f216dee00de19e9e6d9b1719bf2763e88786fccf3352695e56e7b6c49b6e45aadf1ccdd00b2f5e9fbf030852e398a937ad473e95f43bf4b571215c8837b3176fa73bb710021e10f08a7cbb5fa80297bf7f0df6008c415b3ddfc7319f4e77373e04a1e1100b8b9008bec6c45ff000f4eb86f0e77f3e56e0743e6d08809edf303a1d87a8a0083e86a2b892af1e02f93b70391eb08e999af4e72367869d466acaf299bbcf1006caa60ec3866703dc36969b4b539832c4d58425b6da6cb4d46a1a750cb2dbc008710d2129ebddadecabb39db94ccfed36c8e0f88544c5a662b10974e70fc5800903741fe2d872a931254b01b7a52aa8c956ea77e5ab752d66653c89dfe24a400a8bbef36eaadfea4b29b93b45b066fe0da431822a2b246658e93c42dd79e6200553e6d3329580eba92dc23531864b13281858541752dbd130f3d8b790961b70096a73dec52fcabb65f82bc36777d53b07b555143354b98b97856d2ca157463007d5bc9912f15a0928aba7952412997df61f88cf5a0244d9ca9815317af9b8500a4b99330a4e899971d378070068e951e2758b47cf5a33a89a76a79dcc397e200152a69e79a44fe567f79491d436e06db7d7170e92b97b7141497211a9bb12e008c750540c2a5c65f6daf1f6dc7643da1f678a5af69b66eb29e80294118c51e00ee23832d226f752d6ac428ccd934a67a8a4c9a7aff00ca55a92a4934e92e0600b27534f91fe22081a2832927c52ecfa0531e20452dc75ac5886108610861080061086108610861086108610861086108610861086108610861086108610861000861086108610861086108610861086108aefa71c3bea16a1a588f103fc3590075e4a5d44f67cd3d0e98c654965c4392897f8531b336de69f0e43c6210cca900e2d3ed099a5f694d63bb7b38ec07b43ed20c9aba1c37f82e013082ada1c7130036928a64b281302e824141acc4c2d25a5cda490ba3ef3e09d572194a4e5c8a0039d3d8a53b88ff003aec3fe88cd5d406e2445f4e43e1a74cf241868b8897af00364ee1d4a70cd331a1a7e19b794c065460e469aca98690a0a89833188994c20012297ef9a9915b30aa67de5d9efe17bb36d8a34f5b89d21db3c72429333f3b008eca42b0e933bba32d4693024a974225ef133650c4bf89cf9338226caa842e005cb29dbc9c3e44a62a1deab37581ba2da2326d7e2de6e36117009484a42520002529484a52004a5200a2401b0012289000a580d857d1d2e5cb952d12a5211200a54b4265ca972d2944b972d09094225a100250842404a52901294800000011009d6d2c341c044d3b76a52b526fca9d7a93d8e2b7f4f1f9f2844529fa539f3100f9fdd312fc4e8de571c3d5d8741089a01bfe7d6f5e7cb954f7df0249279e7e00bec741c042229dff00bde9bd0f2fadef6c1f316d3d3dddfac2269dc6e3e5d70095afcc8bef887cba742dcf5b65ca1116b7cbbfe5b9e9d3b60f9dfc1f837c8700d210a57f2dbf3fbfc707f5b7be8de9c21134e5fd6b5dbafa52d7e94c4fdbe800dc3df18447a74e5f2fd7bef8876f979da1134d8017fd493eb5a8a7c872c4bf004361f26b787df363080036ee7f1279f9fc86c4d2a77e19365c1bcf21cba42100e1efc8f317de94a50d3b8bd77e78876e1a79f8e673f330852dc8f3e55bf2f9001f4ea0d712fc2dd1e10e676a5c585bcc5b726a45f7e831048d6d6d4fbf01c000723087cb61f8f9d2b7ef6de94b1f4b7d7eff0048429d08f3eb5f3bd07a6de8006497f1cf2cf8d80605b5b78c214d8fade879d3d7f1bdebb987f5fdbdf0f4840029ebdfcae7efe83077e1cbd4b71d5e110529502950052a052a49150524514000a4820822a083635a6c0e295a11350b953108992e62148992d690b42d0a052b0042d0a052a42924a54950208241041845bfe7de1a74d33b9898c625eaca53b8008525cfde99750d310cb752c161262e44a0995bed38af0c4c59836a5b1f191400dfbe7664971e8a53fe71ed07f0bdd9b6dafe62b70ca456c6e3938999f9ec06005a13874d9c25f769357812948a032f7809b3bf877f0ba89f3b7a6cea952e6400c2bc19d87c89ae520ca59bba3f493cd06cdfeddd3ce2c5b51f877d42d3b4bf001ea81fe24cbaca54eae7b2169e884423294bee2dc9b4bfc263a58db2d305c80088c5b6f4a992e32d19917dd4b58f06768fd807689d9bf7f595d86ff1ad9f940049fed0e0699957452a5841595e214fb82b70c12c27766ceab908a3135a5caa00c9c5492ad44fa29f21c94efa07f3a2e07fb87ea4f3246ebd81314231d25189000c210c210c210c210c210c210c210c210c210c210c210c210c210c210c210c00210c210c210c210c210c210c210c211dfb21699e71d49997eefcad2a5c4b6d00a9023a6912a30b2796b6a5b485391b1eb49405212ea5ef83864c4cc5f652e200e160a23dda80e6fb0bd9d6d7768d8a0c2b657099b5cb4141acae987b8c330d0094b501df57d72c77525206f2d3253de55d4250b4d2d34f989dc8bd2644d9ea00dd9697e2a364a47151d3a5c9d018c89698f0cd91b22b70f309e30c673cca8200dbdf1d34851fba65ce9654871a96c95c75f857bdd38e92dcc26498b8bf7b0f000f1d02d4a5e0594fd12ecbbf0b9b19b1229b13da8453ed96d22372685d6c8200701c3e6eeac2934385cede456291de7c3598a227abbc9526aa92970f9c186e00a9f0f95299533fbd999dc7c00f24eadc54fc40498b912a2a254a254a51254a0026aa249a9249a9249b93b9bdef8f502592024240003000300320c136602c18006561666d844624a89f26d7c795f5843adbefe74f9e1bc4677b6afc723d73bb00bda10bd3977ec2bdbbf23dbb6054486b31e0fc8eb7e5c336843ec77fe95b7600be0f717b0e835ebc9ef67e59a1ebf5fa7af4e780511cf3f0e9e86f99d1ef08007ddbe9b73ebfae04b12737caedcf205db5be79c217dbeed7f973fae009cb2100a70e418d9bea5c92d0876f5dbece0f66ebc067e2186ad7bdb2b42183b3316b003d80377235cade275844ff007f3fed7fad30737caec5ecf62e2c35e3eb6844007f6b52fe7d7cfb76c0a9f5b58f89b9b1b10ef9fca10c4ef3e8340eecd99b3900b007e5a3864307b5b9e8c2e6fab6bad830e3087dfe34fba76b571049367b7400b30d45ba9cacd6c83203e5bfdfdec7e786f5c72bdef7fab641f23ab421fd3b006df7ebb9c495177e447b7bb6b95f22ed643eff00bf4fbf41258646dc3a785900b4b5afac227e5cbbfe54f3af3eb887cdc8cb2e37c8f9977cfc4184462778f10016d18807cbe45817bf0843d3d0fe36f9ee3f2c46f173cf3176cafe79f1e79b00a1b721f3a8f9f7edb72277c378e7619e9ef33c2ed9bb0843efefef972c09cd00bc5b8b8d75c9df89cf8a2429492149252a49052a048208350411420837046c006fbe0485050500a4a92c52458836208208219ed931391308b6dd4ee19b23e700a4444c644c31933332fde3bf192b854fee898bc1969286e67256dc62199f7800b67fcc984ac42457be898a8f8e6a6eff008593e5ded47f0b9b17b6a2a314d90084c8d8dda45efcd52a8a47fe01c46694cb0135b85cb29451ad465deaf0b1200085ce9f53574988cf50035f5187ca9aea96d2a66761f02baa74ea96cc921463001db9f74d338e9b4c952ecd32a721db538b4414d61bc5132699a12a584bb0130000842165684178c244261e62c36a418b83865a8231f3bb6e3b3bdafeceb13500617b55844fa1515a852572019d85e2484dfbec3f10427b8a849494ad729d150054fbc11554f226ef4b1a59d226c856ecc491c159a55d1591e998d408e858e100116618421842184218421842184218421842184218421842184218421842180042184218421842184218422f1f4778579a66210d98751d11b21929703b0d9600c05424f66a841a83302b4fbd92c03ab1eed4d1409bc4b497bdd26581c838f7007d75d8e7e17318dac14bb43b7a2af67b6714513a9f08dc548c7718940b8335003313bd84504e6b4e9c835d5129d54f2244a9b4f5c7654b87ae632e73a25e6100392d5e047c29e66e7401de320b2590c9b2dcb61e4f209640c9e570894221e000a0219b86601f7686cbcb4b63c4fc4ba96d0a898b7d4ec5c5b80bd14f3afa9400b57d12d9fd9ec0b6530ba6c1b6770aa2c1f0ca6404cba4a1928948de4a1085004e9ea03bca9aa9a10933eaea5736a6a260ef274d993145477884225a42109000948c800c3af327526e758f6d4a5e97e5cc56e2d6a5ebb52b620914a1dd3f3100c4f103833bf8f46046554401534e7b7979fd6df65be1ba65cf561f5ebce11300437a5ec2b7aee474f2f4bf998df1c75f4e76f972e7088a1aedd36e5f5a6c39009dae7ae2778367c45ece40d6df219f9420013b7f5b5edd7ebf861bc398bfcf008fcdf5d09bc227c3ced4a57e401a7af9f5d861be39e6df31ab5985f83b422700c34eb7b5b6d8837bdc9f2f31ca37bea799c8f260dafcf547102bd6fd2db79600fc89e74b6c052a71c47be3931cc5f5f284284f2f3e5f2ed4a7a9ee311bc1d800eaede1993ae6e385bc610a540a72153defbdf71b0f9d39e01573a5f741fa7c00f93422684f2fa1b1b589f2b8ad7eb86f07cfd783e433f367b33ea852bd079000a8bda9607f123a50e1bc06a4b747d5ed6f938ccdaf0801dab5a7236ed51e7700a50d7eade1c78f8b7c8db5d39e4814902b4b7a7afd76ded4c02c7cf2072cdf00cb3e7ca1029e9e63a915b5bd79796f6c37b8e791e0ed7be5e679e57843c37e005e7cbaf9d295bf63d090df0df4d7edeb9422294dfbf314f5bef636ded41be100bc3dbbf935ee34fa5d120579f5deb6a0af23e7ca9cf7b06f676fb91c6e074600cc9b73840279f202febccf3b75b8a75a530de1f3ced97bc8907ce11045397e003f4a81f7f3c0287bd0359ff6d783b422424da97d89af2a72343b76373436c000a85efe5e998cfd39c21423702d5ef5b806b4db7ed4e57386f0e3f4617c9c5e00e39de1114b9a50d3e5e55fd4df00a0dfd09eb6f50d6d435e1134aedd4f5edd00b615e77a6e49c37c0e393fbe3d438f00f08007e95b5093c873db9795b95a0a008663a645b9e99b7cbcd114dfb53ea37ad48de9e7db94ef7db89b35985f2f2d006f6847ab9d48a5198e5b15269f4ae0a6f2b8c6d6888819843b712c28142d0100d485a49662590e2970d18c29b8b847bc2fc2bccbe86dc4e9768367f01daac200ea305da2c2e8f18c32ad0533692b6489a804852133a4a8b4ca6a995bca548a00aa75caa9a75b4c91365cc014295a1131250b48524e60871d7911a1171a463e00758b8579a65ef8acc5a6edc6cf64616a76272d90a8a9e4a5b70f8bff00938a0001767700d289421b0854da1d92c9744cc262e3dbf9dbdb1fe17718d93fcd6d000ec10abda0d9c4954fa9c1f7553f1dc1e59528a8ca44b49562d87c9b3cd94900188534a20d4c8a89726a2be3495587ae5bae4bad199466b40e5fe748e5f10d004100aa2ce31e458d6430843084308430843084308430843084308430843084003084308430843084308430847b39349a6b9866903259240444ce6b317d10d0005050a8f78f3ef2cd80164a10848538f3ce290cb0d256f3ce36d216b4e7e1780056258de214984e11455388e255f3934f4745492953aa27cd5e494212096001005ad65912e5a5532629284a942a4a54b504a41529458001c93efcb38c95e897000d528c84982ccd9bc434f3398f0c4434381ef65196dc29212dc2a544a26534006ebe37264f20310cf78512c612b861338bfa3fd89fe1a70bd8c147b4db6d2e009719dac48975149871099f84ecf4d524143056f4ac4b15925449ab5255494900501270f4ae6d3cac466ef29281325a64e65ccb109cd283a7fb943fcd924dc6005bd175279d875a9f2b9ef6b52d5b8f3f5902d974d797cb8e8798b6c7c7c9be00bd5fdddf9d3aec7911f6056bd460efe1f563f5812de3975eb11406c6bdf7a100bd8f5a8a7cbadb007873fb663e5d79c4c00a577ebceff334e9d3bd8d30776f0021e16fa7ccc2269b5b9d79d6fe5f5ada9f40578bd99b36b78659d8f3061e9000f0f31623cb9f3a541351bf423a5cb79ed9e991b35d9f46e16e7a41fdf5853f005df9dff5f5e783f1e5f36eb6b79c3c62297b827d6a2fcb7a0a5f6e56a9ad0900f2c87a79f3faf3261e79fbf0f63489a0bd0007a91ebdabe9cfad061bd617b30071fdf866d6617871f95bdf9988f0f6040d88245adbd6e69414e7b5852c7eae0079dc9bf36cadf5bc3cfdb72f77e16902fe5b7607ebd760052d7a0c1c701fd200da1d72bdf3eb0f16f7ecf844505bb1b6fe77373d7b1d8f2c378727c8b73b33000c9f5844d295e7cf99351e64f2a0fef815731a8d0717cbc5e10eb6e553cbb500a97247ddb07cbfab667cbef07f7efc3cc447845f99b75a7adee48df6df6bdd00bc79ea32395ad7d38662cef089a0a9faf7de9b74f9ec6b6c01e1ef4d78b74300d2d0f3f2e9cbddf8408a8a01f502bebcabb799dc0b83b7b1c786beecf687d60023c2294b8bd8d6fbf99f3f5eb53897b8e2dc2de961e3627ab42269dbaefdfe007bf5ee7d601f98e5d398cf94214f2b1efe7ea7913cee4f3183f0e87d3fac4300b7f4e7eda141b5f7afad7e5e63f0c1fe9ebea3d3e7130f0dc91f315dbcab4e007cc6f722f40deb365adfa7ed71fb3479ebc3e97e9d38e6237d8d4017e9de9c00ee76fa7205750d7caf7f9e5ce261e106a28057d3ea7b8f2c029b2396973cb200f4f3e1088a0b56848b77bdea29cfd6b726e6f86f6aecfe5c1b837a70b421f3003b0a791ad7adbeb4e75049dfdf16f4e0dce113415d876b6df67ef7c1f4f31600f3e2d7f1cc3da111e1ed5f2b5390b9341c85a9caa696c1c7836ba366cde36800428395ba8b7d46dd0d77a6d83f8e977fa31b365a5e112403eb4afa7e5dbbfa00e0eccedab3b6bf3e507f6c62d5b5b786a9467d11b99b2808691e722151113000de10d4a3323807f3a62929a265b357400b44c9942988a7c2913260ae297348004f26f6d9f869c2b6cc566d36c4a29305dab50995357877c34f84ed0cc0825400e94b4ac37159c52e9ac425349593d4a388265cd9f371195adaba04ce79925900332e4a724acfc92ae7604fea624a8635273269ae5e9a46c967701112c9acb900f5c346c14523c0f30ea391b94adb5a4a5c65e6d4b65f696879971c69685abe0070e2b8562581e215784e2f4353876254139522ae8aae52a4d4489a9cd2b42c0002c410b42c3a264b52664b5290a4a8e8d49521452a052a496208620fbf3ce300d6635f14c3084308430843084308430843084308430843084308430843084300084767c9f93b30e7b9f4265ccb32f5cc26515e2594821b8784856bc3efe3a300a215fe5c2c1c38527de3ce1fe65ada87652ec4bec32e720d97d97c776cb1aa003d9fd9da09b88e295aa225c996c944b9696336a6a672c8954f4b21277a74f900aa4a1018395a9095572e5ae6ac225a7794721c8664936006a4fce32b5a37a200d21d249438961489ae679a36cfefb9fbad212b210127f764a42901c8293b4e00d5e2827e22631011131eb5261e5f0b2ffa95d8e762580f6558777ea32b16da00cae948fe278e2e506900a005e1d83a5684cca5c390bde2b98a6aac417fded50094ca452d1d1f21a5a445324970b985b796465fe94ea0072faaac4b0000acff00007bfdd31ddfbc7dddf8b8cafaf3be7196d9f3f7eddf9c3efbfe941f33e97a009c3b8e1e16d1865964e2c1c92ed0e0f7cbcfd05b3f900d0fbaf5fbfbed1bc70042d776f5d34274d38b41aefe57ea3276b0f3877b1edf7ebfa8b60fa127317b00e8fccb6993e5a917716cff00a79e5af47021e9d3efefe9838b72be84be62ff00003b7220c3df0e47ee1dfae50f5fa57d3faf217e54c013ccb0d4dbadc6872e006de23a6971d7c1b2ebc1e077b0e9bfcf9d6a3a6f5f9d00dae4ea79f41c1f520078e4c4bbefefafadfa385cf2fec39dbef99c1d98bdc753a3017e1724bea59e000cefd7e591fb6766780f96ff00773f9dabb72c1cf1d0680640db4e27d1a1ef00f7d7e999261e5f7d795ed5fd77c1ce6fa0b5b3c859db4e16d06461f4ebe37e009e7e7034fb14a7e5f9f60298825fd79bdc71b8b3797589f7ef4f2fb40efcbe00c7e3bd7e589de3c4e86e5c58fbf66cf7efd7de7c56b436852dc5a1b424556b005a825290375294a3448eb7031724ca9f53351229e54ca89f355b92a44996b900b3a6288b2512d0952d6a205800556b6b000920004926c039249e033e805b9400567d20e1cf886e20626161f43342b567561b8b8a720db9be4bc8f3c98e566900f69450f263b3a3d0d0d93a5adb0b4a9b79d98cf615a6dc05a5ac39fcb8cdc60028e8765e4aa7edb6d36ca6c2cb1244feeb6b3682870ec5152d77404ecf4a550056d24d5cc077a5a2560eb5293f181baa0a8998112413513a4d3d9da74d4a5700c9a502a9b7d0045e321b92fd85bed36cdeb47c7688e51d3e6174a456a06b06004065210a485254b85c9132cf5304100d1685410710b05252680e3acebfb6be00c070c0a337b51a9c5a6253fe16cc6c3ed25692b73be9ef71e4ecc4821c0dd50089c42c3164dc0c35623864bceb0cc37b49a79abbf07982486e05fe515d59fd009c7f6843d0ff0010bcefc23c22fc3e2f8188d4fd5a5c5d69747bc85d047e0b00c5c81f89f00247f311538e387f131f87f96a32ff0035dadce513ff0094c9d8007d92974fa907ba9dda38a82904dc36f1660c22c1c630d767ad363714f240f2003541514cb37fb02bda5595d0e392bc85a47a8496d255e0c8fac52a65f70806008969bd40936414924d07f3bad8bd6e0571b7a0edebf0fd8881ff008fdb4983004d51000da0ecfeb64c90f65154dd9ec676994961774c95b9007c222ea314c30015ff00de66a0bffc6d3280b9cde5ae69b696e51641ac7c0071bfa00daa275600b857d62cbf2c6e1dd897f304872eb7a9195a11860153ae47e67d318cce5249005a50805c57ef58d8125014a0084923b0b02c6761b6bc84ec67699b07b473d500344a97872b1a56cc632a2b608eeb0adb2a7d9ea9a8df53202684561058167800cb95369a7da9eae9e6976ddef3b959d07c13c4a2a7ff004ef0f48b3d878a87008b47bd867da7dbad0a9a712b0957fcd5049252a1b292ba2924104541a6d71200c2f13c1e79a4c5682b30fa94e52ab29e6d3ad4904a77e5efa52264a71f04c9006572d60ef25441062e290b429969524b64a0478b117eaedc338f3fd3cfd7f100e4797318c07e800fd98647260e5b4e77a1b4eb9fadc64ee5baf843d7efef7300d7a540c46f1cfd6e6ec79e798bbd9b85ccf99f0cb5cf8dadec8653af9fcb6d00fb8fd2f8390ff17ee727b72bb9f5ce27fafd6183f33e377ea0e59db3bbc47100f7a367c7e90c439e26fc0b7d3870b65c2261d2dfd7fadc5ad4e789059fc472001ae8f627401b2d1c4479f4cbed0bff005fbbf2f4e86f83e61dae78fd1ecfa000ceee7230f95b3be5ebe3c5b3bc3fa7e3f75b73f9378b1be6feac33b0f4b3360045a0defcefc7aff587e1cfee8712ee741abe57b3ea33bb3f4b6866e27adfa100cb4f0d49bc4fa72e9d29b9ef53f879439e22cdf37702c3462d63eb0c985f5e0027ccfdfed11cb96feb6fcba7e7418805bf63974bebaf95a27dfbf7e621f7f700f75c4bfa391cb3e1c6dc05b2b98375f3f7e79f387cadb7ebb0c43b6a72e9ec006bede1145b59745a43ab728692f2db95e689636efee49fb4ca4ac25695132a009b04a0bb192775e3ef92807e265d12571500b4a622630731e91ed93b12c0bb0056c344e065611b5941297fc2f1c972920540dc56e61d8c2508332ab0e5af7400a26201abc3d63bea52b94aaaa3acc3aaa4454877dd9803256397f2af521fc5003a6a158a7ce193b30e449f45e5cccd00b809942f856054390f170cef8bdc4600c0c4a2adc541be12af76f366a9710ec3bc96a2587d86be5a6d46cbe3bb1b8d00566cfed1504dc3b14a2501324cc652264b53995534d3904caa8a59e91bd26700ca5290b0e1c2d2b4a78f4c96b94b289892950cc7c88391074223ac638fc51000c210c210c210c210c210c210c210c210c210c210c210c211da72664d9f67dc00c5019632dc288a9947ad5453abf7309070cd0f1c4c7474414a843c1c2b60ad00d584add70f821e199888b7988777906cb6cbe35b658ed06ceecfd1aab713c40066f7726583b92a52120ae754d4cd20a6452d3cb0a9b3e6aac942484852ca5000aae5cb5cd5a5080ea5161c3a93a01a98cb6693e93e5ed29cbcd4b256cb51530098a6db727f981c6bc319368b4f89440f12966165d0c54a6a025ed2bdd34d8200f3df111efc545c47d5cec93b24c0bb2ac09349489975d8fd6cb9671dc74cb6009d59381defcb536f92aa7c3a9d67769e9925256c2a2a02a7a94a1c929a991400c860c5647c6bd49e038246835ccde2aa1e56e54e7cb9fcfa77a8b9af6e3b7300cf9f1f5b1f18c988fbfbfbdadb60faf973f3f4f37843f2a589f9f2f5a7f5380087cc7b7f0c9b22e35e9087deff00df6fb22b5c1c5ef967ab756f7e508003b700d7bff73b9fae25dee78b69d34f26f0684283bed5f5fd3f3e9be21fa3736e3c0079d88f9de10dac0fd49faf3fc3124ea7ec3ec2113bd07e27f5b0fd6b887f9b0079fcaf6d7ea1102d5fbf3fd397cad8977f7e1f4bfef089fbf98f972bf3fca100eed7e7a7cf30fc1e111bd7ef6bfd0dfb6f897f7d7ef97a4216bff7fcbb007600debd460fc7dfbfb0e108bc7e0cf80ee2438efcecfe57d0bcacc3796a49162100b3c6aee6cf8c96698645516511061261378786898a9ee63799719f83ca5962001a673b5188878b98b729937c4cda1b176b768b63fb32c129f68bb47c567e1d0026be4f7f80ecbe1699151b63b512cae64b13f0da09ca4c8c370a44c96aefb100cc6554d4252952281188d514532add44f91472c4daa594850797290c67ce0500c3a126c9438bcc5eea7fcbbe7e18dbfb83ef614f067c36312ccc9a99204f14001ab10feea25fcd1ab52c838cc8d288ef866da7daca1a4f589ca707028790a8009838acd68ce3992162145d879fb09f76cb5e28dbdfc59f687b452e7e11b0fd00d765db30b4aa41a6d979f353b4d8949ef0ad2bc736c54118cd44d5a591369b000b9983e14a40dcfe1cdbca571da9c72ae6ba29da8e53334927be58777993cf00f784f108eed0dfc9c733d2e96cba4f01092b94c0414ae5900c370b032e974200b10501050aca4219868484866da878661a40096d965b436848094a4014c79700aa2a2a2ae7cda9aa9f3aa6a67cc54d9f51513573a7ce9ab2eb99366cc52a6400c98a24952d6a2a512e4931a624a895289528972492493c493727ac74ed47d5006d30d1ecbaf66ed59d45c8fa6595a1ca90ee62cfd9aa479464a971282e7b9400cca7d1d0108e44292925b876dd53ee1a25b6d4a201dbecf6cc6d26d6e208c200765b67f1ada3c4e60de4e1f81e195b8ad614b84ef9a7a1933e6a65827e298a00484273528004c572a4ce9ebdc932a64d59fe596852d5d592096e718b9cefed00e0f665e4d723a1a0b5c67b9fe3601e7585c369e6946a7cfa1e25c694a42cc0004fa2b2acaf2bc73056921a8b869e3908f829721df75a21cc77fd07e107b71a00932bf8960bb39b2e99a94aff00f19f6e763f0aa8921402826a30efe333f1590013424baa4cca14ce4314ae5a543763689c0b11511bf2e4c97ff9ea890823aa0042cac11a8297114725bfb469ecf08b8cf713387e2132d4185515389de90fbd0097251ffd6a9321ccb3b992514bde5de3a03fc95b63938fc11f6b551bb2b0cd00a1ecaf19ad5da5e1d876de521ad98b25822526b68e8e4cc592c1913d41c87200c445efeced71fd1368e62b44a2a46f126d60a4a41f03f30f7a9a7fed5be04f0051e530198251ac93290e5999a14b82ce3a83a55abfa71905d08092ed75173c006439164247b92b4a5d2bcca94a147c35271d778f7e17fb6dd9eaa9f4355b23004f5d88d3102761380ed3ec9ed0e3892a2425b00c1b1badc755bfba4a7770e20048bb4624dc22be528a0c942d60b1972a7c89b347ff00b4898a9b7ff64742e20003d9e7ece8f68ce5c9866d839669d4c335c6a5c5c1f101c37e63ca7079ca1e006118597d11936cc394bf7a65ccefef510e10983cfb2cccd0c9857627e05b8300887445379fb27db576e3d89544ac031746313b0341099fd9ff00697856255500832e4ca4cc945145418b8a6c4b02992fbd25355b3f5585d4227265aa64c584000966b9188623871ee962619567a6ab42ccb600864a56ca946f654a28208176000d1a917b413d93dc45f00b11139be614d61e1e62231b625fad395253110ae60058545c43ccc04b755f2b21c8c7f2746baa6da69acc50b1131c951f111b010a0089c4be6d1824ac7b5fb37ed23613b6992656c819bb37b6f2a4cda8adece71900ac44f9f5a89284cd9f51b118c2932538fd3ca4296a383d52246d0c9934f3e600264e212902a57c8e8eb69b100d25e4d4004aa9662812a66734ebb77a90ff0000a14d343160a178c5d8215450a281014140820820104106e0d6df2e95e48a4a0090a52169521695142d0a4a92a4a9259495248749490410406218b45f2388b800e3a189fd39fe5ebc85ab5279e21dd867d1b9fd99fa0e8879fdedfd7a52d88d00e62dafdedec6afac227b8b5790ada96ea69f8d77e44cbdb4b3e5d7cc9e5c6c00211183fedcfa421d3b7515b8af5dbebcf00781eac74f6210037fd4f2a1e5f900dbe583fdb40fa59d83faeb081bf21f7fdff21416c01cfc8fbf5f28448e7b5b00efe7b7235ad4f5c43f969c4eb937de10e9b7d9e7f75a60e3886eb088c09035001e25b87d3e9c61137fa72e86dfd3fad7070fef3e0def93c21fa7e237e7dbfa00723f47e0fcfdf8da114b35634a32eeabe5e76593365b859cc336e2e413f6da00062e531868a00f84a15132e89294b51f2f7545a7db3ef992c473107170fd4b00dae76498176ab812a92ad32a871fa2973158163a25bcea39c7e3fcb546eb2e00a70da95009a8a73bdb849a8a708a8425471aa699152862c1607c0bd41e078a004ea34cc5e31259cf26cff20e628fcb19921042cca01693e26d7ef6123219d100e3868f8188094888838a6e8b6965287507c70f12cc3c5b2fc3b5f28b6a765f001ad8dc76bf6776828d54589e1d37bb9d2c9df95350a01726a69a680133e96a002594cd91353652140282561484f1b992d7296a42c329258f0ea0ea0e863ab60038fc510c210c210c210c210c210c210c210c210c210c211ece4d269a6619ac000492490311329acce2110b05050c82e3cfbcba9a01608421214ebcf3852d3000ca1c79e5a1a6d6b4e7e1785e218de234584613493abf12c46a25525151d3a7007e74f9f3941284245800e5d6b514cb9680a9931494254a1294a96a0948254a0020003324e4232dda27a332ad24cbea6bc68996699b21977304e0b484a43810009526512ca51d6a5104e54a56ea8bf318a2e4c2212c36a8397cbbeaaf627d8f0061dd95e04553ccaaddacc5a54a998e6261082242590b4e0d872c24a9187d2a00c6f4d59515d7d5a55553b765228a969391d252a69937654c57eb57001be14f002073e26e5810135a8a76a5af4200dbbd77efe447418eee7be6f978f221f867009e56e3195bdc9871240bdadd731e1e4205ea4015201a7e343414e5b6db0be100bc435c9e39f971ead12e5b2b80e478699ebfd490444784dc7304721fd856b500a6d635186f65eb6e97cee79d8f03ac1f8f8ead9bf934494d09b8aee3a5af4a005283e62ddac5bc6dc2faf327883af1bb4017bdd8ff0046e3f4e700012aa74b005491cafb76adb7e54ad68de3c85c5c0bdaff003bf583e5cfe5c7e5e6f0a50f0023636b914adb99b52e37da94ad0e0efc8666f99d74ccbf3e761691d1bdfbf900c4f86c0d2be5cebb73bdee6bc8f414c1cdc027ddf5cb9b666d7887bf83b9b60046fa7be4e0c71a57e74a5091de9b1f437ef5c1cf13959edabf12f933f8189f0097bf79c7229040a6fccf53dc8aeddebc80380511af87adb40fcbed10ff0030003cfab38e6223c3d46e6c45697bdc6f6f4e753890a25efa7be0d9f9861c20fa00e9efdeafa42963cae05297aed6ea4efebbd092697eaf77bf1cf4f57307e5a6006f6d73e5cda0526f61db95cded722db6f4f5c55bc4645ada5dcf3b0cdb573700e713ef8f4f790bf58c9f7b2f7d9ab9c7da15aa51eb9b44cd72770e3a6d1d0600355b5020db533309ecc9d4a62a1b4bf20c538cb90cee6999422d1179826c3d00ec3e4c90c4331b1095cde6997e0261c6fb48ed1b06ec576628f68713a5a6c60036cf6865cd99b0bb2554cba612252cca5ed86d2d3852668c06967a0cac2b0f005eeaf68abe5293ff009ae9ab669c7adac9787c94cc58132a2683f97906e18500bbf9c1dfba06c84e735408fd014637e9d25d22d34d09d3ecb5a57a4392e43900034ff28cb9996c872d65e82441c14332d2129722a25cfe68a99cda3dc4aa2e006f3b99bf19389d4c5d88994da3a323e25f8973e606d4ed56d16dae3b886d3600d562f5b8e6398a4f55456e215d34cd9ab5289dc952921a5535253a5a4d25150034b9349474e8974f4b264c8968969e193a74da898a9d396a993165d4a5173d0006812324a400948b0004546c71f8b5183ef6a87b5ee4bc19bffe02e834aa5500a9fc55cfe5d0efbd2f78ae6795f47a5d366bc72b9b6738196bbf1d37cdd3580075b71b95b20b2e424444c13b0d9867cfc2491f9542e62f54761bf87c93b6780070ed07b44aaadc07b39a7a89b270ea7a5dda7c6f6e6b69140555260b3aa50600450e0945301958ced1cd44e95226a578761f26ab1213851eeb0dc2bf3091550054a54aa404ee01699505246f2504d912c64b9c5c020a500af2d5b273c2d7b5001b8edcf4bd41cf3a3bc4eeb66699badd8985cd7a819467f97f284b5888507000c1e567b334265cd3cca5264d1221e53969329804252928616b2a52fd535bdb005f655b0184ff0067f02da5d89d81d9ea6dd97fd9fd95c429cd554142373bdc0066750cdabda1c7eb55754daac627d64c3314a281253ba84eed588d051cbeea005cfa6a69496feea4ac151d3e329de9b355a9330a892e7e119570917b057da700f3af76a88d0394481b5a428393dd5bd256fc2084d12e332dce7328a4280249004a98052010aa2804e3ab6abf14bd8ad3b846d5cfaa2091bb4b80e3a78dc2a70061d25043ea165ec5c863186ac770c4ff00c793fed9534ffdcbf51fd3bb1fd900e7f695068b8323e97958493ee06ace59f7ab37fe449510c05721e27928adca00c6f8d5ff00fcdaf637bc13fc531b676df38156ee876054e3e26d7f4f16075b007fda0c39ff005ccebdd29beb6f6d1efb49bd9a3edace08b35b9a87a23a4f3b00824c3b897b31e59cada87a659d3236a040368ff3e579b74de1f3aad7991a8a00860b846e358933399e5c141c91cca062d0c3a396aff139f87fdbbc3e5ece6d00d63d4f8fe14bf828e763186e3787ed06cecd514eed5eceed3cdc3bbec2a649005244dfc94caa9d82d4a8ac56d0cd13664c17178be0f5a8ee6aa626620d92a900889889b28e8a9538a0196412fba5465aafbe9209319aae1c257c3d717b2f8f004eaa70b73be1238bec9309031ba9994651039cf873d64804c7baf43c167aca0019fb233ba779fb3769acf2670918253347a61170901346622533863e390d44004c3816d7e33b69d9f4aa2aed92ed22476a1d9363cb9d2b67b10c4ce15b73b3005de53a50ba8c031cd9dc7918f60b83ed361f2264a1574c8912d5534aa955b40013a6524c1dd6aaa665650eeaa9eb7f3b4134912662ca2aa4b862654d93384d00972a7a030527746f27e2412936cb4e5e6a020723c1e9ce6a445ea26596f2ea0032b4d5ccfcfa336cdb33ca3e044ba2919ba2670d3cce687a670be344ddd9ab002e2e685e7d71aa794eb9e2f32e2089d3f1a9bb41852a56cfe24aaf389d327000342b0ba5c36afbefcc4b3854ba4521786229e6b2a9534ab48a508409210129006d577ebef0cd0d2d456563ba1dd84125c77612c1013fca12cd66368d393daf00beca783e12a39de25786f96c5c670b799a6d0d079bf2831f1d318bd02cd1370089533064bae262221bd2c9fc72d88195464c625472bcfa321642f441974ce400447d02ec6bb5b99db2d1cdd99da832a476c184524eaba7aa48914f27b4bc22008e505d4ce9325065ca5eda61b4e95d555c8a5960e3b4126756a249c429aa8400de6586e22311419530a456cb4950361f9b4a4392d61dfa4395001e625d4dbc000be0aa95a11b5b6bee7b1de94e84efbe39fb9cae0f3e39177cb33e77e23381003c3c7e5fd34f2313e1ad4537b8edd8f4df6a73e74c1c8b851cb5f0ebf4cbcc00ff004f52d105372074e95adfb0e84569fa9c028f12f9b3db89e19decdaf18300e5cfd0f0ebef3b104837af7b5c53e877ad3ca86bcdbc417e16b656e96f768300f2f0d7a70f5d6ed0f08bd05af606f6a7235bf5a7c81b13970e785efc3323520038ebcc41c7eece1b896d3de57804f5b117b81fadc0a6d6a56f6ddbc789bf0300e238e5f2ea60fc2e395cfc98789789f09b6db539d295aefdfcb7d87307cb3700777776c8117cf2b5f2b183ebebf5e9ae7114dedbd284ed4269cb63cc74f4bb007ae2e79b5f5275fdfd48812dcf8f2b137f4e1d61cf704f9545057a134a817000073a58570770da75e79d99cf526e0939c1f9306773f6f79400a8e808f96e7a008a8e7f9d8d449faf17d18db36b1c811e64e1dbdfbe50f0fd7614de9e54a7950041eb5a5c5478f4e57767b1b71bf2ce0fa7bf77bf996710f08a56fbd0d76e7c00c795bbd2a2f86f66343f3d1ddcfadb436107e8c59b898786dfd294e54fccef005a015ad096f5b816bf3e77b93e2e331a807e991d6d6e6def870a29ad7a332a00d5bcbe1af1a25d9a652879ecbf390d21492b2859549e6962ebb288d769e25b006a0fcba28351f0e1f6c464be63d23db6f63d8776a980854832a8b6af08953600660789ee200a800294ac1b1159014ac3aa9677a52c282f0faa22aa505ca55500d2d66255d28a945984c47e8571e28559f74e6381be4e0e24a75269a65d9ac700c927703112d9acb22170b1b05128287987914b1174adb5a4a5d65e6ca9a7d9005b6f32b71a710b57caac530bc4305c46b709c5692750e2587544da4ada4a8400eecd913e4a8a56850b821c3a5682a9731053325a948525478ea92a428a540800524b10743ef516398b47acc604530c210c210c210c210c210c210c210c210c00211945e19f447f8024dfc5f9960ca339cfe1825985884a0b99724ce7f3a21100290545b99cc87bb7e66a59f7b0cd261a5a96e19d6e6422fe917e1bbb191b1b0086236d369693776a718a6070fa4a8420cdc030a9e0a92374ef1918a6232ca50075654d3a9694cba052644c5e212a6ef28697ba4f7ab1fde287c20b7c008700003ff312c55a81f0b5d422eae9bf4e96fc3ebe78f5515f5d59b5e0fd0817cb3000cd9ec4dc83d430b16bd9dd9c6a3e621f7b77dbe586f97e9d41b8cd816f76e30000fec1bb872cccec5ec45b95e14eb4e54eddf9fe1f961bff005f21c872e62e000b9e2cf89177195ce619bcae4b9bf1853ef7efcfec72e586f5b9ebf2b8b96e009cb52403b9b024fa58364720c5d9c1367cc188e57afe07efad0f974c378fcc00e79e8c2d6c8e7d4dda040041393ddc1cfc5f363c49d4dc1134af97437aff00005af9db7ea1bf6e77b5ed7b17cfc3e5ab43af3162f73c5cd8bb780ccb2dcebf002afe7f2fcb1014459c9e3a0c9b321fc6df5880cfa3b317704961e398b1b1cd008387853eec2fcec37e7ebd2d89dec8732f9f4cef9e767eba938622f9f366b3008b8cc0e2cd63c6229eb71e971f86ff00416c028f1d3875cf363a9b101afc22006ec73e02cef63a0b6a327767600189a53a1e5506bb76b52bcec36b5b0dff00001e5971e5978f89bb09e2e1f880069d7996274639c452fbed5bdefb7913b505007d700a2f72347cb8f1f9fa5af03604bf2c806e9a3872ecef90689faee3e82e007d7a7cb9e016793dba5fd436b9f51a83e4d7cafc41cb426d70e4bf1ccc55ee001fb42f3d7137ae1a63c3fe9a3095e72d52ccf0d20848d7901c83cbb2665a7600639ab38ccd1ef1a2a9564fcb30734cc51eca166222db97881836de8d8a8661007968aec1b03c271fdb2da82b4ecbec6e18bc671844a5aa5cec4669988a6c230067e91612addadda0c566d2e172261dd4d3a274eab98a44aa698a15154b952e0064f9ce2553a37e637c255a225a59fe29b31909c8072a7dd05fe927c33f0eba006dc28e88640d05d2895896e4fc8527440b6fbbfcf329fce625c5c6e61cd73d00885296b8b9ee669d4446ce266f15fba44445985836e1e021e12158f959da1600de63dda5ed8635b67b473933311c62a42d3224a44ba3c368242134f86e138700c9484a2461f85d14a914549292907ba921734ae72e6cc5f08aaa999595132a00269f8e61761fa5090190848d1284809038073724c577c70b8c78b61e2cb5b2007da35a69030da772d85cc5ae5abb9ba45a31a0195631110ec14df55f3caa22001e53369e370ac443cde4bd3f9442ceb52b50637c0db70591f27cfde310cbde00e09ec5eccb64b0fda9c7aaaa768aaa661db11b2184576d96de6292952d33a900765b0412e655525099ab972d78ce3f57368b673009054553f1bc5e811b8b4600f88caa49289b314a9a4a69e9e5aaa2a5619c4996c4a52e40ef26a8a64ca0f7009931218c546e187839d24e1ab29caa1e53972459bb57a393133ad51d7b9de500a9339aabab1a813e7dc99e70ce799f347c23b3a519cce6262dd964891305ca0032bc904bb2cc8d885934a60619aea0ed4bb5dda9ed47682aebab6aaab0cd9b0095ddd06cb6c4d156d4ff0067764f67281229f07c0b0ba0df4d30451522258a009abee135389d7aaab14ad54cadac9f357acadafa8ae9aa24a9326c9914c85200bba9129008972d0876f853fa94ceb5152d4ea5131778897c6382a987700ffa00746fd68b292479038eae12669c907c593f32231934f395712d4dcc6efa163e0091e4fdd71fbfb8ff00fb8cfe1ef2b89fcbceff0027fd64ff00f5455f959f9f0077ff00591f2de78f1ae5f1a815543b87fea00e1f936547e98832668cd07c19005ff6498a4d3ce48732d5e0ca3e4924fa47e552168345a1483d149293f2206200d9046608ea1a2d1046608ea08f9c7e48a83838d425a8d85868b692a2b4b71400c351084aca16d15a50ea1690a2db8e3654054a1c5a2be15281bd4f555548b3003296a67d34c2374cca79d324aca7792bdd2a96a4a88df4214cedbc84ab34820000919123a12229fce74c2433105c979724f1054b592c03110ab2b2090a847500c4fbb0920fbb4c33d0eda02940a1490808e6f84f6878d50b22b823159012840081388935290870e2a65cb256a5023bc5544b9eb514a485a49595dc4ce50cfe002eb63e63ed140b50b4bd11b97731e4fcf197a5f9ab22e7092ccf2ce679546300063f2fe60cbf39835c04d2533661412a4311b0914ec3a90fa5973c656e41ba0056d25e4f706cb6db52d55761f8ae0389546158fe13574d8961d312b14d89e100f5f49384fa6aba3981453317266c94cdde90a98909dd4d421216659cc91505001311364aca264b5256922c52a05c1e771a131f3dcf681f07337e087893cc9a0050911b1da67981a773be88e638df03af4d74fa3e2d6d09147c425f7cbb98720014c4b995a70ec49878b99b30d2bcc8a8487859fc283f52f03daba3ed2b637000ced0e865c9a6c4aa2a0e0bb7585d3ba65619b612a499ebada694a96812b0bd00a8a54ab1aa0952953a4d2547f12c304c06892076053d522ba9a5d5a193314700bba940ca5cf48049b0b2272409896b075a5dd0c2ca282f43f954d056f63c8d0039f2f2af78dce448b667a6acfe02d7e46e7890da3a9ef91d6f70e188f9445300efd6bf7d682a70de3c746701ef6bb5add46658388076b3f0391d069c41033c0081bf29a01d0d6f4e9dcedcc5799f4c378b1e2cfc865c8b9737766cb9c1c80500c33102dc33b06390bf4e710457727fb1ede43f1deb88de3c8faf005f2003e500c34b110006767bbb87eaf97a805ddbe1b43f5fc3d3efaed89dfe96f32de00500f3d0f230debe4e097196b639f5b904076c9ee207d4ed6ebdbadf95fbe1be6e002da6479f176f46e360440ebc5f50332030cf3fa3b86689a03dbefd7d7b7a60001441bdc7937d2f7b3dc8b5b39c807bbe6f6e7ab87e02daf83ec53eff00b6050045c8ebd6de62d773a81c60ce4967d0b372cdcdb51c5b510a53d2d6dbf2f9f3003b93be1beda83e7edbef603214b97258e77e2ccedab7810cdfcb0a7adc0bf9009a1dbcae761426f5c3785b3362581c9dacefd7a3861139e84d8e6e0e8e086d005f41d00ce2282f4f9dcd0fcc11b9f99a6f5c37dd9ec0bfeda1d41d3cc40bb000b3366c43676e4e08e3a31cda269bfebf9dfb914ec0537c37c30f5d7c33cf8300e972e6009d398bb3bd8bb0bbe7e17b9ce29cf9f53cbcbec6e7d6778fa6474e00bc189616f8bc8c320330320daf81362f77e1997cad53899d1239fe4c3376590083f1e729043a83f0cc0487331c99145ae0ca0d3decca5bfe63f2c52141d8860057152e52229c5cb5309e54fc48f63636cf0b5ed9ece5183b558353135f4b4d002d2999b4184c91bca05218cec530d9614ba32099d554a2650013e6a30f952f005f5f4bdea7bd427fbc48ba400eb480e5dadbc039005c8b5cb018bbc7cdd8d1004308430843084308430843084308430845e4f0a9a34acc9366f52331422ff700048231272ec3bc92844e27d0ab0bf8e483fcef4048dd4a54149019899b06d8000f3825d318557abbf0cfd918da9c613b71b414a55b3d80d527f84d3ce4912b0017c6e429331130a48fefa830a504cc9d94aa8ae3229899d2e457481b0a1a6e00f15df2ff004215f082df1285dd8e694f91530bb111926ad4f97ddbcb63fd2f00f464a8303ec6bf2b8e3a3bc6e9cb339fdbe67a7ac3a7f6fbfbb6f8a4ac78dd00b23d323e3e8ee21bdebcdefa7316201be4fae526df66f6e5fdbd312140f02600cfe3e591e0fa7483f1e2e41cb8e4e39db22f7bb4476ad0f9d37b7979576389000a07c8f02036771124b9b387b972001ae9a8e26f686d4f4eb7b11615f53f3e00e20281f9f0005b3bf36eb14bfb1c1835df461f52e22683ecfe5b61bc34d41c00f4e6470d78f00625eef9db5d1b8310dcb26d2e1e20fafd39f3db97af3ec03700872eae38df2d7519bf2897d1c3170f99bb3e4c72e39b17bd84f95fd7d6d53400fba74c37b8b0fd8906fae560cfe1943df36ceefc88f3ff002ddee03981f97c0086ff00af2b53e630dfe5f7f47d1cf46e302a3637b781beb6fa0e0ef11f3ec600a2f5bdbfb6db61bdf6b966e239dce6035e0f97225af61ef42fe36b3d7b75fd007eb5efd71014fc35d78741c1cbb373bc1f89ea73e59b1bb644580e70ea6a7f001ed6143f4e95eb890ae993e6dae4c756e7f389de372fc2eef67c98bbb5f51600bd9eef9fdfd6df3f5c4ef0d18d9f316f17f7a90f10fc0f07722ede2fa640e400066e236d2fd9b9e15532fcb1abbc6666895b898fcdd1afe8be9144c5b1e14a00727e5c8b8498ea466297297e2f7adcfb3a312fcaa98b6c34b65cc85368649700198d714bf37fe2df6bff008660fb17d9550cd099d364caed0b6cd08992d5300057e29227536c7e173fba6dc4d0ececc9b8dfe5e6aa62c2f69a5ae6095324a60054bd4e393f725d3d124dc815551c779608908247f96513318bde6e86c3697c00786238dc30845a9696e5a82d77e3cf3c67899a951f93b828d3f95e9965197b00f0edfc235c41ebe49a033cea4664617e2f78669943433fc2ecb72698845588002d5ccff2b616d7bf8f0ff616d9d6ccd8fec3304d9f92f2314ed931fa9da6c600274a9aa4cd9bb05b09573f05d9cc3668dd6fca62db6dfda6c4ab29f787793f0065300a95ef777277362a9611872259706ba699b30a4b1553d3932e54b57fa10073fbd5a92083bd265139346501a61964785a6d0d8ffa29009f356ea3dc927100e634a129b2520741f3399f18c44a1080c84848e43e6733e31e5c551543084300084715a10b1e15a12b4f45a4287c88231040362011c0878820283280238100008f231eb1f9442bb52d82c2c926a9a941f3413403a0494d316174f2d4e43a0f002c9ffda74e41a316651ca5394ba0f2ba7c8e9d1a3d144cba261aaa527c6d8f00fce375200a13fcc3fd49a52e48f0836f11a8ae24c92b97721d3fe619788cc700cb998c19b4f3255c8de4ff00992e46b9d9c657d3998f5ee368750b6dd421c600dc4a90e36e242d0b42814a90b42814a92a49214950208241041c5085ae5ad100325ad52e64b525685a1452b42d24292b42924292a4a8029502082010411163002ca3081edabf674c77173c2ccce7ba41207671adda231f11a95a6d97205a6d00c99e64876e1530b9f321491461e2225e773765b6dc8895c8982db933ce123c00aac3312cb684c3abdb3f84efc41516c66d94dd93ed06bd149b15b7d429d99c006f1c9ea5a6461158269a9d9ada2c48266ca4046098c7702aabd4e89183d5620086a24cd13264d8e41816269a5aa32aa14134d569ee272c964cb53bc99cab80003ba98c14a2e04b54c70738d03a652b9a4963a22553a964ca4d35835fba8d9500cde062a59338278a438588d808d6988b857929524a9a88690e24100a6a40c700d0c2a405cc4a26c89c997326cb3369a7c9a9a798a9331529664d4485cc9339001be8504cc94b5a1603a54410639912320a7009b82950241d142c438b172f66001947e0eb7fad853eef88de22c45f87c9cbb66e06bf582fafa177ccdf3d7ddd00e1f9fdd3d7d3e7b8aafc835f9647c8f524e9778a89639db91b333585c3750400b364739ed5bf5dbd7a61be3fadbc7cbe5cc440397d4e5ab8e1a37c8bc46e770036b53fbfe37b569d70de1a90fc1c3fa91eadc19e0fc09cf5218f9f372e470d00627f3f3fb1f7cf02b1d2f7b0c8ea18e5d1fa341df5232cb2e161d067e0c338008fbe5b733bfdf4c0a85bd7a316ccb3e5ab35c30c8f9fd6da30d5cb8393b00f0062224fafe3f80c3781c98707f57e7c03e9c19cee43d83bf11cedcd8d8f1d3300881cfecd79f615b1e5b936386f0d383f0e5adbafa3c378f17d58f8b8766b8e009cb811e5e7d69fa57cb13bc34bb70e19dce5d2fc9f363b91773e593ddcebc000f47724803f3debbfc81e46a05bb1ae0ffb737f67c898746376cb8b30716bdd00d986772f122febd7efe786f0b039f0f1e6dcfae99c1cdae74b642c73e1c8590085ed6731b036a9e57efdfec72db11bc1c70fadbd3470f77d03c1d9cf1e674600cd9b373e39335dcfef97d06fdc91f46f0e39e4ee3e79b5fd06b070f6e2e0bd00c67fd5b57b97b8c6cf159a37fc35365ea3e5d855fee1cc1187f88a1da495b700289fc52d4e7c7507f3b5013b70a94a2a0a6a1a6def592f34998cba111f39bf00131d918d96c5d5b738052a93b3f8fd528e2d4d252552b08c6e7954c54c1ba100a550e2cadf9b247f874f5a27d3a4ca953a8a44696ba9bbb577a80c859f886700baa37776c9598e05c581022cdb1e528d7c308430843084308430843084541d002fd3f98ea667494e5580f1b4d442d515378f4b6e2d12b92c214ae3e35c521a00792dafc2a44240fbf4a187e67150308e3ad0880b1ccfb3fd8bc47b40dabc2b006670e4ac1ac9c175d549415230ec324a92aaeaf9a5b740912491292b2913ea00974f4c957793d00dd912953e6265a6ce7e23a2523f528f41e6586b199b91c90025996e4d2c90c9615b82954a20a1e5f030cd8480db10ed84254e109497a21d00214f45c4ac7be8b8a71e8a885b8fbce2d7f5db00c0f0dd99c170cc0307a74d002e1b84d24aa3a4949090adc969f8a6cd52529ef6a2a2615cfa99ea1bf3ea26004d9d3095cc513c913284b4a5080c948601b3035393a8ff00364497372498f60094ad3cab7eb53e80dbfad0e36ef9b78fdbc5fe513bbd78331b3b676e7c33b0007ce14fe9e7b917f335f3ef5c4bfc9b33969fb69689ddbf85875eb66cc80efd000bc286a77b58f417ed6ed5fb27d327e1adb2d6dab75833364e40d78bbf571c003835dc3c84934ef7dc8e74e5b5fcbe66f0e395b906e3d322fafda377d33e190039032c868e0f4bc47dfd7ec7e383f4b5bfaf3bfc9a2776c5f3e41fc09e3c9c00699da200e5f53f5f9fd4f235bc93c5bed9d8676be5cb4688ddd380bd8e77f000e17b0eb1ca96a7323714afaf21606b6b57e50e05d87afddfa44ee8e632fe5300fbdcf85f94453d7d3d7f2fa5712fe0395b95f8feec1a1ba327cdd8b1e2cd9800bf11cf5cc29f7f7e54ebd307f1fa7b7814f3d0e608bdce4d930cac750199c0006d41bfe3cffafcf10fcfd74cbf68821ace01fbf3e0ceec395cb32879d77bf600f4ed6fcee7077e1f7e7cdeff00d044848e23afef9116b64737c9a14e77fc7a00d3efd06d897caf965a7bbfdf330dd6b59c0d012faf01d1c7373908ec79772500672ce6ce665e4ecb933cc2e652ca398b3c660302c29c8792e59caf2e766335009c4d6249443c0c0b286db8669710eb6a8d98c540caa09313338f82847f270d00fc8d4637b3d84d7d64aa44e3d8f6118153a94a099936a313ac954c9448490a0054c98896b99394c95264c8953aa266ec99331699404779290a56e89b3512c3009ccacb0003392c4ab2609ba86eb98fa50f04ba0f2fe19784ae1f343606051200f89c83a5f9620b32a10b71cf8bcf5338144fb50a6ee29d52d5ef6779e66b980066eea010d32b8d532c21b61b6db4fcceed876ce67683da86dced7aa60994d800c6d1620ac2921294229f01a39bfc3f67a8a5a5012912a8703a4c3e8e5db7940089014b256a528f0eafa835559533ddc2e6af732004b49dd9490d664cb4a53e000f9c5d263ada312184228a7b3565ea8fe1da79abb190c113ae22f5e75fb5c200363d577e6997330ea9e63cb9a48fbab23fcc6a5fa1d94f4ca4500a154996ca0060c82a24ad5c8ff11f53dcf68749b292a63d1f67db11b09b1522406dca5c43000fd98c3f10daa4240fd2a9fb6b8a6d2d6cf06e2a6aa702c0048dad7fc339120041f869a9e9e401c14994954ee8f3d735446854632078e848c2861086108610008610861086108f5119296def138c51a77729d9b59ee07fa09ea0509dc5ea3100a6d3a55743255c3f94fd8f3cb96b1873a912b754b642b366f855cbfd279e5c0046a3acb8dada594389285a774a850f9f420f222a0ee0e3054929252a041198003eee381163a46b14952094a8104687ddc731631853f6b17b23f22f1d99463b005374d2125192b8a6cad2971524cc486588095ea9c140304c364ccfaeb61b4200e314db6984cb59b620aa2e4abf8797cc1d7e4094b503e8bec2fb79c4fb32af009582e31327e23b135d3c0a9a42a54d9d824c9abf8f11c312ade2258528ccac00a14322a06fcd9294d51de99b7c2f145d1284a9a54ba659b87732893fad0fa600aa40b1cc32af1a0a67bc899c34cb38e63d3fd40cb737ca39d328cda2e49993002dcf211d819a4a66904e16df868a8674022944b8cbc82b622585b5150cebb000ef34eabea36198a61f8ce1f498ae15594f5f8757c8454d256534c4cd933e4400c0e95cb5827894a92596850521612b4a9239c21489884cc42d2a42920a542e0008e360dd357b671d529db71b6dced4adcd6dd7a0eb8ce71e5af0d5b366d7d6002add07ebcb317cdb425ed9b1e11fd2bdbd2bd6d5f2ae278fbe1e7efc6775ae00e33d73b68dadf301f2b3e50a5ebd2d4341f4dfef960f6faeacccdd1a047073006cc6b6be9e39977619d94dbe9e7f7cbc8f4c43b7935f87f488005f561a7a9f000f5e90fbefcfeff4ae113bae6c0fdfc747c8381771982f34af9501bf2ef63d007cf6db7183f47bfa8cbca200e3a799e0c2c6e0b871a7076823a5bc8fcfb5ef00f62b8973adf91f76cb486e9b73d35e37c9beedd600721b935fa72bdeb4a5080017db7bc1f90f2ce27773d3a9be5ab03959f217ccb830a53fb83b0b9b7e7d3b001c1f8fb73a69e1cfa402797272e1b47b81c6c3371a650e5fdebf7e55e9d06100ef84377cb8b7a8605f2b5c3bdb3ba9bf9ec79529f7d6b538973e41be7f76e9000dd272b7ab900e86e1d8b38b5efa400039d6dea3d48eb73f74124fbf2b727d003ef10c3d2cce5edd2ce41372fa30ce3d54f6472ccc9259a482750a88d95ce200062202361d6127c6c442148529b514abdd3ec2bc2fc2c4a13efa1625a6621800521e690b4e9f68303c3369b05c4f00c629d15386e2d49368aae52820a8226a0059336529695895534f3372a296781bf4f532e54f96d325a08854b4cc4a90b000e95062f98720701f15dc5ad6502630cbaa1a7f31d33ce936ca91e54f370cb400454aa3fc0e25b9949e2c1720231b538cb095b81017091dee52b61999c2c74200b4eba987f78af913da06c5625d9fed5e29b318902b551cdef28aaf714997880061b3dd7455d29c0044d95f0ce4a0a9322aa5d45315a972171c6e7ca54898a9006ad0fc259b792725373198d0b8d229f638645a861086108610861086108cad00f0b9a5a3226446b304c9909cc99d9a849ac4871a6bdf4b649e05ae4b2d4ba90079e5255110efaa6b1c91f0af07e361e023a143f286d67e947e1afb381b1fb2000368f1290138fed74a935644c4244da0c100ef30ca3042e66eaaac286275360092b3dfd2d2d44913681e3794327ba9456a037e6b1be6122e94b73b28e4f91b0088b9b23950ded5af2b9e7fa73a571e92de23e6cc05f9b7bcb2d33c12de2ecc00cedad807bf3d35d38d01ea6b7e7cf993415aff002d40da9bee713bc7965ab0006cec06845f3cc7839db30cc3276c9b2b9622e4139bf38e405450daa6b437b50036e5403a72e57a110ec5c7476639e7adcea4f941efc58696bbe7a837bdec7a00c71526b7e75d8536f98a9a53bd4f422921472761a7cb320dbe407177949c86008c73c9db306f9deeeccf6e33e11bdcd79d079f2bdc5479f4a0c378f27ea7a600ae33639f89730723802320e7336d6d6b11a70b171253f679debbdfadea083d0006202bdf8368de0c4373887e9c59b23c85ae1dc1b7072d11e1da805c509bd800ef71535f23d81389de2d7e2fd464c32f31ccf53b3b9cae06841b5ac2fcfa9e0030f08b56ff00403ca9cc9fb1605bc74e7ccf8be807bce1bc731966d997f11900037b69e2d14363436b5e86c05adccdf97317e6713bda3e7a8b3126f73703c000e7e10717722f9338b967b9761c6d773d239016a8e74d8529caa2a2bd4df7af007c5254fe0f9937b93a16e1970176812e58b589ccbe6722c59b2b68dae51045006bbded5a74a5ed6a1bf4d8505462428f2b7419fbb30b3dc81683e5966f620500cbf11a59ac58665b28f0ef63f4a023b6e7737209a5280e0547a58fa8cdf4c800586a0bb41f22e3326f9977bbe42cd6701f321a2aa689e8aea3f10faa592f4600b4972e45e6acff009f670cc9a432885484a42d695bd193198c5101996c964d0000cc4cd677348a5220e572a838c8e8a710c30a50d26d1ed1e13b2782e21b41008ed5cba2c2f0ba7554554f985dc02132e4c9439336a6a26a91229e4cb75ce900f325cb96379401b73a7cba796b9b314132e5875124b06c921c1751364b5c9200006ca376586f6726977035c0ee52d09cb2981cc1ac9c466bef0a390758352f00e197f1d9e1b7f5e72266bcfb9665a6207c44bf204a34ef2ee75858192368650031f2e878a99ce21de9acc22dc1e1ad85ed6b1aed27b69aedb1ad1369b6776000b60bb51da1c0308df1dde173e56c2e3b866055f3b77e0998aceda2c4b065aa00a49519350b952a9d699326588e2d4d5f36b71233d4e24d252d6cd952f447fc001a6a25a8f19866ad077b304803e1119abc74a460c3084536d65cd2ee46d20d0056cecc385a7f27e9b679cd2cba0d0b6ee5fcb1349b36e03c8a17089503ca9800e45b2186231adacd98c1a6242a5e2db4582e18b49c948afc4a9a95493c8a660091e3176423bc9f265ff9e6cb47fef2c27eb1503821cbaaca3c17f08d959c48004bd977864d0792c47f28495c54b74b72b42453ae04800baf4434ebaf2cd54b00756b5a8952893c47b69c4062ddb176af89a4ba310ed276e6b25dc902554ed300e29365252eec944b5a528192520245808cdad56fd655abfcd533d43a19ab2300ca2e871d6718b0c210c210c210c210c210c210c211f922e0da8b478563c2b400ff00a1c03f993dbba4f349f3143438b7325266063623250cc7dc72f91bc59900d253392c6ca1fa54331cb983a8f1ce3a8c443bb0ce169d4d08ba48ff004ad300c9493cc1f98350684118d72d0a96a295781d08e22351325aa528a5418e8742003883ed8d8c6027db4beca59771839123f881d1391310dc4e69e4896b8b964b00a19a695ad594654d171596a3d2d8417f3bc96110e1c973450722662cb6328400697619d91c448bd3df876edc276c0e272b65368ea94ad8dc56a40953a72d4a001b3b5f394c2ae512fbb86d4cc23f88480c894a3f9f9602c54a2a77583e2869001629e7289a798a0c4ffc4ac9b29f3dc27f50c927e3170aded0e62a0e2a022a0022063a1a2212360df7a122e0e25a721a261a261dc532fc3c4b0ea50e3110c300a85b6f30ea50e36e214871295a48c7d3844e4cd42664a5a172e6252b97310a004ad0b4a8052548502ca4281052a0e920ba490d1cd4104383622dfcc199f9b800c9959b01a02de1a7514adb61ce9f2aedcfa03d6a737bf021c93cbcf5bb71630066ab47041233724dc65d727d059c866650ff0053436dcd6be84d01b8dea4e000fd39338e41bd73e39160221c38fa137203001ae356b837b8b004123a76db7b00fa9a5ad5e94268460544bdfdb35b20f762dd40b3c0971a710c6fae96bff98e009980f11e135af737aec2c3a0ef4a0a01e840a890416d2c38bbbfdc17f52d2e002fcd880d99bf32c1eed6e99bcf86e9a57bd474fa57a537dfbe1bc482fae5cb00ebf419646237aca0e2fcf8e6d6259b3e1c89b282a0116aee695b580ef5a7a800e55be0146f9e47d4b936cac7c3d21c4bb16d07472fd6c4bbb877d226829d3d003ad81ec76b9d88e40e21cdf525f9b5f2e633b657be563dce44b3dfd40d08ce00dc3571105229ce95f9548b0df6f5e7cee24294fa13f40e6f90d7d3cdbc49d100f8dc5d2e6f978e59ded6209e7d4935d890694db97caff58de3970000b3e5ad00fc7dde04d883c180cd8837d3c8dce7726269526a3f1dadf9d7bd69db07601b00ae433bfd1baeb9983e4c730e48039be41f2b3b819beadc4a45474dbd6d5ad600fb6c2f5df6ad6ade2d997e832d187cce8ec4160d53967ea742ec1b41e648490002d1212294a6c77a6e2b5dedcaddafeb4951770785b8166f7e1ac53bc5f3cc0072cd80bf0bf1b785c5b27147a5a9cf5915dcc32d602b32e49662e690deedb600bdf4ca4be14393a9738e171952d4c43b1fbd60524c53a62211f8182850fcdd00c563cdbf894ecdc6d86c8ab6930da70bda0d92933eb077691ded7608ddee250046495a378d1a12ac4a952d3560c9aaa6a79466d71546057c91365f789fd7280013d519a920bdf77f52431d407778c52e3e6bc68e18421842184218422bc70e00ba6dfe23ea34b998e860fe5dcba5b9f6604b894298886215d498195ba875a7005b79b9a4706988a87212a7658998a9b71b71b4ac770761fb03ff00f1036f3000ea3aa9266e078494e318eb84197329296627b8a150582998312ab326926ca100fde1a45d54d411dca949c9a593df4e4821d09f8d7c18643fe9160466c49d23003004924924926e4935a9b927ccd6e79e3eaaa4848dd0025290c000c0240b00000000003203a358c720f4be9e1a5b289a13f2ad0d6e00e5d76ed6f2ae277c6500c750d6bf5d3cb5ca1f3f4f7944115fa1e9b53e77bfe836055ede7d7c38103a00d8f127cf8e5971cfa70b0ca248f514b72dbadfe62f506fbd437aecd77bea3a00659b6590b3bb0bbdff004b16ccfcf368505bfbed5e7e96debbf6c37efa8e9c00f216e20f203283fb16f97b6b43a77fbf2e84f6a6d5c378077377f4ced7d46400e73f288f7975d7dfa0876f4e543cc74e637e56e830df16e07ed7c9f906b3e800e225cf906e19088a5f9fdf6fbfa9c37ac0e59e9a5cfefadb9070f7efd9f9320096af97e7b74da96e60d790c3783b7dfcbc2eeecd91d483fed61e17398eaf93006b69a771e869f8d2c79f2f9d0b79dec411cbe6c0b795f4e4b74eb7e3cb3e190037ac453cafd69f9edb7a6f805679d9f4d0f16716c8f483fbf77e57d3c2248a00731cf98e42bd7eedd710160fcedd79b6419cf5e107e9e5f6cfc5e3f4c14146004c636125f2f85888f9847c43107030306c3b1517191914ea5886858586612e003d111310f38869961b429c75d521b4214a50069993a5c944c9b3569952a525004b99366282112d084952d7314b64a10848256a25929049205e0a50624b000300936160333a00007e57d237fef633fb3265fc10e90b7a9ba9929857f89ad5c9002423f9b1e79b4baf69ae528a5313197e9a4b5e527fca8e0b6e12639e221809004c5cfd96656876325f97e023227e5c7e213b649dda3e3c706c1e7ad3b1d80d004cc450a52a2138c57a02a54dc627247ea96c6649c350a7dca552a794a26d5400d4238362f889ac9dddcb51fcbca24274ef162c6611c34960e49bb02a205d7f0019d1ceaf5abd9d99705150d36e2c7394de31850f125d4e56e10789b98c22d4009d8985993f0714d120fbb79a69c4d1684285eec0a9d03663f107889044da3e00c9f0aa4933066838a76b5d9ad3ce483981369913a5a9b3429493f0920d5840001dd62ab39a6850905b55d6d203d1c020f2f28ba9c71d8a618422dab8cf795000dc1e7161108345c3f0d3aecf24f4535a5d9a5c49f9a463b17b204099dad76500d2c87133b45d89411c42b6970c491eb195421eba8c71aaa71e739117cba370008dc0690e95c0b4025a82d37c8f08d81400370d96256ca0002c004a0014b53600c7426d7cd5546d66d44f5b954eda2c6e6a89ccaa662552b2ef777518aa717900d349d66cc3e6b315231c762dc308430843084308430843084308430847e68b00856e2da2daec45d0b1fea42ba8ea0eca49b11d084916e64b4cc4ee9cf43a8300f63af2e6d16a74a4ce46e9b1cd2ad41fb1c88fa80474e7d8721dd534e24852004dba293c9493cd2797a8342081ad5a548514a85c7911c47231a75a152d450a000c47a8d08e47dde34d8fda03f668b1912791bc73e89e5ff7194f374de1a1b80080cb3278165a82cb79b262a6e165fa9b0b0b06c368879666f8df77059c1c52004919c62e1a74f3b10fe668e5c2fd00fc2d76c4ac4e965f66db4755bd5d4121006bd97aba89aa54daca1920cc9b83ad7314a2b9f412de65024103f87cb5d3a500294d1ca0be5581e226624514e53ad00990a51ba921899649cca412501ff482001804df569ebce9f2f3fbeb8f6a6f0b375e274b378bdb26d639272fb7bf61f2006853d76f5208e9dea7bd36008c46ff00df9b1cf83dbd0eac493fbcddf3f7f500bc453b8b7a57d2bca9bfe150313bc3cf4e8eef9379b780261efe7e90a7715100cb7dfcac7f2e57c029f3e2473e4e33d5acf78687c3df1f2e7120791fcbb9a600c3afd79605438f3b6a082d9eb91f4bc1fc3a787d9fac0803a8b1ef520d29c800539feb88df0fc7d001c78be9cf96a26e750fc9dbcad9787088da97fbdafdf900dbb5f13bc1c8e9d188e3c39f36107cf47f201f97be5934db603bd6f53d4dad00b7f7c029d8926e6c2c3935f36e475cb4025cbe7d7e5eda14db957ad77e7bf700f41e58050677d6fe397f5d40367c9f6e0df2f9da14a76f3f97df3c3787b6b5009d8b9f796707f3fb0e7c7f6688f2fc3b5fe5d7f0c02c11adbc583dbcf875ea005a6bf4fdb33c627c239d3a8f3a57cb737e97a916ab7eec1f81f037b0be5e16001ce0fcce4d7f96b6f6d0b8351629a1041a107911cc11f4383a540a480a0a040014b0208d4106c41163983d20fe5c0e5f48c3ef113a6c34e351a64c40c3867200ee622e4fe4096d284b30cc45bcb31b2b6d2db4d36ca2571def988587016b6a0058a9729d716e38a59f953db86c01ecff006f711a2a69265e098b156338110100225a28eae62ccea240400940c3aac4ea4972d5fde0a5452cd5bf7c952b8fd50049ee67103f42be247207316c98b81c9a28463a7e31a18421842184232dfc310069f7f02e98cbe2e32194c4f73816b31cd3dea9a53adc23edd24507565214db006c4ad4dc62a16254b89848f99cc5a74b4b261d8fa67f873d87fec86c052e21005720c9c636ad52f1aadef04bef6550a905383529521c8962897f9eeea69336004d4623512a6250b49968ded14aeee48510ca99f19cb2fe416d377e263705440045c4fdfcf1dfaf9721f53fbc65c3ef7de9d7e74fb387bf7d323cde10fbf3e700f7df124ea5b8fd49bf5be90891cafcc7a7ce9fa753812efcfd9842a7ad7f2f00d36e588fa7b63ef584460fcef6cbcdbebe1e210afe5f4b0fa6108797afddeb00f4c4bb7af2626d6f7d34844efcfd4f2bfcf9d6d5c43fafbf7e3088f5fbfb030007f3b9f3fa7a421f973fbe94e9cf13e1ef97eef08621f9deeda1e248e3ccdf00d2c8d9cbf67c7d9d2cea9e76778d7d5fcbab7f21699ce972ed1194cda0d62000b35ea44b948547e78433170fee66326c80b5261a4f14c29c875e78f78e36fb0071d942261d5e3afc53f6b2bc130d1d9de0354118a6334e276d1d448980cda200c226b8958715217bd26a3140ea9e8504a861ac14932eb90a8e3d8e621dca3f0029295fde4d4bcd20dd12ce48b5c29799c88468cb11ba38054425209248000b009249a0007324d863e7a67947100092c0393600664f08b04e3421041f121ecd0012b03c4e710dada1d3bff9cae0eb5f4b290ada884875341fea2a511dbd49d8005cb12fb3afc460ff008c3d9fec6289ff0048ed6f61778740e9bf1ead1c9b0f009224d06260dd6aa790547fff00329fe1cee071e2e6ced162bc5dfb67b86fe100df3acef46b4ddf91eb7eb4e5d7dd97e699543e7694e50d3dc81330d20a607300767788869cc74da6cc3ce166639734e72c6789c49a26162e5f9a1196a3108400afd11d927e0efb43ed1308a3daeda1fcc6c46c6d7a113f0daca9c2aa713c77001ca62a2f3f09c15132925d3d2ad09df915f8f62183d2d5cb9b26a30dfe2325004542ea30ca8ee13533a4d5094b732a5d3524da9a89c067ba8484ca94923f4c00caa9d4e85e72cae31ccffb5738c3d64f8883c93ad7c31e410ca4baf4168e64000567dcdd2e6d64009984e751f503344a6add4201734ce54bf1925c40346c7a006a97f08fd8fecb6e4ec6766fb44da1def844cda7c711836153d41fe2914bb300d8261d56378dd86d054a583249ba8e92b7144e1dfe26cf624804b266e273660053ca51d3765c9a6960be7f0d5ac364758a479eb54788ad61904df2aeb3f15300af59eb2ce6297c6ca67f96e593bca9a5797e6f289943b90731944c20b463280069dc6c7ca26108f3d091f2e994ca3e1a3615e7a1e250f30e2db573ac07603b0033d90afa5c5364bb32d8cc2712a09f26ae8710aba5c4f696ba92aa9e62675300d553cddacc531d9522ae44e4226c8a8a791226499a844c96a42d21435476b600ad2a4aa968b0ea35248295a242ea56082e14f5b3aa52140b10528490406ca300c594a7faab90e32063f4eb89be29f284ce54cb09972e17892d5ccd12e8465a004866150fe4ed40cd79c324cca11a4b21a6a0a759626301e06cb26154d85231007317d96d86c7a4d45363fd99766589c8ab5acd46f767fb2f86d54c5ac954d5002316c0f0cc2b18a79ab2b2a54ea3c469e76f10b130299504ed562c59537f2500512c9ba6661f4884a8e64779225499c9393ee4d42b2bc649b87bf6bcf117a30071b0125e2a656c7119a581d4b31faad90f2bcb32aeba64e8471c0a7a7599f200148040646d5192cad90eb9188d3f9364ace4d41a522599533b4d47b889f2df00697f831d83da9a7a9c43b27ab99b09b4810a992764f1dc4aa712d8dc5a6210007768f0cc76b8cfc67672b2a57ba994ac72af17c2553947f318960f4bfde4ad00cd1e3187620532a62461954ab277a62a6504d512c94098b79b4aa5120033970036482e573a5272d8eb4bb54b4f35af20656d53d28cdf24cf9a7d9d654c4eb200ce6acbd1698c96cce05ff125401a21f848d838843d03349547330b3493cce100a2e5735838398c1c542b5f35369b6676836371ec536636a709adc0f1fc1aa900747896178849326a69a7a18871744d93365a913e9aa64ae65355d34c95534b003a753cd973579f325ae52d52e624a1682ca49cc6a391041052a04852485249000418efd8d14510c210c210c210c210c210c210c211f823e09316d5a81e402500b55857fe828ffcd57ff94d0ed506cce942626dfa85d27e8791f42c78838f5100244e45acb4dd26d7ff0049e47d0def91a519e325659d43ca39ab4fb3c496130030651ce5219be56cd12198254a849ac8e7504fcb6692f8808521c4a226122100d6bde32e36f34541d65c6dd42169b5876215b83e214789e1d51329310c3aaa004d651d4ca2d32455534c4cd95312e08251310094a814a80295029241d5254b0095312b4929992d61492334a925c79111f35af68bf0559ab810e27338e8dcd5003151f92e354bcdda479a62005a73469bce2362d32575f75286d0a9dc8dd87800acb9991a0cb004ea5517170ccfeec8d973f11f5e7b28ed128bb4bd8dc3f6860041972b1096050e3b4482c68b17a7420d42529249fcbd42568aba453a9e9e7a0010b577d2e7253d8341588ada744e4b057e99a9ff002cc006f06ff29cd26f6200cee0c5897d36edebf9e3b2dcf1cedd5cfd4fda3321fd7f03f8ed887c8797a900f7fb421f7f7f7cf07e9e9a7bbf1d610c1f8ded6bfbc9e10fe9bd7faec3f0c100d99dbc72d4fcba02c1e10fb1f3ae00ea2fefea3d210fbfbfbe5838e3cb3e9600f36f4842bdbb75f5bfd83b5af89de193827a87b6873b06ca113ca96dfecdfd002bcbaec0e21c72e1e3f784457d7cff005dfefbe25dbdf1b6ae3873b0bc21f300dbfbfa73fbae04fbf6dfd5ceb0854efd3ee9f21b1b6201e07c8f8fefeb08b7005e27b4fce79d318f8b83865444f727ad798a57ee8b2979708c35e19ec182f0002a5b4f4ad2b8d10b0ea444c5c74ae5cd33ef56130cff00417e23761ffb5fd900fd4e21492153b18d9354dc6a8fbb4cb3366d0042538cd2ef4c20f7668d1f9f00eee59ef674fc3e44a96998b5842b12b6577b2490e552dd619ae3f985f95ed70024001f28c48e3e66468a184218422a968be4456a36a465bcb6e34e392c545f00ef29f290db8b4372496522a390f38d50c3263821b953312a212dc647c30a2d006a4b6be7fd976c81db9dbac036796952a8a7d58aac55404c646154293575c90052e5fc524d4ca9468a44d2521353532012e4037a9e577d3508d1dd5c929b9c00b27fd2399119a74a6802529094848094a404a4003f9424000240000a0d85b900d31f5a901129299684844b9694a10840094a1281ba9421202425294b200003000160cc07228107a6fb53f2ebe7cfa9c57bdcce834cbd4b87b3126d784484de00fcec3af315a56a29cf96fd8182a7f2b8d1c8f1e1677be99c1a2684f2b54f230073e5bd06f4a5b6df13bd717b8cdb5700e6e35d1dad7c808471a11f8f6a5cdf007076e469db12e48f4bdc9361717e37ccf2e289f0efbdbe97eb416a7ebb569400951d5f91048e3a1cc3e7c38b30844015adbf0fcfbd36f2e7897b35eeecdcb20037b81ad8b5bac22694dfa5bcf98a53d3901e76c52096b3db98e034d72e600f0038471a1fbfbf9f4c54157cfc4b662f9067b0b1605fc0031e11245fcf6e43c80073ed53bf3e78825c93e80be9e16b5c8d0b4204115b7a5edfdb7e9b57a60157007e36b9f120700f913f784477fcbe7f8e249d3af22f7b11606fd7835dca2e4f00844e19f39f17dc44698f0fb9187b89a67e9f221a673971bf790b95f2acb99500cd335e698d495b695b121cbf091f1edc29710e4c631a8595c3154646c3b6ae0023b73b63876c26cae31b53899df9386536fcaa704a57595b30a64d0d1cb37300bf5354b952d4bdd2994854c9cb1ddca51162aaa114b2264f99fa509703552800d9291d5567d2e748fa6de8e693648d08d2cc83a3ba712862499234e32bcab200ae5e8065a61a598395c32195c7c72a1da61117389b44fbf9b4ee64b6c444d200711b1d328b5391514f38af8f3b418ee23b4d8de298fe2f3d55388e2d5b3eb600aa6a94a5013272ca84a9416a51448908dd914f281dd93225cb9480108481d70053a6ae7cd993a6175cc51528f32720fa00c00d000348ad12783f11316e0b240094b20f356ca73a109ba53b8f1788d8a41c61534b73de1d0b2473d4f86439f30011954725cf7aa1649210389d55e190b33bea230e1c5d49673c7b710794f493004db31667c89a51c1c67f9d4d35675bb23cf0c8f33669d5bcdba5d997224f38007ed399e34db8ec9e1e45a79a931511ab39fe4ca5cef2f4d6772cc9d93e3249009d6573d9ce59f7076435347d86ec162bb5bb494187635b4fdae605474bb2bb00178cd10adc3f0dd94c2b6970ec728b6f36828d4a4a6a975d8fececa97b2d81005584d1d7d35154e2d8b49acc1ea6869312e472e6ff000fa654c5211367d6cb0048932668de972e4a26a6626a66a5fe252a64a024ca3621257302a5a9295d6900d2ce16b4c787ccab0f95b46b4d32364290c0c2b2d39079424d0d03309898560012dfc74ee66615338ccd3a894b7ef23a733b8f9a4ee6b14a722a3a322e2de7001d5f1cda4ed436876ef1399896d76d16378d56ce98a526762d5732753d389a00b2aee28e9c4d34986d1cb2a6934947229a8a96504cb912a54a42529d4544ea00aaa5999513973964bbad6480e72482c94243d929094a458002d16c33cc83c1009f1e994e64f4d32e64ed487a43315c9e61354cb66991f59f4bb31c1be5cf8000898e543e57d5fd27cccd2e1c3ca96c69cb9318e972c7c4424649e394989ece00a0c7bb5dec3f15a61478962fb3a9ad902ae9e9d3534d8c6c8ed2504d437e620054a4ccc4b65769f0e5099ba2a24fe7e4499e3fbb9b26ae4832ee955761eaee00d7bc844c4b99530227d2d44b21ae857794d532cbb3b2d2142c42936c37711100c3a6a1707f9a6532eccf3b98ea2e8766f99b526c81ac5328684627f97a7f1600a599769eeaf09643c1ca513698f8550b9433d40c0caa519aa210cc8e63032f00cd4fc1267ded7eccbb51c0bb5bc3aa0d2d253e01b6d85d32aab19d97a799310054189514a03bfc6f65ff0033326d49a7916998a60d3a754d561c82aab913a700e1c99a68f8fe298348a89336bf0c9424cc928332b30e4952929969fd75545b00c4acca45953e9d4a5ae482a9a8519014255b4e7cc85153d8b97e70ca13319600352b2d43bcde5f9f84b8b8099c12d7f10fe52ce102d1027794a68ea68fc3b8000c6c9e25d339903f03356c3ce76be138b4ba5973b0dc4a47e7b04ae5a55594008e04ea79a06e2311c366a81fcae232127e158feeaa65a7f2d5689b4eadd1a500c3b1114a2652d54afcce1b52a49a8a72c172d606ea6aa9167fc1ab943f4a8100089c91dccf0b9458773d35cfcc6a0481d8c7a5ef487324963df90e71caf16e0021c8dcb7992052d98a817168b4440c5b2ec3cd647324252ccde471f2e99329004a227dda3578de10bc1ead32933935745532915786d7cb494caaea29afddcd00483744d96b4ae9eaa412554f572674851251bc6710a234539294cc4cfa69f200d33e92a500845453adf75601fd331042a54f964954a9c8992d574b9bc0e0cf008b49b7019abc731bf1510be1735533141b7c40e4d690b7e0b21cf268b87954001f10f94e0c3886e55112770c0b7ac50b08130998323c3c4e69760e2732e5780055cc3a1fb7aec628fb74d9132a9244b4f69db2d87ce5ec4e28e113b1ea1a610032aa76c262737754aa94d527bf5eca4d9bfde50e33325e1c99d2b0fc4a709300c9701c4cd62118555ade7a52461950b507701ff213544ba913188a47754b9c0044907bb98023712848b858f85868e8189878d828d87662e0e3211e6e22162e001625b4bd0f130d10ca96d3f0efb2b43acbcd2d4dbadad2b429495027e31cd90053644d99227cb992674998b953a4cd42a5cd95365a8a264b992d60291310b00052b428052540a4804111b5208241041058836208cc11a111fa316e10c210c20010c210c210c210c210c211e866f05e21f16da4f88503c00dd205039e69b05700fd1a13409271895329c7789171fa9b51c7a8d79748c0ac92e3bd48b8fd607000ff0037864795f8c614fdb57c09b1c64f09f39cc394a5222b5c34121a6da85a0072e42b2954c33149e1a0c3d9e74faa88688898a198a4b0626123816034ebf900c24997e1c44310917300f777fe1e7b4a56c06dbd3d2574f32f67369d7230bc00582d47baa4a85cc29c3714bad0847e56a2699553314e94d0545528a54b972800a6ee0f5a692a9285a9a44f225cc7c92a3644ce5baa2ca2dfa0ab911f3d322e006d4a1a1e446c0f237001f1539de9bd7ea7ef1d6ee9b35f366cf37b1ccfdb9d0043c276feb4ee680ee2b6ade82dd4f7e00f57362ce5c581e801e41e1114e9b7005bfdf97e03072381c999b4f9062464390cc9429cebdac0efd3a7d76f960490007ec5b419b87272cf3219a10a540a7af9f217373e43e78057124d9b36f5079900b9bd865a1befeadf3850fd69ca95e95c4bb80e74bf121f47cc96d79e65c04400f84d09e9b5ab5afe95b1fceb8a4a9cf266cf8ea6c7c406d1b2108114f3de830061bdbf0e7cc62a0a7367cf5be60f3b6ba11a9c842228477adfad39efeb4a79005b6388de275019feb67e16d0924e5fe9429ce9f3af3a6d61b733b7d2b1bce4003e57b1b81f52da6ba73844f84f2e7df6e5d05c9a81bfd2b89273d74677198200e3ab5c301cc5842047a5ba8debd694ed4b6c49237c1f36f5b177772c47161900682ed08e2a42569521680b42c142d0a4852549228a4ad2410a4a8120a482080034208de95a51325ae54d42264b98952264b584ad1310a052b42d2a74ad0a4900dd5255bc1492a490438067d1c657cafa17b79c616759f222b4e75233265b6d00a5b72d4c5fef191294871285c92663e2e05b69c72bf102042d72b7e2104a1c008c8089144a92a423e4af6a3b20ad87dbada0d9e4a0a68e4559aac29452b09500e155e91574012a5de61a7933451ce980949a9a69e013bb1c76a25f753968d100dd3fed371e42c798314b71c022cc30846463829c95f0923ccf9f63219d4bf30088b465e93baf30eb3e2964bbddc54ce2211d594b7150b1b31761a15c710952001a8b91bcca5d2ea1f6dbf717e12f657b8a1da2db3a892b4ccac9d2f00c326200e5a90f4b4ddd5662532529569b2a7d52e8a495a414267504e97bc56998946d00b0e96c999348ba8ee0ff00686529b912de296e317cd4dad6dfd6dca829b93b00016a9dce3d8cff0068d9bdcb74f0e1ac4d0f3e446d716f51cfcc0b52b8023400e6f66e16f97025c8888743cf63f5fbbec2c37c1c71f7ec8f38408edf96e6e700f03d6a37c4bfbe1ef86508809a1af5fbbd49ef7b73ea0604dafa7c868c3f7300f53fdfce269defdad5edfdcf5b8ad310e2f91fa7be70fdf9e7114d87216dc800b1a5bbed43cfcf72897d753c58fa37bf189a0b741e7bf2341734a13f2b1a8c003f6f7ec7941cfbf7ec5b28115fc3bf9efd850d395ab6c4bb79ebf2e99bb58f008444476341536de94e9fd36e605b10f9338f7d037d3c610007cafbf981cfa700cc0a1a6d83e9ef9f83df978b912f785056d6a54fd2941f85ab4e8374c83f6e00567cf8b68ffb19727dfbf6fc63761fd9d0e0b9bd30d10cc7c5ee71959673be00ba08acb5a7a6202d2fca748e45344262e310cadb6cb0ee75cdb2b5c628abde00a5f92e5ccbd1d08e25998bc1df9e1f8afed08e33b4549b09413f7b0ed9b28a00cc53708299d8e54c8265cb2a04850c3e8678961b74a6a2aaa65ac1329053c300f1fabef27269127e192cb9841ce629361627f424f220a940e41b658876151200f21946ea373ff3522ea51f2153dcd00b918f23a1056a091a9f21993e51a1960083316940d4dcf01a9f0114af8b3d693c3870d7ab9ab92f85663b30652ca111000d9064af34e3ad662d4fccd130b9474af2b2d0d254b23356a34f72c65f5384000435fbccbef290d21c5a7b5fb28d8a4f681da1ec96c84d5aa9f0ec4f1594bc0072ae5a928561fb3386cb998aed3e280a884be19b3f4389e20dfa9669f7520a009401e47474e99b3a4c8fd282a1beab7c12900ae6af4fd12d2b59e2d142f87800d1d81d04d19c89a5b0b1eb9d4c32fca9c8acdd9a620bcb8ecefa8798a362b30026a3e7e9a3910e3afae6b9eb3d4df3066b9915aca51193775a650d43b6d32d00f63edf6d6cedb8daec6f6966484d153d7d5265613864b0812305c030f932b000ed9ec0a9932d294269704c1292830ba764baa552256b2a98a5ad566aa7aaa600a26ce2182d5f0234972d202654b0d6dd972c25039262b4e387c63c59af123c002c39a893483d69d119c4bb4a78a4c9f0a84e5ccfc9845a72f6a549213c2eb900a47aeb2d806fdee73d359fa5a1070f1af35159a34e23dd6b366428b8299c2c00540cdbb7bb3bed3ffb3d4f3763f6c692a369fb34c5a6938860466835fb3d590035d29daad8aa89eaddc2368a84a8ce5c942e5e19b41212ac2f1c953a9e6ca900f499b4d5494a0d35524cea3984ef4bfe790b3ff1f4ca3fe1ce4e643844d0e8009a0a4b8a4f96271a77c69f0ff9a72be7fc98f4ba1a7cde63d2cd69d29cc0ec00244662d36d44903c25f9af294c2261c2d0c4fb2b4e510d3bca59a6010d263e0005595f3e65b7440cca5118ae678852e3dd906dd61989e038c22a2650ab0fda006d8fda8a04cd9741b43805724cfc2f15a796b214ba2c4e90cca3c530d9e5460044f1896098824cea7aa9431e6cb9b8755a4a161451bb3a44d483b93a4ac3a1006c7344c4ba264b5647bc94b0e14235e8732c669d30ceba87a1b9f62dc98e7400d19cc89cab173d79284af39e548d97c2cef4f7503c2851407b3764f8e96c5c00edb692db1039ba1f32ca58406e5a09fa4186e3786ed6ecfecfedae0d2d323000cdaac3cd78a249246158a489f328f1dc15cdf730cc524d44aa452895cec357004154b2f50c3886d0504aa4ab44fa64eed1e212cd553a0391215bea45452b90002d22725425dc93215254a254a3149736ad3a73a8f95f532187b990e6e8b94e009aea4b481e1607ef68cf85d3fcdefb6d84fbc8d94e658987ca71514e7bc2240099a7de44521e4cc2e1f9761e938d60b5f81acef55e1d2ea31bc154a2eb229e005efe3187214a7dd95514285e22896187e6b0fdd47c752b0bab0e51c4282a7000b5fc53e9513711c349babfba46f57d22493644da64aaa9290dfdf53327e29c00a0ab8c8a85868e8688828c6198a848b61e858a85886d0f31130d10da9a7d8700da70290eb2f34b536e36b4942d0a525408246385cb98b94b44d94b54b992d6009992e621452b42d04290b4281052a4a8052540820804178d4a54a4292b428a0056850525492ca4a925d2a045c1040208c8c6c23ec5ad7a9ae7ee1db33f0f9900be60fcc738709799a5fa77289847457c44c279a2398a58a9fe884d5f4ada6900f0dc8642d4e349be2dd5452e671ba591f327635d8b898a661fe627e35bb3da005d97ed328b6e308a7453e0ddaa61f3f68e7c89328cba7a2db0a2a9145b6549002c8529055595cba4da832d025269a56d2c8a74494ca9729733b245426ba9a9007114b0555cb3f984866456c93ddd5061977aa09a94a6dba8a848c802731d8f001bc510c210c210c210c210c210c210c21104050295004104106e08228411cc0011638679c0804104383620e447031d363e10c23e522bee97553477fe5e692700aa0d8d6e4515cf1ac9b2fbb5901f74dd279707e20db8e4758d34f95dccc20700e93f120f2e1d41b73b1d63e78dedb2e0b4708bc63e629c65595181d21d7dfd00e1aa3a7e186dcf8194cda3a37ffd20e4f697ee59619321ccd14a994be5f0e500c6a5d95f3165c87f785c0f04fd4afc3c7685fdbad81a4915b3bbcc7b667bac001b14de23bd9f2654bffc195ea4ef294a1534681266cd50499b5b4b56a6621f009ae1159f9ba4485179b21a5cce2407eed4f99de4d89372a4a9e30f3416b77a009e86d4bf6001a8dba1c77c93c75f0fda36ae7df57f662696a6fe77e7f7e5d200987bf3888e2050dfbdf6e43fa814a500c4bfbf6fc89fd844bf9dbebef2bfcf0090efd4f7adcede47a8b536a8ae21fc34f4bea7317e9a0ca222283e7bd7adb700a5bbf99dc570f4f941cf189a0e77af6dfcfe587d211143d06f7efcc9a546e4000a549b74be0e1f5e06cdeedaf3e61e5cf97bf7c224002bfd7602c3f1b5ef7300838f7c783fd3af38393ef8dfdf965022bc8fe1cfb1ea2c7f0db00787cadebe00ee0c4471a0e9ced4a8de8795eb6adc5ac3960ee7325b521f8daf9b1cf875b4004bfd3d23953715dc934fcb6a53b6e6b415be0e3e9e36ebeef6d2220802a46f004bd36a8da82f7036dbf3c1f4f1f7d7e9ca11633c6be4a31725cb19f6121de7001e93c53997a70eb4c38f044b6625c8c9644453a8253090b07324454221c710001b762e76cb25d4bab61b7bc71f8b3d95efe876736d29a52d4ba39abc031252002595814b53ded661b366a93fe0cb93528ad9256b1b8b9d5d225ef25650999a00cc465b844d0e48f815ad8b9493c002e3aa80eb8e7c787a3550c2119c4d31ca002de45d3fca79552c965f94c9a1533141712ed671120c74e9c0b4296829766d001318e3694b8e21b6948690e2db6d2a3f5b3b37d9c4ec86c36cc6cf84144ea100c2a42eb52b20a86275bbd5d89dc5b7457d4d426582484cb4a13bcadd04f2390008eee54b46a9487ff71babfeb131df29f669d6db74b77ea2bb7362a246679e007cb2bebabdb8345d89fbdc7e36faf961bc78fab71c9bfa3e6f0881f88e63bf002e60f5ada95029892af982073e760fc33f368400e9c87ddbee9cf101478f1f007d79e6ed72f088b74269f75bdad6f95af5c013c588cb2e8d7c85fa0bc2269e007b1af3f2dcdb7a5a83d6986f1cf5bded9331f1b67ae41998a1d87dd7eff3380090a3ccd8f9bf4d071b0bc207cfe55adfe5f9ec69c8e2378f1f65ecc6de9c9f004843e7e5f76f2ae0f6ccdf37e8c7c19b5f0e088fd4d683af5dcf3fb1892ae0004f8b9d2dcb9177e2e74472bf6f9f7b73fb17b5b11bc78eafc1cb6acd9f2f580045c6f087c3be60e2bb894d1ee1ff002e7be444ea3e718195cd639853495c97002a40a1e9c674cc00ba0b4a5c8329cba73376d95057c4bd06dc2b685bcf368500713dbadaba5d8bd92c7b69eaca77309a09b3a44b50511515cbdd9187d31dd200e3f335b369e4150ba02ca94424122c554f4d353cd9eaca5a0900eaa36426d700f89440f178fa7de4ac9d96f4ef27655c8393a56c49329649cbb25ca79664f000de230f2b90e5f9743caa5300d1714a71688581846190e38b5bae783c6e2d6b0052947e3ae235f578ad7d6e275f395515d88d5d456d6542db7a754d54d5ce9f00314cc015cc5a94c0001d8000011d70b5aa62d53164a96b515289cca945c9f300315364d0deeda544287f33bfca8dea1b49beff00f3d42bcea12920df155323007525673565fed1f73e803671b1a395ba9330e6bb0cec91e1fcc6fad806d62c0037da231226797f851d317fc025dab9c6e684ca669e2405a970ba43099d38a50086874836098d9af0ff002e8188343583898947fbd51e8bfc3dcafcbe25da8600d2201351b29d8c6dc55d3328a409bb573707ecca64c245c9934bb77513e58f00f9d972ce91baa3f84564e19c9a1a829eb3b72974e02a09d3e915d31c5a355000c210c2118e0d5396234438d3c899ca5c9542e4ae31e4530d36ce52f866690800debf691e549ae72c839ca2490a4b7199bb4732fe74c9739896d6d18a1a79a700f0cb69e2c975bf44eca55ab6cbb20c6f07a8226e31d92d6c8da2c227cc5bce0056c2ed56294d84639844b0e0aa4e13b5b5f84631492c8509471fc76605242f0074e691f99c3a60379b40b1310a399a59eb08992f989750a44c4862ddecdb870068c6ff00b52723339635af87cd69840b437a8f24cd5c3fe6a4a57e169f99e500f849aead699462d01212a5c040c0eaecbdc538b53ab33a8043212db2ff008b00d3ff00853c7d75fb31b79b193483fc16a70ddb9c30b39449ab994db33b432900dc90274d9bb31390129091f959e56495a1b4b89cafcce07522dbf875449ad900659cf7550a4d1d4a01d3796ba398746945eed18e8cfd9599cef92735e517d40086c66290cce54cc42d249828c8a84751013168a7f9db8896c77c3c7c2bcd9400bac44c334f32a4bada143d438457ab0bc530fc4520abf275922a14807fc595002e624ce92a05c144e95bf2a62540a5685a92a052488e1f4154aa1ada4ac482007f2f3e54d5247f3a12b0664b2ee0a66237a5a810414a88208263dae93e6a7b003be9a645cd716a49994eb2bca22a7284a423e1e7c9836d89fc1a9b4d9b76060074cc7c1bcd8ff8b7585a3fddc636d061e9c2b1cc5b0f9608914b5f532e9892004efd2198a5524c04dd499b4ca95312a3fa92b0758cbc4e993478856d2a1fbb0093533532492fbd20a8aa42df50b9250b0750a063243ecaed42674efda1121c00b5131512cc07113a0da81908c2362b0d199d34966f26d50c96ec40d82a0f2700466b2a5b59350b8b436907de288f2a7e30766d58ff0060b3718952a5aaa3600036e304c6153556992b07da9a5aad9cc5912ef7efb1797b2454902e99249fd20023936ce4c3370dc429cb7fc16a69aad17c91508994d3d87fbd1499737d236b008c7c928da4308430843084308430843084308430847e1984288a875003fcd600eab68f3240ba3ff5c0a74af84f2c5a9d2fbc41007c42e9eba8f116ead162a200577b2c801d49f893c5c6607fb85af6768c30fb69383fff006b4e09f3bff0fc00ad31daa5a23f11abda76504a22e3065f827ff8db2d3650d3af447f1064e33400f8196b7e011d99a5b973c6b48601c76f7e1f76ecec3f687878aa9c6560db4500bb8162a0dd12cd4cc49c3aad4e4047e56bc49ef669732e926d5b03bd16f07a00afcad62028b4b9dfdd4c1c1cfc0a3c3754ce74495718f9ddd0fdf2e57aff00006028063ea8b902da105f9b37be373ca39dc3afdfdd0dc56d6c1fa9bbfa5c6a007d59b4842f5ebf9003a7cff5d86277ac1f89e0efc74e27e562ca843eff00af00a7dd45711bc7d5fe4ceccf970b69a321f9ed4ad6ff009efb72e7bd01446472001ec5fc1999af630877f2e9f80b79d3f0028de2cc6fa87b9e17f5cc78334220008e5dc1e5d41fbe7e6700aeb97139e4e6f7b7ec35844fcfd4fdf5b5b614adb000de36cad76035160ffd6c398843eef5bfebe7d6b53d0e5ee48bdd8f3be5088100cedcfd7ce86fd47953b61bc789f3b5b4b01efd11cb98dbeb4f5f4e9cbb93880073f5e3f373a42389fbb8e5ebf434b56b6a5677ae6fd06879116cf8db5b398400745d4eca4de79d3fcdb9556c97de9ac962d12e425c4b644e21902364ae15a90048484b536868371c429c6d0eb685b2e3886dc5a8708ed2366c6d76c36d360100b8a9b3abb0a9eba24254028e2746d5d860049fd3f9fa7a70b49237d056824600f16b53d1de4a988cca925bfdc2e9ff00ac0460eb1f25238e455ad09cb2336e00ae64593ad61b6133b666f144a14b0ec265f6dd9ec442d10eb4b418e6a5ca82004bc95d61d5101ff0381b2dabb0bb28c03fb4dda2ec9612a29ee578b49aea9000b4952665261295e2b572581041a8a7a2994e955c217352a2084906f53a3bc900f2d3a6f026cf64fc447880cfa3c669c7e57e83a1dad4b57af5be3ead1573e300ae572385c64435db8ebc8a23af97dfdf6c37989cfcfcb8d98b866e17ce10fb00fd7f3c40531bbb7526e3c4023d0f9ba248a5adfd891f7dbd713bc2d98cae4800b3b1d08719bf0cad94222df4e7d7d29cfe9cb0debb8361d6fc7874625b80780043ebf7f90fc296dc02b8e8e49e3ea38f9d800d644dc57b7d2ff91e9dfd5bdc00ceacf77161a5b8b677172d9a23ef6c40564f9824e6757b331f0feb087a6ffd00ab5e42be95df13bd6cfcec6fadb31c19ada6461134f5ebb585bcfa1bd39dcd000d30df2331c4e672c872391c836a2ef0857e9b569e7d2f7ae242c3e472cce600cce3f6bc202dcabf8f5b1b91d7a53b629dfebe27c1c59baf33ca11b69fecce0070bed38bd6de2fb304bd0b5b0a6f4434d9d8a824a8b2e2db95669d449cc0bf0010d12877dcb994645091f2f5a55ee9fccf2d7dc2871e671e24fc5d6d928276007b61696691be0ed162e11314378033e8b0b9131285314ef26baa572a686de400d24d425c25438c6d0d4b0934a939ff007d3189cae9402069fa8907fd240d4600dc70cc9887db645bc6aa13d120152cf984824753418f10a1256a4a46a7d332007c0031c665a0cc5a503f98f901727c0031de129084a529144a404a40d800280007a014c6d4000002c00000e4328de00000006000007002c0463b7da290eb9600ca7840d48710152bd2ce39b442613959710dfc3c2eae4875178619744ff39100e34b398f5ea46b7928aa8301d729e14288f42fe1e6626a2b7b58d9d4922a76009fb14db4a7a301255bf37652bf67bb4aa8976058af0fd86ad08258199b897700508cea2f8935b28673682784f332552ea88f14d3a9b48af78e271aa86108610008b11f68d25d96f0dace7f816c7ef9d24d70e1b752e5318281e97b126d79d300e9666d7995923c098dd3e9de7092c70d9f954d63e1560b710b07bbff000f6a004d4768a7029caff81ed56c67687b3b5528bee4f5d5ec463d53852163f98c9c007a8f09ac92ff00a2a69a44d17960c67e1a37aa1724fe99f4b572486772aa6900aa45b889894287050062cefdac523838de172479a1e682e3f4ff00883e1fa700d287bc452a857f336a5c974ae68e248babdf65ad449ec22d07f954888350680031ddbf853ae9d4fdaaccc390a22463bb15b6f415686044c9741b3f57b474e0008396e6218151cd045c14003331af949132462524fe99b84e24e19dcc8a59950068f29b4e850e603462271edc8eb88a5fc39908d3c99c0a7fd12ad53d6b963700d0350fab99d14ca4744a5a710800592134140001bddb4be33266d9ea301d98009ea6ff0032f6770cde7e6540927324deef1c871d735b256739b85e0f30f5560015480f9904b9bb98bebe0c496fda1dc08bc81fe61d56d5985246ff000f11c2009ebfade1ff0054aa1d92a1b129493b0c79f3f10602bf0eddb4a55fa46cfeca004c1c3bc4769bb0e9478b2d4dd4c6cb65897c613a1c365a8f54e23420796f1b00e7eb1b92e3e2ac6f61842184218421842184218421842184218423a94e211200dbca25014cc4a545492014152aa1d4106a08503e2a114214452831af9e832e0066f25c051de0438650cd8be6ff00106667602d1a9ab95ddccde1fa57f10d19005a8ffbc32cdb478f9aafb56384f7b83de36756b4ee5f2e76072066a98ab54b004a9cf866a160dcc879e62a323e1e592e6d9529021328cf9a9f6496c90db8e700f0dfc429a421f6fc5f57bb17db84edd767b8262932689989d14a18363437ca00e60c4b0e44b94b9d354abf795b4caa7c418384fe6c242894284737c36a855d001ca98eeb48eee6ddcefa00049e6a4eeaff00e94639edf7e57dbaec3b6fdbb5007786af9be7a70d5f50d61d34cf88a0befb8fbdc5ac2bcaff00390ae2ceed6e0019be9d2e6cf70e2e853bfad6bb797e97f2c37f91d357f5bf2b75079a27ea29005e7e5f2aef4efe78055efc00777c8124fbe6c4c21f5f31b1363cfd6bd713bd00ae6d73a6797500d8db867aa23ecfdfebb54d37bc6f102e4bbf0190cf3bbf3600670c21122d5f2fe97dbcf9de9e8deb731c0b8e19bbeb6676b703088af2fbe90081570737e5e1a5af93df5639422798afad7bff0043f98e586ffb24dbd389d200fe004203fa7cfb7e6057e98153b68dccdfc383e7ab78c207f2b52bdeb635ef005a1a0eb86ff5e4c473cf3d0f30488447dfe986f8be6351e8e3c6f9e5e021180058d75cb2328eade7a93a1c0e30a9dbb37852942901b84cc0d353d8785016eb00cb59826a6298253ca5d62150e5ff000361c0da7e52f6ad807f667b44dadc250025264a3169d5b4c109294a293164a315a592c4924d3d3d64ba75aac16b94a5000090a0071da847773e6274de2469657c43c8167d79651701c1148046672ce1009916c34ea24997a1256db8e08752a1a2e7f1fef9b7584b8853edbeb8591c6c003fc443947821de8886749445842bb8ff000a983a6ab6bb1fc7264a4cc460f8002229652d494abb8abc5ea4097310ff001a66aa9282ba505a6c254c9a857eb1001958721e62d643ee218722a39f56491d098c95149b9f5bd36b57ce95e9cbc80063de216096f07cf561a701c79718dc4295e5bef4e56ad87e42e2845684627700ada72d1fc4e97cc58db5cd0009a53a5fd69ce9eb7db90b02637807f1ebcfcf002f425ec10f01edf80f33e5f957cdbc39bb3b35f8e9cbde70814dcd8f4b0a7700ad2c29cb7b6fb5061bef724390f9fa139bf87476843c34f41cc1bd6d614dee002c4d8d46d7c378656f020f3bea1b8819732d088a56b4a6e3e77b722052f4be00d4a93892a6e99db51c79876e99e57844f86ddf6f2dafe95015516b9f38debf00b1ab78bb1238db990f7efdfd1e3c24d6f4b91d2fd3a6e05857125596b67b5e00df6b9cda113e1b9fa5add3fdedefcbb8bd2a446f7c9f3be4fa641aefcb2722001029deddf6def4a5796f400015df6a50142d7cf3bb73caf6d4dedd6d08f3430042444644310908c3b111516fb50b0b0eca14ebcfc43ee25b65969b482a71d7005c525b6d08054b5a82520922b4ae6a25a55316a4a5084a96b528b04a1097520089b001203a89218024f181203be81cf48fa77f01fc3b4270a7c22683e85b5000c61a6b93f21cb1fce014b43ab7b3fe652ee68cfaf7bd6c51c64e6d9c4dda8200bafdd4bda84870b5a594a8fc83ed276a666da6dced2ed1a97bf26bb129c9a100b10138652351e1a9655c2bf2522419961bd34ad6c0a888ebaae9e6a6ae7ce2005c296426cdf027e1406e4901f897317b52487a25c8950babfcb6c91fee8a150091e6aa27ff00548c714a54594b3afc23ea7e43c0f28bd452d82a61d7e14f4100727cd87818f7d8cb8cf8b52e38747673aefc29eb3e9de550e9cfabcb2c675d002e2cb81a5275734b2752bd50d2653aba12210ea364fcb288f4a68b7605512d00216852c2d3da5d8a6d7d26c376a5b1db438994ff00034e24bc1b6942d3be0e00ca6d3d1d4ecd6d484a5c0ef7fb3d8b6246412e94cf12d4a0a0929395453532006aa4ad7fe1ef19737ff63352654de4fddad4cf67678e9da41a9920d67d2bd300ad5acafe34c8352325e5cce72c8779c69c8b806330caa1664a954c3dca948600a6b287621c964da14f85d83994245423c86de65c6d3c9b6b3672bb63f69f6800365712635db3d8c62183d4cc42549953d74155329c5548df00ae9aa912d353004b36e99b4f3654d415216951c29f2952274d92bfd52a62a5ab404a490e1f4200ce0ea08222a3638fc5a86108b19f69246261f833d5882f0a96fe659a69364700814207896b99e7ed68d3cc972c084ee5498f9f43aed7484157fbb8eebfc3c4009333b5fd969ae128c3a9f6a31a9ea2580a6c0f6431fc62a493c3b8a1980f17006d633f0c1ff0c96744227cc57fb65d3cd5abd12436b165fed639fc1c170c59006b28bae1131d48e21b41241286529f129f772967f976afcdc1a5d086b2ce9900cf1f53942125b424d0ac63bcff000a587cea9ed4aa7149690646cf6c46da6200156a258225e25824fd97a623fcca5621b4146809cc85123f4c6be5a84ba7c400e71fd32b09c4412ecc6a69d7452fce6d4cb1e3c6311b8f6d475c4531e1c13e00f74bda9a8490de64cf1aab9a21964102220330ea766e9acae2dba81e2622e50091307130eb4ff238c3adb88250b493bbdb52138f2e43b9a2c2f00a058b3a2600d1e058753cf96589654b9f2e64b5a734ad2a4900861c871e64e20256b4f438005d3287f96648c369654c49e051312a49198208370d191ff674e499867ff68e0070e6b80759107a3992f5d75bb31256495082fe0a634424f0e8f0a55e1888c900c6b508a874b8509761a4f335214a543290af307e2971da6c07f0ebb73227850019fb618e6c5ec7e1fbadfe2a31756d955cc5391fddcaa4d9032a6148514cca00ba749004c71b6d9846e52e2d504165a68e890742a9939554b6ff006a6906f7000df483fa846ddf8f8e71b98610861086108610861086108610861086108fc5001f0df130cb401fe627f9dbff00ae9adadff3924a7a5483cb16a723bc411a8b00a7a8fbe5166a25f7b2d49fe61f127a8d3c438f18d5d7f693385e567be1fb4d00f8a1cbd2b43d3ed0fcc8328e788c694db6f9d37d428a868497464505d1c8b600e439f1b934141b0c92e43a739cd22d4da986de719f51fe13b6c4619b4d8bec007554e29a7da1a4fcf61d2d40948c5b0b42d73a5a3f965aaa70d351326294c100668242010add0abfb3f51b93e65328b09a9df402ff00e22331c0128727fda0004695341b1047cbbd28297ad3adce3e80ef702f63e5af4cefaf28e5f114bdaf00e761d4f2a1b50dcd296bdb07b5ed97ae56cf3b75f444f876bd39ed5a0e7bf2000791dafe66378697d3c797170eda1cb3c90f09b1fe5b1e86f5b6d6dba5857700e786f8cafaf4617f2d78ead93a1e120d2d5ec2bcbbd07f7f2c4ef59f8daf610098e1f51a13ce10f0f5af90007cabbdbb56c6b7de92b0fa79fcec751c5aee2d000878694af9ed5b77ff0049ebd7e989dee1eac1fa7120dbead0f7efdf0e300900ea2a079ef5bd29d0023bd01e6302a6f1cb95acfd74cadd210a5370295de86e0036277b8046db5491db1214f970f1cac3c9f5cb91843c34ded6ee6bdcd8d3ae00d6b0def88de0ec3f6f03af4e47c50f0d773dee2f5de94ad6bb9a7973d9bc3d0039b66d9b64ed70fd2d081493b0b52dda845b9df95c835af2186f8d7a6b935800e9e8fa6708c6a71b9201079cf28663430db4dcef2f454adc71b4c3a15131720008f2fbaebe96d297dd7d10b3d81871131057e386661a1d921108509f077e2a00f064d2ed76018dcb949968c67045d2cd989091dfd5e1156a0b98b6014a989a004afa19254a27fbb952909b20c69f11434d42c06df4313c4a4fcd8a474022b6007059247a074ce71387d871933dcd918a8471684253172e96cbe020d110d3800078d6da665fbd614a567c287619cf025256b52fb3bf0b3862a9b62f1ac5264b00285e29b413254a594a477d4b87d152a10b4a87c4a426aaa2b6500ab2572e6600e8b927230e4b4a5a9bf52c8ea1207d491e717857e76fea76b6c46c0dfae3d300c08b1d395f4f57e1e11b088f98bd6e46c697df6a548dc589d8d307d1edc87e00c0df2275e7089edbd39547316dc0e5cea7722fb83f85beaf7e3fd384207a770016d8db737dfec8b8ae0feff6c80e5cce85a10bd373b9bd7bd29f8f2b12280d002b86bfb7f5f5cf5844fd7f5b5e87e76dafcce21ddfd9f65efc7384453d003e00429ea4edd6d6a81638973e7cbdff005be70874a5ee2b5de82b7a01602963b7003ef83e57c9c7dfeaf0876dcd7cf95452a6db5b90ef4a95bd3fafcdaffb4220009df7db6af3e6282f5efd0ee050e23cbdbfbf2e7089bf4b5a9e5ca8473dab5300434de95c49e3f303339fedecc2326bec7ee1f18e237da05a0d95a6b2f899860053c933c8ad5cce1ee1bf1b0ccaf4da19798652d4cbc495204b66f9c18cb320008c4aa9ef9a9b1650429d4d3a8fb72da856caf665b4959226a25d6e214c8c12008378b2953b1550a59c65331ef64d02aaea6591fa552428b805f5d8acff00cb00d0cf582ca5a7ba4df599f092398495171c1f48fa3b25254a4a522aa510903a00926807a938f9557278927cc98e020124017248007339477987652c32db49d90008009eaaff007947ba95527cf1b6424212948d0378ea7c4b98de4b409684a0005985f99cc9b7131e6c5515c308462f72a4a1be18f5ff0035e81c6a112fd29d00719fe72d69e1ba397e0665b2ecd53d8b7f35ebce86b710f3ea5b93a82cd71b003dd6ec9d02a09723b26e73cdd289143264ba511c217d435d5c7b4ad82c2f6e002528cfda9d89a1c2363bb43901d7515185d14a4617b0fb6aa968404a68e761007268b633179e1d32317c1f0aaaad986b36a2477b95523f33211549bcd90944008aa1992948dd9150cd649404c859c82d08528ef4d8baac75b46b6184231e9c005ccdc6a6eb5f0dbc31cacb31d090b9b20b8a0d6984f153f7769c68f46bf11a00570f14540a03d9ab88346498f9641905c994b34ef382851897450577f764d4007fd9dd90ed0bb48a90b9331785ceecdf63e737fe51b43b592508da65ca00850014619b08ac62454cdfd34f518fe12082ba894d9d23fb8a4abaa362b41a2a7300c66cf03bf2392297bc04e8a9a819a8118a9f694ea7426a2f119a6ba392788600a324fc3e48265a8f9dde86790e370daa3a912a7b2de46cbd14026ad4c245a600cfe6fcc331830b2b4c167eca718ea5a43d0feffd77f861d969d81ec3ed26d900d5cb5c9a9db6ac91b3b82a66214933767702a84d7e335d29cb2e9eb31e46190043266b01df609894a41514ccdcd162f3ff0029832a5b8137159c896949fd5f0092a3589b3660e026558912d0a399913d21ca4b63af57f33c6e57c87365c954004e6acc2a85c9d929842921d7f3866b7932590ad293552989745c509c4c94da001c5c3ca25b308cf76a443af1e9cd9ca1955d8b538a903f87d189989626a2fb00a9c3b0f49a9ab04e4173a5cbfcb480480ba89f265b82b11c6b07a54d5e2121003340fcb48deabac2412052528efa782d60a9884f732dc80a9b325a1c1508aa0059432dc1e4cca596328c02d4b80cad97a4d97a0dd70250b72164b2e879732e00b81202038e370c971ca003c6a51c71fc46b66e27885762338013abeb2a6b2600252e40995539739494bb9dd4a96425f4022dd5d42eaeaaa6a963e3a99f3a7a0080bb2a74c54c2072054c3946753d881a2b1abcb3acdc5fe60971876f5a269200bd32d1979f4a52f44e8be93cc27888dcd70e8a7bd661b50b53e739b62a0de500acb539ca594f23cea1109858b65e89f9d5f8e8dbc93538f6c9764f8754898900d89a5a9c7f6b132c92846d86d3c8a354ac366281285ccc07672930b973529000154989e298cd1cd3dec95a25f3ea6a5fe1f87525128113d5bd5b581df767d400a6589724d831934c894169b944e5ce492e18679f1e078aa2cb78d7e3974c380021c95956739af286abeb16a6ea7cf23f2a688f0edc3fe4598ea66ba6b566990044a5fcc13d97646c9b2d532152dcab9761a273166fccd398e95e5fcbb2865b001151ee4da672394cda92588001529592433b021cdd800970e7a00e481117700000726ece0581009be81c3f511695ecbdf6d6f0b3ed47986a769fe4191ea168008710ba35318e85d43e1d75ba5b2e906a4cba5b2e8d6a531d98e530f011f1d000d37944a67cb732de63855980cc79567cc261332482590d339146cde0294e1000b4142ca77acea4100805a66e8048247c24254d7096bc4390add5a4a5453bd600752480402cb601c121c100ddc06bc661f15c550c210c211f8261348095221100c8f7d2c223663012a86a824bd1d32896e12118404824a9c75c153608405ad40042524e03300ea40cd9f8f0d1cf1e11233038966e3a9f404f1611a5ff00ed7700659d42e1998e087da79c366a3670d19d7dd37d585f0ff30cdf9267b112788900f4967325cc1aad91e0e77008884c04fa592898643ce5073492cd65f3493e6400936637a4b9960661288787844dd2841fe50f6bb07701817cec2d9e4e32262e009420df752e58bb0770181767702c395b28d88bd90fc7cc0fb4ab801d08e2a500c8695cab3ce629447e50d60cb9298b868887cbbabb90e3ddcb99d1944230e300aec9a03314442c2e79cb7268f263e0b28e6ccbdefdc8a0e371913641b9048200527754dc581f07490a0381116038241cd258f9023cc107c6325b898986108b0067e27b44a45aff00a23abfa1f989985724faa990332e554bd16cfc4352c98400de5b10d49e7486ca54445e5e9e0819dc038805c62320219e6ffcc42719bb39008e54ec9ed460bb43485626e138952620132d5b866ca953926a2989b0dca99100ded3cc492ca95354936546b4a9549592e726c133133436a97f8d3d0fc4923f00ca79c7cb3f376569e647cd79a32566681765999327e619d6569fcb5ea07a02007797e6313299ac13b4a80e42c7c24443aee405b66871f60686b69f11a2a4c40028e6267525752d3d6534d4dd3329ea652274998392e5cc4a87231d80952569004ad25d2b4a5492354a8020f88223aef7d8f315dedb74e54ad8d06f6c653e9e00f8b7d5bc62a81bdc1d8f90f9fd8e5bdc3d5f8c21e5cf9ee057902076e7ebc800625f2fdfd7cce5ce10a1ee761da97af2a799e7b0a5460fc2dd337eb9b68cfe006734284f3237a8a8e95a585adfd2a4d4c421d6f4bf2a7dd76adba01d713f4f006df3843d48af2a0db7bef5bdbe5d893b5fa97bbf3bbfb73085773cf7ec69d0009af2b13415b6d518037e591d59fdb8108549277a0e83b57bd6d714f51700c300fbfa4222fdc8a5457f50772294a56e6a2971897e795adceec459ff007d43420026a7bf21feeefceb41bd2fcf602db622dc78fa7bf38459e71a925763f4ce4900388761c7cc8f364298b710da54984974ca5f30855c43ae1ff31a6953112b8400a24f81c7a2590b05496fc3e62fc53e18aa9d8bc131444a2b5617b4089335610020f734b88d0d52662d4ab144b5555351ca61654c992dee046bf104bca42802007756013c0281b93d424753154f86e94c4c9f44b20c2c5c3b90cf44cba366be00edc5a56550b3a9bcc66f031092952c25b8b808d8589422a1484bd45a50b0a00039ef617453283b2ad9395365994b9d4f5d5dbaa20928aec5ab6ae9e63876130069a6ca989bfe95a524050298bf460a69e5836704f829448d4e60bfd04570ee002bb007637dc0e7ea6bcfd476def1667e2c4ea39dafaf33e8726077fedb6c7f00237041361b541f52e6fa38197833f263724bd8421d6b7a5a95ebd76a6f414d00ae0570de2efc589667b7c99b537cd9898437f2ede9416a14f226dd2f89dec900d9c1bdf4d58581e02e7a4214bf30492473a72ee2e3b5b6adc61be7c867a13c00c5b9ea7270181844d3af33cefbf2dedf5076e7411bc78bdb98e4e2fe390fac002141e7d7ccee4d3cefd06c30de27d48d2dfb371cdb5108e213fa1e5cc1a8a500fd2b4aed4c37b5f2cafc7799af6b72f3844d3f1adad5a798a1b83bf2bd70de00cac07d33c9b2704027ad9c42269b6fd37dadcf97a9adf13be7967e7a0cee7c001b2be764472ed6370491704576a91435bedb8270ded38bdddbc8f83025df9500c4236dbfd98ad102987e25b8908e62bef1ecb9a25966269b7ba4c3e7aceed100245483efb202904103f95ca8b8a789ff00173b44ead93d9596b36155b41568003c15bd8761ea0321fa7137ea1ad9f17da29fff0093d383fe69cb1ff511ff00007fce36e394b1ef62d2b34f0b20b86a2b557fa503cc28f881ff00a38f1953a3007a639c921fc721e46fe11a1a446fcd04b3206f5f8e49f237f08ed98d8c6da100842184228feba68964fe2034ee65a7d9bdc9acb02e325d3ecad9bb2d46feea00ce5a7d9de4112998e55cf992a721b74caf32e5b99b6dc542a9d662a59348450046c8330cba7196e6f3893c7f2ed87db4c5f6076829b683084d2d414caa8a1c004f09c464fe6b07c7f05af9669f13c0f19a3de40a9c3b11a652a54d085caa9a0069a24d750545262349495722ec99ca91302d202ac52b4283a264b5065cb5a70054a858e441652485252463315c5c45f0cb9da51a17c7bc5c934b332cda3132009d2ae25970eb90f0e9c43c321a79d62218cc914e3f29d1dd526a1594273769006e7b9a4be1c4dd6b8ad3f9ee6bcbb1b00f33e9a97d9749ed2b05aadb6ec3650056ed361d4b28d56d476722626bbb40d80985684ae5ccc3a525155b5bb32b9800b270ada6c129a7acd2012b1ea2c2f10933d0ac85e1ff009842aa30f0a9c84800de9b4afbd534c5c38dd60a9d29cfc1365825ad3129503179ede79ca113256b0030cb731c9271268987115093293cd2026701170ea478d110c46c1c43d08b87005268a1121ef71420fbca115ea5fe058ba2b15413f0eada4ab9730ca9b4f57400b3e9a74a980ee944c9339089a2603632f73bc7046ed8b6ad40a1452a4a92a10062920853f0dd21c65a88c2a7115c6a683e85e73d5f9870f8653ae9c556b3cc00244ecf60e55995ecd593f4fdbcb72087ca79715a939ca05f8d95e47c9993610020a327707a5b2a8d63356609fcf2751d2a91c12f364d332427b4fb37ec536e00f6ef09d92a4db6455ec67663b2126b5349515586a70bc4f1b388d7ccc5310300806153a5c9a9c6717c5a64e954737692a654cc3686868a8e454d64e186536100f36f4f5f734f2a762933f29454e95f7128a426a2a8a9456a4d3482cb9b326900210aa9527b99694a77d6d2c22312321954c2044de6798277179af39e6e9f4d00737e7bce1316db6e659b338cfe20c5ce27314db5544331e32dcbe4d2b654a800490c8206552197844be590ada3dad3554a895454386d1cac3307c26869b0ac001b0b90546461d85d14b12a9a990a57c532610153aaea57fded656cda8ac9e50053ea2628f01c4f119b89d5aaa16912d0129934d4e924a29e9e5b897250f9b300954c5303366aa64d50de5aa3b6a25f0612cc647b30cb5c138a8d867629b69700fbbdc4b0f32a8b65c741f867842bf10d2df4290b4c3bcf345610e3a9560aa7004c754b92b584cd025ad32d4a1df24ad0b12d413fad3de210a082e0ad2953120094918b2b7d2e12560cc4ee2929246fa4a92adc5007e205494ab74b8de092ce00045c0f097c2567af680671121cb066997385e934c0c36b36bac207e121734400242bc04cf48b4566746d198f354fd285ca336e7793baf4874e24cfcc54dccd00ecf3fba64e8ea1edafb6cc07b05c15736a154b89f69f5d4fbfb27b1cb289cb00c2664e41fcbed4ed7d3ba8d061b424a6ab0bc1ea928adc7ead14e0d3a706fc00dd58e6783e0a68ccbc471395bb35244ca2a098196a5e68a9ab967e29726596005ca92b01750b092a4890e666e2194f2ae5cc8b95b2de49c9f2680cbb94b27c00824f95b2be5f95308859648f2f4825f0f2a92c9e5d0c8a221e065b2d84868300846103c2d30cb68164e3e31e2b8a6218de2788e358bd64fc4315c5ebaaf13c004ebeaa619b535b8857d44caaacaba898af8a64fa9a89b3274d59ba96b528e7001b85ad5316a5ad454b5a94b5a8dca94a24a944ea49249e71eff18114c602780038d4e57169edcef699e7a8d8b8599e52f67c68be80f06fa42cb70cb760a027007acb179935575ee72c3d1097d963368ceba750192e7d172c7a0dd732ec8b2e00cb23619cf872ebb32412662cef31594a4286eb251f0960402c57be428bef060020946eb55243efacbdd452970cc947c2400c0b1585173fa9c31290831abd7b0061b34bdeca9fda7ed03e2f74fdd81c9d963591ad10d65d478680964ba0a51100f9433ecca7ba05c40b119050af7b98b8ecd724ca79a734cca71190d0b1aacd0093d5e61ff3e690c89a3f54e1fdd9533997f186cfe1b903aa5c7378aa68f81400a67281be2ce7e1b900712010dabe99c7d1ec1040208208a822e083b107983800a22dc30843084625fda23c464af4638b1f63fe459ce6032496eb1f1bb9ce4700170c998c4c1a672fff00b2beb9645cb32f8e84856dc54d25abcfbaa39392980068a065d0f3e732fcc22434f424246c190a5098948701485957c24a484aa5b0002a664ab7940a4382a09530201626f31018d82d40b16046ea7f5330242cb0700048de60402d873fdb48cdb2e947b31f44f29ba65cecdf377193915e82878a6d004b8e6a5b97349b59a2a6b3295a825419721a2a3a4d2f8b754a40309377190400a9e0939119116a7fb109ab5309ae86f1e3a16fb8eaa5991355747b55a5ad14002830dc6eaae52cdb94a72e25cf1f814f3cce8f48d2b4a5b0b4b6cb65c5a9250094a31d569aa0d628429dc5d44ad2433b8b246801bb125db1d76986d629492500f32ea0cd98b017b03a5de37a0c210c211ea270c7bc860e81fccc2aa6d5250b00212a029d0f8547900938c6a943a37b549f4363eac630eb25ef4b0b19a0dffd00a6c7c8b1e8f1f3c7f6f1f0fc3443da0d9fb304b65b092fcadaf121916b249100b81494b1fbce6edbf97f3cfc42681299947677cbd3dcc11884d6a89f42c41a00188a0fa49f872da83b43d9961b4d3674c9b57b39515380d419841577320a6a0070fdd373dd4bc3eaa9a9a592d7a75a4174bc726c167f7d412d2492a904c95300f04b290dc8214948e87a461900d850fd0fa1a9df91a72e9cbbe378dee3c43e00ae0e5a73cb8691b686e2bcee072fa817f216af5df0de209f47b79dfa5cddb3000c5a103d7eb5b5395afd48b5fcab605657f901e19016e36d59f3400dc79f9000b6dbd0d294b790c4956561986e3d6f93e9676736b421deb5a5e806f514f5bd00f7fcb11bc796673d320e7cf50da0b58227f2e67a7d3a7e15c028dae7867eb7003a58e80dc59a111e87bfcb7da86b4a5baf22712159e5c9ad7b58f47e5966610011cb7ea0ed6a5ed700114de9bd4d00388debbfcf4e6e38e46d7000844f903f00402de7cf953b0ad2c70dee7e77d43e418bddf95c5ddd0a1a75dc0db91a837b00d8ed5a03e57c4ef5f40ecdebe008d6c7239b01087337dfb0ada82b53f8115f005ae1bfae6df5d3c06b96605888450fe246531337d12cfd0b090ee44bcc4ba000a6c50da929298692ce25f378f7d552905b8481828a8a7124a94a4347c2952800a41ea3edd68e6621d95ed64b952d53a648a7a1ae0848ba25d0e2b43533e63d0086ecaa6973a6af5dc42807258e35607a698c1d824f928127c039f0d728a85a00770820b4ff002241216a711039372b4136e2a854a6a1245030ed9510026a5000d24a88091b9000a01cb761e4a68f62f642912494c8d98c064ba9812656174a0082a5330724126d724b45c941a54b4be52d1cf248cb8fd2d6d23b8536dcd2bb0013e57a7a5faed42698e53bd9367990fa723973e9171f8f1b5be99fa7a5e14a0057fbfd8af3e42bcb00a0dcf81b7ab374cf9eb1274ebefdf8429de9c873f5260087a123d37e6de19fbd39bd9ef9e479438ebcbdfd4f943ef96dd36c3781d40e000febc2da68f7b5a1efdb7be113fd7fbf2dc9b74e7de0abc2f773cfa17e6dc600c73221f439fa781f66cecd114e5604f3b73e75e7eb6f9e24ab27f639684720005f966225fdfbcb9be5023ef98a798f5e789de60fa91fb172da3b73cb3887fa005ecd7e1f2eb11e1f4b9a936bf3db9f2e54f2a831bfccf06be439e4c082f76b003bc017f277f973bc4d3af2e5debf88fbe58050d5c75f6edcd9a0fc32cceb6e005fb3e96bc29cff00aefb8fa8b0dad51414c0aadadd8e8de2720743adf8983f00a1f64727f0cf844d37d85c5abf8f61606be470de0dd79873cf3e3e5c20f7b300b6a5ade1c4f4b10f1f455f62ce8dab463d9c7c3e40c64ad996cf750e5539d500e9ea9b4781e982b512731938cb31f16480a5c4ab21ff000942ff0035db62110096366863e5e76f98e8c7bb53da6992e719d4d864e9182533974ca18653cb9100572d1c13fc47f3ab6162a5a959931c0f189ddf57cf20ba6591293c07761940007fd3de2fabc65ee4cd782194edaaf2c9af3f0b64a003e4af19f5c755d325a500956aa3e82c3d5e26891bb2caf559f44b81eaf1edf1931990c210c210c2114e00356b4834bf5e320662d2cd64c879635274f735c139013eca79b6550d36954600b4b4a92dbe86e2105c829941ad422659378076166b298d6d98f96464246b0c00c437c876576b769b61f1ec3f69f6431cc4b6771fc2e7267d0e2b85554ca4aa0092a041520ae59099d4f3923bba9a49e9994b55254b9153266c95ae5aaf495c00e93313364a972e620ba5693baa1f707220b821c104388d75b5a3f6747264b600366d30e1433de449665d98c4bd10d6907107925fcd19765ad3ca2a12e946a400e4d765b9a5e96b214b6c2f5172c6a9cfe21b0cfc46625adb75511f44b61fff0000b453185c9a5a7ed5b66b12c46be9e54b94adadd86c52561789d429018d45005ecfe2a89f858a95b051fe0588ecdd1215bc25d0252a4897933a7cdaa00cca00dc528a6310665056ad295598134f3bbc44b219c2696652cb0e59193536947b0016b8e892c0b125cbf19c136509632a486cca33d6b04540c3a0f8438e31966000b4072bc3f8949154b299db20512953ea03c58e6f55f8e5ec46a662aaaab0de00d8b12a9502542ab07d929531658eea555f336df1098cecea346a2ce42348d0004cd9da29f3953aaf16c52a8ab354ca593df2b36de9d32ba793d4cb3ad845c200652f61aeaf4c1b65cd4de3264320140a7a0745f4121e1662dad413e26d19a7005475033e4bdf6d14506dc4e9fc0baa2a0b51481eecf5ce35f8f5c02515a366003b20a9aab908a8daedb6993a4a921d94ac3367303c1a7cb529c1527f8ece4800018393bc2fc9c0f03905ff002b57567ffcdd604a39908a4914cb0fce72a2eb00b4c3d891c236558d6669abf3fd65e28a321a361a3a1657ad19ce5b0190a1dc0086a110b15a67a499774cb2466a963cb4f8e265da8527ce90cfd54cb8930ab500307a7b6aff001bddb1e3921749b312364fb35a799266c89b3f63708a8998dc00c4cd70664bda2da8c4368b19c32a500b4ba8c06af07988202c1ef0058d949400d2d217a1a1a4a357fcecb96a9b3c734d4552ea274a50d0c95cb2f7cef197190014864595a4d2bcb99624b29cb997a49050f2c92c86452e839449a512d846d200cc2cbe572b97b30f0301050cd252d43c24230d30cb694a1b6d290063c8d5d500d5d89d654e238956556218856ce9953595d5d513aaeb2aea26a8ae6d454d550042e64f9f3a6ac954c9b356b98b512a52892f14a86f28a944a94a2495294a2a0024e64924924ea4c7b6c62c46e2787a9fbc3086ea787a9fbc6975fb357add0d0030f6acfb7ef4a67d344b99b750b8999eeb449a561e210995e4ad7ed7bcaf9c006361587bdec42d94456a86438259314e3708db706c86d1efd05534ec64a58b008de99720073de2f78b24245d4e6c07373788960252000c1d46edaa8926c00b0092f96b7bc6bebfb5fbadf2ad50f6baaf24c962d1147877e1ef49b4b26ea43600df819cc5368dcd3ac118c25f6dc5fc4fc3406a6ca587c2d2db90d1ad45c2290027dcd717541d2a1c5245ac6e38e915100820e44105b363c1af1f4d0e13f30400d736f0b5c3566a9ebe98a9e666d00d1bcc1398a434961113359ce9d65c994c005f4308fe4652f4644bce25a47f2b614109b018c697fe1cbb93f026e4824fc2002e4809049d48003e400b45a4cb1ba965123753755d46d99b26e75b0be8328a00ff008ae2770f110c220a14347e9ede34a4fdb34cc7a83a5ba71ecd5d7ad3990093f97f31e8ef1319e330e5acd108a64c5e5ecf90720c999bb24cc61d8782c3008ec346e488d8e6d6b696ca1d816db787f9e84aa50409894dee85906cd628b1002eee5dc000820289660e4b8580410e95696705363abb390066028e91a7e7b500d7db55c467b5fe79a2115ac595326e9ae55d0fca51d2e92646d3f7e74ec86600b9e7330969cf1a831ca9dc64645a6367824f298094ca8bafc3e5c9340220d8008a8c8b8d9acc63efc5e8d99ff61c64f3148f6934fd50ee2652f1e14e4ecc5f008daf74ecc61bfda1236261c361c2f8718868a8470ad4d25a2989096dc5ad2e0025bc758fef9dcda580cc58ba95776dd70d9024872e0021f1d63fbd773fe1a4003316ba9577667b64efc40043efef842184238b884b885b6aff004ad2a42bc9004083f438823781072208f30d10a0149524e4a041e84318d577f698f42c660d0002d13d7c974a971135d2dd478fc8398e610cd92a85ca7a852c762a162262e2004544141e69cad2c97c2296406a37327bb45151671e9dfc27ed09a3da6da1d90099f3822562b862310a694a36556e1738226a250ff3ae8eae74d581728a40a3006445cd9f9a5151514ca536f23780ff005cb531097d5944e5924da34bb1f75e00ff007e7d2d8f79150cfe99f06e66c7a5cb3c72cf5bfbe1978e5c614a6d7dcd00b956a6e06f4e63d6b5186f0e2ff4e57cba9b3922d6107e473d7c7dfd2ef003006eb534f53f76f2de95c4be9627ef97bcf80bc1db3cbedf3e80687a4295f9d7007a53b77af4f3df11bc3cb3cbcddf2f583dc73f672078dded973853f3febfdb00cbb61bd7d35eada65c4e5c4335cc4bfbebc467efac29bd0f7d80e96a01b0db00cbbd30de17e4fd6deecf9c3dfbf7f78529d77205052b7f2bf4ebb576181531006bf1f0bbe6346279db304b438e239df27ca143bd283fa8af6dedf9df0def9e007979b9e46fe8f683f9f07f7a7cb85e1d29d79d3aefebbde94adf6b8a86bae400dc321776d3c32e707fbe472fbf2d7d0294af2b9b6c790bedd6bcfcad50dee300e0e6f62ccdd5f906bc1ffa8f13cf4cfadb310a6f6faec6fb5f737b8eb4b9a100c3785f96ba11eedc09ea041ed91767035fdb31d358e9ba8b0a98ed3ecf704a00716d223725e69835b89a789288b914743b8a15045425c552a36df738e2db730021359b15b5f48a702a76631e93bcc0949998555a12abd9c2885273048498b700383c99a08cd0b16e692d9f0717d3c23b7c240b12e84869743252dc340c3b300070eda004a10c42b6865a4002d44b684a5236a0a5b7c6e30ea745261f43492d002128a6a3a5a74240b253224225240e00048f26cad1290404802cc06af6166c009879b139b0b79e80d850114dc73b0bd46e7cafbdcffa7309273f7d3844807c002eec6f99e0ff003e59b8572a58817dfbede66e79d05ab5163887fb79ff0058008bbbf117d383f0200cb8eb716811bf7ebb569622b5ea282be55a0c4bf1d79e0079f9f8ded6685c35b2b5ae59df466b31eadc4c4048b0f4aedd8f2e9dea7f98008e580d7cdd9fdbbf9b6512497d2cd6371c5f8f12e34038167847a577e75af60002943d6a3c860ffd3c7de4c79c47c407cdf22c39e761766e6e5da3c26d51c800834ec491b6db0df7af5be0f6d33cb9b70f3cbc74892e0901df30e1c0d0df9300f874cd4dab7df604d00af98f41423a13420fd32f7970cef6b40be771935c100009007cfc0f100982801414dfcf6edb8277ef4b0070737bfd38587d78b3dda0001c5c93912c48cf9e4c3261a16ca24276dadea2c7cc1ede9435a0c1efe26edc0073e57e1e5104ab3bded667cba1b67911c80bc08de82f5bf3e76edff48d4f40006d4c1fecfe8edd2d965767807162fad85896009e1adad72e6e6e4fbfca996600679cb3465bca32463e26739a67d26cb72760923dfcce7930869640346d5ff30022a29a46c6c6805b18d5b57268692aab6a15bb228e9a7d54f530f86553ca5c00e9845f2084a8e9d2214a294a8a8b00952d4782521cb33b586be6e6df554d3a00c952dd38c819134ea49e254a321e4fcb192a50549085aa5b95e4b0323802a40027f952a54340b44a4581240b63e3b6295f3b16c5311c4e781dfe255f575d38000cbbeaca89951300e3f1cc37d63ade628cd98b5eb316a53735a89f998ad6c30061965a687fe6d094f9900027d4d4fae2fa53ba94a78003cb33e39c6e909084002503f952078ea74ccdf28f2e2a8ac027286115841d587a9f7e30c22b0848e700d618454c0641a184218421842184218421842184218423e3a3c74ea9714bec00a4f6e0f1aba85a039fa69a47ac5953892d6cccf95730424249b3043c669d6b00bcc2659f241033992664819de5dcc72b9d641cf525887e06752c8d661a62980058f658829ccae0df82ae4b84312094a94090c1fe224120000120825866498a005164b16704bb30d4e8001e9189c9b4f75638a2d76899f6689bcef5375af5ef0053d111369c4cde1133dceba89a8b995085bcfb890d37f19399ecd528434ca10088660bc8661da6186db6d154c2c8597664a8b9d2c624e46ed637e1cf5ca3ee00a7a5390e034b34bb4db4c656419669ce41c9d90e5c43afbe0c0650cbb2ecbf000843f14a5c4bc0c3cbdba3b12a53ee7fade5170a89b09042520972120136b9000189b048bf24a470005a003002f6005d9ec356003f40070023bf62a898610800d7fbf698f8249c71b1eca6d6083c95288a9dea770e53794713790a5902e32d00c54d1bd3a97cee5fa872b4a5d52171def74a73267899404a21d662a699825300228783622a3442c2bd4aaca42ffc8b04e7fa540a146dc028ab23fa5833b8a5005a1e041c9ec6c7c9ddf803c4c7c8431951547d5ebf64ef827cc5c28fb3065700a9b9f65b3093e7ce30b3cc6eba993cd201d96c749f4cdb95c0e54d2961e65e0001d886b3148a551da8f2c8e21088892e7d963686a8c179fc5fd4b5aecca64a006dfc887673aba94b50d374860ee4da28de5296f9b01d12faf52a3ae995e367006c5514949198f1f7f5861110c2118dcf6ad68d7f8dfc06f14d911a0b31cad200c99e7b9325b405baecef4c2221351a5b06d8a13e299466536e5ca291e30dc7002fc355531cdfb2ac6ffb39da76c86246d2d78b48a09e49200918ba1784ce590023fe6915666dece804da31a42ff2f89d3ccb6ecc5a525f2699fdd2b864ef7f00de3e67fe1f4af3e62b5dec2bd29524d6e4db1f5479feff0038e6d70dae590200c72cb41c5ec03586622483526bb8e42f41caa7627952dcf7c1fdfdf8c0060d009f5259f5161a017e6e3531053f23f3a8e7b8af33eb5a1c4bfb7e4c0f87b61000f886619bc9b86ad76f01a31313e1a8da972295e57b8b5076d89b1aef83f4d200fe563c85ada1881bda6ada5c91c4824b16cc96bdad971f0edb8b91e5dc58720016d86d6dea7f4b8cf973b3f2bc4deec341f5e2fa9b92e0deef90269cafcb63004befb72ad6dd397312e7df4d6fa6b0727891ad9893e7605883cc917d013d8800a9b7614df634a9eb716e6307e9e43df2e96893bda70f5719b72e16777b447800457b74bf4f4d8fd01aec70249cce597bfae7072c05f5721b4e57b903a027c20039f86c472b6ddf7e753e47a0b1a60e7f6f2e366e595b260229214fc4dc9e1600c80b69c83972cd9c70f0f634bf98de9b9aed4edc88ae0faf4cac6de1a36b7c008c54e78e59f0d01e81dee41c8dc089f081b035a5286845452f53d6bdac0f3c0001cb97875be711f11e84b9395ae34e0dc4e97223c11702c4c616225f1494b9000d1d0ef414436a154b90f16da98750a0770a6dc5248248a1f43878853a2ae8002ba96600a975547534f3126e1489d2572d49503982951046af10a75254345200482f7d0e7666208c85f2d5c7ec372491b9a922f7b9ebdb9dc5319008012072004eba5ada7887d013ac56dcbde56e16c9b8e90a6ff97e67cb9f3a5ad89de17e00a40c86435736bf16cc44ebafb6f7e7c61423e5f8f5f9dbb114e586f0e205f500e1e2cdf77b11784287f2e7dbf5fe9b61bc3ad9f41f3bdf4b6bc3286e9e5a7f004f7a4453e9bdfcedfd0f4a8b61bc2d7f477d34e27ed9e46f0cf2b71f7d624800b0e763b5091dcf2a5ea09af51b0c3783eba31d2f978bb8cb4be569f1f7ebef0058529db73d3f1a6e7a5f7b60540d81cfc7e4de6e388d5a19fdf87a8b716e1000a72bfcbaedde9b6fd6d88de1cb419defabf2bfcdee1de7afbb7bbf1c943b6f006aedb8f51d2be82bd0e242835f319f5bebcdac074106faf0d4fbfade229cbf005f5a53d6fdb11bcdadf9e8d7b87176b5acf6b44fbf7efe90a57e74e7f423ec0080713bc0e4fc6cda072ef969c33cf3686f3e233f7e8f768be0f66a69d3daa700c7d7091941b4071b56b8e47cd31ed783c69764fa7f336f3fcf1950b7f2bd2700cb11cd15ff00e6c2fc641f050f5ff6ab8aa708ecdf6d6b8963fd9fc428e592004069f8949386c820e5f0ceab96a19bb3067b61e20b12e8aa97a890b483cd6000cb1cf350b795e3e99b2f6c3b18c24ec17e33ff00f4c158f425201f3c7ca692009de9a81a3bf9027e91c0a9d3bd3a58393b9ffa20abe623b9e3671bd4a5ee7200f9c308b800194308986108610861086108610861086108610861086108d11300f6b73d8e7aa3ac798f26fb473859d33cc3a8d98a0f2f4ab4d789dc8b9032fc0064ff0037c4cb648b54369f6b0424865298b9c6616e5b2e884644ce9fbb20220062a4b2294e4d9c390c64b0198a672ba52a1294a52ac85b152893f0ac00904b009202549001600050073528c527e1249c8e65ec0861e0e35b00d7ce3175fb2f00fec61d5de2038c4c97c677109a5f9a323f0e5c2dcfa5b9fb28b39ff2bcfb2f002b58359a01a5c769dc16566660b934546c834fe7625ba873e9f34ccce4711100d249165289848f67304c8cba56b4cddd4a1972c9256b0414ba4864862778ef005cb061ba4120b022ca6018806e6c43a4b81ccbf0c9aec63ea01898aa184218004238ad08710b6dc425c6dc4a90b42d21485a140a5485a540a54952490a490400104820838423598cd1fb275eca6ccfc570e25cc8755a4f95e2738233dce78600394e6b92b1a07359e7bd7a36325a9973b961dcf12bc99339b3889ac6e4d96600748694b3476472812aca8e3597e1ed8428029ef57dd9046e7c36496b05b77900a100ef92028804327768dd396f1ddc9b95bf9b3d1b3c89d588d9725b2d974900a5d012793c0414aa532a828596cae572d8562065d2d9740b0dc2c14040414200b6d4341c141c334d43c2c2c3b4db10ec36db2cb686d0948b996515c7edc21000c2285201cac7d21845b2082c63abe6d9540ce253152e9942b51b2e98c345ca00e6308f242d98b809843390f150cf24d3c4d3eca96d2d3500a5c239e2ccd5ae004ae4544a52913644e44c97313652168505a1693a14a90083a18c1ad0c99730006685b38cc3dc17e45367d4f38f944eade467b4c75575374da25c53b11a7da80039cf23bef2c10b71eca998e652171c5a4eca52e00a9429504917c7d78c1712004e2d836138a246e8c4f0da0af0919245652caa9001b693000d61616ce39ccb00589b2a5cd6b4c9695b7252429bd7c6d9da29f52fb53f2bd2a7d77b6367bc1800b17f3cef96762cfcb8c56c0e9ed88f9130a74e5bfd7b6df23caf7c4ef0cb5200e3986e39b7cacfca262294eb715eb5eff2fc29cac704798e17e5d74bf8da0d00fbf31efdde248bee37b13420d287eef415be0141b5d39e7a71b71d79981f7e00fdbe50007e23b72daa47991df913511bdadb5e7913c1f866c5af7d0c37db3d000e6dc3d32e0d0a6fcea2bcadccedea29c85cf3c4ef6b7606e58b31723e8fd7008189f7efdf0f08236ebdfe4476f5ec69b62778717f4e7af2faf02c6fbf9c28003b733d2a773daa296e77f9524b59c970d6cf2cc1e25c72b1d6d06f7efe50a7007deddbf3edc81bd36de7785f96770feb6cf9e5abb08803c2ccc3287d3efe78003df5e4dc8b1b9fadb818365fb67a7101b90e1a06890282b4b83cec2bbf6da900b124d4da9883c1eca19679b0d7377e591d6f13f4f76fdbe70b836a1a58f903007af3a7e22d5a62c853b1767008bf93716887b8cae1ef637cb5b9f7d57fa75a00dabcfd7af3c4ef0cec3d38e6fc8f94520ea73d43f077b58d9eee3869f1437f00b36a7f603a7e4de70f6b9cf237b72e37d74e02241b07e21efc78bb59dc117600d32b2a79f2e4474e5e5ca9f860f66d0f07235ebcae4365ce04f83b31cf3e870042cef63e311f76e7f74e7f8e00e447dfaf2e460fcb205db3196a6dc7d1811700857f5e97edcb972fa5b07e7cb9dee4710487f3f083d89c81721f3667d0f5d400344d0ff5dc5adf2b50570de7cf9e97b876b6bab6b7cdcc01d1dcb121ede052003d3326ed0dbefa7507cab86f659f2d45ed9876e19d8e5c621f50efa6b990f700cb3b5cf880410de96fd4d37e97bede430de17f5cf8eaf7e77eba40171c436a005c872c474c8dc82d7d2d1df02a075b9cb9d9b5cdecd7e633897be7996173ca00f9f46cb3243d895fef9f2dcfcaf61f3c1dbd97191cb3f3d48d5a2064ccd6be00a5f95c9b599f97000e6b3d805a5d98b3efb46b4fb374a619a7247a3992f51f003e66c8a79cf7698697cdb284d34e654d4302087e3a2730e779516e1814acc000b1318b154413831d0df890c62970eecbf13a29cb509f8e576178751a121cae00648ad9389cd2ae12d14d4135d6cdbea972ec5623538e4d4a282620d953572d00090d7242d2b3a65ba855fa070e23e81f2468979c788fe54365009ff9ea2926009e49041ffac3adbe7552a7e252b4018753fb0f58e3187cbde98b591f0a53bb00ff0049441cb5b03e91d9719d1b886108610861086108610861086108610861000861086108610861086108610861086108610861086108610861086110a0e3009e91eba6b4f817bb16a9e7ef503f027166a3fc2572ddff00b4235f57fe02fa00a7fed08f9a17b59f4f6134cbda37c5ae5c8152550d31d538bcfa3c1fe943fa00a72894ea646b2050784311b9b62580903c290d809fe5a63e9cf6358a2f15ec00c3632a667eb9783cbc36f994e113a76152d44bdca9144853f13772efca30b9008665052a8e7dd8961fff00c32658e04bee79868c76f7fbf3c7669568ed761d004e9c72e3c79c679398d6edc727b677f4623a44d4df9fd93dadce9b751838d700f773a6ae790bf9c1eefa3664861d1b339b8e97ca1e7d09b539fd07d36eb4c100f83ff43cdadad9ded6d60e5db9dae06a3437b0bf8d833188fbfbae1bcdaebe00bf7f51d221f8781cc663a70bd8900b82d137fa7cabfdfe7e986f740e4b79e900a3dadab5b4b4926c2d72c6fd75b312d6e6f9343e5f4fbe7b73da96c0a9f37200e781cefc59b2f0b642f11bc38121d81e6f987f16e0cc73b47d9f9ff6e9fa9f00a67ebc3f6897e362e46a6e4e59f2be9d18889bd87e3702bcfa0dfe788de0c700c45b539b0c9f2b0cb8443bbe65b90bbdece483cb3b0b5cc2e6f4f5fbe95f210060795677864fd787db43cf37768926f9b01c1cbfd34e6d7e0f1153cbd2c2b500edf977be1bc353c079583fa873ada00f136bdf2d4b38d2d6bea0bb9631c80a009de84edb751b743d85fe7815b02acec5f33907bf46e601e907bf1e399bdb8000d396a7211f9e0a2d99941c24c21549721e3e1998c61c49050b622da43ecad200454514dba9524834228474c6b682a515943455682152eaa8e96a1041b2933a00422625408cc14a9c3686c62d05020173700b817e872ebd752d1fabc1e87e7400b13daa69b915db6dc9cb7fea49cedf603d86973c72e6472cf4d487b073d220002483f3a0f3a52bb1e77a8a53cf13bd73abdf835f4b9cdbed95cecee4e62faf00d74c98eb99193c3736e9b72daa3737bd6f5dabdf10e752ef9dfcb3e06f6e3900c493660486773bd9bdfc723a0626f7ce3c279d852dcf7b0171bf5a0b72e58300b707bf1f30c4366d6e1ce201e6d7661c05c805fea493e2fc827a826e2b73720077229d2d7f3b9c1f8721af0cb98f4e99447306fc72b001bea3e6d1052456d600a5cd77ef615a0b1f21537c1ee7d73cfc0eafeb689b71e366cbccb124378b5e00d7048b6e2f6af5e74e40da82a7d2c0e0fa3e7ea58f10e753f2660c7f1f1cc6008e466dd397213e1e95dc827cabe76e44732296c4bbbbf86b7b71e01d9f2eb000770c4f3d7336d757bf017cf288a5390a0dcd6bb1a906c2a6db52dcf9521dae004f1bd9df4e976bf585b89cedc9af93e57b6b997d0cf84d39de951b72f2ee4d00771dc8c1cbbf37f1f7c21bd7f1b665871b9f439f28d9abf66426d2887e20b8009690bca6bf7e4c747b2dcd65a1411ef8cae4d9d21e12745a24fbc0da62e792003f7c9455254592ba78514f29fe2ba4ce56cdecb54241fcbcac6eaa4cd3fcbd00f4fa052a46f68e5122a18b3b6f7126341b40099121407c227281ea50775fc90041f563abbeeb32429f877523fd41e255b6c50809ef7a2bb58f7c78a294fc0a001a85bf981f631aac388dc58d77cfaa52df231ee71951b28610861086108610008610861086108610861086108610861086108610861086108610861086108600108610861086108f41388c494fc2366a7c414f11b0a5d28ee6b452ba500dea00061d4cc0477692e5c6f372c93d5d8f846a2b6702f2937254ea3e2e13d722780065c63e61ded11d538cd6ae3938a8d438c8a878c6a63ad19d6472689842150c00e656c9134772364f5b6b4a94973ff9ad96e4e1c7927c0f3be37923c2b213f50033b34c21181767fb2186212b41958150544f42dc293575f2457d6822cdff00000baa9ec9374a592728e5f452fbaa4a69601004a4137b952d214b1a5c151195009d8f3b32a1a5aa69ebdb9924731415069b014c73905c1bf3d6ecfa0cdf3075006d5e32c10e5ecfa83c1b4beb91cee6e4de27c3da94b52dbd29426dce943d4900b11727d4e9c5f8eaef6f2f3ce9278bfcb5371d0bf1d72d20269435df71bedb008d8f4a914ad453a9c1dac3476e4fc4716f1be76107cb95870ea1f23ccfa30800929b56849b56e6b5163d6a0fdd45b076f7c6d6e199ea62a0407bd83b78db88002ff7d2e638d286f5ad294037ebd8d050fcb9df07b37efe17b33fccf120c58100b366c09d32bf17f4cf3197329f3ea79f4aee2e6a2bcff0183b1f6fe86d6b6700941fd3af136777663f21ce23c34adcf4245bd2fca80d6f6b545060fd38b35a00e5fe8dd2cf68383a78124be5abe7e17e65a229d80e77f216b91ccec6d5df6b009c8d74d391e5e6e1f3e7076b5ce42c48c8db8bf0195af99b0a7feb0a1df7eb007e4390bf2af4c4ef33eaf9b9f06f53af0c99a0fc6eedaf86afcf3e2086880200bd0d36a56be55d81a1dcd6f4a5c5a1ddf26e4c1ce4ede1a0f273125ae2f9b10076e3739b93607abe42d1f9e363189641c54c629496e165f0afc6c438ab250c00c2b6b7dd5a89d825b6d44d6c00e56231310a94d1d056d5ad4132e968ea6a1600a240094c890b98a51b860024972c337d620a804a8dd8051cf2b3f1bb5dcf07002c63abe9bc5a63f4ef20c7252a6d11b92f2ac62507fd494c4c8a01e4a55424005521c4824137046d5c71ed8aa9155b1bb2952976a8d9bc0e6b1fe53330ca5500904e5bc924a5859d2fa5ed4b732e59bde5a0f8103ea7cf9c775de86ff7d41a007e74e5d71c99c8e0c3477d74e0da3dac0dd845711cea7f4fba501a9b505401004ae054e08e3cf2000b5c5defe3c5eef7eff6f189a50d7efe57d8d80daf51bd00037b30ff00517cf4d7868e7500421b7a9fcb9fcbb74c4051e37e77cb4e596600332ce433c4dfd75e3ef3f588a814b11b816f5fb1b9a6c712547883e16cae3900bebe8439111eb12457d7e9b0adf6229e639621f836438bd9b9f2d34e9696d30037e17f7edee214e74e84de87a7ad3a79f4c4ef9b3def7b0cb973d7ddd7f4d500b9e4ff004d6076e7d7b9ea39de9d29e7be277f871bb66ce496b364d73fd221004df9795adbfa73db9dc5ce20ab23a8f007eb7cf4032630fa4398dec3adbd7a009e95deb6a9c378e7c2e747c873b3e7902c322611779c09f1573be0bf8a3d2f00d7f9542c44d65796268fcb33b65e8779d69599320e6285764f9b254da11150008cbf1edcb629536902635d300c66695c963631a75a842d9e17da0ec8c8dbad0092c5b6727cc4c99b572533682a5484abf2b88d2ac4ea39c494ad499666a04a00a8284f7aaa59d3d082952c2a31eae9c5553cd9059d6014a99f756920a159120003d94d729240b911f4add22d59c8bab9913296ab698e6597671d3fcf72583900ee5e9fca5e0ec2c7cba2d3501493e17a0e6302fa5d8299cb235b62612a994300464ae650d0b1d0d10c35f2fb12c3711d9ec56b709c56926d1d7d04f5d355d200ce4eead13107349ba56858699266a0aa54e94a4cc96b54b5a56784a4cca39e00a44c494a927766235b6441c8f1491620d8b178adadb887901c6d414856ca0600a0fe846c41a10410704a8280524b83efce3752e62662428105f2235fdf88e5001cf1545c861086108610861086108610861086108610861086108610861086001086108610861086108610861086108f553298261d0a65a502fac11507fe280011fea34d977fe51b83fcc4529e2c79f382014a4fc66d63fa799e6d96a338c000aaab12c144b20ac86247f273e45b2d756667c44fb5938facbfc0f70d9989f90034ea095af5a9d2d98e54d1fcbc88a499a41474c195c1cd350e261db59888790046498479d98c345bad9868ecca24b2652bc31b10e31d99d8ef67753b7db53400c2a244cfecf6133a556e3752a49eea6225a84c9586a5646eaa7d7ad225ad09003bf2e97bf9ece848558c3289559500a81ee6510b9aae2c5c21cd9d66c7321200e5a3e768b5add5adc756a71c716a71c71c515adc7164a96b5ad47c4a5a964a0094b554a944a8d49ae3e9702c9dd0c90000909b01ba00000166b580602e5b2800e6defc07d8470a0f5de87f1a6dcc1b0a7fbdb5f125577e0ed9ea38d8f1d07000c99a7d35f77fb9f0bc2df3aed5fa91d36df95b6c0a8b9bb0393862c7874e5d005b38881ee2b436a0afe3dfa6d6adaf86f12ccff66f37b664bbe6c2272cb5e700f407ae7a7510fbdbaf3faf2ea6bb1a1ce60f32ee1db8b598f0b70e04c78429007aefcb7b0f4ebbdfc86f88de3d3d79e45b5d4b9e70853ec5bf0c4956799701009fd5c65ae9c06778919f86a075d5edcedc620815bd7f2e43d2bca97dee307000756d4b783836e1c98eb939713c2fea34cb58934e479ed6ea2bbdb7f507cef300bfc7ebcf3ea2ee0786a17f31e9719f4d074ced0bef4ebce9cb9fe1cc73e56800dee19f1b73e0dc49cb3d3326202df86dc87d4f6f3f5c46f1e3d73074e0403c00afa69944dcfcfce3a5ea44526034ef3ec7ad2a7110592f3545a9093fccb4430048e39e5a478881e221b2002a02bd3971adb4aafcaec76d654aae29f66b1c9a00458b9461954400e40751dd480e0127abd134912a61cbe051d3449c9ecfea49006d629ef0cb35889be87641888a7d710f43404c2561c71212530f279d4ca570002c0f0a520a21a06121a19b552aa4340a94a57894787762b5cbadeccb661736006998b9322ba8dd4dbc25d16275b4f225dbf96553ca932d0e3f4a0664b9a6900083225ef5ec43b5c3294d9170c0365701dcde2bbd2bf67bdbd7973b6e0571da005bc388f1d6e45bcbe59e517ec5defccea7c08b162c03b71cc429df7fe9cf97003efced6c4ef0eb673c873fb67ca2a6075b676c99981b8f872cae7481161fd000ec47cbb77be0fed8fc9b98f5e11045b4b802e0bf4d58b330b9cefac452d53c00ee3954d4537e76a72bf7c1f86b6b74fb5fa783881c3366e17bb69a5ac46aec005a276b75bd6a7e5bfad077af4c01072bfefd7d3ce258306be4df50013d4ddf0057160edbd76fbf4ef7af2da378313c34d7edd2ed95dcb452c9ccdc97f3677d00350458b13936900deb7e96b8f515237b127a62a8aaf986616199762f617cc800624f07e11343cbccf6007df4f9e20a80cfefc9fcaff2b883371e27907e20d800103af32cd11d0f4fd3b56a797af961bc2fe7cdba69e36662fc21811eadfb06003cb8310778b089fcf6f4fbdf99e75c1c7b7ebf2bb682e62a200bb0166cb91e0040e59df88d21f2e5f7faf9e0e3df8db8bdbdde2181761c6c001c9d89d082cf007bf58cb57b32fdabdaa7c00e6439566f0d1fa93c39e63982a2b34e9aae2d28009965c8f89280fe6dd3a8d8a588795cee884aa65258a5a24399190b6a304be600860e7d2fe9ced53b21c23b46a51572152f0cda6a59611498a041eeaa65a02800a68f124246f4e90e4897390f514aa628ef250994f3357886192eb920a5a5cf004864cc6b2983eecc6177c9c17473168dec7862e2d74378aec8109a97a03a850027ceb217432dce25ad3821b31657993882b549b37e5a892dcdb2fcd5b2873d00da2321db66399408e954547cb5e6231ef026d36ca6d1ec4e26bc331fc3e75000cf054652d43bca3ad9692ddf51d4a1e4d4ca2e1d52d7bd2d44cb9a997312a4000e25325d5504d28989282e6c6f2e6016749059438949706c58da2ea61a6b0e00fd12b3ee1c3b85ff00a09ffa2e586fff003fc2790adb1a645421763f0ab9e4007a1fbb466c9ae42ecbf84daca363d14dff0069b48f66082010410454106a0800eb516a1dc5f19119a149391f7f5f089c22a861086108610861086108610861000861086108610861086108610861086108610861105406663c2f44310e9f1300ce25039026aa3ff5522aa57a03d4db14a9694075103e67a0ccf8459993d12c003a884f5ccf448b9f5e61a3d0c54e16b0510c0b69d8baaa7bc23aa46c8aef53005574f09c61cca925c2030ff31cfc387ac6b6756a96e25b8196f1fd5ff440b2007e7d23101ed0ef6b970fbc0bca669956163e1355f88688837449b4a72ecc19007dacbd19110efaa0a6ba9f3987716d6569536ea1a75c93254fe6e9a35110ab008194332d89727705dafd9b7637b47b7f3e5564d42f07d9b13019f8bd54b5250075494ad2264ac2a4ac3d5ce20a877e40a39252bef272a624489976870c9f5a00a0b53ca92eea9ab70557b840375127351f845dcbd8e889c4a712dabfc59ead00661d67d6cccef664cdf3e5a1961a6d2a8591e5a92432dc32ccb195a521c7190093e5f9521d5a61a0da52de8888762a6733898f9bc7cc23e2be82ecbecbe09b001d83d36058152a6968a9815124efd4554f50489b57573982a7d4ce501beb20000002654a44b932e5ca4732914d2a9a4893253ba94ddafbca36752ffcca275200e198064800505f3f4dfd36a8daf7fa134c7210416e61fe9178016b66e5989200dd1b8f1719100650e7f4b123eec2e4f952f4c1ecfc9c7bb7a911278b67a86c00b8dc1d03172cdc1c80a5c8efe9e7f3e9e7cf07019ecff4cefecf27b452c03f0042185f267b971a139b8b6b6876fcff00aff6ed83fbd736f5e3d225b237c9b3000e2ed67d2fa870407689fa7e553f3e97e87737c1febe87d4f2196b06bdc378003d81d2cf7d4f3be6008fbfa7e7bf3dfe4de0e038be57f7cdb8b671240c81e900d1b56e6497b8371a9872f2ebcfcb9f3fcf076fa7bfa794411663d491726ec30036625f3ccb1ce1f7f7fd397ae1bc1db90e8c757cbc7c070830f912320465c5008e9aea6e4d8473f5b6dd3e9f89f2ae27dfbf6dce01c97637f116b666d70ecf00ab5d8989a72b7af9f2e56e44dad7af38de1e7d7debe2f67789616c8bf2e8f7000c323671990466d0a7e5f43bfd7f0c1c73d34cdf87df2e710c0e8726b8b17300a37019176660e3334238999ac4c9f43b3f4442beb877a26025f2a2b42428aa001a7339974ae39821495242226022e26196aa0294bc4a149584a8756f6d55b30028bb32da899266194b9d228a8f7800ea975b89d1d2d44b620da6d3cc9d2d560070952882080463d55a9e61762c079ac0019b221c39bf38a53c114f1c8ed34900fc95f7d6f2a459b22150adadc4a842cbe6b2f81896d869bff5b6d2e62ccd22007c47f956f443de1248584f01fc35e24aa8d92c630d5cd2b561d8e2e6cb429600e24d357d1d3290808174cb554d3d64c1a2a64c9845c2a2c502bfba524e617600726c08496238120f893179dcb6fe9f7debdb1e8a7cef9ff5d7a5f52da98cd70039faea0dc8172e41619bf2b888dfd07cfeff0001802c431f3d2df472d12e4600ad66bfbd1dc369123d3efe7f76a8be0fcce4de8cda5b2fdf53f858e57d1b9d008903ddc8fe9f874fcfd79e0fefedc34ca21db81e96bf10c031f5f02220fcad004fd797a751c8db12fcdcf3e77279dc6b6d58bda5ec38b58f8393937273910e00f9913f96fdee76fa7dd71009f2cb4f571980de8200e400d35cddb4ccdc365900e8d114efd87d2f7e5e7f960f6c9cea4fb7f17d7903104820d9cfafcc93aeb600d6c043efefd2b437a1c1c7df406e7c48cb3bfa432360e351a1b916e39d9dcb00f487afa74c016f79f5e59e57f4225db5ea0f1e4d6001c998fcc4edd363d79f002f4f972b8b624976e0cda699736637b5cbb7238c9f46e3766038b07cd9f30300808fbfcb10f667b6796bf33104d80d2c72b3e5d4f3e7668604bfdcbf13e7c500d9e2779ddef9dcf3f0b819e42e070022ac68d6b9eaff000f39de5fa8da27a80099a34df394b56d96a7196666ec198c61a790f9974e204fbc96cfe4cfb8da0c005c9677071f298d40f771706fa3f94ea31bc0706da4a19986e3b86d2629453000106455ca4ccdc5105226499969b4f392144227c85cb9d2f342d26f16a6ca95003d1ddcd426625b25007c41cc1b9629650b8caf1b39f08bfb49496d893e51e3003f4c1e79e426025eeeb0690c333e27a81985766d9b74ea651acb687090b99400de3f274dd2824bccc97242006210f95f6cbf0c414a9d59b118aa520f79306000d8cad4c92ea5a64d26252a5a89194a932eb6496f8553eb8fc4b8e3f538082e00aa498c6eaeea6e5a9dd42c0e19058eab8d91f87ce317870e26a4ec4eb4075b00b23ea1b6eb0e443d24954e5b86cd72d69a59438a9de469c2603364928aba55003691c18750a4bcc29c6568715e66c7f6436b36467aa463d82e218610a0913a006c93328a695071dc56caef68a796ff009a9cb20ba4b1040d2ae556d1965a2600cbd03a77a597bfc258a09e61cc5d1b33b58a07994a80ff0079a2507cca5454000d7cc0e6072c685354a1fa920f3163d58b8f94568af586df483c4a4b1b722e000f981c23d8353683700aad4d28da8e248f5f1202900772477a62f26a259cc9004f220fcc38f7a46522ba5299c949ff00524fcd2e3dde3f7a1e69cff8b71b5f00fd45a55f81fba62e8524e4a49e841f94652672159107fdaa0af918f257ee870015457be9e3e87ed0a8eb844b8e23ce1844c30843084308430843084308430800871c442bcff0bfe184415246a3e7f288240152401d49a0f5ae04817258713100066245fd721e24c7e5723a11aff5bedf9215ef15ff00e140511f2ef8b6a9b200d39ac7405cfa3b78c585d5ca4e6b474077cf926e3c63f03b3a6124869b71d200362a21b49f2ff52a83ba41df95f16555491fa5255ccd87d4fa08c55d7a6e120014aeac949f99f40fe463d5c4ce625485a8adb8669095296a4d13e14004a94b007564f8424024a814002a49b57164cf9ab2026da320392f6e67a3379c62aeae0072ec92100d9922e5f9972fd1a3187c537b5bf81de15216650f9b757e59a87900f2121dc718d35d227a0f3fe6b898b6e2130ca809846cbe3519532b45b4b2a7009e633766491c508469c761a1a29d30ec3fd95b29d8eedf6d7ae52e97079d8700504c500ac531a1330fa44a0a4ac4c9689a835956822c9551d2cf46fa805290009de526fd3e195b544112d4849ce64e7486e2c415a8734a48e79c6aff00c68700b7ef89fe216166f923426093c3469ac6ae2a15c9865d9a3934d5b9f4b1d68b001eea619dc3308c65743e3fe15ee325cbe593681716a83566999c3a14b7fd5700b0ff00878d94d9b5c9afc7d676a31497b8b12ea64a6560f4f341de79742553000d594bee6f574c9b2660017f9494b2c9e4349835348dd5ce3dfcc0c7e2004b00497d10e5faadc581dc72230351b1b19328c8a984c62e263e3e3a25e8c8e8e800d7dd8a8c8c8b89754f44c54544beb5bd111310f2d6f3cfbcb5baebab538e2d004b5127d0484a252132e52532e5a1025a25a121289684801284200dd4a129f8005294b0480c1846e136b0019ac960c006b37017dd00e6dc63f362a24f1e1f2f00a59f98112fcdac081e0edc386772c350044d7d3e5ebf3a6ddc81be0f91cf97008307fa8e1d4c1fa3f0033d007e6e6c0e56b3b08e9e66ff007cbd09f3c4ef58005d88f9f1362ef91bdc9c98393d85c0373cc96b12de57cdee2d79e5f3e9dbd600837f4b0a8c4126ce4db89d7970d221cdbc4e97bfa6590d4060f788fbf2bf9500ff0043bda98390cda5fc7ddb87d40e433e0c35d09b5f2bdb2f181bf5b773f700f7df07f5be40deff0073d39b4492f7391b3bf0d406ea1c0b3e44bbbefcf6b500afcade7f23f5e77ebf319c1f52789b837367c8330f3377ce24f9d796ff002f0041f7cb07cdadf6d6fefe6e3626c346e84686c48b0d393dcbc7f4f98fbad7ae000ff6f9fdfd88873c321c18821f9bf13d464cf0fbfbda9f8fe383fb73cdb5d100fddde41e1a3e4e6dc7cc96d720487261f4fbd86fdfd3b8c4b9d4f2bdf30c4800e3ab5f5ea619f137bdc9d34e976bbb1b17b85ad6079fdff4eb88724e77c9fc005eedf4e510ee41246432278ebd3806e568b33e37276ec0e99c864cc3eb68cf007364318a6d0b481152f95cba3e256c3ad9fe75b6998392c89f122c87619af10091e340579d7f127892a9f64708c35130a1589638899310143fbda6a1a3a85a00d0a05c9426a67d24d2dfa568439bb1c2af57f76816054b7607400bdb4b907300cf4772688f03798441678cdd965c7db6913fcb90f3165a714ca0c546e5f8e000869a60ad41e71f4414e66311ee190a0a876621e70010e950eb5fc3662c9a5d00a8c6b085cd084e2b8422a25a14523bea9c32a53b92d00b2953134d5b593425003ff172e62d56408c7a1534c5a5db792e39949c878127a03193ca5bb580b54d00f6269b57e7caf8f66ef1be77e7ccf26c8e4d9df946cfdfbf7a408a52b6defb00ed5e9e637bfa62778972e0b3123c79ea180e5a392f0f7efdfec036b6fb0e7b005cdf7bd0d2bd6d4be1bc6f7e1a7a5896b1cee6dcae89f0ec2943707cee41df009f2e5b9a530de2e4bbeac3fa700fd3504c222847ce96b9b6ff002e5b1389de0037e0d70e35eb93647304d99cc4bebec7edcb2bc29636b8df7daf7bd3fa8e5600ae2378bd8e6ec0335db3b9e66faf8c47bf7efa4083df903523737e7b5fd6970036386f1d186649bb0fdb83f40030897cf2f7efed0a5796fb6c397af51de97300bd44ef1be7d5f891a80dc5ad6cb4688b7879fda24a48d813dfe7b8dfa7d9b4006f9f62df536cf239e5689777fdfdf9c7120d45b7bd29fa53974dbb6c2778b100cf8706b64e6ef9def95807107e37d33d224835dbf336ef6ec2ddb72311bc6d007e2e6cd7e43506ff00d5a220474bf2f3a0a93d282bf2f9e2428f1eaf71e00500f2bd890e6e0692fef8b71800798e9e7d00f2eb4a9d853a37b987be4436998200daddf21cef07f93787bbf5bde14de87e55f502bbf30056a7a52f86f9d7d91e00777e2c0359cda0ff007f1b39f16e9ca3d9c9e7138cbb33829de5f9b4ce45390096c437152e9bc9e3e2a5734818a68f89a88828f827588a84886d54536eb2ea001d411e24a8114c5a9f2a4d5495c8a8932aa244d4944d933e5a26c99892ce9500cb981495a4870a49043162f105940820105dc10082f98208620f0368ca9e8000fb6c7da15a06994cb53abe357b2acabc4819635b254d678f8b655b34fe700e00cb351cfba00fc327f8cbdd3144a3dd2da1ee8f52ed0f61dd9ced0f7d34e0a30007ab9c4135581cd340506ec5347bb370dbff003351052ae497f886ba7615430039c995dda8ff0034a2517d1937475f863307a33fb4d996621a6a0f884e1a2700b2c884253efb3068e667809d43c42cabf9ca3296747244ec0a129354839ce6004b511e12057c43a631bfc2dd482a5ece6d44898924eed36354b324a921890f0059422a04cb8bff00c065800f9eae6e007391500ffa66a5bfeba1deff00e81100945d32f6dffb36f52912b697aeebd3c9b4ccb69fdcfa999333765854bdd59a007bb996616a5132c950a11bae27f8a170891fcc62280d3aa715ec23b4dc2ccd0050c013894994e7bec2eba8eabbd48d65532a74aae57fb7f2a17fe98d7ccc2200ba5b91284c03596b4a9fa2490bff00ab190fd3ee23b4335496d37a5bae9a5500a86eb884b8dc3e46d49ca59a9f5215fe9261a49398e7473fe55b60820822a000d3aef10d9eda4c1c138a6098d6180382aaec3ab6913cfe29f25093c73e7a3c0062a915727f5227cb6ff325691d2e1bc22b426691c367eb4b5d0d9ffe0afe7800d48a89a3f99fa81f6881553c7f3be974a7edf38fd099cc5277430aff00d450003ffe5581d7973c562aa67041f03f4317056cd19a507c08f929bd3ed1e413b700b9b2d1f252d3f99c4fe695fe44f998a8572c7f225f9122397efc5f3874ff0000ed543ff87f3c4fe6cff907fef7ed157f105ff93feb9fb472fdf87ffe187fed008fff00f3c3f35ffe19ff00e21ffe989fe207fe6cff00f10fff0044419e28ff0000fb30ff00db2bf240c3f37c25f9ac9ffbb0fe20ad259ffe213ff7447133b700393081e6e2cfce80570fcdab440f33fb4527105e881e2a27e823899dc472690091e6167ff8c623f34bff002a7d7ef149ae99a211e3bc7ea35f7ac7815378d300fe9536dffd46d3ff00c7e3eb8a0d4cd3a81d00fabc506b271c8a53d123fef300c7e28b9c3ac30f444647a6161986d4ebf10ebad42b2cb484f896e3cf12da1b006d29054a5ad494a5209240ae202e7cd50424ad6a51094a10095289b001290e0049e00127c62d99f3d76ef1649b326c4ffee80ff58b4cd4be3c3835d25868d8008d44e29344646ecbfc622a55fe2465b9ce634adb34534d65791cc26998e25f000411ee21a56f3d507f92c69cab0cd81db8c69484e1fb2d8f54a6636e4e561d005526998e44d5d4225532125eca5ce4a58bbb5e2ea692b6733489eb7c8942f7007ff794c91e2631cbab3fb41fecf8d3d6529c9739d4dd6d9839e34a61f20e4000984920985a455263665a98f645096566def25d0b3471373ee48dfb2707fc3a00768b88abfe1d270bc0e586255886212e7ad40e6112f0c4d7fc4384d54a1fea008cd978256aff005f77247fad6147a012f7c799039c62a75abf698758e74b98004068070fd90f2240b8d3b0f053ed4a9dcdf3ecf91e3aa5b983528911c9f2580008b6c10b44245bf98a0db700f7ca8a6c941edac0ff000bf8248eea66d0ed160021882c14a974f8648938753963796674f15b3e620e456814cb21f7770b11b1009580494b19d3a62cea1004b4f473bea234fe53d34c2e7103ed15e35789f43b0007ac5c42e7b9d481e69d61cca1218c87c8d92de61d5125a8dca79261a4123900b1457dda2267105308a0d8f0189502a07bc3677b37d87d95217826ce61f22a0012a0b15b508557d7029003a2b2bd5513e4be6532572d054c771ef1b591454b004ffe1494023f988df5f8296ea1e044594d3a54d45ebf52686fb5452b5ef43800e6fbc580f5b73e56cc0f0cc3bc657bf9c453e75a52dce9717a9af2b1143be20077fc2da644f37e56b6675c9a5f97bf5f4689a1171f9588bedca9b5edd69c9b00c4bddb965d483e659c78e51111424edd86f434b79d3af4e830deb38cdcbf0b00fa73039127525efdfbeb12534a77f3a54d7981f75f5c378866c80163addad600cf3cb367d1a25efec5bf78148eb7a7983bf3f4da9b903be24289e1a3e7965f0057b1197488852e6d6ad0d29bed6da82fd3a0ee2378b6af7673a1d79e473d4d008680fefdfca24a4da97f4ebea7e761f5c02cebe3e82da0e278c4bfbe1d2208003b77e5b73faf4adef4f36f6be8e78f8661b2716723847afbf3852b502a2dbd00ea4dafeb6dec05e830de22e5880788e6d93b6bf27312e7d5fc62286a01b6df005bf4a9e9b1bdb0de39b8d5afebe5600e79b1311121269cfbdfbf314aed7a5e00bbf622a3a1e8f767f3195b9390d99869efdfdbc4c294ad472a0f33b53aff00007e9892a7d48bbe5a67c0f4ccf1c8d9efdfbf9c0249a5b96f5d8548f9deb4af002ef4c41517e199eae2da5f2b123ef08786c3b9ed41d6a4136e7b56dcb0df3e0017b666fcfde791160f7ef38c6271c998046e78ca3969b886de6e419722262e00b6d965661a373047a90eb2f2907df21e5c1c9a5f11ee5e0909877e1de6814c004151f18fe24b16155b4f82e1089a26270bc257533109293dcd4e295077d0b600254998aa5a1a39a50a6025cc94a48f8cc6b2b94eb425df752e79151cbc923c0019a2deb427348c9dabb90e76b4256c09eb12b8cf12d484b7053f43b228b89a00a50e29460d898b91886c27fce5b0968a9095950ea9ecdf1bfecf6dcecd62640024ca4e252a92a0ac94a514b892558754cd24025e4c8aa5ce48c94a9694920100262c485ee4d42b4de63d15627c017cc65c233883953bd6fd282c0de80f96dc00ed5fa4048e41bdf160f98737bd8346ea1cba52a3b5b98b916b6fb50ed882a000e3df20dc79f5045a11006fd8d81a814def5173726f5bed4b6277806f20dabe0062dedac2112052bf7ebe66f536db6c415001ff0077e2cc74d4e5d61106dd2c0045bd7aef5dcf913635ae242af6e0e38b7420063967f56408a820f6a5ea7d7700ef717237b8c46f7935c8caccfd478663c912453e95bd76a752056837a7a8c0002ae1b83df9bdb87239f06cd9100f6adceca1e9cc579f7a82772713bd9f26cc00101fc45b31e06113da9b9a1d8f43537e6074a8fc4ff27636f3cfefd611005000d7b6d424d3977ad46e7e42988de1a5eec2e19d81fafbb4227d36209ed5b93e0062b5edbf204cbf8f4e9f7702e6f67ce10e5b7e35b50f9549eff335186f3b5f00a73cf8b656e274601a1114e553bd8ec7ad2be8935a577ef4150eb67f0e361e00f520e689dc1b1dc1a5af71f97e95ad6871e0cefefd38b1e1088eb51cb6b127006dedcac413d6f6b623787bf1fb10d9bda113435df9d473a6fdf9f7040d803400b37c72c8e4e350393db3d48bb5e10f2f3a56953735dc546e05afcec2a25fdf0093bd9983dcbc223b6d7a6d5daf5db7bdc9a9206f6ae2378e8c5c696cb97360000677cf9a250a521495b6a5256950525695292a4a81aa560f2554541170763e00202b248b82031b5f5191041d079317ca115c72af139c49e4465986c8fc426b007e4d86864a530cc655d57cf99798874241094b2d4a73041a1a4a450252da500012294db1a1abd99d98c4095576cee035cb55d46af08c3ea54a27fcca9d4eb2006fa9d4df38b4aa790b2eb932964e6552d0a3ea93174b92bdad9ed1ec82c37000d23e2d753e60d363c15ceab906a43c4529fcd19a8523ccf18b229feb54478c001bf88926bc52bbb21ecd3112a5546c7e152892e7f222a30d03363b986cfa54000cf20966e918ebc3686612554d2c3ff90197ff00cb296f0cf58abf2ff6e9fb004ea05685af884974c12920a9a98691e8db8858047892b543e43867403420a9000e215452a8a49a14e9a6760dd964c047f67664b26c0cbc631a0752087c414200e086045db23168e11879ff00886cf29937ff00afd32e5154e4dfb42ded12950096fe3e71a3b98820afc5fbdf4c21a1cbde2ff485fee09bc9000ddbc1ee836400ff00be57cf513ff0e9d9bce732a46354c0e92b155ab772cbf312679be7f112002f988b4704a139266a7a4c3f5063bac27ed1f71e90e55eff0027f0e31a15600022721e74404db74fc1ea5c2a89373fce542db52d8c299f86aecf881bb57b48008c8fc388519241399dfc35400f01d620e0745c678fff00713f5418fc913fb4006bc7d3c1cf7597b87a832ba847c3e9fe687033514051f15a8111520dc7bd2e000ad010ad8d69fc367678967a8da25b1b856234a09d6fbb87a7a1609bb97005009fc0e8bffc6ffe20ff00e88a6f3bf6ff00fb492689526035034eb2e129480a0092e93e507d4921654569198a1a7c9f1293fc8a0a4a93e1ba1295d578d953fe001ebb329441998762354c6fdf62f5a9196bf97553b806e199bf989040358c160080672d6aff0074d5ff00dd298a711fedc2f69e46a549ff006945420582098100d29d17875804107c0b4e9e15214370a04104d52410063692fb0becb25904ec00b8510729b8b636a06e343888717e1c8da2e0c270f1ff00ddc1eb326fff005800fdf578b78cefed28e3ef505f75ecc7c5eebdb61f512e42e59d449f64596aea00285265391e2b2ecb0b641b3420c360d15e10a16e4743d99f67b8725a9b6376007cee80caaac369ebe68606fded7a2a2682daefb9f9de450d1a3f4d349eaa9600959f35851f58b61ce3aadaa5a88a0ad40d49cfd9e969515a579c738e61ccaa000b06be3499d4c634a555a10b4ff35686d418e554585613868230ec370ea00c00cd43474d4ae1b22244b43e46d1909972d1fa10847fb5294fc808e835574e7700a9a8e5d2a7e800e60ef8d86f0167bfb39e5eb15c40036bf6d89ad88dba13ce00a9d8d6f73819fbf97b059da113cc501e95351cafcbcab5b134a7507e9fbbf800585fc8e4d7447406d7b126a6dcc57e5eb6ad7070c4f0ce11cafe7d4fcec2f600dec6be7b0c46f8e59f93ea72b656d1f898471bdc9371bd294a026d5b50dfad0086f4389ded742dd6f9300e4ebe5e3089bf7daa6a2bd29b52e3b74a9a1c37c00071637e5616bb9fe8e585c3c220569ce95bee0edcb6a508b800dac09a60e38800e5c395efa7cc5838108e57f3b9df7a6d6b0deffad0d9bc35238e8da1b0d45e00d68441039da953d7d6e39741b5bb600bfcfcfe5e39e62d080b6d4d80afd0540057ad4723ca96ae1bcd9dbd4f316c88b139db56784396f515dea36039db6ad800fd4e20aaeda81af32edeb9f93d84220d4d79037adbd09a8b5280ef5e9b5a7700837a6b9dadcf930e3089a5c13b529b8373e62a79f326fd2b83db98079659de00e33d5cfa42205bb9a93bfcb9ec6b5a1b5ef7dc156bf2cb9bfcae08d48c9d8400226f4e9b9e47f2e7cac4f337b60fcb47be9e6cedab1b5bc103d40b9241ad2e002f6bf5dcd3cef7c1c7a3bb1d387f57108806961534ea0017e86d720837dfb100383fbc99b5e96cfeef089bf21cfb0aefd8d396f43cbcc540679685f4b78f9300c23077aed9a4671d5dcf93b425298733d7e5707e05a9c4bb052043722848900056842926321e5cdc62db293ee5710a6829610167e6ff006918dff6836e76970013013dd2b129b494e524a92ba5c3529c3a9a682402f3a452a27293925531490004800c6967af7e74c3a6f103a26c0eb9b3e7676168a4b8e1116633b7a4f9bd0019f74e32766a0eade889a492144c9c524215fbe209265f3a4848091e14cd610063036b4a12971bf0b884a52b007d26d86c7c6d2ec8ecfe33be664daac3a4a200aca83135f4af495ee2d635922714b00148dc50480531bd94aef25217c407e40043853eb9837e1ced150f958569ca9b73163d3a6fb6d8e58e490e5833679b5b00d5cdcf3cda2e35db3f9e4e6df767b3670e5d47735db63b1ad7e96a0c1efc0800e01baea19b2e7a9810ccfaf5fb7cbc5a27715a7723fbd36b7ca988d59f887f00e8f63003cef66e9f3f772220df9d3e97f2ed5141b1069d312fe59358db317200e3f7049b9306f7f56cdb2cf37b4003516ec7615aef4ec4904edb73c09e7ab80072490065d0e6dd5cb58c19fa5afd7de7cba449bde876b0bede47d4006bb7ca001f216f4e3c73f17106d465fd439d065fd6208b8dcfc8817b549bd456bcf98b000269215c380f4176c80c9acc599af06f1b3e5f3fd9c44d36a721e5e56e9bd600dbd310e6f7bff4d7c037a41bc32cdf525b4e01f5eaf6890926f43cb9034a7900569f3adf142965258310c73736366cc5adc0447d61e03d15f5fbfbec294f7a00ae09f2f63ddb5743c06b5a1af97ea3f0a61dea99ac4677079f3bdef78428470023eb5fcf6f4c4778ae03cbf784453b9da9fd7cfbff004a4f7aae03376bb74c00f27bb7eee853b9fb35f3bf3bdf13deab8275d0e46cd9e434f0e108529616fb00fbfef88ef55cbd7e87cb48429e7f74fd3ea6b8778ab585b2b1e7a3b6bc341000853d7efe5c86066a8f0d38e81b8f330878474fbe9e5dbe7877aae5ebcaf73900bddf99e508506f7afe3e7d71266a8e89f236cac2f6166f378400a733b5295b0052dcb6e5f3f4c477aa3a25f8b5fcdfdb421416e54ad29df9fdf5c3bc55f2bb0039bbdbc7db4214ee7cf6af9d29e55df6e828ef55a003c0f176b936e5f72e85003eed6c3bd5701c1aecc7c7de79de113f76b570ef15cadc43fa13088201ea3f00b536da9f8e244d50d13e20f2be79da10a7f7e77a74f2fb188ef55c98642ff5003ce10a72dfcf0ef15c00cb27d3c610a773f76f4b74a1ef89ef55c13ae875cf005bf8b8e5085011f9dab7df952fced7c04d234d1b336e8ef9758429f852bf9f004af7a606692ee33cf2d3c210a5ebfa76dba6df53877a787a9e7f7f41081153005fbfad7e94dcf5c4f7a47f2e8d99f7fd070108014f33b9eb877bc881a31cbd00b9d610a773f8d7ceb5381980924837e5fbfbd610a5297341cbeefe95a7a60600683a71d06b9eb0853b9d88e5cfbd2bf77be1de8e06c41f2e4edcfc6d088f0800efce94b52bd29f7735df13de8e1c05c3bb5f53afd9a1134df7b904d3b72f2c00477a3572dc40d7c73f661114e5f33b1ea6b6e75e5d68001522b0a7015e42dd00059f881e4097b44b7be1d7e9c4e513d7ebdbad2943535af3c1fcecdf7e16cb00836906f77cb8f48817a50daa6dbf90f4e82d4db6ae249cc11c1ecc799c9c3f00dcb5ec6f7f3be5fd43448fbafdf604f2e95df10797d7df4d78b41babe81bdd00a208e479fadac2e4dea79539d37a624123e7a8e2598166d4db8e56837eda7a009e5f4e30a7524d0d7cfa74bd7d3b0b50e74e0471d2f6e7672da6a5dcd937cb005e038c2e2f51dea6c06d4ee4d6e4915c1dc375d3c78b06e56009f137ae5d210043b6d5bd390fa52dd013537b0ae2490dc4e4e49c9f2177bf12cc2ce4c1bd7a00f86977d19e29e6ace6f6f2169c671cd65d533112c92c5265ab4252b57ef98d00025f24052a0a05266b1507ef54a4ac36d78dc29525252788edd63e3667647100ec6428a26d2e1f39348a48048afaa6a4a1201b048ac9f24ad83265851215ba00c6d4e5f772d6b3980400e1f78d83f0625f896b460931f36a3470c211925e0600b3b98a9466bd3e8b88716f4ae25accd2669d79c74265f1deea066ccc336a050030d0f091e88189536da821d8a9c3eefbb4b8a79c77d65f872da3ef28f1bd97009f314a5d2cc4e3340952d4b6a79fddd3574b96936972e54f4d2cddd490954d00ab9b33752a2b52f6342b74ae59391de1d0b03ea079c5fdefbf7e9cbefcfd6d008f4e6f372f3c8b3bf9e41fe6d9f114def4a1fd2bd8ed4af7b545c8281b7dbc0039f80e4f784481fa927e55fede406277875601db23ef3b9b0e96408a54579d002dda9bd77db9f2b79b7b2cfc9f3f3233f323ac2237fcac7a7f7bdb7c37864f00c32cae72cf3fead0f7efca269f226bcb7d8fad479e20ac5aeed6d72eacdd2e00dcda111b72e5ebcbb126df5a627785af9e6f6c9c6ad707c6f08e543bf4ebd300ad0d88b7d69cf11bc38f339166be9d5add4bb423c8dec7cff218c79ca3bc18009fd235e67cbc6f08e78b4e789f330860e789f330860e789f330861bc789f38004313beae3e83ed0861beae3e83ed0861beae3e83ed088a0e83e430df571f4100f684283a0f90c37d5c7d07da10a0e83e430df571f41f684283a0f90c37d5c700d07da10a0e83e430df571f41f684283a0f90c37d5d7c3ecd0850741f2189df003c07afde10a0e83e430df3c07afde10f0a4f21f87e186f9e03d7ef088f027a007d4feb86f9e03d7ef087813d3ea7f5c37cf01ebf7843c09e9f53fae1be780f005fbc21e04f4fa9fd70df3c07afde10f027a7d4feb86f9e03d7ef087813d3ea007f5c4f79cbd610f027a7d4feb8779cbd7f6843c09e9f53fae1de72f5fda11100e04f7c3bce5ebfb421e01d4fd3f4c4f783507e7f6843c03a9fa7e986f8e07d003ef08780753f4fd30df1c0fa7de10f00ea7e9fa61be381f4fbc23c6a1451030095cf7b75fbdb17d0a0500f0e9c4f3fdf84214dcf9790076bd69befb7d0d2ad00f1e1ebf7f7a3877d2208ee6e2d4f5bed51b73f9601434fa1febf5bb3de111400fc6bf4a7e1890ab1376cae34fd5edbe4e61e9d3deb1343f9f90a7ebf8e2028001f7e5e7cbc5a0fefdfca013ca94f9814bfcbada9e741892b05dce4cf6bf0eb006d7ee610fbf3dc7caf86f8e3e2c74bd8f2e2210a77eddb9df975bede986f580016ccdb2f7a3371b6b08b03e3973bfc34a32a69f4244ba87a6712ee669c34d300ab6c2a5f03ef60652cc4212026221e2a3dc8e884b6b51437132865e536a71000c38df98bf11bb45ddd1e07b2f226a82eaa62f19af421652f4f20cca5a197300024b4c97367aaaa6eea894a66d1ca99bbbc9414e0572ec896f9fc4472164f86007e5ca31b78f26c6ba18422aa68ae7d569b6a5e57cd0b714897331c202789f1003810b91cd1260664b5a1b23df98365efde30ecaaa85464143288050143986c000ed22b6536b706c64a88a693522457a5d402b0fab069eaca929237cc99530d004ca417499f265122d17644ceee6a55a3b2bfda6c7cb31cc08ce636a6dd421c006d495b6e212e36e21416871b5a4292b42d24a54952540a54824281040bdfe800ba26226212b96b4ae5cc485a168505216950de4a92438292920820b10c4166008ddc79080682840adcf3e43caf6b826b7b62a73c4f9f03f4f430801524edd300c88a0dedcf6bf4006c60a86bd33e25efea6fccbdac8507226fb545b7e9b9a50069717ad7ae0fa3f26f5bf96bc39421e1f3237dafff0056d7e95b7cb07d43780036b7faf9728408b6c400072adaa2e69d3720dabc8ef838f3fa6708822e37a5000548bdf9f7a52e3953614c48530b1e4efcc5bcc78bb4226836e7b12413f2e500e46d40310ef91f23e2d08e49a52d6f3dfd7efe961626a8050ff682e3993c4f00ed08e58b7be381f4fbc2186f8e07d3ef0861be381f4fbc2186f8e07d3ef086001be381f4fbc2186f8e07d3ef0861be39fbf184313be9e3e87ed0861be9e3e8007ed0861be9e3e87ed0861be9e3e87ed0861be9e3e87ed0861be9e3e87ed086001be9e3e87ed0861be9e3e87ed08627792751f2f9c21838e23cc421838e23cc00421838e23cc421838e23cc421838e23cc421838e23cc421838e23cc421838e0023cc421898430843084308430847050dcd2bb52de5d8d6e36e95ea317907e1001c01721f9fa5a1000016aefcf7a5ae2c4f6a7cfb54e390cc7cf89f0e5d611c007c23a9ed5bed5e74a0a007fdea13bd36c1fefccf1e6798e7d6112126f51bef004e4297a7736b014dc73343e77b6b96972fd3edc0422280d2c01236a74df60200fd40a1bed502b2fefc5edc3faf1843c3b75bd452b4e62829402b6de9bf2ae100bd9b160fa1d785b5f53abc227c229e44dafb7e35e96dc6c7730fcf23ebf78400705a9b690b75d5250db692b5b8e2825084369aad4b52bf9528480a52c9344a004155922f0a9894214b5a928425254a52c84a52901d4a5151012000e5458017002d08c18eb4e7d56a56a5667cd2db8b54b9f8d301234294e94b7239624414b900486dda187318d3466310c04a5288c8d89342a5294af9d3b7db4aadacdacc63001a4a9469675477187a495b230fa448a7a4212bbcb33a5cb15336580009f3e700102e63493a6199314ad1d93fed161e799e64c52cc70e8b50c210c211989e13007523f8f34b60a591d12a7e7f9214d65e98974b3ef9e9721b2acbf1a52d00a200d2e5a812df7efa7e22262a5518f3ca75c5179cf72762db59fda2d909145513004ccc47678a30ca9ef0a4ae65204956193f750df07e593f94df58ef264da39c00b5a94a5152b6f4b33bc94013f123e13c5bf94f959f529262e7bf948dfb57bf002a13e9d6e3a8a63b7828ff005c9afa78e9e51930077fea3f1edd3cf9e049d0009f03627d3eba0166842df3bf424f5a75c4151fa7870b35b802ed971743d0d800d45f7dfafcafb72eb897e76b38b86660fd7570f965a4200d295e67cb7aefe70043d2fc8600ddeee471f0cf361c2f90b9d1014df73e95fa5ba034eddb0de23200b701760fae7e59eb0853f5db9dfeb5e788737b9bf87a74844e2d4c2490f7b0001ea610c5b8430843084308477dd2ac8ffe26ea869be9b7ef4fdc9fe2167ec900f91ff7d7c17ef2fdd1fc599865d21fde9fbbbe2e03e3fe03e3fe2fe0be3e0b00e2bdd7b8f8b86f79ef918589567f0fc3abebfbbefbf23455559dd6ff0077de00fe5a44c9dddf79babdcdfdcdddfdc5eebef6ea998c12c09e009f20f1971f6a000fb1e7ff0006e699e9b6a2ff00b44ff8cdfe2167a8bc95fb9ffc23ff000eff0000747c2c823679fbcff787f89d9ebf787bcf83f85f83f8182f0fbcf7ff001600af07b957597679da97f6f710afa1fe05fc2bf23468abef7f89fe7bbdde9e89003ddee7f0fa3dc6dededfdf5bb36e87718f22a7be514ee6eb25df7b7b501bf4008e31851c76d464c308430845fefb373819ff00c211c43c56827f8a3fe117c30069de65cfbfc57fc13fc7de3fe1d98e5f80fdd3fb8bf8bb25787e33f7efbdf800efdf0af87f85f77f06ff00bff1b3c2b6f76c3fb1181271afe1dfc4f7aba9e800bf2df9bfc9377e89ebef7befcad5fe8ee5b73baf8b79f7c331b53a6f728dfd00ddef880676cdeeec78708f4bed0fe0c7fd82b8959df0f1fe247f8adfb9f2b60053ccbfc5ff00c1ff00c0bf11fc512dfde1f05fc3ff00c539c7dcfc0ffc4fc400fefb77e27fe33dc43ffa317761b6b3fb69804ac73f21fc37bda9a9a7fcafe600bf39bbf975846ff7ff0096a57df77ddee46ee5bcace1266f7a8dfddddb90ce00f97361f28b1cc7308bb0c210c210c210c2119ece197d883fed19c048e37ffd00a77f83ab9175873aff00863fe0b7f10ffe29e6d9d257fbb3f8d3fc5991ff0000faff00f843dffc67f09fff00257ef1f75f0932f84f7913d31b41daf7f02db4003b21fd9efcd356e1749fc43f8b771ff9ca5524cef3f29fc3277f83f9adddcf00ccff0079ddbef4bde64e2aeab727775b8ff1246f6f37ea00bb6e9c9f8de3020078ee78ca8610861086108ce1e8afb33f843987039a29c68714bc67668e1f64009acb9af3864b964aa034666ba8502ce61cb59a73cc9e1601988cb5171d3651008f93e488e9bb9111929848361c2b83110b73dc7beea1c5fb40da897b618b6c009ece6c9d3e393b0aa6a5ab993178b4aa05991514f47354b526a12895f04dac0044a0944d52d4197ba06f6ee32a7ccef572a5ca0b290093be136201d6d996ce003d14db844f63bc2cae65132bf6a9e70994ce1e5f18fcba5cae1535361931f100ccc338e42412a21c9606d84c54425b60bcb210d070ad47c2938bb2b6a3b525004c96999d9bd2cb96a5a04c58da5c3945082a016b091349514a5cb00496610e00f2a7ff00571ffc54fde29b7b29bd9bb22f68fe7ad5ec993bd549b6967f86b9002e4b9a2063a579620f33fef6899c4e1f950838b662e6f28f84618f74978bcc00adf717e228f769a02761da46deced83a3c2eae4e1b2b11fcfd5cea65a2654200e9fba4ca9426efa54995377897218803578aaa27192124242b789172da3f030018dfd54d38ccba3da99a83a519ca14c166bd36ce79972366286295a5289c650069c464963d4cf8c02b8676220d6ec2bc2a87e19c69e6d4a6dc4a8f3cc36be900f15c3e8712a4505d357d253d6485382f2aa65266a1db2504ac050cc281040200088bc921490a1928023a10e22adf077c33e69e307894d27e1db294526591da008b991107359eada4bed65aca92b85899de6fccab875b8c2229724cb52e9a4700c2402a221ccd23d98495b6fb4f46b6a1acda9da0a7d97c0313c76a52662282009cae5c90774d454cc5264d2d385328a44ea8992d0a584abbb4154c2921044500331625a14b3a0b0e24d80f33e02f15e3da75c10493d9fdc4942e834875026b00a9504fe9be57cf4acc73790c265d8a11198a6398a09c97a65d05319a33ee610051246d687cc595baa7d614da02120e9bb3ddaf9db6d802b199d432f0f5a6be00a68c48953953d3bb225c85899de2e5cb2ea338829dd60122e5e289134ce46f0094eefc4433be4dc8718c77e39cc5e8625c8c8910882057722d4b73dfe645c800a5f17d0a3ba352f67cc5f8f0391b8f9c215faed5e7cfcff4c4927470c1b33e00fab374840edcfd37b1a91ded6e5eb4bc83d3223cf91e7760353d210a8b935100f75fe9e6283025ecfa5f9b7f4cf3e2c2c10a8e543e57e7dbbfeb8873c4db28004053cc72a03d7a8bf5a9aef7b5462778e84f9ebadb2fda1027cc56837bdfcb00f2e5d711bc78fd7e7ef86908b61e2c7523f80f4b6365b0314a627f9d94ee5d00977bbf745e6a5ce360e618d0976e96d12d5996fbf6125f858b9ac1bcd16960003cdf51f6d3b587677642a28a9e7197896d095e194db851bf2e914907139ecb00bee0a557e53bc47f792e75649988525490b4e355ccdc94403f12fe11d3f98f0095bc4461db1e1a8d4430843084308457be1c353ffc2fd4b95c746bfeeb2e4f00fc197f31f89484b4c41c63c8f8599ad4e2929684a6383116fbc0fbc12f4c73002d825f293d8dd976d71d90daba3a99d33730bc40a70dc541202134d3d69eee00a945564fe4ea04b9eb58057f974d44b4ff008a41bf4f37ba98092c957c2ae800723e0589e4f19aa17008a50804102b5a81422876e629e7404027dec160804200b781008bd9ae4313620b8bbdf982d1b9852b63cb9915dbcc536a8aedce82b400c4ef6972f978f8bb8e01b8738429f2ed5a52f6de8697adb6340062378e5af300b7c999ded7b1172c610f0d2be7cb90b52e6a6bced6ad76370dff00972b9bbe00b972b13085c0a1140294b9a9f507722b417bf6a5677b817e5901d5ef62ce5c0074ce1022bbdb7def4db6ad4539d7adad5a080bd189e06fc32e2ef6fa96728900a7a1d81d86c696a9aedf64530def2b1b679f10cdc083cb8bc23cada4106b7b00f535d81eb6df6a0f2c589aa3bc2e72d32cce4d9f5bf58473f027a7d4e2db9e0027ccc223c03a9fa7e9839e27ccc21e01d4fd3f4c1cf13e6610f00ea7e9fa6100bc789f38457ae155007141c379bdb5eb47fa7ff785977b634fb46a57f67b1e00bffc8d8a683ff519fca2899642cf042be4636dff00da8048570d1c375796ba004dbfee04ef1e67fc3d9231fc79b5c1e57a56cafbc6be87fc45ff00b3fef08d004cf4d783ce2af58e4ad665d2ae1c75bb5072dc415a61b31653d33cdd3990450029b157130b3a83943b2d89522de34b114e290480a00900fa52bf6ab6770a9a0069f12c7b08a19e18aa454d7d24a9c90722a94b9826241d0a92018d82a64b4900652d20f02408e8ba9fa13acfa271f0d2cd62d25d49d2c8f8df1fc0c36a0e4a00cc79417304b567172e33e96c0a23db410429d8353ed82082ab1c6661f8d617008b215330bc4e8311421b7d545554f5410f96ff0072b59413a05006252b42ee0095057420c52cf00ea7e9fa6363beae3e83ed15467e7f66e9207b43a6841ffe008f1a943fff0022d3fc74bf6eea2761d009ff0096f0fe1ff335b1895bfe08ff00007a7e4a8e97fb4388afb4a73a9aefa5da4fcbff00e5c3df195d87a88d82a40063ff0028e25c3fe7c44d1ff823fdcaf9c60e7ddf7fa7f5c76f6fab8fa0fb460054541d3bd21d54d5e9b9cbfa51a6f9f352e7894a56e4a7216519f66e9832da008f843afc2486063de619aeef3c8434900952c0048c2aec5b0fc2e577d8957d001504936136b6a64d2a091a2553972c28f2049e510a52521d4a091c49007ac50068ce5c0af19da7d267b31674e15b881cb721866cbd173999e92e77665904ca005254a7a3e353265c3c0b4948254ec5ad940d8a81b63554bb67b2d5d3448a4d00a3c0e7ce5164ca978952198b39321067052cf24827945026ca51613104f00a00116aca69685290b050b4a8a54950295254934525492010a0410410082286f800e4626121c3106e08c88e39c5c88f01ea3ebfa61be780f5fbc237d5f6665bd80026074d0be30bfef66b463c69da01ff00facc4fff00de365cff00feae131aa900c5eaff00fdc963c824468dba6da3faafac93b732de9269b67bd4ecc0cb022a00224d90329cfb374ca1a14a8a3e2e2a0e43011efc2c2f8c1498988436c0558b0080db1ebdafc5b0fc2a489f89d7d161f209dd4cdada9954d2d4a67dd4aa74c4000529afba924b5da368a52521d4a091cc81e01f33ca2ad67ce09b8c1d2f91c400e67d43e1835e72765b8160c547e619f6956758091cba1920153f329abb25100012e68545571afb0906c4d6d8d6d16d86cce233934f43b4182d5542ceea244900c46957396a259912c4edf59b6484931409b294584c413c0283f93c5b1780f5001f5fd31c837cf01ebf78b90f01ea3ebfa61be780f5fbc2369980e0f3884e3300bd845c0be9ef0e791d8cf99b32c6bdeaa6729d4b1fcd194f2a22132eb19cf500fe48e4708ecdf3b914044293329d4ba1fe161a25d8b21f2f2582cb4f388f3b00af6ab04d94ed8f6bebf1dab3474d518261d492a6269ea6a37a79a5c166846e0052c99cb4bcb93315bca484d9b79c80703bd44aaa9a56480529018137dd41d2003155aa3ec64f68be8ce9de71d55d45d088291645c83218eccd9aa70deaae9000cd572d92cb5bf7d1916996ca33d474ce34b4d8f1087818389897366da59b6300b1f0eed5f61b15aea5c3687175ceacad9c8a7a69470fc4e589936616427bc900b46896873fccb5a523531909a992b2121772580dd55c9e6cde662f3fd8419c0073069ce53f69bea0e558c32ecd391782bcd79cb2d4c1286dc540cff2c4b736004ee4f1896dd4b8d2cc2cc60619f08750b6d451e15a549241e27db1d348c42a007b3fa2a946fd355ed65352d44b72cb9153329a54d492188de96a525c5c396800b556013241b833002391678a7dedaac8996753a6bc397b4674b611a3a7dc69006964823f382a0a2044c2c875a325c9a0a479a32f4511e110f30848081624b1008da5b69b899d654cc2fa438f0897579bd9357d461d2b1dd85c449fceeca625003d14bbe37553b09ab9cb9d4d3d39ef214b5aa6a0924a64d4484961ba0554c400a42e4abf54a5102d9a49705f9936d588d32ee3ecb0531c1af085c5d7b487300041b4de718d8297f0bdc30b51a3e1622333f6748a837733e6694aa31872166000ce5d5392499abe110eb9110394b3a4a56f42a96b2ac5ed19476af69f66360e004a8fe510b5ed16d0941df09a2a44ac53d3cd08214833c09d2fe220257534930077541a227ff79325c9fe507bc99afc23205af7b8f106ed1d37f6845f898de300832245c4bae4444c570ada2f111310f2cadd7e21f8ace4ebcf3ab512a5b8e3008b52d6b51254a5124d4e32fb11dd97b235a84864a768f1609000002426900000068000c07089a4ff00095ffb457d2305be0574fa8fd71dc3be381f4fbc654300c0ae9f51fae1be381f4fbc23828106fdb6e5f9126a3d3a8a8c5e42c6ed8713007d5bf607c85ef088a0dfb5faef4b1b529ce9b0b114a524a8df4e190d1ef9f80071bb102d08002c6f7f3b52a37e469dfa731882a566e3fa81a16b70b13cdb3400450d4f2a569eb6b01d295e75aec09a62adf16ea39707d7c38677221126f4df00b9b8e836faee0d2a6b7bb78f11972776b8705b982cce5b942208e40daa4505003635aefdf976a81d1bfc41c8b3f85ac3835cf184410120a89f0a4024d4d02600953524ec05c93b037a902b88df0904a8e4092720c2e5dd8066773a702e21180056e23f53c6a86a64d63e0624bf96e445520cb7e1282cbd0506eafe2a64da9b005290ea26d1c5f8c877890eaa5ea8069c092c0427c13da8ed71dafdabaca9910037bcc2f0f7c370a00a4a174f214aef6a92524858ada8336a25cc3f19a7553a0014ddd848d3544def66120fc29f853d0667c4b91c984504c75cc588610861080061086108cbaf091ab49cfb91119566d10179a322c3c34bdc2ead1efa65978000f732798a501b6bc6b8369b4ca2355ff0877c70f0b1918f97e68907da3d8b6d00a0da1d9e182d6ce0716c025caa6f8d49ef2ab0c1f0514f00251bc69d29147300c83314f2e44e9cb332a446da9277788dc27e24003aa7207c323e04e717694b00d3e6081bf4a56e3ee9d7b981d7c5fa73d3df08ca852f4e7f2a73dedd36f4df0012f67d3cf965f5f1844508a547ca9b73ebca87e476c0117fab8bbb7dc79eb00089237debe9617ded73717b8c4020b337adf97cfd7c10a1fa57d2fd76afd6a300b525c75bb789fb67ca10a5f6ebe94b9f3a529cff003c1c7cbd72f9c23c88d800d791a7c80c62ce2778312c520f0d4c239e2d39e27ccc21839e27ccc2186f1e0027ce10c4efab8fa0fb422bd70adff95070dfff00a7ad1fff00de165dc69b6800d6afecf63d7ff91b14d07fea33f945133fc399fec57fd931f444f680f0c1a1009c4049348b3ef1379864d28d03e18b394ff5bb51a553f4ac49f34c14a7294c0065f2e93ce1d4ac78a4889845351d3596a1a8b88cc4d433796d88388fdecb4800f126c5ed0e31824ec4e8f67e4cd998ced052c9c26866496ef69d532a51326400d9408ff18a12512e61294c82a33cad3dd08d4495a905410095ad3b896cc390005c73b5b867668c0b6acfed32c0652cc09ca3c2df0b5970e9765af04a24934c00fd3c89cbcf4ce5500b54343992e48ca12f8781ca52b30ad342590af4da64f30050ea6cc4cbe05c4aa09bee1c37b045d4c9353b43b433ff0088543cd9d2e8a5002670973163795ded5d52d4ba999bc4f78a12e582a7dd5ac32ce5268890f326001de372c1fcc9ccfbbc644b83cf6977071ed7b90cf386bd74d1990e5bd42986005f8c8e774a350e2a559bf2f66d86621dc879a4d74bf363d2f93cc5198e4d0c00f199a1886809266f92437bf9ac922a3a1e4d1f3685e13b4fb07b51d99ce93800f60f8ace9f4489c840c4a85332967d328a82a5cbc42982e6cb3226a8777bca005cda69aadd97352854d44b559992265390b4a890ff00a92e08e1bc2e2f96a000e5ab46a95ed54e00e63ecfee25637224a9c984d34873ec0bd9cb47330cc57e00fe31fcbc620434d72d4d2290db6d3d3cca1345feee8b23fcf8995c448e711000868cd9081e8cecef6d53b6780a2b266e4bc4e8d629714908002533c277a5cf009692e449aa97f1a744cc4ce9409ee898cf91384d4025b7c59432bf10381f9b0088bc5fd9bcff00943a65ff0067ad4bff00bc39071c5fb75513b132c13ff2dd000683fe62b62dd6ff00823fde9f92a3a67ed0d7fca539d7b697e93ffddbafe7008caec4d446c1d231ff0094312e1ff3f1347fe08ff72be716b7ecbce01a71ed0003e24a5fa6f151b31cbfa599425cace1abb9ae5a868c7cb72cb0f0868192c900d51095c389fe6a9aad894cbd6ea1e101086653a54345a254b857f917681b6a008d8bc0575e944b9f88554c14b86534c7dc995046f2e6cddd63dcd34b066ac000237d5ddca0a499bbc2e4f9c24a1f351b2473e2790f5ca36b9e2d7da2dc16fb001c32d48786bd03d1790665d498191c0c5ab4bb2346cbf2ac0e5c828a864997004fb5633c9964f66f1998e76ca513410f1b093acd73a855b13299c4cba0a65200e994479c766f6236afb51a89d8f6338ace9140b9cb40c46b10ba95cf5a547b00c9386d1f792652644953cb2a42a4d34a5054b96998b97325a7025c999524ad006a212e7e22e493c1209161966c326b34580e8dfed3ec74666f87977103c32c009e0321cc625b86899fe9766d9845cf72f42bab08722a272e66783721333b4d00a1557d8869d65f783695ad86e2dcf042af99e29d802114ca9982e3f357592d002549938853213267a807094cfa758553927252a54e0ec0948750baaa160e8500dc7f9830f319457df6a2fb37b876e38386489e3cf82882cb29d4087ca311a9004ebba7f2e621245ae1932590f10f66482984920130c881d4d90b5071eb6e2500301fbfa3a6f288ec9b98605e99bd091726d4767bb798eec8e3e9d8edab5d4100a2554a6800ae98a5cec22aa6292242e5cd59515e1f38a900a77fb944b9a8ab0090b12c293368913d7297dd4d76763bc6e836038b8b0e405c16cf4a820824100041048208a10458820dc107718f56778797afde3671f406f6416498bd4bf62d0069fe9c4046c3cb63b3fe42e26324c14c631b75d8497c5e6ad4ad59914346c50034cff9ce43c2bd1e87df6daff356d36a4b7fcc463c5fda6d62687b55adaf5a000cc451d660156b968202969a6c3f0c9ca4249b052820804d8137b46a27909a00a51cc05215e49493164baa5ed12e11bd8a794e59c1870ada472bd6bd6aca1200c95b7acd9cd73386caf297f3cbb04dc44d2619f33341cb2713ccd59add75e000f2729c02989564f9744c3e5f6a732e7654b9337cb30fd89da6ed5ea666d56d001627330ac2aaa64c38552896aa8982902b765a28e9d5325c9a6a60031a95ef004daa98954e32a6098269ba99332a7fbc98b2949277433d864c1c0039e66e75008f5bc317ed2e64dcf39ba0324715fa192fd3acb998e60ccad5a8f906791b9800b2e48a1a60b10ca733764e9e40ae6a64cc8595cc669289bcd1f44395d32f3800842dcc55b41d835552532eaf673175d74f908333f2359251227ce5206f014d005525625f7a48644b992a5a496fefc16112ba2500f2d7bc468431f020e7c03000eb14ff00db93ecb4d2d674bdee3cb84ccb997e4f2a866e5338d61ca7901a8400464c9ee529f0856259ab193a57256952a842c3d1500f66a1254b12998caa3500cce0e36dc4424ee3e619fd91768b88ff00101b1db493e74d98a3325617535a00566aa4d4c92a3330daa993542629c25629bbdde9b2e6a0528252a9289734b300d5bc254c2f984951b83fe52f73c06ba0d046a498f4a779cbd7f68d846c2baf0079867d977f67e3d9fd1797e773791453dc4eea8433d13269946cb221e87fe2002e23dc2c3af413cc38e325c6db70b4b51478d085787c49491d2983cb933fb6009db313e4ca9c91b3f879099a844c485773818de016950059c380ec488c3400006ae73807e04e601fe54718c0dc66a26a04c6162206619e738c7c14534a662a000e33334ea2a1625958a2da88877e396cbcd2c594db8852542c41c770a2968a005a92b45152a1692e95224494a9246452a12c1047105e32b753fe54f90fb46600dfd8b7ff0089ef6b2ffd80f52ffeebe77c753f6aaadec4fb370cdff8e9879c00ff00fcc52728c6aace47fed47cc47bff00677ca5ee3e3d9fbc527b3b231c33007d56d235278a1e15a163a2617df333597b8a96e68ca5247235e65b81869c4c00e6eb95be56fb3050efea446cc5ea7ba79c4d8db69e9d8ddb5d9edb84244ac300b130767b689484a8832d63bca7aa9a109256a952e509896056a4d0a101dc02009dfdd4e44e164abe099d343e9e8d678f51ed78cc721d0790f071eccfd3d99c0023f23e1672449336eb17eeb79e721a73af1a88db1369a44c62d6969312a97c0014c6673b952cb497e1a133f44413e4aa1db6d9bbd99ca9b8c4fda9dbdae96b0013b68eae6d2e15de04854ac1a84aa54b4a4024a77d72e5c9981c852a892a4d008978900afbd9e7359504f248c9b873e39c759fda06ff00cb5f4f7feca3a25f00ff00bb386323b16504eca5702fff00a498b7ca962aa4ff00095ffb457d230600b8edddf1c0fa7de32a186f8e07d3ef08f0a812a3f76a537e5e751b6f8c8428006ea4f323c5ce9e196b68471a7a77a7ad2bdf9f6bf218adf4f4f47f0844d2d500b73fbbfdedd460f7d74f7eede459114e54dcdbcf7fcc1afeb5c1f9fbbfd01f002843c3f8027615ad37f9d6a3d79d1bdc789033393d8791cfc38943e9e5e77f00bfef838e474b9d740fc470f4845a5f171ab43216445e5494c404668cf4c44c00bd25a7101f9665e00353898290a69d295c6b6b3278227e1dcac4c646c1c48700e56507a5fb69db4fecf6cf7f06a29bbb8aed0226d38521602e970b1f0d6d43006eac8554051a292e65abfbca89f2a60994ac712ae6ee4bdc07e25db984ea7c007f48ea482e231178f17c6aa184218421842184218422a1696ea1cd74bb3b4900b384a8a9c302e9666503e3525a9a49e2a8dcc25ef04ad2957bd6a8ec329cf100b70f1ec4245fbb5ae1d031c8f64f696b764f1ea1c6e88951a799b9532378a500157453593534b3188044c97f14b2a0a12a7a24cf092a9498b92e6196b4ac68006e388d41f79b18ce865acc528cdf97e5199a431488c94cee0589840be953650041b7d00a997d2dad6198b85702a1a32194b2ec2c5b2f433c10f32a09f7f613008ad163586d162b87cd13e8eba9e5d44858209dd5872898015044e92ade953a00513bd2a72172d63792a11ba4a82d21492e141c1f7eb1ef2829d798a5b63bf400a9b548b114db1b07739b3fbcf36e578aa229eb4a035236b2ba5f90a7e1be0f00e1a867cd9b53eb9c224a76bec3622be469ccd3cbf23214cf6ccbbbdf987cd900fdeb088a56c76b5ae3a5796f63d373b57027867a9f12d773a7c85cc214afa9003bd01e74a9b93d011c8d79621fdf0e9717cbc44239014f9dbcb97ddfe5618f0039642835fe1198d5cf3feb99bc410fa91d0b44e2cef9e03d7ef11bbfea579c0030ef0ea07cbef0dd3a295e6ff68627bce5ebfb446e9ff39f5fbc30ef397afe00d0dd3fe73ebf78af5c2b7fe541c37ffe9eb47fff007859771a7da25becfe3a001b3c1b1319f1a29fca289893b8bf889f8156bf03ce372cfda4fd5acc991b8200bc89a7920982a060b59358a5524cdada3c41c99658ca7249ae6efddfe34a920052d2b32c065a8a781f1071109ee949297091e5fec2b0f9155b55595d3a585a00b0bc2e64da6272975153365d36fb105c890b9e94f02a7171181469de984e5b00a97059ee481f278d1671eb9df1c0fa7de364cbe23df8455bd04d579ee856b600694eb1e5b8d88809ce9ae7fcab9c615e865b885b8dc8e71091b1904e869485003b0932816a265f1d0c4f822a0e25f867029b75493adc6686462f84e2385cf40005caafa2a8a5505004033a529095877654b594ad0acd2b4a542e0452a429690052490ca041f1f08dc7bf69ab204ae7dc226896a6061a72739175d21e45051c000254a44833fe4acc4f4e219a58493e08c99651cb310a21610a1029aa547c05001e61ec16ba648da5c5a80922556610a9cb4719d4557204a51048ba1155509c009c6fe978c0a32a13169059d2f7e292330c74278461f7f66f3fe50e997fd9eb0052ff00ef0641c76676e6a0762a580fff009ee83ff915b17eac2bbab9046f8f0091e423a67ed0d7fca539d7be97e93ffddba7e58cbec51606c25202ff00f9c30012ff00e7f589a40aee431006f2be7d0c66dff669f4de5d937833d66d648e830065b9a67fd679c407c7a1285c4bd9434e327e5e4c0b457e10b425a9fcf3371f0073e328551b748aa853aa3b77af5d5ed4617862144cba2c2a52f70b802aabaa00a7ef96b8bc9934d767cc463d6289989492fba97e01c93d3402e789f1d3af8800bd5dcc9af7af1abdacd9b63e2a633dd49d42cd59ae25d8b8a888b54242cce600f14ecaa4f0ae44b8ebad4ae4329f819249a082fdccbe532f8280864370d0cd00369f4e609414f8360f866154c8089341454f4c9084a5214a97292264d504b00033274ddf9b3567e25cc5ad6a254a24e7a10a42529040090001ec67c79c518c006d37c703e9f78afe3e293e7f402374bfd993d689be6bd05d7dd089e4c62265002dd2fcf122cd395a022d45f8794c8b51e026699b4ae112baa5b817e7f9763e006aa8503dd98d9acc5f20aa25caf963b7bc32548c6306c624cb12d788524ea700a85a46eaa6cea05cb32e6288cd69933e5cb0a37dc96848b2436bab504292b20000de0416d48e3cd8fa46aabc6e69cc1e91f18bc51e9acb219b839364dd7cd500692c8215a00370f9718ceb395e5d6929484a5011237200142404a0d502c91800f446ca620712d98d9faf98a2a9b5583e1d36728bbaa7aa96577e49d5e685df005ce3365a96a9682c0ba125f9b07d78c6ed1ec80ce6ee9bfb1734fb50d8436e003d90f21f12f9d196dd495b4e3b95f52b56678da1c4020a9b5ae0405a4104a400915a9ae3ca5da6530afed52b68cb84d6566034a482c5aa2830d92483a165b800e11ae9e0aaa48362a54b05b9a5239c68319c335cf33de6dcd19e333c73d34c00cb9cb314ef35e6199c4acb911319e66199c54de6d1cfad5552de8b8f8c8888007564d54b7144dce3d8d4b269e8e9a9e929d225d3d2c8954d225a410997264400b4ca948486b042129481c046cc6f000048600017d0586b1d7717f7d3c7d0fd00a25d7c07bf18df67d8c93e57157ec8b8bd19ceaebb3b449e0b5a78768e726400f2e29d88cb739838c8d91305d882e16d893c873b41c8e5a8069050927844300096d2cb4078efb5294367bb4a4e2b4804aef57856388081ba04f94a4a27298300399b3a9173661fe75cd592e498d6540289fbd604eead871d75d59cf1731a1300a92a4a949502952494a9241052a0684106e0822841b838f626fa78fa1fb46c00dd7c07bf18b86ccfc54eb8e71e1cf4eb850cc39ba1e3742b4a335cd73b645c009e9cb796616224f992751199e2a651ee6658494319a26687dfce3985620e6900388c8367e3529661db4c2c2258d253e0183d2e395db47229d48c5f11a69749005955dfd4a933644a4d3a65a053aa61a7965229648de97290b3ba5d47794f4000410b54c091bea0c4b9b800016de6190c845bc6377be9e3e87ed171d5fe5ffa00c22e0b43f8a2d6de1ce4babf97f4873643e5994ebbe9e4d34af54219fcb99600a7cacc391e73091f05319432fe6094ccdf9338fc34ca31b132923b2f99b45d000b6631b5b6da91a6c5b01c231c9b864fc4e9cd44cc1eba5e2387a84f9f27b800ab94a42d134a64cd962680a9693ddce0b965ae92097a1690b29de964ee9de400dcd8f1b67e2e23d5f0f1c466b170abaa526d66d09cdeee49d439141cda5d0300394cb24f3b8654be7900f4b667051f25cc1013492cce162219e2a0c4c25f1200db314d4346b096e321619f6ae63782615b4587cdc2f18a74d5d14e5ca5ae51009b324ab7e4ac4c96b44d90b97365a92a19a1692525482e952812c0989295cb0025258b5c645f301c781ca3ab6a7eac6a06b2ea666cd60d4acc7159a75133be006188cd19973146330acbb1f3788712e7bc441c2310f2f838487436cc340cb6000a161e5f0104c43c0c1c33108c34ca3270fc3e870ba0a6c32824a29e8692420069e9e4214a211292198a94a52d6a53952e62d4a98b5a94b5a94a5124964a42001282120335fed9f38ee9c44f131acdc5667996ea3eb9e6a6337e7094e519160045809a43e5ecb99690ce58cb6a8d549e5e6032c4aa4f2f7570aa984595463b000ab8d88f78044443a10df871304c0b09d9da499438448fcad2cca99d58b966007cf9e4d44fdcef57bf51366ac056e27e00a084b7c290e612c2658294a1401200fa9b9ccdfa4506c6e1c711e622bdeff4abca1838e23cc437bfd2af28e2402400f514a72f5069bef415a5be5912d5f006caf7177b9cc3b7a4540bf11d7388f0008bef7b52fbd795af4bd283ad6c6d56f1cf577fa7f5bde11200bf3af5ec08a5007aee6d71b5b6c1cf1e9a33e6d97bb8e3088a0bd46f415ebca94a5b6fcc1da800de3c722fe27abf1f6e5d0205f9dba03715bf73b0a73ef7a4ef7ccd9cdc1d0000cb8f3faa3d1e66cc528ca397e6f99a7d168829449605e8f8d88594821a6535004b2d25453efa2a25cf043414383ef62629e6619a4a9d752856bb15c528f05c003ab315c427264d1d053cca89f30963ba80e112c1237e74d5eec99329277a7400d5a25a015ad2f4a941095289609049f0fa9c871368c17ea8ea14d75433bceb00384d4ad1f1ef96a5b025656dcae4f0ea5225d2e64788a521864f8e214d8422002239d8a8b280e442f1e01dacda4acdacc76bb1aac2a06a266e52c82a74d251004a2534b4a8d00952d8cc524013672a6ce237e6a89d2cc98662d4b3a9b0e0340003de6e629f638e45b8610861086108610861086108bd8e10b5c7f8367a9d3800ccd18a4e58ccd1a81238a7d654d48f30c4a92d258249ff00225d3c51432f11005661a6221e24a596a2a63123bcfb1adbe181d78d9ac5671184e293c7e466cc005128c3f12984252939ee53572b71130fe8955025cd21089953323329676e28004b5164a8d8e80f0be40f1d0df531958a7707d45b714fa77c7ae778d9db8df300cbaea0e603bbdb38d9fdf8fbd74fe903dbef973f3afa731505bd98273763a7002c83e99d8df2d621edc1c81e65ba713ae87287e5d3a13da9d7fb9a61bccf7700cf8f0195c867cbe80b89772dd5d8e5a7d72ead70222f51bedda806e3adefe40079e1bc18b71e84e7d33b657199caebf3bf461f3b8f104f2ca686a6849e7b540000295e56af7f3c37afcb5bdf88b58386e60e44978805ed77cceac067cef90d006f934318f34ba81ff487eae78f0cbc2d6891af5fa0febe30c5b89861086108006108af5c2b7fe541c37ffe9eb47fff007859771a7da1ff00cc18e7ff00a3e2007fff00c53e2899fe1ccff62bfec98dc67f69774d73066be0d74c33f49a5cec0074bf4b75b25f179aa21a1e2fdd321cdd96e75975898bdcc43af31ae412d510002cf4c582aa26a47997b09ae934fb4f5f4735610bc430a5a69c1ff8c9d4d3e5004f281feaee04e9839215ac6ba89404c5027f526c389041f93c68d98f5946d2002a468e69c4df58756f4c74a2410ef454e75273f652c8f2d6584296e18acd1300d819336e5120f85b63e30bef3aa010cb2db8eb852da14a18389d74ac330daf00c467109954347535730a8b0dda792b9a4732add6005c9200b9114a9412952800e49049f00f1ba1fed30e729648782dd22c821d6db99e71d7e92c6c04083e1500993e4dc8f9c1733896d3cda838b9d48a196374aa3d93d71e5dec229664eda900c4ab189974b834d42d6ce3bdaaaba512d24e85499539438ee18d6d1079aa3a000411e2486f40630d7fb379ff002874cbfecf5a97ff0078320e3b3bb71ffd0a0097ff00eb541ffc8ac8c9adff00047fbd3f25474dfda1bff94a33a7fe8bb49f00feee1c65762dff00a0b4bffea188ff00f3c44d1ff823fdcaf9c6743f66e33c0041e76e03f5474bdf7db44c721eb7e6e817186d7e379bcbb9ef276559a4b23900d41a780bf38466a876d23f914997f881f19581d4bdb9522e976bf0faf00945005e134cb04d819f4955532e6201e528d3a89ff5f48c5ad1bb352ae291e6927e008d1a576af69fcf34a355b52f4c332c2ae0b3069de7dcdd926750cb0a05a99600589f47c9a2c24a9292b694f41ad6cba1212eb4a43a8aa16927d4b86d6c9c47000fa1c429d41522ba8e9aae5286b2ea24a26a5db2202c02342083711b3490a400a543250047421e29de336263726fd97fd2a9a4ab4bf89bd668c86898796e7300ce392b20c95e75952188ff00e0795cda73357e19c5001e443446708585714800f1252f25d6ca82db5a4798fb7dc465ccafc070b4a92a994b4d555934020a9100f9b992e54b0a198de14aa5007463918d7572be2427802a3e25be91aca71fd900ee0b5338e0e2d33c4b1d6e22533de21355d7268a697ef1b8b9240e729bcae400d1a85ec4464ae0a122a8925292e94a54a480a3df1b1d48aa0d94d9ca4980a600649c170e13526c533974b2a64d4ffd198b5279b398cd9437654b073084bf90008dd1bd9199362f517d8a591f4fa03c1f1d9eb4eb89cc9b07ef1610dfc5e67d0045d5a9243f8d6a212847be8e47896a2024549200c7973b49aa4d176a9575ab007dca4adc02a94c1ceed3d0e1b354c352c8368d6d41ddaa52b82a59f24a4c68002b9864336cab3f9e6589f413f2d9e65c9c4ce433a974536b6626026d278d7e005f31828869c4a5c69f858c8779879b5a52b438da92a4850207b0a4ce97512600554495899267ca973a54c49052b973501685a48b10a4a82811620c6d810402002e087078831ea317611bebfb0e2429e1d7d94111ac59b2b01039823f5ab5de002c46a1c87f85caf9599899243c43a971293f0f192ec80f4e21df48287e0661000eeb65485249f2076b33bf8df68a9c329be35c84615842770856f545414ce50000dfcc95d6094a1985a140dc18d5557c751ba336427c4dff00ef46854b5adc005adc71456b714a5ad6a355296b254a513cca89249ea71ebfcb28dac71c210c00210c210c210c210c210c210c2111d3f4f4de95a5c5ab4b5791c64cb532078800b1be64e46d7c9fc3ac1cc7dbc3ea3cb94057eb4b917befdbaf2a0a8ec6e6f000e2e7c6c7ea3eb7d6d0efcaff005f9bb020b33c4fdf3fcaff007b6237f8e9c300c6e1ecc7c33d624f0e395c87f2b86d74f3b3bed5af3ec074adc7a5f9ef815300f5cfc9cfa0f12796700f16cdb3f1d6e08e072e70fbfbe5f7dce1bc2fc9cf5300970d5f8d80e113edfd6d6639ff00568c53f179ae5fc653c569be588d52b2b6005a8d5fefc8a61546e7b98a194a696c85a6efcb648a0b659d988a991888af0b00edc2cb6271e46ed976f8e39882b66b0b9e4e1385cf3f9e9b2d442310c4a51200852417fef29684ef4b9764a26d4f7b380988974b36359553f7d5dda4fc093700caea1d3303e6e7268b27c746461c30843084308430843084308430843084650093850d7d19fa4e8c859b2382b3a486107eed8d8a710977334961d344ac28940097e712a69296e3d241888c830dccbc512ea266eb1ebbec8bb42fed051a767b0018a87c6f0f923f2b3e6a805e29432c303bc58ccada440099eef327c909a9260062d354b46c69e795a7bb51752459ff0099239e654323cbe2cc122f331ddafd00357f7a367fb464927460f661c8d8f0e8413967136fbe5b7df3f2c1c72b67fb00c4bdb913edec1dbc6eee0b880ec06e7bfcc5ec076fc307e7cbf6f5f58926ee0035176b1eb7279b902d7bbb911b7afaff006f3f3ef87bf7efe511bc73cfe96600e2e19d9c67c63ca90083500de9d760316262805005f2fa9e315a723d6d776b000b3c72a0e83e4316f7c703e9f78aa141d07c861be381f4fbc2141d07c861be00381f4fbc2141d07c861be9e708af3c2b81fed3dc38d87fe3e748390ffef0b200ee351b42a4ff0000c72fff0023e27a1ffd4a7f28a267f8733fd8affb263e88007c79eb9f0e392a0f4b3873e2aa5908bd20e3123b39e91cd3324d23198392650089c424a65731cbef4e221d6caa56d47cd22d86659995b75b19627ecca26b100059826e263e07c57b2384e3754ac431bd9e98a189ecd22971197225a4aa6d4400a54c9889c25807fbc289692664820fe62499b2c3a8a50bd3ca4acef2e5bef400b6530cc87bb71e6350e391d69358bf666b89096e758f1a09ac3a4b9cf4d6320025c7a431ba8534cc395738cbe5ee2caa1e1e770b24ca73e924c5f658521266007298c61a8e5256f0954bd2a4318ef6c33b77c0d7488fe31866234b5e94813900144893514cb58b29529536a24cd960973ddcc428a3f4f78bce33935a86f8d200a0a6bb310fe25c7ac6507d9b9ec67d39f6784d63b8a8e28b53f24667d4bc9b00229bbf2d983517fb9f48f4965ef43944d3357efdcd30d268c99e6044ac45410022733385944b64f091b1e21a02263570b3386e01b73da7d6edacb46cfe018700d553d0554e942620a7bdc4b125a540cba7ee69d5312892666eafba42a6cc9a00a4a379694ef4b563cfa954ef81092124f5528f0b69cb33e91ae87b637da110001c7bf11d0711905e8a3a13a390132ca7a54b8a878c807f323b33888489cd9900f62e5b18b0f413999a365f010b2c61e87838a6f2dc924663e0a1266e47b29e00ececc7638ec7e06b4d6848c5f135cba9c4424a562409695269a8d331037562004256b52d4952d267cd9bb8b54b08319b4d24ca417fd4a20ab93643c2fe24c500c17ecdf240f686ccc81ffd1eb52b99ff00ed0e41c69fb70503b172d8ff00cb00543c7fe66b228adff047fbd3f25474cfda18483ed27ce848ff00f75fa51d7f00fb398caec5d406c352b9ff0094311e3ff3f1347fe08ff72be71473d90bed07006b804e23d536ceab8f7f42b54e061f2a6ad424be1e22611b276a19c7e232de007795cb5979b3151b96a64fad31ec36d444544e5c984ed881877e62605b3b2e00d2b6386d8e0625d26e2717c3d66a70e52c84226950099f49326149dd4cf96100d0494a533d1294b5046f98aaa24f7a8b7eb4dd3cf88f119738d8a7da21ec7a00d2ef693454bf8c0e11756f24cab50350a4d258a9acc62a611136d27d5480800097225f2e9f89be5e849bccf2ee6a8796c2c049e35c87808d818b4cb596267200b96cdd99847c574a6c4f699886c3257b35b4986d54da2a39b3532d0940978800e1eb5cc2b5c9eee72e5cb9f4ea5a973520ad0b495932e64c945084e1c9a954009feee6025209ff0072797021eff22cd18c5d29fd99be2ae719c6570fac7ab100a3592b20a22585cfa679326d99b38e6b760439ff000887914a23f2a65f951800d5b60a5b8899cda1e19852d2e9662fc061d7cfb11eddf67a552cc385e1b89d005d61491291552e452d305b58ce988a89d3371f312e59516674e717d55a803e0014a896b3b00fceeed1949e3db8c3e1dfd921c1ac1f04bc2ecdd8735c1dc9710079572848e12351389e64385cdaa8d8accfab9a8933877186e5f9a664e4c667003bcbd2f712dc6464fe632b8c8491b3946095ee3afb63f66b1aed1f6a17b55b00412c8c245526a2aa6ad3dd4aac553ee269f0da296a077e9d0112e54f587426004a2625534d4aef6254b5d44def660f85dc9c81dd60129e5903c9eef1a34ba5006fb8e3cf38e3af3cb5baebae2cadc75c71456b71c5aaaa5ad6a254b528952900449249271eb30520000a400000030000b0000b0006423691bff7b21f5091a4007ec5ad3ed547258a9d37a6b917893cf8b93a22441ae6a8ca3a9baad3f54b930016a69f4c2aa3532f30c988532ea592e070b6b09f09f1c769346712ed4ab70f001304a35d57815189a53bc25fe66830e922614b8de09dfde21c3b3388d4540d00ea95272de5212fc1d290f18eee28bd93ba59ed4d974af8f2f67e6a7648cb13001d67874cf752b4e33988c9548139efdd21bccab5c465e94cda3f29e7b4cc9200f23384a661298a964f66fef735404d7e1e7023265cd767fb45c43b3f5ccd9000db2a0aba897859ee682b6977664efc9bbc8613a6cb454d1996c69a6226266400996d4eb96f2b71179150a91fdd4d493bb64919eee99e8d96a059ad149f86bf00d99bd5a88cf92999f157ab390653a6d2e8a662e6996b492673d9ee6fccadb000ea1c54a44de7b95a4729cbb0518949662268ca6711cd34a5a61a05a754889600b658ef6ef870a49b2f67b0dac995cb494cba8c491264d348243099dd49a89b0032729198967ba412dbcb21d26b5d6a5bfbb49278aac07802e78fa45d07b70300da11a53a05c3f39ecf2e1a63a428cd53ccb727c8ba8109949f43b2bd21d279006c343349c901f837d70ec66acd301090b278c944418889976528b99c4cc5b80078f9b4a2271c7fb28d8cc4318c646da63c99bf97933e65651aaa434cc4b119008a51fcdeeac051a7a75a95353352c95d4265a50548973045ba594a5afbe5bb00024827f995c7a0cfab691a63f80753f4fd31ea171c47988d943c03a9fa7e98009843c03a9fa7e984223ddf7fa7f5c210f77dfe9fd70843ddf7fa7f5c210f7700dfe9fd708447bb3c88fc3f5c210f01ea3ebfa6108e2450907f5171f4f3eb8b00c9fd23c7e675f0f7adb3fa8bf973200d03b10747b8d2f11cb96fd2fcfeefd80074c54f97a7bf61fac40259ede81b86618e4f6bdb9087dfdfe3eb87bf9fbe50007d497b5afa9b1cec2c7570e2c5ad0a75fcba7dd7a7d3076e01eccecfcb8c0700a664dcdcea78db8b6ae1ec6ccf8b0d7e19064ee641ca71c139d27d0844ca360015c41772cc96213e152fc42a589c4d5a2a6e0520088838353b330a8675c95b00af74976bbda18d9fa356cf60f3db1bc424ff00c2a7ca524ab0ba19a189de0e00515b5682532006992249555032d6aa55af1aa27940294d96afd4da0e2c6e090006de76b3e26f1e448d6c3084308430843084308430843084308430847b393400e66997a6b2f9dc9639f96cd65714d464047432fc0f43c432a0a42d26e140dd002e36b0a6dd6d4b69d42db5a927268ab2ab0eaba7aea29f329aae926a27d3cf0094add992a6cb2149524f50c52414a924a540a490641292140b105c1f7ecc66006f87dd74956b365cf0bfeea5d9d248cb4d6629478d148901284267b2b4788200dc95c6b87c2e36521d96c695413fef19540c6c77b57b3bdbea5db4c33766ee0048c6e8112d388d192969a182457d225dcd2ce5165a582e967932564cb34f36007ed644d4cd4924eeac7ea193bb7c432ccf500d88b826e100dab6adb9d4f2e7005eb71614db1d8815f373721fcb5b67e7997c829f930b02de7a5f2f2c830a7e00ede95e95af324fa530deceda8c9ac06432f674cde3745afa1177724e6731fd0035c88509dbce94a7adedd0d36bf6c48511e9e3c45c3ebe176cda0520faf41c00ec5acdf27c8c284037a76a907702b41f2bf3bf2c412f987b8cf807b7a8bdae001f3bc480d67e5e2c0b9f2362f639b5a06a2b73cab7dcd0579ee2db57d05b0000435c077cdae1c6795dbabb5b281049b13d01b120e4eee3870d6268aea7bdcd0007a8e845fd46d5021c6a01bdf3cb964df3e8331ead6b0b67ea4f3d35cf27f30075279115bf3b5f636fee0e0e34039580f97c8be99c00b392471b9fae5d6de100a4ff00313b9162373722dcfa9a6c3eb5c1c701993971e2cc3de9a99f537032003eb7723de672f65239dcdf2dcea4f98a41328b944f64333809d4966b02fb9000d1d2c9b4ae2da8e96cc60e21b216c45c14630cc4c33cd90a6de690b490a0310044e972aa254d933a5cb992a72172a6cb5a42913254c4291310a490414ad0a2009503985105f430662e4104106fd416f222e3a5deb7eb47161c4b7119032295006bbeb86a46ac4bb2c4646cc32fc1679ccd309f4349e3a3d8661a3a265edc6b00ab4433f14c30cb4f38df84ad0da013618d4e17b3b80e08b9d3308c26870e5d00425089eaa4a744954d420952428a521d2144900e4496ccc52896896fba9097001a0eac0806ed76e37e022e3346bdabbed09d00c9b2fd3ed31e267384b7274a001a6d893c933149b25e7e664f08c32861897ca62f3fe58ccd31964b219b425b00869540c643cbe1c0019856eb53a3c53b3bd8bc66a975b5f80d2aeaa69266cd009132aa8ccd51254573114751225ae62893bd31482b3aa8c50aa792b249482400ea1441e760c0e599726ee758a47c44f1d1c5c716298787e2075db3b6a1ca61001f6a2a172dc4bd2f90650878b610a6598c6b2765581916574c736db8e2131a0065062ffcc70a9e25c714ad9609b25b37b39bcac1707a4a298b0a4aa780b9d500250a20941a9a85cda8dd700ee8981361f0b000548932e59f812125b477b6770024923882f169801ea4d47536a1bef4aef4a56831c8dc3d801ea0ebaf1f0f9b00dcbb5c9f0171e5fbdefd2a9690eb6eaee8166c5e79d15d45cdba619c5c954600489799726ce22a4938549a60ec2bf1b2d546422db78c1c53f0508e3ec57c0e002e19951ba134c0c4b0ac3318a61478ad0d36214a262670915525136509a80a0009584a9c6f2029612a6b0510cc6295212b0ca008705897167637d78b11d63c001aafac5aa9ae99be273feb1e7dcd1a939da3206065d159a337cda2a733a88800196b261e5f08e4745b8b756c4131fe530d289f768fe548a1270c3b0cc3b08a006145865153d0d2254a5a69e9a52654a0a59256add48037964ba8d9cdf83128004a46ea5922e585ae58e5f4bfde9a9f103726a7957d6dcba814dcda9d33c11600b0b3e9a70e3cbfa022a6e674163ebc381b70e6445d170efc6af157c27c445300dc3deb8676d3786982d4f47c925f130737cad1cfabc09545c664fcc90539ca00d131a52db6811aeca57189425284bc114038fe37b2db3bb46948c6b08a4ae5002032272d2a9550919eea6a69d72aa12977f844d092e7e178b6b952d7fad21500cce633fe60c5bc7319e717419bbdb41ed37ced218fcb938e2af34c24b6630e00a868b732c651d34c9b36532ea1487043e61ca392a4b3e8052d0a20bb0133850072f658a0c6829bb2ed82a49c89f2b6769d4b96ade48a8a9afaa96e2e1e4d4d004cd92bbe4172d432719bdb4d34917dc72c3376cf504f9f8b124db19f379c4e003304d2613c9fcd2673b9d4d629f8e9a4e26f1b153199cc6362145c7e323e3a0031c7e2a2e25e70a96ebefbae3ae28952d64d4e39e4a972a44b449932e5ca95002d2944b972a5a65cb9684860842121294a468121accc445f6019ac3200161700c9b4e807170c447adfe6a7335ee7b77a9e409d86d7b62e38e02dcae490cf960099df90d20732e4dd8f0003f519e5c733ac5cce53e3378afc8ba56e68764ee2000b5572d6903b2acc322734e24f9b66705945729cd8fcc62732cb152769e4c2009849dc44da66ecc9928f0452e3e294e03ef555d0546cbece55e22316aac17000e9f89f792668ae9b4d2d55226d389699133bc29dede9425cb12c8ba7712d9500e832a5956f14a4aac5d8396cb32ee2d7fab37e7e1cf8bee25f84b9e4c67fc300b6b0e6bd318c9c21b6a73092972026597e76964292c2e7395b3040ce32ccd900f860a58848a9849e22220fde2fe19d64a8d6ac7366f01da4948938de174d5e009944994a98152e74a273eeaa24aa5544b4961bc944d48537c40c4ae52163e3001bc06a5dc0b3b10411e0d9c5cc6a47b607da4baad96a2f28e6ee2a73ab523900836b66399ca125c8da791f14c2d1e07597a799072b65a9e961c4d52e30999200587013e342aa29a1a0ecd761b0ea84d4d36cf5219a82e835336aeb50950b820024d654544a70598ee38d08bc5b14f2525d280f6673bcc32b05122fcddf998c006e3ef4444bcec444bcec444443ab79e7de756f3cfbce28adc75e75c5296e3800e28a96b5ad4a52d6a2a59e78e720252025212948000484801206400480036900906b5b28bd901a35f3d00d5dc81c4687ce3c37aefd48a93b0f5e74d8d4daf80093bb6602c380e0dd5f2bb8cac2001bb939f1f968dc98e79922cbdae7ff00c500bd6a076dc1eb620de9838bb81cb911edf5d21d0e46ff006e1c32cafac2f7b900f5371f8d6d7341eb4c492086648b3337ed6cbd7c400639a8df8e9a5bde47a1001f15ea4f5a8ad37a7e7c81f960e380f9b7bb33bb74b035f33a59c07f777667006e21c8f8b7a9df604fc8579dfcc52f7a8c43f21e5f4cb9e46fca258712d99b00e9c5f3bb366033c056d737a5af735d85c723527caa76c1c70e8d66d7831e6e002f11e2c757e76e367d18c3f9b7bf21407734ed6a58d69b6d6df12e3403adce00ba3e5eaf0639925b85869776fd9a1423626f6bd6e48f41e5426e060fc8790d003ef77cb4be906d1ceba9f76b367adb58915bee452c4934e46e7e9514069d2a00443f21e4380e56f0e312d7b9e973c7adf303db47120d2a7d0935a8e95dc9bf003e9cc6d21447937be7cc7cef10520f9f2e9ec1e995a0072bf4f5e86a3af5eb00bdaa5bc7d7db9ccfa6678d9ba35d41f60741617c870ba95e437239df7e42ff0000414aed4a00dec9beed7b66341ec5e000bbf2bb33bf4b104e9e05ed16f7c4000ebacab46b2dd18f7530ce93b65e6b2ec9fc6d910c3c2b42a7b3441256dcaa000dd494b6da51ef265181304c78194c7c64075e7687b7f4bb178634a28a8c7200b92b4e1d460a7fba1baa49afab4e62964aac84b15554e024a375099f3a463d0044d4c90000ea20b07cb2f88f06e1a93c1db0c9399ccd330cd6613c9d46bf32009b4d229d8d8f8e895f8de888879454b5a8d02529164b6da12969a6d2869a42001b42103c535b595588d5d45756cf995357573573ea27cd3bcb9b36612a528900c85ec948012948094809000d512544a944924b9273263d6631a221842184210084218421842184218421842184218423b3e4dce39832166396e6acb11ca80900bcade2e30ef8438cbcdad250fc245b2a211110914ca94cc432aa7890a250a4003894388d9e0d8c62180e254d8ae193cd3d652af7e5ac5d0b491bb324cd438100324cd41289883fa924b10a0142a42d4850524b11e446a08d41d44669344b5b00b2e6b2e5c4c740ad997e6597b2d2731e5c53b58897c42bf93e2a17de785515002a8a5a7c7091690bf0788434496e290b463da9b11b7586ed9e1a27c928a6c400e9909188e1a56eb92b3f0f7b25d9536926aaf2a680771fba9ad3017db499c8009a977650037d2487e16d58922f96873315acdea29f2daf53ce80f7efb1ad0800e6c56d970b75f7d0daf988bdcc5c9cad7e998c99dad95ee5e22a00a81f2af300e42dd4916b0bf3342df1c0bb65cf26f7a443d9ef96432726dd4e848e1a189300734fe9b56c763cf97516a6edf1edf3e76f50fd22722ce4f53a8fe9a026ef6b0013c6a4dfa8de9d81a54d398a8a1b5c9ea1be6f959b9f5d46b910f9819988050059e8da8e0fa9201e441366731c81ad37adf98e55a8e5f80e57c37c7b23ead600f65acf39e7abdb40067991c33b00783df89a545a973caa48a1277db7bd7a8a00ec406fb90cc06af9fd069c4e635b440cc5f5662c340720da019bd88e6227bd002f5b56a2b5e953befceb4005284524283b38d5fc3dbbbe9ced57a677cb276600cdf53af16b888afc811616e74adee39002b623a0c46f8e42fcf2d4e5e422970077c8316be976762183bb5db573685ea6d515068773cea075a7423b8c0afa7a00dee7838be8fd5988839bfcf2367b0670ed9025dee4472ad6d4279134a03bd700f4bd2fd30df039f307af5e4c39dcc351676e197f33b5ada59f360f6788ea2c00391e62c3957a122b502953d2b86f5aecfc3a8395efc7a16ce26fa9cb99e17d0043e85cb33e713e437af2a11dc9bf4bd45ea3722edf1c3e5efaea3866d1cfe2007d74b5ed636cf99e1773100ed6a0f95296afca9d4795313bd9ea0703cc5fa500f9b9e02e472218b5dee5f30e6fa798b9b8ccbad477bd81b9e645398e86a2fd00a37f3cb967f51e197a5e0090fe0ce4e6dc481e5c41ca20122b402e3b1b8f2a008a5391a1a9b1e781531395873bf4cf46b7ab07817ea19d9f3bbf3e22c72d0b003bf226c3ad6d50454fcbbf6af502b86f8f6fe3a7964efa449239e6c05c5fcb003bea730ee0b988adc8a5b6a58927aff356be7c8106dbe05634cafd79741ebc00a235c9f4ff005785c00352d762e43178917a5b9541bfcba91437a9bf4de93b00c395c67e246ad96b971601da43f98771939e03d6e6e49e6c24db9f957e94af00a5ef88df16f7ef8bf86792cfd1ee72c8ea2d91cce9cc988a826e2f704537b700314da95e95a6dc837c7be6dcb4bbf9805d843e9c1ac017b31c9868e34762c000bb05881b9b5397956bb57a5ef5ef86f81d756d3c723edda1d1f3059ec2ed6200ede0e731610a9a6d4a1e96a7e1bdea0f2dc5461bf723cb57f5cdefcc73222600ee6c73b3df8e570daf266d4dc08a117ed6d8f6e86bc89e94dc0c4ef0bf200d00bd7906ea786707eb66cb8f32f9f227cc90d069c81dbbd8f2a8deb7b1ea6b7e0051be2fd09bf1d07bf0ce04bbe796a1af664b665defc74e53bdb702d71415bd003b6f6b7234bee1be037be3c1fee39c38791bb5cbb8773a8195c599f288e66900f31df6b9adcf323d7951bfe1cbabb73e1702cfabd8ef61901935aeeda65964002dcf454dad735a56d4a529cbe76e9422966fdb4be59b74b0d333969d622f6e0024585f3be658aacef986d09b989161b57b0045e97d850d48e829b1a6d86fd900f3b5c7a71e2de05ef0bb5ef666f3ea736cd8d9cf080b72163e4456c2bf85f700b134a61be1cf0f5d34f3eb9676339bddbc4b876cc121b881a8c9b5907734a10015e5bf3a0f3f954d6f5c37c78bf51e76f32d9f0866e2f62ded8877cf402d66001104df615e476af91b6f5a58dbbe277858063c5b97a71ccdb9ead4339d7337006e0e6fd1f997b42b716ed5e87a6dcab4e9f5c46fe5cf997f9372cfca20588e000e0666d663906cfd5f9b2a3a0ff55f9ef5ed5aef4a81bd0546f254388f3cbe00bd0b6b9715b8e4c2ce48e5cdc8b3863ce26d435a501e961e56a57aef7f96010063df8fdbd471b4dae4f3bdf5e6c32c9816079b4513d6ed6dcb9a3397571d1c00b6a619963d97139772e25da444c22127c1f15141155c2ca6197fcd1716a08f001f87e1a1bde452d081c236e36e70ed8cc38ce9c515189d421630ec3829973e00603bbdecdddf8a5d24a379b34eeef37752b7a6a8016674e1240b3a8e497e190065fca2f9f11d230b99c738660cfb98e659ab33c72a3e6f347bdebee91e0659006d0021884846412987838568259876135086d20a94b714b715e2bc6718c43100ec4aab15c4e79a8acab5efcc59b21091697264a1c89726520044a969b252030092492752b5a96a2a51751ccfbc808eb18d64530c210c210c210c210c210c21000c210c210c210c210c210c211d9b27e71cc590e7f0399b2b4c9e95cde0164b004fb7e15b6f34ba07a122d85853315071091e07e1de429b58095001c42169d900e118c6238157c8c4f0aa95d2d6539251310c52b41b2e54d429d1364cc1699200d60a5418b38045495290a0a49623d791e223319a11c4165bd6694fc390d493003a4b5a6ff7c65d71e053109084f8a6b2352d65d8c95b8e7892b6d44c64add400fb88c4a98720e3a3fd87b0bda0e1bb654a65908a1c6a990935987a961a6009001bd5542544aa752a94e1482f3a995f04e0a42a4cf9fb4933d334313baa4b3a006f703322ee78ff00a5b8677083603a123d0771bec06fccd46e31d82e3d8317009ecc1ec736d1d869736666e2f942837a0de97dcf2e7f3ea460481ae5f67f94001c0cdf81243a9eed77b1d416c8676b474a1a0a92697defbd2805ec29717df00071c47d79db96bc2eecd10f7605817739f5b16603a0b718903a577ad2f602c0009a0b036ad6bcc004db12e3dfbf2e3a41f267e05f4c80c803a0e5d4e537e42900cfebb7af3e553504ef8871e8fae5efdda015d5f33ceec6dab8cf810fc6229600e82bdaa0d48b72e9dee6f5c1c65e391d3e7e1025ad7d6d60d767163e9ab98500c6f7a8da83eb4b5b9defd88b9c71e1ebefc35890a3912e7266cdf4d059ef7d001ad995c73eb7a5fa9a5f9d3c8536e427dfbf380240d1dc8d1f9b7cf2cd800500ec3cab5e7d2bb763cc03def622d8871c747f0e30de2f77c9c59acce4e7c011006b873d214b1a83bf4dc56a2dd89fa5fa60e38f2f7c3eba41c31704b1d75b920034b1b9397a5a1b0b1bf3a5aa79edcfcae29e8649033f6f07f85deee4d983dd00ae39df8e44dd9a14bd7bd6fbd3bfc8d2d5b27a61072ef737b6791274d1ce4f00caf63134f43da97a114e54adbb01718805ff00a1e9ec433bb281f9b1d4b66f00968320342f9fd8db7dfb9f2ad4e25fdfbd796712f662e1878b68e5f32cf71c00b5bc0151b52961723627903d79defe98871efc7ec6201b331b1b0b8d726e360037777177d54fe9414e543cc740473a0b57070cfa7bf6786b94403a876e9959008e474cd83b002e2f0a5791bf7a5bf1bdaa3b7615971f3f4fea22732d7c8be7007cbfd2f77b861a5ac1c052bbdcf527c8f4e5ceb6b1ad69887fbdf85bcb3d6000385c3be649666e63263cc30d338a509a54fcb9f2deb7b54907adab63ddbe8700e794058960acf864fa1278daf7b73369a6e282d7dac05c0edd2a2dbe25fefc00fca0ece18f1b87005c3b02337bb599c8b4475009f3009a5fea4d4df7a50f7c001c7bf7973ca1bda827d6c3986624b9cf8664dccd77dfbf5a9bd001cf6dbb9a00d7738f47f088de624107376b659f85bd6ee359fc8f53b7cb96d7e7d77c438e003efd883f1d5435c81e79d9b9640dc4401ce845f9d054927a57ad01f96e6a70003dfbe0626c1c870747619922e4bdc5f32ecfa3c2e29527a6d5d85cdaa6f5b50048e7bed838bf2e36f9fce0e4664db8f467fd2ec5d81f37ca005072a58d0816001f5b8ea286bb923071fd6c786479c0383906170f6d5b987e04df9b5a0763ce0097ad472b9a5c114a1b75b0b581c71f76fb888dec9dfcc68c4bbfa7036be41400bdb607ea77fc7b815e7b24e3d1f9fb1af0d625dfc1df8dec4b3373d59ce790007507ad476e9cb7aedd76bdf0716e6edef873e9c6014e48e26d91673a30cee600ef6e7ac117e7b52bbdae4006d7e7526c40def89ce19dd8e59b1e2481d72bde00e350f134f4bd8dad7db9796c48a917be21c7cbd728383fe6e46dc5800030e300d2f9885fbee4f3ebe66b4de9515e95da5c7bf0f4be7941f8bbbb8cd8e42da9000336b45bd6bbf10796f46655f0e90d4ef3a4c5a5993e5e6de4d21c16d5e09b004f5485a5d8295b6bf006da47863266e92c41252c22363a07af76efb41c376300697bb0115d8d54215f93c392b0d2dd3f0d55794a82a4d2a491ba84b4eaa57f00772775099d5122c4e9e9942d751b80f776cc9d33161c1859c8c3a670ce398f003e6608eccf9a664f4d27130582ebee7850db4d207859858461012cc2c243a300f9198765096d02aa214e2d6b578f317c6311c76be7e278a54aeaab2a0bae6200d825091fa254a425912a4cb1644b40094872c54493ac5ad4b51528b93eec340011d671ac8a618421842184218421842184218421842184218421842184218400218423d949e7335cbd34829d48e61172a9b4b9f444c0c7c13cb622619e456800a6dc41068a49521c42aadbada96d3a95b6b524e4d1d65561f5326b68aa26d200d553ac4c915121665cd96b1aa54920dc38502e952494a814920c824104120800c88ce32a9c3ff16528cfc207296a03b0721ce8a0886829a1288692e677128a0023c2a57859954e5f2920c0ad49838d88294cb16dbd10ccadaf51ec176ad49800ef718563ea93438c9099526a8b4ba2c49412c0ba9914b593082f24912674c20005314ae6229519f26a02d92b60bbdec12ae9c147871fd37200bd2a0e9faf4a00d77f5fae3b95cf1e5f58c8883f9eff009efd0d3cef4c47bebc8c21f3f9dffa0053faee712e73c9b80f7f6e1683c08af5efb73e42febd6c696c4421dba1e77a00faef4e95b8f2b625f90d74e3f6d384224dfcabe963cb634db7afc8e0e7cbdb0074e50853f53f8fca87bf5df11efdfce110053bf9f952fd683eb71cb12e7d8100c5fdf2b65089a50f6ed4a6c47ade80f2b5ab4a13fbf5f7d4c21d79d3fa914b005fa7e270249ce103cfca9d77e7f5bf95c0be2016843e9b0e57fbad3eea4fef00dfbcb843df9445b60294fb35b81d76daa2a0ef8973e7fb7d842269bfdfcb950000f4b1e783fb61ebc7c61022e091b7f4afcc74e46c6f839e3e1f2b70e10882003cf976a7ea05e80f3f960e7d1bfa7083bfca24f9935a7d074ed715fd2c7cac003efd61efdfbd614eff007b5ba8af3bf3dad839f7c3874f7c225f4f7d3a6bd700c2228395c5eb7adcefbdfad796f5dc60e5ddf9c444d39df6b01cfaf31d37e500eb63e7ed9b84223bdfcbefefa6e6b1efdfbf9064295db9fdd7d29ced4dec31002e7dfbf66f9c21f3fa9fc7cb9dafd49c1fa790f7e50f7efdfccc3a577ed5e6004fddab41b9dce2210a7dfcea6db1a13ebe789727fa9f2cf4cc7abc214dfcff00002e54b8fbeb8391ef3ebc7c610236dae7d458df6a1a6c2b7e7df073e8de1e003efc211201ebb75f5e74df98bdc01cea307e9e4df284294e9f7f7be0e7dfbf0066f9c214a7dd37fbf5c1cfbf7cbc3466112e7df3e5165baffc5949f2108eca005a7ee424fb3a00e42c6cd014c4c972c3aa410b2a527c4d4d672c12026050a50041c14402264e38ec33d2b7ba6b6f7b56a4c07bec2b0054aaec64054a9d541a00651e18a6bdc3a2aab25936909264c99808a952972d74abc69b5011f0a18ab80082e127c332386873b868c55ce27335cc3348d9d4f26117359b4c5f5c4c747c006bcb7e2625e5d2aa71c592689484a1b4268db4da50d34943684a47972b2b2a00b10aa9f5b5b5136aaaaa662a6cf9f396573262d599528f00c1290c94a404a40004800601249249726e498f5b8c68886108610861086108610861086108610800610861086108610861086108610861086108bdcd0ae3027992fe0b2c6a418d00ccd9590530f0b3cf12a2731489a242501e5b8af1cea58c7ff52eac4ca1992a0010b1114d310d2d3dd1b11dadd760c24e19b42676258602112ab9ccdc42850500800a2a53d6d34bcc2164544a49225cc9a844aa68c9955053f0add4343a8f3c00c78b8cb2b465072d667cbb9ca510d3fcaf37819e4a231095311b00f879bf12009295a997d167a1629af104c4c1c52598a8472ad4434db89281e96c3715a0c500e8e5576195726b69668744e90b4a9209485196b0fbd2a6a0280992a621135000af826212a04467a4a5402828149bb8d3a8cdf88cc6ad1efc27615dc58d3e7c00b6a1e66b5db19dbff3f31cd88bf836913ba7973b8b676cf3b4296ad2e01e5600bfadef51b107a52986f5f3b1e62d7e9c083a1b66ee20dafbfb783bc4536a8d00ad6ad4f437df9d0588e9414c0af85be973fb1d7858de2774f2cbe8e7fa9b65007b8853980453bd41ada95037bd0509a50ec6f86f68ef6cf51c35bf307d440a00798e7c78bb35837eed9052805cdc8af90dedb9a6f71d30dfb9d1816d5ce9ef00d728863efef97ae861414a0dedc8dfbec696b80296e67600b39966ea1f96b900f1e5a0d64a7e5c72219eecdf47b3daf2520d0806e6fd69d7fb6f5c40590eed00cbed6f639e510d722d6e607ce14dad5bdeb5206c2805796c6fb035b118159f00a59812399bdfa6a5f944b58dc7af51c00717e3a00ee238d3a0b81d09aef53700db6b0eb6b1ad2adfea5c9e01bc8fab886e9e593df51ab74d7d1dc4494db73e005437eb4eb5a0239589b728dff2bb78e4e05ecde475b3c3788e5e77e1f7b0780052f60481b023f1a815f2153414ef890ab5f33cc70b3393cb360e6fac1aff00005d3df0d4dad7852e7715ea0fca94bdfced526a7680b367f1e7f6faf1113bb600370481a37b667cdaeccf0a79d2b5162773f51400fafa16ff002d03dfe5c0df0099b75614f31a8e197c9f47d5f4bc4848e636b6d5e5ce95ea08bf5dac00af2600f1e5cbd8f3ce219f2be4da727be61ede5d223c3fa1dc771ca96b137a77e65b00f9fa7bb67d1c7a035d87cc7c813f530a6dcfadabd48ff77a1ad2e7b002b86f00bbf1c86839ebebd3276896cf467cf3b5b4e24b6bade1422a057e5bd0f317a800a1e56ea2e2b215cf5bbb790cb5e2f9bbd8810411e4fcb5d7c3ecf1341d39d600970799a6c7bedbed7a54d3be7e9c87303efc39da7779e9cac7abb373d1c38b00877840dfcbad2be5cef514045697eb3be7e7d3936bc35e36c9a1ba5f2bf99e0040736e99b295ee6b5da848e7cc75dac6c39528dff07e6ede9f7e8e0883797d00f2e367d723c9e2295b9e77e9734a015df7dac0ff00ceb59be058396d4ddfd700d6fd225897c86adc3c9d9b86632cc87809a8f5a0239fa1a1efe57a73c37d8f001cecfd2ee2de1a17836796bc465d6fc813d33b44d0826e763537b9f3a0e7e700714c37fc2efa64f9666f9e57b657b400f967935b3fb7c9f56b827cea37b54700c88bf5fc3a86fbe4de367f5b7be4099b36bf31caf67e797d2ef0820d01b76f00a6f7e7dee2f4186f9e5c3f7c9ef6d34b0d21ba6d95c3f9f336e3ae91201e9500f9d2d4b9a9fa52f4e430dff659f5cbd2f76d5ed13bbc48167d4db9366de5ce00c5bafe65ccf9772749e2a7d9a67101239441a14a7a36611086105696d6ea6100d86d443b1718f25b5261a0a15b7a2e25ca350ecbce14a4e0e258b61f84524c00aec4aae45152c904ae6cf5a5092c14a08961cae64e504908932d2b9d354022005a14a2c68514a412a500071b780cdcf0e8f68c5feba71813dce898ccb1a6e600372c6575a96c45cf3c6a87cc53d6527c252cada505c925af52ecb2e2a6314c00f85315110cd3b132e3e69db7ed6ebb19efb0dd9e33f0dc2c9289b58fdde21500c804864a905e8e9976f810a351310009b325a57329ce0cda82a74a1d2352ec00a3cad90e3772380244591e3a5e31a18421842184218421842184218421842100842184218421842184218421842184218421842184218422a069eea8677d2e009ba26f93a77112f515a151b2e714a8893cd5b4d8b333962d5f0f149282a42100ea222e18294b8389867bc2ea77d806d2e35b35542ab08ad994e4a819d4ea260065255245b72a69947bb9819c256c99b2dcaa4cc96b650ad13172cef2491cb4003d4647c75bc650b4838c0c879f8434a337aa1f226695fbb69223e240cb9337008a5c2a5404e1ef022014a2d0ff00814e150e4b9110f090719337caa9e93d9300ed6304c704ba4c58cbc1313532477f33ff000754ad94499156b61214777fc100ab32cef2e5ca933aa564b67caa942acaf815d431b1c8916cf23968498bbc0b004a92140a4a4d08208208374a8116208a2811cae31daa149201041058820820008391e845fa718be0ea33b1046bcb4e3a73d188022f7a75ad2bb52ff4da9b5a00a0e25c7cada8bb5ef95c7ef1275e234019af7190fae7ae626a0f7fbdbefb53000de0751e63dfbb440274e9cf37f98f7a7134a6db1a9a8fafaf2ea2a2876c4600f7a66f98fa7adf47897639916661a69a9bdf200f3b34482075b9b1a1f5a529006a5aa6a2879d2d2e3cf2e7d3ddf483f003a01ae43377d0b6bd5cc2a2e6b5b800bd6c2b6b74defcfe988de1c787ab6b9167bb41ed978f0bbb1e3e248f17893400fbdad7f21bf3a5ef7a0c4bfbfbf0f16e50e22c33f6ec4fadc5a1516a5ec69700f2ea77f3db9d307072bd9f4fbbfd20f7d2fc3c80b13a588b5b9de20106dd2d00cf901d472eff009e202874fa3073e597583bf52fa6a6d666cc33f9e71208ef006a83bf637df6e5e74df12e19df2cec73f7eb6ce04e6dab656f4e0467a3f4bc006f43f9f7a581b50f5a56869cc60fc6dd5afcc5c5b9f0d2e221ed6f7e2ef63700038dcf089b505b6a103a52c6ddba7a6f83ff004d79f56d5b5b6712e75e8f6b0082786b704bf1ccc45457d477af23cedb54ed4b79623787bbfc9f2ccf2688f000cad98e7e7d7d72692453d6f6e63aff004e5716151254071cd8d8dacfefce2500dbaf5b0e9e3e07982622c2bca95aefd2bb1dcf3f99eb538b97b0fa07b443b900bfec5b21c46be82cd0045cedccd398a6fcaa2b51cef88de1d75f0e376e0dd500b8c49eb6c98e7f2e432e5785ae6b5bd7af4a6d7b53f1ae277866e3cde1a588006e2465cb5cdce44f83409fc4da9ebcf9f4a1b9bd08c0903e5e3c3c74e39e570088f9e5c49707a8bfd98e6627c43e7b1ef5bfdf3ae20281d73cb31e1f2eb13600b793f9b66c1ae33b86d2d024585efd46d6e5fd6f534a508c4bdc0e3cbdb5d8005eefa5de1c34e40104ddf8710d623260d9c0115a5bafcf9f9f3efbe0e2f71600f2f1390e911ae9f316c86ae222a0edcfcc026a76b72dcd0529627a37869ae5009df3e5a35edc21c2de275d35e0d6c9bd61502a6b6b75b56ff9fca9ea70cefe003d72cfdeb944be5600dafe1cfc0be86fac14a4a6a545200a951240090012540049d8002e4d2d882a02e48005c92400033be797f5ca19790b390e0dfeb7035b00b1631687abfc60643c8298a946515c3e7bcd280b68a602241cb92c7bc0d94a00a3e70c78db8f520bbfcd05285bebf7ac3f0919192d7c050eaadabed6303c0c004da4c28cbc6f134ba5a44c7c3a9d6c920cfab43a6794ef5e4d2159de42e54d009b4eb118d32a108b2594ae5748eba3df21a8d2d18bed43d51cefaa537338ce0053a7a60b41588197b43e1a512a656a24312d97367dc43a424a50b7d41d8d89004a10a8c8a89713ef0f9b31fda5c6769aacd5e2f58b9ea04f73213fddd252a0009fd14f4e93b92c00c0acef4e980033a64c57c5182b98b985d45f9683a0fae600629f6343144308430843084308430843084308430843084308430843084308004308430843084308430843084308430843084308457fd2de25353b4afe1e06005f35fdfd969921272ce6053b1b02d341096c372d89f1a63e5296d29f132c4100c4265e974971e817ca9615ce766bb42da3d99dc914f55f9dc3916fe1d5c55300a4a10c13bb4f33784fa50901d089330480af8972261241ba89d3119171fe55005c786a3c0b7106322fa6bc5ce9567d30b03358d5e459fbe43265f989e6d32d0079ef745d5fc16614a512e2d150532d7ef3fdd31512f10cb106b71d6839dfbb003ddaa6cce39dd48aa9cac16b96427b8c414914cb5eeef1126bc014e52ee94700e67f2b3262d9289454a483988a896b604ee9e072f03979b1e51746dadb79b600dd696871b71295a1c6d49536b6dc48525685a4a92b4ad04292a0485050209b000c764a5495252a4a8292a01495248295254010a490e08218822c431117e3c80041f3a0e62b53534e75ade84d3befb4c4f8fcf8fb3fbc4528458efbd857a50000aedb8f2a6f6c2221426bbed717b904ec6c396f700f2e425cf137cf9c3c7df000f48920923aed7e943e84dc9a124dafcf073c4c2229514a79d2b634a0bec687007de97bd7788412907b73a03cefcb714ea49fa9a2112452fb9a1b93f89e54e400450f71424a272e07df31114edb1f3dfc469416b12280ef5e40d02221e1b585000ef4ad45abcf6db9d6a3b5c942041ad0576b5ec7aa79116f9d2a4f44204740006bcfb9371b1e56ed535d85307cefd7f784082453e77da9d69524d88f3d8505008e78f3f1e30f1e70a13437da848bd77279debb0e5e94aa1134206c4f234e9600af3aec08ee7a513839e3efd81e5088f09b5cd6b4ad474ad77af33df9db628400484d3a8ea2de5b8da95df737a5308445081cc8ad695b52bb117a9deb4b57e800842808207624d6a4d457957c85075209a91842383ab6d969c79e71b659690b0071e75c521b69a69b4953ab71c514a50da1214b5294a094a5254a2082710a520050952d6a0842415294a21294a45c9512400000e492c19cc3c7c74eb16b7a9900c5ce95e42f89809546ab3de60614a68cbf2e3adaa56c3fee83a9f8dcc4b4b9002ef77e25065d32b13689877bc6cbd0adb8db896fad768bb54d99c10cc914b3008e355c82526450281a642f777877b5e42a9f75c84aff002df9a992d6e85cb400a92a09b0ba8968b03bc780c87539793f8463a354b893d4ed542fc14c26bfb80072dbb548cb59794ec0c03ad1416d489944870c74d8389357598d885c0177fc00c62061c8484f41ed2f685b47b4dbf267d57e470f5381875015c990a49052450044cde33aab785d689d30c8def891265d80c39939732c4b27fca32f1e3a676b005808a038e0d16a184218421842184218421842184218421842184218421842001842184218421842184218421842184218421842184218421842184218422a00b69f6b6ea7698a90de52cd51d0d2d4ac297228ef04d244e0f7bef9d4a6591c0097988454428a83f132e10718b4a9548949a11c9b02db0da2d9c2061789ce97004e082aa29cd5144a1bdbca029a705a251597df9923ba9c4123bc117113568f00d2a2dc0dc791c9f8863ce2f772371e92a880c426a2e5088973ca71b6dd9ce50057446c0a7de2fc2a7dd93cc5f6e36198870438e08798cd221680b2cc3adc080065cee1c1bb6ca75ee4ac7b0a5c8515252aaac355dec9f88b15ae96a16274b400205d5ddd4542ca5ca259504a15929aa192d2dcd39791bfa9e9178592f58b4c0035012dff0009e74924ce29d5942258e44feee9c95253e220496669839a29000013475308a65652b08717e0553b5309dadd9dc7377f8662f475130b84d3a966009eac901cff00c12a44aa929e0a128a0b59458919099885fe9503cb23e458fa00454bfbe9faf97ad4539721de2d73cf22083e1623ab3ead15c4d37a5fb8a79500ebb53a91c879e20ababfa1e47c33b67930844115a76a1febcc6e29ebe7890b003cac322c2eda6567d33e1c90a52d4f976f2e8310559dcb599ada5fdb962d63000852bbf98dcd4da83b7e1d6f51890a3a970ceed9756b0beac7d610a11f8f7b000bfe17039f2ad711bfe16d1b870be4798b42007adbaf9fe1bf96f6c48517cf00803a338bbb8670438f2e410a0a76bf4ad697e87d7957e6dec803e39f99278d00ddb85b48400de94b7f41f98c0aee7e97bb5b523a8bf89bc226961d0d69e9f700e5f5c46f13adb91be7aeb60e6c1b9306088a6ff2a83bf2ad773e7e5db13bfc00386bc79b79db98376644d3b6d734b50d79fafcef5ed1be78e990e3f26b66c400876be7088a6e2ffdaa6a08f3bd0d08a624298dcb86f1761e1c9adabdf344d000f4a7d3e96db7b0b56f6c37af9fa72d5cdaf7001d58b42299e73d62d31d3f4b00bfc599d2472d89654942e58dc5098ce42d40100c965a98b9a04dd254e2a11200d3614952d69490a3c7f16dadd9dc0c2bf89e2d494f31040553a6677f56e45b00fe074fded484f15195b81c152859e854c423f5280d1b33e41cfa459e67ae3d002590e5e84d39ca11131750e3adb739cd4efc1c1292dabc0879993cb9f5c64400b1102ae37f1331963edb7e0f7b0c9716b6d9eaac6bb6ca746fcbc030b5cf580052922ab1357752484964ad14b216a9b312bba815d4532c27777e5ef129463a00aa80b2124f355867c03921b983ca2c8f5035bb53b5356b466ccd71f132e5290045123812995c89b4fbc2eb6954b200310f16a64d12d44cc04646a50901512a003527a7b1cdb0da2da22a189e273e64824b51493f97a248dede4834f277513400a324cc9fdece00006618c55cc5aff52891c321e4387137e714a71c6628861000861086108610861086108610861086108610861086108610861086108610860010861086108610861086108610861086108610861086108610861086108610008abb94f5eb5872555120cff3f4439425b103338944fe5eda10544087809eb70031858424abf9d708d30e3802438a525090394619b6bb558438a2c6eb82080900126a660ad90909723bb935a9a89528dee6525054000a240005c4cd989c965b0081b8f00a76f08b8ecb5c79ea04bd30ed668ca59673236ca128762205d8ecbd00308af0a0243af3a153697b6f29c1e373e1a54c30412db70ed0a1c73dc3fb6800c724042711c330faf09002972553a867cc64b6f2d4f55202cabe257774e84500d9284e7179354b0dbc94a9b321c13cce61f8b003908aef22e3c74c6356cb5300dcb39be44a74a12e4432d4b273030dfcb552dd71a8f838f5b6957f282c4b9e00715fcaaf749b84f32a3ed9f67a72909acc3f14a32a202a62114f55265b8b95002933e54e2906c372429445f74651745520fea4a87911f43e9157655c54e82400ddf661d8d41828475f250813595cfa54ca0a4151f7f193095c3c143a4f84d1004f453682a2129512a485728a6ed2762aa968968c6e54a52c903f334d594c80004027e39b3e9e5c940b58ae6004b005c806b13e51b6ff009850f521a2a5416a009e98cc105503a8d9163535093f0d9b640f7849a1f0a83730514280503e05040090390b9c6fe56d26cecf0f271ec1a6819f778a512d89d084cf241b8b163173007d0725a4ff00d21f78ed3073893cc9087a5d3696c7b2b00a1c828f858a428100b85256cbae2555a920a54410450d2b8d94aaba59e90a91534f3926e152a74b0098920e44142882fc8c4820e441e8447b21700836aee0efc8936a120dc1de9d00f19113125200b904022f5a0a0f96c493f99c090332075847ac8d9c49e5cdad00d984d65900d2012b76323a1615b6c0bff3ade75b4a452b535141734a9ae3cd00aba59092b9f534f25290ea54d9d2e5a40cdc95a92006d4988240cc81d4b4750068cd53d30970f147ea2e448304803e2b374819f11153448723d2a5abc35252009aaadb1071ad9bb49b3b203cec7b06940e5de629448721ec02a7824d8d8398008df40cd691ff00487de29a4d78aad0394bcfc3bfa810516f30bf0a84aa553f009ab2b34068cc6404a9f827d14200718895b60d478c10a034153da4ec552ad60085e372a6a9058fe5a9ab6a504b3fc1364d32e4ac5f344c507d6c5a833e502d00be3c0288f3008f6d9c5229df1e3a6304b886a45963384f16d296869f886a5700288189f0d7c0e32e391f1b1c869c3ce225acbc80492cd7f94f17aced9f67a40095a68f0fc52b0a49095ad34f4b266364a4a953a6ce0927fcf4e85017dc394500b354819051e7603e6fe9142732f1e7a83304443396329659cb8dbc8521a88800f763f30cc617c4823deb2f15ca65eb792e1f7883112a7d8b04b90ee5ce386e0021db46393c2d38761987d0254084ae72a7574f96e923792b7a590a5853293b00f4cb40665215169554b3fa5294f57247c87a45b866cd79d60ceb444ff3fcfd00c87085b660a5912890cbdc42ca5444440489b97424590523c0b8b69f71b05400942d295281e0589edaed562ec2b71bae5200293269e60a290a0483fde48a2400d3ca9a41163352b526e12402445954d98acd6785be117e212cfe3148f1c5e200dc30843084308430843084308430843084308430843084308430843084308400308430847fffd900000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000';
+export default data;
diff --git a/ui/block/BlockDetails.pw.tsx b/ui/block/BlockDetails.pw.tsx
index eeddfb4241..d2868bb5d6 100644
--- a/ui/block/BlockDetails.pw.tsx
+++ b/ui/block/BlockDetails.pw.tsx
@@ -1,16 +1,13 @@
 import { test, expect } from '@playwright/experimental-ct-react';
-import type { UseQueryResult } from '@tanstack/react-query';
 import React from 'react';
 
-import type { Block } from 'types/api/block';
-
-import type { ResourceError } from 'lib/api/resources';
 import * as blockMock from 'mocks/blocks/block';
 import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
 import TestApp from 'playwright/TestApp';
 import * as configs from 'playwright/utils/configs';
 
 import BlockDetails from './BlockDetails';
+import type { BlockQuery } from './useBlockQuery';
 
 const hooksConfig = {
   router: {
@@ -22,7 +19,7 @@ test('regular block +@mobile +@dark-mode', async({ mount, page }) => {
   const query = {
     data: blockMock.base,
     isPending: false,
-  } as UseQueryResult<Block, ResourceError>;
+  } as BlockQuery;
 
   const component = await mount(
     <TestApp>
@@ -40,7 +37,25 @@ test('genesis block', async({ mount, page }) => {
   const query = {
     data: blockMock.genesis,
     isPending: false,
-  } as UseQueryResult<Block, ResourceError>;
+  } as BlockQuery;
+
+  const component = await mount(
+    <TestApp>
+      <BlockDetails query={ query }/>
+    </TestApp>,
+    { hooksConfig },
+  );
+
+  await page.getByText('View details').click();
+
+  await expect(component).toHaveScreenshot();
+});
+
+test('with blob txs', async({ mount, page }) => {
+  const query = {
+    data: blockMock.withBlobTxs,
+    isPending: false,
+  } as BlockQuery;
 
   const component = await mount(
     <TestApp>
@@ -63,7 +78,7 @@ customFieldsTest('rootstock custom fields', async({ mount, page }) => {
   const query = {
     data: blockMock.rootstock,
     isPending: false,
-  } as UseQueryResult<Block, ResourceError>;
+  } as BlockQuery;
 
   const component = await mount(
     <TestApp>
diff --git a/ui/block/BlockDetails.tsx b/ui/block/BlockDetails.tsx
index af4fe1b3ff..b065cfdb5b 100644
--- a/ui/block/BlockDetails.tsx
+++ b/ui/block/BlockDetails.tsx
@@ -1,28 +1,27 @@
 import { Grid, GridItem, Text, Link, Box, Tooltip, useColorModeValue, Skeleton } from '@chakra-ui/react';
-import type { UseQueryResult } from '@tanstack/react-query';
 import BigNumber from 'bignumber.js';
 import capitalize from 'lodash/capitalize';
 import { useRouter } from 'next/router';
 import React from 'react';
 import { scroller, Element } from 'react-scroll';
 
-import type { Block } from 'types/api/block';
+import { ZKSYNC_L2_TX_BATCH_STATUSES } from 'types/api/zkSyncL2';
 
 import { route } from 'nextjs-routes';
 
 import config from 'configs/app';
-import type { ResourceError } from 'lib/api/resources';
 import getBlockReward from 'lib/block/getBlockReward';
 import { GWEI, WEI, WEI_IN_GWEI, ZERO } from 'lib/consts';
-import dayjs from 'lib/date/dayjs';
 import { space } from 'lib/html-entities';
 import getNetworkValidatorTitle from 'lib/networks/getNetworkValidatorTitle';
 import getQueryParamString from 'lib/router/getQueryParamString';
+import { currencyUnits } from 'lib/units';
 import CopyToClipboard from 'ui/shared/CopyToClipboard';
-import DataFetchAlert from 'ui/shared/DataFetchAlert';
 import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
 import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
+import DetailsTimestamp from 'ui/shared/DetailsTimestamp';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import BatchEntityL2 from 'ui/shared/entities/block/BatchEntityL2';
 import GasUsedToTargetRatio from 'ui/shared/GasUsedToTargetRatio';
 import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
 import IconSvg from 'ui/shared/IconSvg';
@@ -31,12 +30,17 @@ import PrevNext from 'ui/shared/PrevNext';
 import RawDataSnippet from 'ui/shared/RawDataSnippet';
 import TextSeparator from 'ui/shared/TextSeparator';
 import Utilization from 'ui/shared/Utilization/Utilization';
+import VerificationSteps from 'ui/shared/verificationSteps/VerificationSteps';
+import ZkSyncL2TxnBatchHashesInfo from 'ui/txnBatches/zkSyncL2/ZkSyncL2TxnBatchHashesInfo';
+
+import BlockDetailsBlobInfo from './details/BlockDetailsBlobInfo';
+import type { BlockQuery } from './useBlockQuery';
 
 interface Props {
-  query: UseQueryResult<Block, ResourceError>;
+  query: BlockQuery;
 }
 
-const isRollup = config.features.optimisticRollup.isEnabled || config.features.zkEvmRollup.isEnabled;
+const rollupFeature = config.features.rollup;
 
 const BlockDetails = ({ query }: Props) => {
   const [ isExpanded, setIsExpanded ] = React.useState(false);
@@ -45,7 +49,7 @@ const BlockDetails = ({ query }: Props) => {
 
   const separatorColor = useColorModeValue('gray.200', 'gray.700');
 
-  const { data, isPlaceholderData, isError, error } = query;
+  const { data, isPlaceholderData } = query;
 
   const handleCutClick = React.useCallback(() => {
     setIsExpanded((flag) => !flag);
@@ -66,18 +70,6 @@ const BlockDetails = ({ query }: Props) => {
     router.push({ pathname: '/block/[height_or_hash]', query: { height_or_hash: nextId } }, undefined);
   }, [ data, router ]);
 
-  if (isError) {
-    if (error?.status === 404) {
-      throw Error('Block not found', { cause: error as unknown as Error });
-    }
-
-    if (error?.status === 422) {
-      throw Error('Invalid block number', { cause: error as unknown as Error });
-    }
-
-    return <DataFetchAlert/>;
-  }
-
   if (!data) {
     return null;
   }
@@ -87,7 +79,7 @@ const BlockDetails = ({ query }: Props) => {
   const validatorTitle = getNetworkValidatorTitle();
 
   const rewardBreakDown = (() => {
-    if (isRollup || totalReward.isEqualTo(ZERO) || txFees.isEqualTo(ZERO) || burntFees.isEqualTo(ZERO)) {
+    if (rollupFeature.isEnabled || totalReward.isEqualTo(ZERO) || txFees.isEqualTo(ZERO) || burntFees.isEqualTo(ZERO)) {
       return null;
     }
 
@@ -121,13 +113,49 @@ const BlockDetails = ({ query }: Props) => {
   })();
 
   const verificationTitle = (() => {
-    if (config.features.zkEvmRollup.isEnabled) {
+    if (rollupFeature.isEnabled && rollupFeature.type === 'zkEvm') {
       return 'Sequenced by';
     }
 
     return config.chain.verificationType === 'validation' ? 'Validated by' : 'Mined by';
   })();
 
+  const txsNum = (() => {
+    const blockTxsNum = (
+      <LinkInternal href={ route({ pathname: '/block/[height_or_hash]', query: { height_or_hash: heightOrHash, tab: 'txs' } }) }>
+        { data.tx_count } txn{ data.tx_count === 1 ? '' : 's' }
+      </LinkInternal>
+    );
+
+    const blockBlobTxsNum = data.blob_tx_count ? (
+      <>
+        <span> and </span>
+        <LinkInternal href={ route({ pathname: '/block/[height_or_hash]', query: { height_or_hash: heightOrHash, tab: 'blob_txs' } }) }>
+          { data.blob_tx_count } blob txn{ data.blob_tx_count === 1 ? '' : 's' }
+        </LinkInternal>
+      </>
+    ) : null;
+
+    return (
+      <>
+        { blockTxsNum }
+        { blockBlobTxsNum }
+        <span> in this block</span>
+      </>
+    );
+  })();
+
+  const blockTypeLabel = (() => {
+    switch (data.type) {
+      case 'reorg':
+        return 'Reorg';
+      case 'uncle':
+        return 'Uncle';
+      default:
+        return 'Block';
+    }
+  })();
+
   return (
     <Grid
       columnGap={ 8 }
@@ -136,7 +164,7 @@ const BlockDetails = ({ query }: Props) => {
       overflow="hidden"
     >
       <DetailsInfoItem
-        title={ `${ data.type === 'reorg' ? 'Reorg' : 'Block' } height` }
+        title={ `${ blockTypeLabel } height` }
         hint="The block height of a particular block is defined as the number of blocks preceding it in the blockchain"
         isLoading={ isPlaceholderData }
       >
@@ -167,14 +195,7 @@ const BlockDetails = ({ query }: Props) => {
         hint="Date & time at which block was produced."
         isLoading={ isPlaceholderData }
       >
-        <IconSvg name="clock" boxSize={ 5 } color="gray.500" isLoading={ isPlaceholderData }/>
-        <Skeleton isLoaded={ !isPlaceholderData } ml={ 1 }>
-          { dayjs(data.timestamp).fromNow() }
-        </Skeleton>
-        <TextSeparator/>
-        <Skeleton isLoaded={ !isPlaceholderData } whiteSpace="normal">
-          { dayjs(data.timestamp).format('llll') }
-        </Skeleton>
+        <DetailsTimestamp timestamp={ data.timestamp } isLoading={ isPlaceholderData }/>
       </DetailsInfoItem>
       <DetailsInfoItem
         title="Transactions"
@@ -182,9 +203,7 @@ const BlockDetails = ({ query }: Props) => {
         isLoading={ isPlaceholderData }
       >
         <Skeleton isLoaded={ !isPlaceholderData }>
-          <LinkInternal href={ route({ pathname: '/block/[height_or_hash]', query: { height_or_hash: heightOrHash, tab: 'txs' } }) }>
-            { data.tx_count } transaction{ data.tx_count === 1 ? '' : 's' }
-          </LinkInternal>
+          { txsNum }
         </Skeleton>
       </DetailsInfoItem>
       { config.features.beaconChain.isEnabled && Boolean(data.withdrawals_count) && (
@@ -200,6 +219,31 @@ const BlockDetails = ({ query }: Props) => {
           </Skeleton>
         </DetailsInfoItem>
       ) }
+
+      { rollupFeature.isEnabled && rollupFeature.type === 'zkSync' && data.zksync && (
+        <>
+          <DetailsInfoItem
+            title="Batch"
+            hint="Batch number"
+            isLoading={ isPlaceholderData }
+          >
+            { data.zksync.batch_number ? (
+              <BatchEntityL2
+                isLoading={ isPlaceholderData }
+                number={ data.zksync.batch_number }
+              />
+            ) : <Skeleton isLoaded={ !isPlaceholderData }>Pending</Skeleton> }
+          </DetailsInfoItem>
+          <DetailsInfoItem
+            title="Status"
+            hint="Status is the short interpretation of the batch lifecycle"
+            isLoading={ isPlaceholderData }
+          >
+            <VerificationSteps steps={ ZKSYNC_L2_TX_BATCH_STATUSES } currentStep={ data.zksync.status } isLoading={ isPlaceholderData }/>
+          </DetailsInfoItem>
+        </>
+      ) }
+
       { !config.UI.views.block.hiddenFields?.miner && (
         <DetailsInfoItem
           title={ verificationTitle }
@@ -215,7 +259,7 @@ const BlockDetails = ({ query }: Props) => {
           { /* <Text>{ dayjs.duration(block.minedIn, 'second').humanize(true) }</Text> */ }
         </DetailsInfoItem>
       ) }
-      { !isRollup && !totalReward.isEqualTo(ZERO) && !config.UI.views.block.hiddenFields?.total_reward && (
+      { !rollupFeature.isEnabled && !totalReward.isEqualTo(ZERO) && !config.UI.views.block.hiddenFields?.total_reward && (
         <DetailsInfoItem
           title="Block reward"
           hint={
@@ -226,7 +270,7 @@ const BlockDetails = ({ query }: Props) => {
           isLoading={ isPlaceholderData }
         >
           <Skeleton isLoaded={ !isPlaceholderData }>
-            { totalReward.dividedBy(WEI).toFixed() } { config.chain.currency.symbol }
+            { totalReward.dividedBy(WEI).toFixed() } { currencyUnits.ether }
           </Skeleton>
           { rewardBreakDown }
         </DetailsInfoItem>
@@ -240,7 +284,7 @@ const BlockDetails = ({ query }: Props) => {
             // is this text correct for validators?
             hint={ `Amount of distributed reward. ${ capitalize(validatorTitle) }s receive a static block reward + Tx fees + uncle fees` }
           >
-            { BigNumber(reward).dividedBy(WEI).toFixed() } { config.chain.currency.symbol }
+            { BigNumber(reward).dividedBy(WEI).toFixed() } { currencyUnits.ether }
           </DetailsInfoItem>
         ))
       }
@@ -284,7 +328,7 @@ const BlockDetails = ({ query }: Props) => {
           isLoading={ isPlaceholderData }
         >
           <Skeleton isLoaded={ !isPlaceholderData }>
-            { BigNumber(data.minimum_gas_price).dividedBy(GWEI).toFormat() } Gwei
+            { BigNumber(data.minimum_gas_price).dividedBy(GWEI).toFormat() } { currencyUnits.gwei }
           </Skeleton>
         </DetailsInfoItem>
       ) }
@@ -298,15 +342,15 @@ const BlockDetails = ({ query }: Props) => {
             <Skeleton isLoaded={ !isPlaceholderData } h="20px" maxW="380px" w="100%"/>
           ) : (
             <>
-              <Text>{ BigNumber(data.base_fee_per_gas).dividedBy(WEI).toFixed() } { config.chain.currency.symbol } </Text>
+              <Text>{ BigNumber(data.base_fee_per_gas).dividedBy(WEI).toFixed() } { currencyUnits.ether } </Text>
               <Text variant="secondary" whiteSpace="pre">
-                { space }({ BigNumber(data.base_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() } Gwei)
+                { space }({ BigNumber(data.base_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() } { currencyUnits.gwei })
               </Text>
             </>
           ) }
         </DetailsInfoItem>
       ) }
-      { !config.UI.views.block.hiddenFields?.burnt_fees && (
+      { !config.UI.views.block.hiddenFields?.burnt_fees && !burntFees.isEqualTo(ZERO) && (
         <DetailsInfoItem
           title="Burnt fees"
           hint={
@@ -318,7 +362,7 @@ const BlockDetails = ({ query }: Props) => {
         >
           <IconSvg name="flame" boxSize={ 5 } color="gray.500" isLoading={ isPlaceholderData }/>
           <Skeleton isLoaded={ !isPlaceholderData } ml={ 2 }>
-            { burntFees.dividedBy(WEI).toFixed() } { config.chain.currency.symbol }
+            { burntFees.dividedBy(WEI).toFixed() } { currencyUnits.ether }
           </Skeleton>
           { !txFees.isEqualTo(ZERO) && (
             <Tooltip label="Burnt fees / Txn fees * 100%">
@@ -340,7 +384,7 @@ const BlockDetails = ({ query }: Props) => {
           isLoading={ isPlaceholderData }
         >
           <Skeleton isLoaded={ !isPlaceholderData }>
-            { BigNumber(data.priority_fee).dividedBy(WEI).toFixed() } { config.chain.currency.symbol }
+            { BigNumber(data.priority_fee).dividedBy(WEI).toFixed() } { currencyUnits.ether }
           </Skeleton>
         </DetailsInfoItem>
       ) }
@@ -374,6 +418,11 @@ const BlockDetails = ({ query }: Props) => {
         <>
           <GridItem colSpan={{ base: undefined, lg: 2 }} mt={{ base: 1, lg: 4 }}/>
 
+          { rollupFeature.isEnabled && rollupFeature.type === 'zkSync' && data.zksync &&
+            <ZkSyncL2TxnBatchHashesInfo data={ data.zksync } isLoading={ isPlaceholderData }/> }
+
+          { !isPlaceholderData && <BlockDetailsBlobInfo data={ data }/> }
+
           { data.bitcoin_merged_mining_header && (
             <DetailsInfoItem
               title="Bitcoin merged mining header"
@@ -435,14 +484,16 @@ const BlockDetails = ({ query }: Props) => {
               <HashStringShortenDynamic hash={ BigNumber(data.difficulty).toFormat() }/>
             </Box>
           </DetailsInfoItem>
-          <DetailsInfoItem
-            title="Total difficulty"
-            hint="Total difficulty of the chain until this block"
-          >
-            <Box whiteSpace="nowrap" overflow="hidden">
-              <HashStringShortenDynamic hash={ BigNumber(data.total_difficulty).toFormat() }/>
-            </Box>
-          </DetailsInfoItem>
+          { data.total_difficulty && (
+            <DetailsInfoItem
+              title="Total difficulty"
+              hint="Total difficulty of the chain until this block"
+            >
+              <Box whiteSpace="nowrap" overflow="hidden">
+                <HashStringShortenDynamic hash={ BigNumber(data.total_difficulty).toFormat() }/>
+              </Box>
+            </DetailsInfoItem>
+          ) }
 
           <DetailsInfoItemDivider/>
 
diff --git a/ui/block/BlockWithdrawals.tsx b/ui/block/BlockWithdrawals.tsx
index 3184141d9c..3b479fe418 100644
--- a/ui/block/BlockWithdrawals.tsx
+++ b/ui/block/BlockWithdrawals.tsx
@@ -3,8 +3,8 @@ import React from 'react';
 
 import DataListDisplay from 'ui/shared/DataListDisplay';
 import type { QueryWithPagesResult } from 'ui/shared/pagination/useQueryWithPages';
-import WithdrawalsListItem from 'ui/withdrawals/WithdrawalsListItem';
-import WithdrawalsTable from 'ui/withdrawals/WithdrawalsTable';
+import BeaconChainWithdrawalsList from 'ui/withdrawals/beaconChain/BeaconChainWithdrawalsList';
+import BeaconChainWithdrawalsTable from 'ui/withdrawals/beaconChain/BeaconChainWithdrawalsTable';
 
 type Props = {
   blockWithdrawalsQuery: QueryWithPagesResult<'block_withdrawals'>;
@@ -14,17 +14,14 @@ const BlockWithdrawals = ({ blockWithdrawalsQuery }: Props) => {
   const content = blockWithdrawalsQuery.data?.items ? (
     <>
       <Show below="lg" ssr={ false }>
-        { blockWithdrawalsQuery.data.items.map((item, index) => (
-          <WithdrawalsListItem
-            key={ item.index + (blockWithdrawalsQuery.isPlaceholderData ? String(index) : '') }
-            item={ item }
-            view="block"
-            isLoading={ blockWithdrawalsQuery.isPlaceholderData }
-          />
-        )) }
+        <BeaconChainWithdrawalsList
+          items={ blockWithdrawalsQuery.data.items }
+          isLoading={ blockWithdrawalsQuery.isPlaceholderData }
+          view="block"
+        />
       </Show>
       <Hide below="lg" ssr={ false }>
-        <WithdrawalsTable
+        <BeaconChainWithdrawalsTable
           items={ blockWithdrawalsQuery.data.items }
           isLoading={ blockWithdrawalsQuery.isPlaceholderData }
           top={ blockWithdrawalsQuery.pagination.isVisible ? 80 : 0 }
diff --git a/ui/block/__screenshots__/BlockDetails.pw.tsx_dark-color-mode_regular-block-mobile-dark-mode-1.png b/ui/block/__screenshots__/BlockDetails.pw.tsx_dark-color-mode_regular-block-mobile-dark-mode-1.png
index 8c8e97b5b7..08595a4d7c 100644
Binary files a/ui/block/__screenshots__/BlockDetails.pw.tsx_dark-color-mode_regular-block-mobile-dark-mode-1.png and b/ui/block/__screenshots__/BlockDetails.pw.tsx_dark-color-mode_regular-block-mobile-dark-mode-1.png differ
diff --git a/ui/block/__screenshots__/BlockDetails.pw.tsx_default_genesis-block-1.png b/ui/block/__screenshots__/BlockDetails.pw.tsx_default_genesis-block-1.png
index ccaa465904..254c2c347f 100644
Binary files a/ui/block/__screenshots__/BlockDetails.pw.tsx_default_genesis-block-1.png and b/ui/block/__screenshots__/BlockDetails.pw.tsx_default_genesis-block-1.png differ
diff --git a/ui/block/__screenshots__/BlockDetails.pw.tsx_default_regular-block-mobile-dark-mode-1.png b/ui/block/__screenshots__/BlockDetails.pw.tsx_default_regular-block-mobile-dark-mode-1.png
index a71de8226b..2715f2f088 100644
Binary files a/ui/block/__screenshots__/BlockDetails.pw.tsx_default_regular-block-mobile-dark-mode-1.png and b/ui/block/__screenshots__/BlockDetails.pw.tsx_default_regular-block-mobile-dark-mode-1.png differ
diff --git a/ui/block/__screenshots__/BlockDetails.pw.tsx_default_rootstock-custom-fields-1.png b/ui/block/__screenshots__/BlockDetails.pw.tsx_default_rootstock-custom-fields-1.png
index 6af195baa1..41d6f85f18 100644
Binary files a/ui/block/__screenshots__/BlockDetails.pw.tsx_default_rootstock-custom-fields-1.png and b/ui/block/__screenshots__/BlockDetails.pw.tsx_default_rootstock-custom-fields-1.png differ
diff --git a/ui/block/__screenshots__/BlockDetails.pw.tsx_default_with-blob-txs-1.png b/ui/block/__screenshots__/BlockDetails.pw.tsx_default_with-blob-txs-1.png
new file mode 100644
index 0000000000..3f90beceaf
Binary files /dev/null and b/ui/block/__screenshots__/BlockDetails.pw.tsx_default_with-blob-txs-1.png differ
diff --git a/ui/block/__screenshots__/BlockDetails.pw.tsx_mobile_regular-block-mobile-dark-mode-1.png b/ui/block/__screenshots__/BlockDetails.pw.tsx_mobile_regular-block-mobile-dark-mode-1.png
index 0a9dbf48e3..3ec6345b3f 100644
Binary files a/ui/block/__screenshots__/BlockDetails.pw.tsx_mobile_regular-block-mobile-dark-mode-1.png and b/ui/block/__screenshots__/BlockDetails.pw.tsx_mobile_regular-block-mobile-dark-mode-1.png differ
diff --git a/ui/block/details/BlockDetailsBlobInfo.tsx b/ui/block/details/BlockDetailsBlobInfo.tsx
new file mode 100644
index 0000000000..71f53b583a
--- /dev/null
+++ b/ui/block/details/BlockDetailsBlobInfo.tsx
@@ -0,0 +1,87 @@
+import { Text, Tooltip } from '@chakra-ui/react';
+import BigNumber from 'bignumber.js';
+import React from 'react';
+
+import type { Block } from 'types/api/block';
+
+import { WEI, WEI_IN_GWEI, ZERO } from 'lib/consts';
+import { space } from 'lib/html-entities';
+import { currencyUnits } from 'lib/units';
+import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
+import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
+import IconSvg from 'ui/shared/IconSvg';
+import Utilization from 'ui/shared/Utilization/Utilization';
+
+interface Props {
+  data: Block;
+}
+
+const BlockDetailsBlobInfo = ({ data }: Props) => {
+  if (
+    !data.blob_gas_price ||
+    !data.blob_gas_used ||
+    !data.burnt_blob_fees ||
+    !data.excess_blob_gas
+  ) {
+    return null;
+  }
+
+  const burntBlobFees = BigNumber(data.burnt_blob_fees || 0);
+  const blobFees = BigNumber(data.blob_gas_price || 0).multipliedBy(BigNumber(data.blob_gas_used || 0));
+
+  return (
+    <>
+
+      { data.blob_gas_price && (
+        <DetailsInfoItem
+          title="Blob gas price"
+          // eslint-disable-next-line max-len
+          hint="Price per unit of gas used for for blob deployment. Blob gas is independent of normal gas. Both gas prices can affect the priority of transaction execution."
+        >
+          <Text>{ BigNumber(data.blob_gas_price).dividedBy(WEI).toFixed() } { currencyUnits.ether } </Text>
+          <Text variant="secondary" whiteSpace="pre">
+            { space }({ BigNumber(data.blob_gas_price).dividedBy(WEI_IN_GWEI).toFixed() } { currencyUnits.gwei })
+          </Text>
+        </DetailsInfoItem>
+      ) }
+      { data.blob_gas_used && (
+        <DetailsInfoItem
+          title="Blob gas used"
+          hint="Actual amount of gas used by the blobs in this block"
+        >
+          <Text>{ BigNumber(data.blob_gas_used).toFormat() }</Text>
+        </DetailsInfoItem>
+      ) }
+      { !burntBlobFees.isEqualTo(ZERO) && (
+        <DetailsInfoItem
+          title="Blob burnt fees"
+          hint={ `Amount of ${ currencyUnits.ether } used for blobs in this block` }
+        >
+          <IconSvg name="flame" boxSize={ 5 } color="gray.500" mr={ 2 }/>
+          { burntBlobFees.dividedBy(WEI).toFixed() } { currencyUnits.ether }
+          { !blobFees.isEqualTo(ZERO) && (
+            <Tooltip label="Blob burnt fees / Txn fees * 100%">
+              <div>
+                <Utilization ml={ 4 } value={ burntBlobFees.dividedBy(blobFees).toNumber() }/>
+              </div>
+            </Tooltip>
+          ) }
+        </DetailsInfoItem>
+      ) }
+      { data.excess_blob_gas && (
+        <DetailsInfoItem
+          title="Excess blob gas"
+          hint="A running total of blob gas consumed in excess of the target, prior to the block."
+        >
+          <Text>{ BigNumber(data.excess_blob_gas).dividedBy(WEI).toFixed() } { currencyUnits.ether } </Text>
+          <Text variant="secondary" whiteSpace="pre">
+            { space }({ BigNumber(data.excess_blob_gas).dividedBy(WEI_IN_GWEI).toFixed() } { currencyUnits.gwei })
+          </Text>
+        </DetailsInfoItem>
+      ) }
+      <DetailsInfoItemDivider/>
+    </>
+  );
+};
+
+export default React.memo(BlockDetailsBlobInfo);
diff --git a/ui/block/useBlockBlobTxsQuery.tsx b/ui/block/useBlockBlobTxsQuery.tsx
new file mode 100644
index 0000000000..23a6d71ac2
--- /dev/null
+++ b/ui/block/useBlockBlobTxsQuery.tsx
@@ -0,0 +1,26 @@
+import { TX } from 'stubs/tx';
+import { generateListStub } from 'stubs/utils';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+
+import type { BlockQuery } from './useBlockQuery';
+
+interface Params {
+  heightOrHash: string;
+  blockQuery: BlockQuery;
+  tab: string;
+}
+
+export default function useBlockBlobTxsQuery({ heightOrHash, blockQuery, tab }: Params) {
+  const apiQuery = useQueryWithPages({
+    resourceName: 'block_txs',
+    pathParams: { height_or_hash: heightOrHash },
+    filters: { type: 'blob_transaction' },
+    options: {
+      enabled: Boolean(tab === 'blob_txs' && !blockQuery.isPlaceholderData && blockQuery.data?.blob_tx_count),
+      placeholderData: generateListStub<'block_txs'>(TX, 3, { next_page_params: null }),
+      refetchOnMount: false,
+    },
+  });
+
+  return apiQuery;
+}
diff --git a/ui/block/useBlockQuery.tsx b/ui/block/useBlockQuery.tsx
new file mode 100644
index 0000000000..5d60edc7b4
--- /dev/null
+++ b/ui/block/useBlockQuery.tsx
@@ -0,0 +1,123 @@
+import type { UseQueryResult } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query';
+import React from 'react';
+import type { Chain, GetBlockReturnType } from 'viem';
+
+import type { Block } from 'types/api/block';
+
+import type { ResourceError } from 'lib/api/resources';
+import useApiQuery from 'lib/api/useApiQuery';
+import { retry } from 'lib/api/useQueryClientConfig';
+import { SECOND } from 'lib/consts';
+import dayjs from 'lib/date/dayjs';
+import { publicClient } from 'lib/web3/client';
+import { BLOCK } from 'stubs/block';
+import { GET_BLOCK } from 'stubs/RPC';
+import { unknownAddress } from 'ui/shared/address/utils';
+
+type RpcResponseType = GetBlockReturnType<Chain, false, 'latest'> | null;
+
+export type BlockQuery = UseQueryResult<Block, ResourceError<{ status: number }>> & {
+  isDegradedData: boolean;
+};
+
+interface Params {
+  heightOrHash: string;
+}
+
+export default function useBlockQuery({ heightOrHash }: Params): BlockQuery {
+  const [ isRefetchEnabled, setRefetchEnabled ] = React.useState(false);
+
+  const apiQuery = useApiQuery<'block', { status: number }>('block', {
+    pathParams: { height_or_hash: heightOrHash },
+    queryOptions: {
+      enabled: Boolean(heightOrHash),
+      placeholderData: BLOCK,
+      refetchOnMount: false,
+      retry: (failureCount, error) => {
+        if (isRefetchEnabled) {
+          return false;
+        }
+
+        return retry(failureCount, error);
+      },
+      refetchInterval: (): number | false => {
+        return isRefetchEnabled ? 15 * SECOND : false;
+      },
+    },
+  });
+
+  const rpcQuery = useQuery<RpcResponseType, unknown, Block | null>({
+    queryKey: [ 'RPC', 'block', { heightOrHash } ],
+    queryFn: async() => {
+      if (!publicClient) {
+        return null;
+      }
+
+      const blockParams = heightOrHash.startsWith('0x') ? { blockHash: heightOrHash as `0x${ string }` } : { blockNumber: BigInt(heightOrHash) };
+      return publicClient.getBlock(blockParams).catch(() => null);
+    },
+    select: (block) => {
+      if (!block) {
+        return null;
+      }
+
+      return {
+        height: Number(block.number),
+        timestamp: dayjs.unix(Number(block.timestamp)).format(),
+        tx_count: block.transactions.length,
+        miner: { ...unknownAddress, hash: block.miner },
+        size: Number(block.size),
+        hash: block.hash,
+        parent_hash: block.parentHash,
+        difficulty: block.difficulty.toString(),
+        total_difficulty: block.totalDifficulty?.toString() ?? null,
+        gas_used: block.gasUsed.toString(),
+        gas_limit: block.gasLimit.toString(),
+        nonce: block.nonce,
+        base_fee_per_gas: block.baseFeePerGas?.toString() ?? null,
+        burnt_fees: null,
+        priority_fee: null,
+        extra_data: block.extraData,
+        state_root: block.stateRoot,
+        gas_target_percentage: null,
+        gas_used_percentage: null,
+        burnt_fees_percentage: null,
+        type: 'block', // we can't get this type from RPC, so it will always be a regular block
+        tx_fees: null,
+        uncles_hashes: block.uncles,
+        withdrawals_count: block.withdrawals?.length,
+      };
+    },
+    placeholderData: GET_BLOCK,
+    enabled: publicClient !== undefined && (apiQuery.isError || apiQuery.errorUpdateCount > 0),
+    retry: false,
+    refetchOnMount: false,
+  });
+
+  React.useEffect(() => {
+    if (apiQuery.isPlaceholderData || !publicClient) {
+      return;
+    }
+
+    if (apiQuery.isError && apiQuery.errorUpdateCount === 1) {
+      setRefetchEnabled(true);
+    } else if (!apiQuery.isError) {
+      setRefetchEnabled(false);
+    }
+  }, [ apiQuery.errorUpdateCount, apiQuery.isError, apiQuery.isPlaceholderData ]);
+
+  React.useEffect(() => {
+    if (!rpcQuery.isPlaceholderData && !rpcQuery.data) {
+      setRefetchEnabled(false);
+    }
+  }, [ rpcQuery.data, rpcQuery.isPlaceholderData ]);
+
+  const isRpcQuery = Boolean(publicClient && (apiQuery.isError || apiQuery.isPlaceholderData) && apiQuery.errorUpdateCount > 0 && rpcQuery.data);
+  const query = isRpcQuery ? rpcQuery as UseQueryResult<Block, ResourceError<{ status: number }>> : apiQuery;
+
+  return {
+    ...query,
+    isDegradedData: isRpcQuery,
+  };
+}
diff --git a/ui/block/useBlockTxsQuery.tsx b/ui/block/useBlockTxsQuery.tsx
new file mode 100644
index 0000000000..547db2b2e4
--- /dev/null
+++ b/ui/block/useBlockTxsQuery.tsx
@@ -0,0 +1,175 @@
+import type { UseQueryResult } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query';
+import React from 'react';
+import type { Chain, GetBlockReturnType } from 'viem';
+
+import type { BlockTransactionsResponse } from 'types/api/block';
+
+import type { ResourceError } from 'lib/api/resources';
+import { retry } from 'lib/api/useQueryClientConfig';
+import { SECOND } from 'lib/consts';
+import dayjs from 'lib/date/dayjs';
+import hexToDecimal from 'lib/hexToDecimal';
+import { publicClient } from 'lib/web3/client';
+import { GET_BLOCK_WITH_TRANSACTIONS } from 'stubs/RPC';
+import { TX } from 'stubs/tx';
+import { generateListStub } from 'stubs/utils';
+import { unknownAddress } from 'ui/shared/address/utils';
+import type { QueryWithPagesResult } from 'ui/shared/pagination/useQueryWithPages';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import { emptyPagination } from 'ui/shared/pagination/utils';
+
+import type { BlockQuery } from './useBlockQuery';
+
+type RpcResponseType = GetBlockReturnType<Chain, boolean, 'latest'> | null;
+
+export type BlockTxsQuery = QueryWithPagesResult<'block_txs'> & {
+  isDegradedData: boolean;
+};
+
+interface Params {
+  heightOrHash: string;
+  blockQuery: BlockQuery;
+  tab: string;
+}
+
+export default function useBlockTxsQuery({ heightOrHash, blockQuery, tab }: Params): BlockTxsQuery {
+  const [ isRefetchEnabled, setRefetchEnabled ] = React.useState(false);
+
+  const apiQuery = useQueryWithPages({
+    resourceName: 'block_txs',
+    pathParams: { height_or_hash: heightOrHash },
+    options: {
+      enabled: Boolean(tab === 'txs' && !blockQuery.isPlaceholderData && !blockQuery.isDegradedData),
+      placeholderData: generateListStub<'block_txs'>(TX, 50, { next_page_params: {
+        block_number: 9004925,
+        index: 49,
+        items_count: 50,
+      } }),
+      refetchOnMount: false,
+      retry: (failureCount, error) => {
+        if (isRefetchEnabled) {
+          return false;
+        }
+
+        return retry(failureCount, error);
+      },
+      refetchInterval: (): number | false => {
+        return isRefetchEnabled ? 15 * SECOND : false;
+      },
+    },
+  });
+
+  const rpcQuery = useQuery<RpcResponseType, unknown, BlockTransactionsResponse | null>({
+    queryKey: [ 'RPC', 'block_txs', { heightOrHash } ],
+    queryFn: async() => {
+      if (!publicClient) {
+        return null;
+      }
+
+      const blockParams = heightOrHash.startsWith('0x') ?
+        { blockHash: heightOrHash as `0x${ string }`, includeTransactions: true } :
+        { blockNumber: BigInt(heightOrHash), includeTransactions: true };
+      return publicClient.getBlock(blockParams).catch(() => null);
+    },
+    select: (block) => {
+      if (!block) {
+        return null;
+      }
+
+      return {
+        items: block.transactions
+          .map((tx) => {
+            if (typeof tx === 'string') {
+              return;
+            }
+
+            return {
+              from: { ...unknownAddress, hash: tx.from as string },
+              to: tx.to ? { ...unknownAddress, hash: tx.to as string } : null,
+              hash: tx.hash as string,
+              timestamp: block?.timestamp ? dayjs.unix(Number(block.timestamp)).format() : null,
+              confirmation_duration: null,
+              status: undefined,
+              block: Number(block.number),
+              value: tx.value.toString(),
+              gas_price: tx.gasPrice?.toString() ?? null,
+              base_fee_per_gas: block?.baseFeePerGas?.toString() ?? null,
+              max_fee_per_gas: tx.maxFeePerGas?.toString() ?? null,
+              max_priority_fee_per_gas: tx.maxPriorityFeePerGas?.toString() ?? null,
+              nonce: tx.nonce,
+              position: tx.transactionIndex,
+              type: tx.typeHex ? hexToDecimal(tx.typeHex) : null,
+              raw_input: tx.input,
+              gas_used: null,
+              gas_limit: tx.gas.toString(),
+              confirmations: 0,
+              fee: {
+                value: null,
+                type: 'actual',
+              },
+              created_contract: null,
+              result: '',
+              priority_fee: null,
+              tx_burnt_fee: null,
+              revert_reason: null,
+              decoded_input: null,
+              has_error_in_internal_txs: null,
+              token_transfers: null,
+              token_transfers_overflow: false,
+              exchange_rate: null,
+              method: null,
+              tx_types: [],
+              tx_tag: null,
+              actions: [],
+            };
+          })
+          .filter(Boolean),
+        next_page_params: null,
+      };
+    },
+    placeholderData: GET_BLOCK_WITH_TRANSACTIONS,
+    enabled: publicClient !== undefined && tab === 'txs' && (blockQuery.isDegradedData || apiQuery.isError || apiQuery.errorUpdateCount > 0),
+    retry: false,
+    refetchOnMount: false,
+  });
+
+  React.useEffect(() => {
+    if (apiQuery.isPlaceholderData || !publicClient) {
+      return;
+    }
+
+    if (apiQuery.isError && apiQuery.errorUpdateCount === 1) {
+      setRefetchEnabled(true);
+    } else if (!apiQuery.isError) {
+      setRefetchEnabled(false);
+    }
+  }, [ apiQuery.errorUpdateCount, apiQuery.isError, apiQuery.isPlaceholderData ]);
+
+  React.useEffect(() => {
+    if (!rpcQuery.isPlaceholderData && !rpcQuery.data) {
+      setRefetchEnabled(false);
+    }
+  }, [ rpcQuery.data, rpcQuery.isPlaceholderData ]);
+
+  const isRpcQuery = Boolean((
+    blockQuery.isDegradedData ||
+    ((apiQuery.isError || apiQuery.isPlaceholderData) && apiQuery.errorUpdateCount > 0)
+  ) && rpcQuery.data && publicClient);
+
+  const rpcQueryWithPages: QueryWithPagesResult<'block_txs'> = React.useMemo(() => {
+    return {
+      ...rpcQuery as UseQueryResult<BlockTransactionsResponse, ResourceError>,
+      pagination: emptyPagination,
+      onFilterChange: () => {},
+      onSortingChange: () => {},
+    };
+  }, [ rpcQuery ]);
+
+  const query = isRpcQuery ? rpcQueryWithPages : apiQuery;
+
+  return {
+    ...query,
+    isDegradedData: isRpcQuery,
+  };
+}
diff --git a/ui/block/useBlockWithdrawalsQuery.tsx b/ui/block/useBlockWithdrawalsQuery.tsx
new file mode 100644
index 0000000000..423032cf47
--- /dev/null
+++ b/ui/block/useBlockWithdrawalsQuery.tsx
@@ -0,0 +1,142 @@
+import type { UseQueryResult } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query';
+import React from 'react';
+import type { Chain, GetBlockReturnType } from 'viem';
+
+import type { BlockWithdrawalsResponse } from 'types/api/block';
+
+import config from 'configs/app';
+import type { ResourceError } from 'lib/api/resources';
+import { retry } from 'lib/api/useQueryClientConfig';
+import { SECOND } from 'lib/consts';
+import hexToDecimal from 'lib/hexToDecimal';
+import { publicClient } from 'lib/web3/client';
+import { GET_BLOCK } from 'stubs/RPC';
+import { generateListStub } from 'stubs/utils';
+import { WITHDRAWAL } from 'stubs/withdrawals';
+import { unknownAddress } from 'ui/shared/address/utils';
+import type { QueryWithPagesResult } from 'ui/shared/pagination/useQueryWithPages';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import { emptyPagination } from 'ui/shared/pagination/utils';
+
+import type { BlockQuery } from './useBlockQuery';
+
+type RpcResponseType = GetBlockReturnType<Chain, false, 'latest'> | null;
+
+export type BlockWithdrawalsQuery = QueryWithPagesResult<'block_withdrawals'> & {
+  isDegradedData: boolean;
+};
+
+interface Params {
+  heightOrHash: string;
+  blockQuery: BlockQuery;
+  tab: string;
+}
+
+export default function useBlockWithdrawalsQuery({ heightOrHash, blockQuery, tab }: Params): BlockWithdrawalsQuery {
+  const [ isRefetchEnabled, setRefetchEnabled ] = React.useState(false);
+
+  const apiQuery = useQueryWithPages({
+    resourceName: 'block_withdrawals',
+    pathParams: { height_or_hash: heightOrHash },
+    options: {
+      enabled:
+        tab === 'withdrawals' &&
+        config.features.beaconChain.isEnabled &&
+        !blockQuery.isPlaceholderData && !blockQuery.isDegradedData,
+      placeholderData: generateListStub<'block_withdrawals'>(WITHDRAWAL, 50, { next_page_params: {
+        index: 5,
+        items_count: 50,
+      } }),
+      refetchOnMount: false,
+      retry: (failureCount, error) => {
+        if (isRefetchEnabled) {
+          return false;
+        }
+
+        return retry(failureCount, error);
+      },
+      refetchInterval: (): number | false => {
+        return isRefetchEnabled ? 15 * SECOND : false;
+      },
+    },
+  });
+
+  const rpcQuery = useQuery<RpcResponseType, unknown, BlockWithdrawalsResponse | null>({
+    queryKey: [ 'RPC', 'block', { heightOrHash } ],
+    queryFn: async() => {
+      if (!publicClient) {
+        return null;
+      }
+
+      const blockParams = heightOrHash.startsWith('0x') ? { blockHash: heightOrHash as `0x${ string }` } : { blockNumber: BigInt(heightOrHash) };
+      return publicClient.getBlock(blockParams).catch(() => null);
+    },
+    select: (block) => {
+      if (!block) {
+        return null;
+      }
+
+      return {
+        items: block.withdrawals
+          ?.map((withdrawal) => {
+            return {
+              amount: hexToDecimal(withdrawal.amount).toString(),
+              index: hexToDecimal(withdrawal.index),
+              validator_index: hexToDecimal(withdrawal.validatorIndex),
+              receiver: { ...unknownAddress, hash: withdrawal.address },
+            };
+          })
+          .sort((a, b) => b.index - a.index) ?? [],
+        next_page_params: null,
+      };
+    },
+    placeholderData: GET_BLOCK,
+    enabled:
+      publicClient !== undefined &&
+      tab === 'withdrawals' &&
+      config.features.beaconChain.isEnabled &&
+      (blockQuery.isDegradedData || apiQuery.isError || apiQuery.errorUpdateCount > 0),
+    retry: false,
+    refetchOnMount: false,
+  });
+
+  React.useEffect(() => {
+    if (apiQuery.isPlaceholderData || !publicClient) {
+      return;
+    }
+
+    if (apiQuery.isError && apiQuery.errorUpdateCount === 1) {
+      setRefetchEnabled(true);
+    } else if (!apiQuery.isError) {
+      setRefetchEnabled(false);
+    }
+  }, [ apiQuery.errorUpdateCount, apiQuery.isError, apiQuery.isPlaceholderData ]);
+
+  React.useEffect(() => {
+    if (!rpcQuery.isPlaceholderData && !rpcQuery.data) {
+      setRefetchEnabled(false);
+    }
+  }, [ rpcQuery.data, rpcQuery.isPlaceholderData ]);
+
+  const isRpcQuery = Boolean((
+    blockQuery.isDegradedData ||
+    ((apiQuery.isError || apiQuery.isPlaceholderData) && apiQuery.errorUpdateCount > 0)
+  ) && rpcQuery.data && publicClient);
+
+  const rpcQueryWithPages: QueryWithPagesResult<'block_withdrawals'> = React.useMemo(() => {
+    return {
+      ...rpcQuery as UseQueryResult<BlockWithdrawalsResponse, ResourceError>,
+      pagination: emptyPagination,
+      onFilterChange: () => {},
+      onSortingChange: () => {},
+    };
+  }, [ rpcQuery ]);
+
+  const query = isRpcQuery ? rpcQueryWithPages : apiQuery;
+
+  return {
+    ...query,
+    isDegradedData: isRpcQuery,
+  };
+}
diff --git a/ui/blocks/BlocksListItem.tsx b/ui/blocks/BlocksListItem.tsx
index 8b5bcb6c2e..b037221691 100644
--- a/ui/blocks/BlocksListItem.tsx
+++ b/ui/blocks/BlocksListItem.tsx
@@ -11,6 +11,7 @@ import config from 'configs/app';
 import getBlockTotalReward from 'lib/block/getBlockTotalReward';
 import { WEI } from 'lib/consts';
 import getNetworkValidatorTitle from 'lib/networks/getNetworkValidatorTitle';
+import { currencyUnits } from 'lib/units';
 import BlockTimestamp from 'ui/blocks/BlockTimestamp';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
@@ -27,7 +28,7 @@ interface Props {
   enableTimeIncrement?: boolean;
 }
 
-const isRollup = config.features.optimisticRollup.isEnabled || config.features.zkEvmRollup.isEnabled;
+const isRollup = config.features.rollup.isEnabled;
 
 const BlocksListItem = ({ data, isLoading, enableTimeIncrement }: Props) => {
   const totalReward = getBlockTotalReward(data);
@@ -43,7 +44,7 @@ const BlocksListItem = ({ data, isLoading, enableTimeIncrement }: Props) => {
           <BlockEntity
             isLoading={ isLoading }
             number={ data.height }
-            hash={ data.type === 'reorg' ? data.hash : undefined }
+            hash={ data.type !== 'block' ? data.hash : undefined }
             noIcon
             fontWeight={ 600 }
           />
@@ -62,6 +63,7 @@ const BlocksListItem = ({ data, isLoading, enableTimeIncrement }: Props) => {
           <AddressEntity
             address={ data.miner }
             isLoading={ isLoading }
+            truncation="constant"
           />
         </Flex>
       ) }
@@ -94,7 +96,7 @@ const BlocksListItem = ({ data, isLoading, enableTimeIncrement }: Props) => {
       </Box>
       { !isRollup && !config.UI.views.block.hiddenFields?.total_reward && (
         <Flex columnGap={ 2 }>
-          <Text fontWeight={ 500 }>Reward { config.chain.currency.symbol }</Text>
+          <Text fontWeight={ 500 }>Reward { currencyUnits.ether }</Text>
           <Skeleton isLoaded={ !isLoading } display="inline-block" color="text_secondary">
             <span>{ totalReward.toFixed() }</span>
           </Skeleton>
diff --git a/ui/blocks/BlocksTabSlot.tsx b/ui/blocks/BlocksTabSlot.tsx
index 36163a3080..d89d248ad9 100644
--- a/ui/blocks/BlocksTabSlot.tsx
+++ b/ui/blocks/BlocksTabSlot.tsx
@@ -13,7 +13,7 @@ interface Props {
 }
 
 const BlocksTabSlot = ({ pagination }: Props) => {
-  const statsQuery = useApiQuery('homepage_stats', {
+  const statsQuery = useApiQuery('stats', {
     queryOptions: {
       placeholderData: HOMEPAGE_STATS,
     },
diff --git a/ui/blocks/BlocksTable.tsx b/ui/blocks/BlocksTable.tsx
index 594fc98777..9a422d0de5 100644
--- a/ui/blocks/BlocksTable.tsx
+++ b/ui/blocks/BlocksTable.tsx
@@ -6,7 +6,9 @@ import React from 'react';
 import type { Block } from 'types/api/block';
 
 import config from 'configs/app';
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import getNetworkValidatorTitle from 'lib/networks/getNetworkValidatorTitle';
+import { currencyUnits } from 'lib/units';
 import BlocksTableItem from 'ui/blocks/BlocksTableItem';
 import * as SocketNewItemsNotice from 'ui/shared/SocketNewItemsNotice';
 import { default as Thead } from 'ui/shared/TheadSticky';
@@ -26,54 +28,56 @@ const GAS_COL_WEIGHT = 33;
 const REWARD_COL_WEIGHT = 22;
 const FEES_COL_WEIGHT = 22;
 
-const isRollup = config.features.optimisticRollup.isEnabled || config.features.zkEvmRollup.isEnabled;
+const isRollup = config.features.rollup.isEnabled;
 
 const BlocksTable = ({ data, isLoading, top, page, showSocketInfo, socketInfoNum, socketInfoAlert }: Props) => {
 
   const widthBase =
-    VALIDATOR_COL_WEIGHT +
+    (!config.UI.views.block.hiddenFields?.miner ? VALIDATOR_COL_WEIGHT : 0) +
     GAS_COL_WEIGHT +
     (!isRollup && !config.UI.views.block.hiddenFields?.total_reward ? REWARD_COL_WEIGHT : 0) +
     (!isRollup && !config.UI.views.block.hiddenFields?.burnt_fees ? FEES_COL_WEIGHT : 0);
 
   return (
-    <Table variant="simple" minWidth="1040px" size="md" fontWeight={ 500 }>
-      <Thead top={ top }>
-        <Tr>
-          <Th width="125px">Block</Th>
-          <Th width="120px">Size, bytes</Th>
-          { !config.UI.views.block.hiddenFields?.miner &&
+    <AddressHighlightProvider>
+      <Table variant="simple" minWidth="1040px" size="md" fontWeight={ 500 }>
+        <Thead top={ top }>
+          <Tr>
+            <Th width="125px">Block</Th>
+            <Th width="120px">Size, bytes</Th>
+            { !config.UI.views.block.hiddenFields?.miner &&
             <Th width={ `${ VALIDATOR_COL_WEIGHT / widthBase * 100 }%` } minW="160px">{ capitalize(getNetworkValidatorTitle()) }</Th> }
-          <Th width="64px" isNumeric>Txn</Th>
-          <Th width={ `${ GAS_COL_WEIGHT / widthBase * 100 }%` }>Gas used</Th>
-          { !isRollup && !config.UI.views.block.hiddenFields?.total_reward &&
-              <Th width={ `${ REWARD_COL_WEIGHT / widthBase * 100 }%` }>Reward { config.chain.currency.symbol }</Th> }
-          { !isRollup && !config.UI.views.block.hiddenFields?.burnt_fees &&
-              <Th width={ `${ FEES_COL_WEIGHT / widthBase * 100 }%` }>Burnt fees { config.chain.currency.symbol }</Th> }
-        </Tr>
-      </Thead>
-      <Tbody>
-        { showSocketInfo && (
-          <SocketNewItemsNotice.Desktop
-            url={ window.location.href }
-            alert={ socketInfoAlert }
-            num={ socketInfoNum }
-            type="block"
-            isLoading={ isLoading }
-          />
-        ) }
-        <AnimatePresence initial={ false }>
-          { data.map((item, index) => (
-            <BlocksTableItem
-              key={ item.height + (isLoading ? `${ index }_${ page }` : '') }
-              data={ item }
-              enableTimeIncrement={ page === 1 && !isLoading }
+            <Th width="64px" isNumeric>Txn</Th>
+            <Th width={ `${ GAS_COL_WEIGHT / widthBase * 100 }%` }>Gas used</Th>
+            { !isRollup && !config.UI.views.block.hiddenFields?.total_reward &&
+              <Th width={ `${ REWARD_COL_WEIGHT / widthBase * 100 }%` }>Reward { currencyUnits.ether }</Th> }
+            { !isRollup && !config.UI.views.block.hiddenFields?.burnt_fees &&
+              <Th width={ `${ FEES_COL_WEIGHT / widthBase * 100 }%` }>Burnt fees { currencyUnits.ether }</Th> }
+          </Tr>
+        </Thead>
+        <Tbody>
+          { showSocketInfo && (
+            <SocketNewItemsNotice.Desktop
+              url={ window.location.href }
+              alert={ socketInfoAlert }
+              num={ socketInfoNum }
+              type="block"
               isLoading={ isLoading }
             />
-          )) }
-        </AnimatePresence>
-      </Tbody>
-    </Table>
+          ) }
+          <AnimatePresence initial={ false }>
+            { data.map((item, index) => (
+              <BlocksTableItem
+                key={ item.height + (isLoading ? `${ index }_${ page }` : '') }
+                data={ item }
+                enableTimeIncrement={ page === 1 && !isLoading }
+                isLoading={ isLoading }
+              />
+            )) }
+          </AnimatePresence>
+        </Tbody>
+      </Table>
+    </AddressHighlightProvider>
   );
 };
 
diff --git a/ui/blocks/BlocksTableItem.tsx b/ui/blocks/BlocksTableItem.tsx
index 2081d416dd..fd5e434bcc 100644
--- a/ui/blocks/BlocksTableItem.tsx
+++ b/ui/blocks/BlocksTableItem.tsx
@@ -25,7 +25,7 @@ interface Props {
   enableTimeIncrement?: boolean;
 }
 
-const isRollup = config.features.optimisticRollup.isEnabled || config.features.zkEvmRollup.isEnabled;
+const isRollup = config.features.rollup.isEnabled;
 
 const BlocksTableItem = ({ data, isLoading, enableTimeIncrement }: Props) => {
   const totalReward = getBlockTotalReward(data);
@@ -50,7 +50,7 @@ const BlocksTableItem = ({ data, isLoading, enableTimeIncrement }: Props) => {
             <BlockEntity
               isLoading={ isLoading }
               number={ data.height }
-              hash={ data.type === 'reorg' ? data.hash : undefined }
+              hash={ data.type !== 'block' ? data.hash : undefined }
               noIcon
               fontSize="sm"
               lineHeight={ 5 }
@@ -70,6 +70,7 @@ const BlocksTableItem = ({ data, isLoading, enableTimeIncrement }: Props) => {
           <AddressEntity
             address={ data.miner }
             isLoading={ isLoading }
+            truncation="constant"
           />
         </Td>
       ) }
diff --git a/ui/contractVerification/ContractVerificationForm.pw.tsx b/ui/contractVerification/ContractVerificationForm.pw.tsx
index 140ba75293..44b219f38d 100644
--- a/ui/contractVerification/ContractVerificationForm.pw.tsx
+++ b/ui/contractVerification/ContractVerificationForm.pw.tsx
@@ -54,6 +54,22 @@ const formConfig: SmartContractVerificationConfig = {
     'petersburg',
     'istanbul',
   ],
+  license_types: {
+    apache_2_0: 12,
+    bsd_2_clause: 8,
+    bsd_3_clause: 9,
+    bsl_1_1: 14,
+    gnu_agpl_v3: 13,
+    gnu_gpl_v2: 4,
+    gnu_gpl_v3: 5,
+    gnu_lgpl_v2_1: 6,
+    gnu_lgpl_v3: 7,
+    mit: 3,
+    mpl_2_0: 10,
+    none: 1,
+    osl_3_0: 11,
+    unlicense: 2,
+  },
 };
 
 test('flatten source code method +@dark-mode +@mobile', async({ mount, page }) => {
@@ -64,9 +80,16 @@ test('flatten source code method +@dark-mode +@mobile', async({ mount, page }) =
     { hooksConfig },
   );
 
+  // select license
+  await component.getByLabel(/contract license/i).focus();
+  await component.getByLabel(/contract license/i).fill('mit');
+  await page.getByRole('button', { name: /mit license/i }).click();
+
+  // select method
   await component.getByLabel(/verification method/i).focus();
-  await component.getByLabel(/verification method/i).type('solidity');
+  await component.getByLabel(/verification method/i).fill('solidity');
   await page.getByRole('button', { name: /flattened source code/i }).click();
+
   await page.getByText(/add contract libraries/i).click();
   await page.locator('button[aria-label="add"]').click();
 
@@ -81,8 +104,9 @@ test('standard input json method', async({ mount, page }) => {
     { hooksConfig },
   );
 
+  // select method
   await component.getByLabel(/verification method/i).focus();
-  await component.getByLabel(/verification method/i).type('solidity');
+  await component.getByLabel(/verification method/i).fill('solidity');
   await page.getByRole('button', { name: /standard json input/i }).click();
 
   await expect(component).toHaveScreenshot();
@@ -102,8 +126,9 @@ test.describe('sourcify', () => {
       { hooksConfig },
     );
 
+    // select method
     await component.getByLabel(/verification method/i).focus();
-    await component.getByLabel(/verification method/i).type('solidity');
+    await component.getByLabel(/verification method/i).fill('solidity');
     await page.getByRole('button', { name: /sourcify/i }).click();
 
     await page.getByText(/drop files/i).click();
@@ -129,7 +154,7 @@ test.describe('sourcify', () => {
     });
 
     await component.getByLabel(/contract name/i).focus();
-    await component.getByLabel(/contract name/i).type('e');
+    await component.getByLabel(/contract name/i).fill('e');
     const contractNameOption = page.getByRole('button', { name: /MockERC20/i });
 
     await expect(contractNameOption).toBeVisible();
@@ -146,8 +171,9 @@ test('multi-part files method', async({ mount, page }) => {
     { hooksConfig },
   );
 
+  // select method
   await component.getByLabel(/verification method/i).focus();
-  await component.getByLabel(/verification method/i).type('solidity');
+  await component.getByLabel(/verification method/i).fill('solidity');
   await page.getByRole('button', { name: /multi-part files/i }).click();
 
   await expect(component).toHaveScreenshot();
@@ -161,8 +187,9 @@ test('vyper contract method', async({ mount, page }) => {
     { hooksConfig },
   );
 
+  // select method
   await component.getByLabel(/verification method/i).focus();
-  await component.getByLabel(/verification method/i).type('vyper');
+  await component.getByLabel(/verification method/i).fill('vyper');
   await page.getByRole('button', { name: /contract/i }).click();
 
   await expect(component).toHaveScreenshot();
@@ -176,8 +203,9 @@ test('vyper multi-part method', async({ mount, page }) => {
     { hooksConfig },
   );
 
+  // select method
   await component.getByLabel(/verification method/i).focus();
-  await component.getByLabel(/verification method/i).type('vyper');
+  await component.getByLabel(/verification method/i).fill('vyper');
   await page.getByRole('button', { name: /multi-part files/i }).click();
 
   await expect(component).toHaveScreenshot();
@@ -191,8 +219,9 @@ test('vyper vyper-standard-input method', async({ mount, page }) => {
     { hooksConfig },
   );
 
+  // select method
   await component.getByLabel(/verification method/i).focus();
-  await component.getByLabel(/verification method/i).type('vyper');
+  await component.getByLabel(/verification method/i).fill('vyper');
   await page.getByRole('button', { name: /standard json input/i }).click();
 
   await expect(component).toHaveScreenshot();
diff --git a/ui/contractVerification/ContractVerificationForm.tsx b/ui/contractVerification/ContractVerificationForm.tsx
index 2a464a017e..8b77e1010c 100644
--- a/ui/contractVerification/ContractVerificationForm.tsx
+++ b/ui/contractVerification/ContractVerificationForm.tsx
@@ -18,6 +18,7 @@ import useSocketChannel from 'lib/socket/useSocketChannel';
 import useSocketMessage from 'lib/socket/useSocketMessage';
 
 import ContractVerificationFieldAddress from './fields/ContractVerificationFieldAddress';
+import ContractVerificationFieldLicenseType from './fields/ContractVerificationFieldLicenseType';
 import ContractVerificationFieldMethod from './fields/ContractVerificationFieldMethod';
 import ContractVerificationFlattenSourceCode from './methods/ContractVerificationFlattenSourceCode';
 import ContractVerificationMultiPartFile from './methods/ContractVerificationMultiPartFile';
@@ -37,7 +38,7 @@ interface Props {
 const ContractVerificationForm = ({ method: methodFromQuery, config, hash }: Props) => {
   const formApi = useForm<FormFields>({
     mode: 'onBlur',
-    defaultValues: methodFromQuery ? getDefaultValues(methodFromQuery, config, hash) : undefined,
+    defaultValues: methodFromQuery ? getDefaultValues(methodFromQuery, config, hash, null) : undefined,
   });
   const { control, handleSubmit, watch, formState, setError, reset, getFieldState } = formApi;
   const submitPromiseResolver = React.useRef<(value: unknown) => void>();
@@ -161,12 +162,13 @@ const ContractVerificationForm = ({ method: methodFromQuery, config, hash }: Pro
     };
   }, [ config ]);
   const method = watch('method');
+  const licenseType = watch('license_type');
   const content = methods[method?.value] || null;
   const methodValue = method?.value;
 
   useUpdateEffect(() => {
     if (methodValue) {
-      reset(getDefaultValues(methodValue, config, address || hash));
+      reset(getDefaultValues(methodValue, config, hash || address, licenseType));
 
       const methodName = METHOD_LABELS[methodValue];
       mixpanel.logEvent(mixpanel.EventTypes.CONTRACT_VERIFICATION, { Status: 'Method selected', Method: methodName });
@@ -183,6 +185,7 @@ const ContractVerificationForm = ({ method: methodFromQuery, config, hash }: Pro
       >
         <Grid as="section" columnGap="30px" rowGap={{ base: 2, lg: 5 }} templateColumns={{ base: '1fr', lg: 'minmax(auto, 680px) minmax(0, 340px)' }}>
           { !hash && <ContractVerificationFieldAddress/> }
+          <ContractVerificationFieldLicenseType/>
           <ContractVerificationFieldMethod
             control={ control }
             methods={ config.verification_options }
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_dark-color-mode_flatten-source-code-method-dark-mode-mobile-1.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_dark-color-mode_flatten-source-code-method-dark-mode-mobile-1.png
index b142a092b0..c9cb9a7f01 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_dark-color-mode_flatten-source-code-method-dark-mode-mobile-1.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_dark-color-mode_flatten-source-code-method-dark-mode-mobile-1.png differ
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_flatten-source-code-method-dark-mode-mobile-1.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_flatten-source-code-method-dark-mode-mobile-1.png
index 4943890371..f35ea814f5 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_flatten-source-code-method-dark-mode-mobile-1.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_flatten-source-code-method-dark-mode-mobile-1.png differ
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_multi-part-files-method-1.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_multi-part-files-method-1.png
index 97f9d82d25..38af92a00b 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_multi-part-files-method-1.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_multi-part-files-method-1.png differ
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_sourcify-with-multiple-contracts-1.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_sourcify-with-multiple-contracts-1.png
index ee8f87002c..eb138573d8 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_sourcify-with-multiple-contracts-1.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_sourcify-with-multiple-contracts-1.png differ
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_sourcify-with-multiple-contracts-2.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_sourcify-with-multiple-contracts-2.png
index 9c4ba1955e..fdc4a8007f 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_sourcify-with-multiple-contracts-2.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_sourcify-with-multiple-contracts-2.png differ
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_standard-input-json-method-1.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_standard-input-json-method-1.png
index 742e849f00..9aabf32d1a 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_standard-input-json-method-1.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_standard-input-json-method-1.png differ
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-contract-method-1.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-contract-method-1.png
index 575cbb0102..2d8dacedff 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-contract-method-1.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-contract-method-1.png differ
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-multi-part-method-1.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-multi-part-method-1.png
index 218d41f8d5..aabf72c4c8 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-multi-part-method-1.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-multi-part-method-1.png differ
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-vyper-standard-input-method-1.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-vyper-standard-input-method-1.png
index 0accffd8ea..fc8feef55b 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-vyper-standard-input-method-1.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_default_vyper-vyper-standard-input-method-1.png differ
diff --git a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_mobile_flatten-source-code-method-dark-mode-mobile-1.png b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_mobile_flatten-source-code-method-dark-mode-mobile-1.png
index 8862ea1733..0a72701564 100644
Binary files a/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_mobile_flatten-source-code-method-dark-mode-mobile-1.png and b/ui/contractVerification/__screenshots__/ContractVerificationForm.pw.tsx_mobile_flatten-source-code-method-dark-mode-mobile-1.png differ
diff --git a/ui/contractVerification/fields/ContractVerificationFieldAddress.tsx b/ui/contractVerification/fields/ContractVerificationFieldAddress.tsx
index 0d5890ba17..0adb9a4b6f 100644
--- a/ui/contractVerification/fields/ContractVerificationFieldAddress.tsx
+++ b/ui/contractVerification/fields/ContractVerificationFieldAddress.tsx
@@ -42,7 +42,7 @@ const ContractVerificationFieldAddress = ({ isReadOnly }: Props) => {
           Contract address to verify
         </chakra.span>
       </ContractVerificationFormRow>
-      <ContractVerificationFormRow mb={ 3 }>
+      <ContractVerificationFormRow>
         <Controller
           name="address"
           control={ control }
diff --git a/ui/contractVerification/fields/ContractVerificationFieldLicenseType.tsx b/ui/contractVerification/fields/ContractVerificationFieldLicenseType.tsx
new file mode 100644
index 0000000000..c458921625
--- /dev/null
+++ b/ui/contractVerification/fields/ContractVerificationFieldLicenseType.tsx
@@ -0,0 +1,49 @@
+import React from 'react';
+import type { ControllerRenderProps } from 'react-hook-form';
+import { useFormContext, Controller } from 'react-hook-form';
+
+import type { FormFields } from '../types';
+
+import { CONTRACT_LICENSES } from 'lib/contracts/licenses';
+import useIsMobile from 'lib/hooks/useIsMobile';
+import FancySelect from 'ui/shared/FancySelect/FancySelect';
+
+const options = CONTRACT_LICENSES.map(({ label, title, type }) => ({ label: `${ title } (${ label })`, value: type }));
+
+import ContractVerificationFormRow from '../ContractVerificationFormRow';
+
+const ContractVerificationFieldLicenseType = () => {
+  const { formState, control } = useFormContext<FormFields>();
+  const isMobile = useIsMobile();
+
+  const renderControl = React.useCallback(({ field }: {field: ControllerRenderProps<FormFields, 'license_type'>}) => {
+    const error = 'license_type' in formState.errors ? formState.errors.license_type : undefined;
+
+    return (
+      <FancySelect
+        { ...field }
+        options={ options }
+        size={ isMobile ? 'md' : 'lg' }
+        placeholder="Contract license"
+        isDisabled={ formState.isSubmitting }
+        error={ error }
+      />
+    );
+  }, [ formState.errors, formState.isSubmitting, isMobile ]);
+
+  return (
+    <ContractVerificationFormRow>
+      <Controller
+        name="license_type"
+        control={ control }
+        render={ renderControl }
+      />
+      <span>
+          For best practices, all contract source code holders, publishers and authors are encouraged to also
+          specify the accompanying license for their verified contract source code provided.
+      </span>
+    </ContractVerificationFormRow>
+  );
+};
+
+export default React.memo(ContractVerificationFieldLicenseType);
diff --git a/ui/contractVerification/fields/ContractVerificationFieldMethod.tsx b/ui/contractVerification/fields/ContractVerificationFieldMethod.tsx
index 7e9c5088d2..83d4090c0e 100644
--- a/ui/contractVerification/fields/ContractVerificationFieldMethod.tsx
+++ b/ui/contractVerification/fields/ContractVerificationFieldMethod.tsx
@@ -11,6 +11,7 @@ import {
   DarkMode,
   ListItem,
   OrderedList,
+  Box,
 } from '@chakra-ui/react';
 import React from 'react';
 import type { ControllerRenderProps, Control } from 'react-hook-form';
@@ -97,7 +98,7 @@ const ContractVerificationFieldMethod = ({ control, isDisabled, methods }: Props
 
   return (
     <>
-      <div>
+      <Box mt={{ base: 10, lg: 6 }} gridColumn={{ lg: '1 / 3' }}>
         <chakra.span fontWeight={ 500 } fontSize="lg" fontFamily="heading">
           Currently, Blockscout supports { methods.length } contract verification methods
         </chakra.span>
@@ -121,8 +122,7 @@ const ContractVerificationFieldMethod = ({ control, isDisabled, methods }: Props
             </PopoverContent>
           </Portal>
         </Popover>
-      </div>
-      <div/>
+      </Box>
       <Controller
         name="method"
         control={ control }
diff --git a/ui/contractVerification/types.ts b/ui/contractVerification/types.ts
index e61cf1d6ad..47081c8838 100644
--- a/ui/contractVerification/types.ts
+++ b/ui/contractVerification/types.ts
@@ -1,4 +1,4 @@
-import type { SmartContractVerificationMethod } from 'types/api/contract';
+import type { SmartContractLicenseType, SmartContractVerificationMethod } from 'types/api/contract';
 import type { Option } from 'ui/shared/FancySelect/types';
 
 export interface ContractLibrary {
@@ -11,6 +11,11 @@ interface MethodOption {
   value: SmartContractVerificationMethod;
 }
 
+export interface LicenseOption {
+  label: string;
+  value: SmartContractLicenseType;
+}
+
 export interface FormFieldsFlattenSourceCode {
   address: string;
   method: MethodOption;
@@ -24,6 +29,7 @@ export interface FormFieldsFlattenSourceCode {
   autodetect_constructor_args: boolean;
   constructor_args: string;
   libraries: Array<ContractLibrary>;
+  license_type: LicenseOption | null;
 }
 
 export interface FormFieldsStandardInput {
@@ -34,6 +40,7 @@ export interface FormFieldsStandardInput {
   sources: Array<File>;
   autodetect_constructor_args: boolean;
   constructor_args: string;
+  license_type: LicenseOption | null;
 }
 
 export interface FormFieldsSourcify {
@@ -41,6 +48,7 @@ export interface FormFieldsSourcify {
   method: MethodOption;
   sources: Array<File>;
   contract_index?: Option;
+  license_type: LicenseOption | null;
 }
 
 export interface FormFieldsMultiPartFile {
@@ -52,6 +60,7 @@ export interface FormFieldsMultiPartFile {
   optimization_runs: string;
   sources: Array<File>;
   libraries: Array<ContractLibrary>;
+  license_type: LicenseOption | null;
 }
 
 export interface FormFieldsVyperContract {
@@ -62,6 +71,7 @@ export interface FormFieldsVyperContract {
   compiler: Option | null;
   code: string;
   constructor_args: string | undefined;
+  license_type: LicenseOption | null;
 }
 
 export interface FormFieldsVyperMultiPartFile {
@@ -71,6 +81,7 @@ export interface FormFieldsVyperMultiPartFile {
   evm_version: Option | null;
   sources: Array<File>;
   interfaces: Array<File>;
+  license_type: LicenseOption | null;
 }
 
 export interface FormFieldsVyperStandardInput {
@@ -78,6 +89,7 @@ export interface FormFieldsVyperStandardInput {
   method: MethodOption;
   compiler: Option | null;
   sources: Array<File>;
+  license_type: LicenseOption | null;
 }
 
 export type FormFields = FormFieldsFlattenSourceCode | FormFieldsStandardInput | FormFieldsSourcify |
diff --git a/ui/contractVerification/utils.ts b/ui/contractVerification/utils.ts
index 1a60089eea..5791b12566 100644
--- a/ui/contractVerification/utils.ts
+++ b/ui/contractVerification/utils.ts
@@ -11,7 +11,12 @@ import type {
   FormFieldsVyperMultiPartFile,
   FormFieldsVyperStandardInput,
 } from './types';
-import type { SmartContractVerificationMethod, SmartContractVerificationError, SmartContractVerificationConfig } from 'types/api/contract';
+import type {
+  SmartContractVerificationMethod,
+  SmartContractVerificationError,
+  SmartContractVerificationConfig,
+  SmartContractLicenseType,
+} from 'types/api/contract';
 
 import type { Params as FetchParams } from 'lib/hooks/useFetch';
 
@@ -52,6 +57,7 @@ export const DEFAULT_VALUES: Record<SmartContractVerificationMethod, FormFields>
     autodetect_constructor_args: true,
     constructor_args: '',
     libraries: [],
+    license_type: null,
   },
   'standard-input': {
     address: '',
@@ -64,6 +70,7 @@ export const DEFAULT_VALUES: Record<SmartContractVerificationMethod, FormFields>
     sources: [],
     autodetect_constructor_args: true,
     constructor_args: '',
+    license_type: null,
   },
   sourcify: {
     address: '',
@@ -72,6 +79,7 @@ export const DEFAULT_VALUES: Record<SmartContractVerificationMethod, FormFields>
       label: METHOD_LABELS.sourcify,
     },
     sources: [],
+    license_type: null,
   },
   'multi-part': {
     address: '',
@@ -85,6 +93,7 @@ export const DEFAULT_VALUES: Record<SmartContractVerificationMethod, FormFields>
     optimization_runs: '200',
     sources: [],
     libraries: [],
+    license_type: null,
   },
   'vyper-code': {
     address: '',
@@ -97,6 +106,7 @@ export const DEFAULT_VALUES: Record<SmartContractVerificationMethod, FormFields>
     evm_version: null,
     code: '',
     constructor_args: '',
+    license_type: null,
   },
   'vyper-multi-part': {
     address: '',
@@ -107,6 +117,7 @@ export const DEFAULT_VALUES: Record<SmartContractVerificationMethod, FormFields>
     compiler: null,
     evm_version: null,
     sources: [],
+    license_type: null,
   },
   'vyper-standard-input': {
     address: '',
@@ -116,11 +127,17 @@ export const DEFAULT_VALUES: Record<SmartContractVerificationMethod, FormFields>
     },
     compiler: null,
     sources: [],
+    license_type: null,
   },
 };
 
-export function getDefaultValues(method: SmartContractVerificationMethod, config: SmartContractVerificationConfig, hash?: string) {
-  const defaultValues = { ...DEFAULT_VALUES[method], address: hash };
+export function getDefaultValues(
+  method: SmartContractVerificationMethod,
+  config: SmartContractVerificationConfig,
+  hash: string | undefined,
+  licenseType: FormFields['license_type'],
+) {
+  const defaultValues: FormFields = { ...DEFAULT_VALUES[method], address: hash || '', license_type: licenseType };
 
   if ('evm_version' in defaultValues) {
     if (method === 'flattened-code' || method === 'multi-part') {
@@ -162,6 +179,8 @@ export function sortVerificationMethods(methodA: SmartContractVerificationMethod
 }
 
 export function prepareRequestBody(data: FormFields): FetchParams['body'] {
+  const defaultLicenseType: SmartContractLicenseType = 'none';
+
   switch (data.method.value) {
     case 'flattened-code': {
       const _data = data as FormFieldsFlattenSourceCode;
@@ -176,6 +195,7 @@ export function prepareRequestBody(data: FormFields): FetchParams['body'] {
         evm_version: _data.evm_version?.value,
         autodetect_constructor_args: _data.autodetect_constructor_args,
         constructor_args: _data.constructor_args,
+        license_type: _data.license_type?.value ?? defaultLicenseType,
       };
     }
 
@@ -184,6 +204,7 @@ export function prepareRequestBody(data: FormFields): FetchParams['body'] {
 
       const body = new FormData();
       _data.compiler && body.set('compiler_version', _data.compiler.value);
+      body.set('license_type', _data.license_type?.value ?? defaultLicenseType);
       body.set('contract_name', _data.name);
       body.set('autodetect_constructor_args', String(Boolean(_data.autodetect_constructor_args)));
       body.set('constructor_args', _data.constructor_args);
@@ -196,7 +217,8 @@ export function prepareRequestBody(data: FormFields): FetchParams['body'] {
       const _data = data as FormFieldsSourcify;
       const body = new FormData();
       addFilesToFormData(body, _data.sources, 'files');
-      _data.contract_index && body.set('chosen_contract_index', _data.contract_index.value);
+      body.set('chosen_contract_index', _data.contract_index?.value ?? defaultLicenseType);
+      _data.license_type && body.set('license_type', _data.license_type.value);
 
       return body;
     }
@@ -207,6 +229,7 @@ export function prepareRequestBody(data: FormFields): FetchParams['body'] {
       const body = new FormData();
       _data.compiler && body.set('compiler_version', _data.compiler.value);
       _data.evm_version && body.set('evm_version', _data.evm_version.value);
+      body.set('license_type', _data.license_type?.value ?? defaultLicenseType);
       body.set('is_optimization_enabled', String(Boolean(_data.is_optimization_enabled)));
       _data.is_optimization_enabled && body.set('optimization_runs', _data.optimization_runs);
 
@@ -226,6 +249,7 @@ export function prepareRequestBody(data: FormFields): FetchParams['body'] {
         source_code: _data.code,
         contract_name: _data.name,
         constructor_args: _data.constructor_args,
+        license_type: _data.license_type?.value ?? defaultLicenseType,
       };
     }
 
@@ -235,6 +259,7 @@ export function prepareRequestBody(data: FormFields): FetchParams['body'] {
       const body = new FormData();
       _data.compiler && body.set('compiler_version', _data.compiler.value);
       _data.evm_version && body.set('evm_version', _data.evm_version.value);
+      body.set('license_type', _data.license_type?.value ?? defaultLicenseType);
       addFilesToFormData(body, _data.sources, 'files');
       addFilesToFormData(body, _data.interfaces, 'interfaces');
 
@@ -246,6 +271,7 @@ export function prepareRequestBody(data: FormFields): FetchParams['body'] {
 
       const body = new FormData();
       _data.compiler && body.set('compiler_version', _data.compiler.value);
+      body.set('license_type', _data.license_type?.value ?? defaultLicenseType);
       addFilesToFormData(body, _data.sources, 'files');
 
       return body;
diff --git a/ui/l2Deposits/DepositsListItem.tsx b/ui/deposits/optimisticL2/OptimisticDepositsListItem.tsx
similarity index 81%
rename from ui/l2Deposits/DepositsListItem.tsx
rename to ui/deposits/optimisticL2/OptimisticDepositsListItem.tsx
index 7e4caefc57..352b8d2b27 100644
--- a/ui/l2Deposits/DepositsListItem.tsx
+++ b/ui/deposits/optimisticL2/OptimisticDepositsListItem.tsx
@@ -2,7 +2,7 @@ import { Skeleton } from '@chakra-ui/react';
 import BigNumber from 'bignumber.js';
 import React from 'react';
 
-import type { L2DepositsItem } from 'types/api/l2Deposits';
+import type { OptimisticL2DepositsItem } from 'types/api/optimisticL2';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
@@ -12,14 +12,14 @@ import TxEntity from 'ui/shared/entities/tx/TxEntity';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
-type Props = { item: L2DepositsItem; isLoading?: boolean };
+type Props = { item: OptimisticL2DepositsItem; isLoading?: boolean };
 
-const DepositsListItem = ({ item, isLoading }: Props) => {
+const OptimisticDepositsListItem = ({ item, isLoading }: Props) => {
   const timeAgo = dayjs(item.l1_block_timestamp).fromNow();
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'optimistic') {
     return null;
   }
 
@@ -44,6 +44,7 @@ const DepositsListItem = ({ item, isLoading }: Props) => {
           hash={ item.l2_tx_hash }
           fontSize="sm"
           lineHeight={ 5 }
+          truncation="constant_long"
         />
       </ListItemMobileGrid.Value>
 
@@ -59,15 +60,17 @@ const DepositsListItem = ({ item, isLoading }: Props) => {
           hash={ item.l1_tx_hash }
           fontSize="sm"
           lineHeight={ 5 }
+          truncation="constant_long"
         />
       </ListItemMobileGrid.Value>
 
       <ListItemMobileGrid.Label isLoading={ isLoading }>L1 txn origin</ListItemMobileGrid.Label>
       <ListItemMobileGrid.Value>
         <AddressEntityL1
-          address={{ hash: item.l1_tx_origin, name: '', is_contract: false, is_verified: false, implementation_name: '' }}
+          address={{ hash: item.l1_tx_origin, name: '', is_contract: false, is_verified: false, implementation_name: '', ens_domain_name: null }}
           isLoading={ isLoading }
           noCopy
+          truncation="constant"
         />
       </ListItemMobileGrid.Value>
 
@@ -80,4 +83,4 @@ const DepositsListItem = ({ item, isLoading }: Props) => {
   );
 };
 
-export default DepositsListItem;
+export default OptimisticDepositsListItem;
diff --git a/ui/deposits/optimisticL2/OptimisticDepositsTable.tsx b/ui/deposits/optimisticL2/OptimisticDepositsTable.tsx
new file mode 100644
index 0000000000..e67de8f22b
--- /dev/null
+++ b/ui/deposits/optimisticL2/OptimisticDepositsTable.tsx
@@ -0,0 +1,38 @@
+import { Table, Tbody, Th, Tr } from '@chakra-ui/react';
+import React from 'react';
+
+import type { OptimisticL2DepositsItem } from 'types/api/optimisticL2';
+
+import { default as Thead } from 'ui/shared/TheadSticky';
+
+import OptimisticDepositsTableItem from './OptimisticDepositsTableItem';
+
+ type Props = {
+   items: Array<OptimisticL2DepositsItem>;
+   top: number;
+   isLoading?: boolean;
+ }
+
+const OptimisticDepositsTable = ({ items, top, isLoading }: Props) => {
+  return (
+    <Table variant="simple" size="sm" style={{ tableLayout: 'auto' }} minW="950px">
+      <Thead top={ top }>
+        <Tr>
+          <Th>L1 block No</Th>
+          <Th>L2 txn hash</Th>
+          <Th>Age</Th>
+          <Th>L1 txn hash</Th>
+          <Th>L1 txn origin</Th>
+          <Th isNumeric>Gas limit</Th>
+        </Tr>
+      </Thead>
+      <Tbody>
+        { items.map((item, index) => (
+          <OptimisticDepositsTableItem key={ item.l2_tx_hash + (isLoading ? index : '') } item={ item } isLoading={ isLoading }/>
+        )) }
+      </Tbody>
+    </Table>
+  );
+};
+
+export default OptimisticDepositsTable;
diff --git a/ui/l2Deposits/DepositsTableItem.tsx b/ui/deposits/optimisticL2/OptimisticDepositsTableItem.tsx
similarity index 75%
rename from ui/l2Deposits/DepositsTableItem.tsx
rename to ui/deposits/optimisticL2/OptimisticDepositsTableItem.tsx
index 99ba9ad465..2a5e2d073f 100644
--- a/ui/l2Deposits/DepositsTableItem.tsx
+++ b/ui/deposits/optimisticL2/OptimisticDepositsTableItem.tsx
@@ -2,7 +2,7 @@ import { Td, Tr, Skeleton } from '@chakra-ui/react';
 import BigNumber from 'bignumber.js';
 import React from 'react';
 
-import type { L2DepositsItem } from 'types/api/l2Deposits';
+import type { OptimisticL2DepositsItem } from 'types/api/optimisticL2';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
@@ -11,14 +11,14 @@ import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
- type Props = { item: L2DepositsItem; isLoading?: boolean };
+ type Props = { item: OptimisticL2DepositsItem; isLoading?: boolean };
 
-const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
+const OptimisticDepositsTableItem = ({ item, isLoading }: Props) => {
   const timeAgo = dayjs(item.l1_block_timestamp).fromNow();
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'optimistic') {
     return null;
   }
 
@@ -31,6 +31,7 @@ const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
           fontSize="sm"
           lineHeight={ 5 }
           fontWeight={ 600 }
+          noIcon
         />
       </Td>
       <Td verticalAlign="middle">
@@ -39,7 +40,8 @@ const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
           hash={ item.l2_tx_hash }
           fontSize="sm"
           lineHeight={ 5 }
-          truncation="constant"
+          truncation="constant_long"
+          noIcon
         />
       </Td>
       <Td verticalAlign="middle" pr={ 12 }>
@@ -49,14 +51,15 @@ const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
         <TxEntityL1
           isLoading={ isLoading }
           hash={ item.l1_tx_hash }
-          truncation="constant"
+          truncation="constant_long"
+          noIcon
           fontSize="sm"
           lineHeight={ 5 }
         />
       </Td>
       <Td verticalAlign="middle">
         <AddressEntityL1
-          address={{ hash: item.l1_tx_origin, name: '', is_contract: false, is_verified: false, implementation_name: '' }}
+          address={{ hash: item.l1_tx_origin, name: '', is_contract: false, is_verified: false, implementation_name: '', ens_domain_name: null }}
           isLoading={ isLoading }
           truncation="constant"
           noCopy
@@ -71,4 +74,4 @@ const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
   );
 };
 
-export default WithdrawalsTableItem;
+export default OptimisticDepositsTableItem;
diff --git a/ui/deposits/shibarium/DepositsListItem.tsx b/ui/deposits/shibarium/DepositsListItem.tsx
new file mode 100644
index 0000000000..0c53e319e8
--- /dev/null
+++ b/ui/deposits/shibarium/DepositsListItem.tsx
@@ -0,0 +1,80 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { ShibariumDepositsItem } from 'types/api/shibarium';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import AddressStringOrParam from 'ui/shared/entities/address/AddressStringOrParam';
+import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
+import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
+
+const feature = config.features.rollup;
+
+type Props = { item: ShibariumDepositsItem; isLoading?: boolean };
+
+const DepositsListItem = ({ item, isLoading }: Props) => {
+  const timeAgo = dayjs(item.timestamp).fromNow();
+
+  if (!(feature.isEnabled && feature.type === 'shibarium')) {
+    return null;
+  }
+
+  return (
+    <ListItemMobileGrid.Container>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>L1 block No</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <BlockEntityL1
+          number={ item.l1_block_number }
+          isLoading={ isLoading }
+          fontSize="sm"
+          lineHeight={ 5 }
+          fontWeight={ 600 }
+        />
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>L1 txn hash</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <TxEntityL1
+          isLoading={ isLoading }
+          hash={ item.l1_transaction_hash }
+          fontSize="sm"
+          lineHeight={ 5 }
+          truncation="constant_long"
+        />
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>L2 txn hash</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <TxEntity
+          isLoading={ isLoading }
+          hash={ item.l2_transaction_hash }
+          fontSize="sm"
+          lineHeight={ 5 }
+          truncation="constant_long"
+        />
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>User</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <AddressStringOrParam
+          address={ item.user }
+          isLoading={ isLoading }
+          noCopy
+          truncation="constant"
+        />
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Age</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <Skeleton isLoaded={ !isLoading } display="inline-block">{ timeAgo }</Skeleton>
+      </ListItemMobileGrid.Value>
+
+    </ListItemMobileGrid.Container>
+  );
+};
+
+export default DepositsListItem;
diff --git a/ui/l2Deposits/DepositsTable.tsx b/ui/deposits/shibarium/DepositsTable.tsx
similarity index 72%
rename from ui/l2Deposits/DepositsTable.tsx
rename to ui/deposits/shibarium/DepositsTable.tsx
index 8aea8aadcf..9e7cbd01d2 100644
--- a/ui/l2Deposits/DepositsTable.tsx
+++ b/ui/deposits/shibarium/DepositsTable.tsx
@@ -1,14 +1,14 @@
 import { Table, Tbody, Th, Tr } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2DepositsItem } from 'types/api/l2Deposits';
+import type { ShibariumDepositsItem } from 'types/api/shibarium';
 
 import { default as Thead } from 'ui/shared/TheadSticky';
 
 import DepositsTableItem from './DepositsTableItem';
 
  type Props = {
-   items: Array<L2DepositsItem>;
+   items: Array<ShibariumDepositsItem>;
    top: number;
    isLoading?: boolean;
  }
@@ -19,16 +19,15 @@ const DepositsTable = ({ items, top, isLoading }: Props) => {
       <Thead top={ top }>
         <Tr>
           <Th>L1 block No</Th>
+          <Th>L1 txn hash</Th>
           <Th>L2 txn hash</Th>
+          <Th>User</Th>
           <Th>Age</Th>
-          <Th>L1 txn hash</Th>
-          <Th>L1 txn origin</Th>
-          <Th isNumeric>Gas limit</Th>
         </Tr>
       </Thead>
       <Tbody>
         { items.map((item, index) => (
-          <DepositsTableItem key={ item.l2_tx_hash + (isLoading ? index : '') } item={ item } isLoading={ isLoading }/>
+          <DepositsTableItem key={ item.l2_transaction_hash + (isLoading ? index : '') } item={ item } isLoading={ isLoading }/>
         )) }
       </Tbody>
     </Table>
diff --git a/ui/deposits/shibarium/DepositsTableItem.tsx b/ui/deposits/shibarium/DepositsTableItem.tsx
new file mode 100644
index 0000000000..7c38f52dd5
--- /dev/null
+++ b/ui/deposits/shibarium/DepositsTableItem.tsx
@@ -0,0 +1,68 @@
+import { Td, Tr, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { ShibariumDepositsItem } from 'types/api/shibarium';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import AddressStringOrParam from 'ui/shared/entities/address/AddressStringOrParam';
+import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
+
+const feature = config.features.rollup;
+
+ type Props = { item: ShibariumDepositsItem; isLoading?: boolean };
+
+const DepositsTableItem = ({ item, isLoading }: Props) => {
+  const timeAgo = dayjs(item.timestamp).fromNow();
+
+  if (!(feature.isEnabled && feature.type === 'shibarium')) {
+    return null;
+  }
+
+  return (
+    <Tr>
+      <Td verticalAlign="middle">
+        <BlockEntityL1
+          number={ item.l1_block_number }
+          isLoading={ isLoading }
+          fontSize="sm"
+          lineHeight={ 5 }
+          fontWeight={ 600 }
+        />
+      </Td>
+      <Td verticalAlign="middle">
+        <TxEntityL1
+          isLoading={ isLoading }
+          hash={ item.l1_transaction_hash }
+          truncation="constant_long"
+          fontSize="sm"
+          lineHeight={ 5 }
+        />
+      </Td>
+      <Td verticalAlign="middle">
+        <TxEntity
+          isLoading={ isLoading }
+          hash={ item.l2_transaction_hash }
+          fontSize="sm"
+          lineHeight={ 5 }
+          truncation="constant_long"
+        />
+      </Td>
+      <Td verticalAlign="middle">
+        <AddressStringOrParam
+          address={ item.user }
+          isLoading={ isLoading }
+          truncation="constant"
+          noCopy
+        />
+      </Td>
+      <Td verticalAlign="middle" pr={ 12 }>
+        <Skeleton isLoaded={ !isLoading } color="text_secondary" display="inline-block"><span>{ timeAgo }</span></Skeleton>
+      </Td>
+    </Tr>
+  );
+};
+
+export default DepositsTableItem;
diff --git a/ui/gasTracker/GasTrackerChart.tsx b/ui/gasTracker/GasTrackerChart.tsx
new file mode 100644
index 0000000000..8bab0d8d1b
--- /dev/null
+++ b/ui/gasTracker/GasTrackerChart.tsx
@@ -0,0 +1,63 @@
+import { Box, Flex, chakra, useBoolean } from '@chakra-ui/react';
+import React from 'react';
+
+import { route } from 'nextjs-routes';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import { STATS_CHARTS } from 'stubs/stats';
+import ContentLoader from 'ui/shared/ContentLoader';
+import DataFetchAlert from 'ui/shared/DataFetchAlert';
+import LinkInternal from 'ui/shared/LinkInternal';
+import ChartWidgetContainer from 'ui/stats/ChartWidgetContainer';
+
+const GAS_PRICE_CHART_ID = 'averageGasPrice';
+
+const GasTrackerChart = () => {
+  const [ isChartLoadingError, setChartLoadingError ] = useBoolean(false);
+  const { data, isPlaceholderData, isError } = useApiQuery('stats_lines', {
+    queryOptions: {
+      placeholderData: STATS_CHARTS,
+    },
+  });
+
+  const content = (() => {
+    if (isPlaceholderData) {
+      return <ContentLoader/>;
+    }
+
+    if (isChartLoadingError || isError) {
+      return <DataFetchAlert/>;
+    }
+
+    const chart = data?.sections.map((section) => section.charts.find((chart) => chart.id === GAS_PRICE_CHART_ID)).filter(Boolean)?.[0];
+
+    if (!chart) {
+      return <DataFetchAlert/>;
+    }
+
+    return (
+      <ChartWidgetContainer
+        id={ GAS_PRICE_CHART_ID }
+        title={ chart.title }
+        description={ chart.description }
+        interval="oneMonth"
+        units={ chart.units || undefined }
+        isPlaceholderData={ isPlaceholderData }
+        onLoadingError={ setChartLoadingError.on }
+        h="320px"
+      />
+    );
+  })();
+
+  return (
+    <Box>
+      <Flex justifyContent="space-between" alignItems="center" mb={ 6 }>
+        <chakra.h3 textStyle="h3">Gas price history</chakra.h3>
+        <LinkInternal href={ route({ pathname: '/stats', hash: 'gas' }) }>Charts & stats</LinkInternal>
+      </Flex>
+      { content }
+    </Box>
+  );
+};
+
+export default React.memo(GasTrackerChart);
diff --git a/ui/gasTracker/GasTrackerNetworkUtilization.tsx b/ui/gasTracker/GasTrackerNetworkUtilization.tsx
new file mode 100644
index 0000000000..e108c7a880
--- /dev/null
+++ b/ui/gasTracker/GasTrackerNetworkUtilization.tsx
@@ -0,0 +1,39 @@
+import { Skeleton, chakra } from '@chakra-ui/react';
+import React from 'react';
+
+import { mdash } from 'lib/html-entities';
+
+interface Props {
+  percentage: number;
+  isLoading: boolean;
+}
+
+const GasTrackerNetworkUtilization = ({ percentage, isLoading }: Props) => {
+  const load = (() => {
+    if (percentage > 80) {
+      return 'high';
+    }
+
+    if (percentage > 50) {
+      return 'medium';
+    }
+
+    return 'low';
+  })();
+
+  const colors = {
+    high: 'red.600',
+    medium: 'orange.600',
+    low: 'green.600',
+  };
+  const color = colors[load];
+
+  return (
+    <Skeleton isLoaded={ !isLoading } whiteSpace="pre-wrap">
+      <span>Network utilization </span>
+      <chakra.span color={ color }>{ percentage.toFixed(2) }% { mdash } { load } load</chakra.span>
+    </Skeleton>
+  );
+};
+
+export default React.memo(GasTrackerNetworkUtilization);
diff --git a/ui/gasTracker/GasTrackerPriceSnippet.pw.tsx b/ui/gasTracker/GasTrackerPriceSnippet.pw.tsx
new file mode 100644
index 0000000000..77ae96cad3
--- /dev/null
+++ b/ui/gasTracker/GasTrackerPriceSnippet.pw.tsx
@@ -0,0 +1,60 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import * as statsMock from 'mocks/stats/index';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+import * as configs from 'playwright/utils/configs';
+
+import GasTrackerPriceSnippet from './GasTrackerPriceSnippet';
+
+test.use({ viewport: configs.viewport.md });
+
+const data = statsMock.base.gas_prices.fast;
+const clip = { x: 0, y: 0, width: 334, height: 204 };
+
+test('with usd as primary unit +@dark-mode', async({ mount, page }) => {
+  await mount(
+    <TestApp>
+      <GasTrackerPriceSnippet
+        data={ data }
+        type="fast"
+        isLoading={ false }
+      />
+    </TestApp>,
+  );
+  await expect(page).toHaveScreenshot({ clip });
+});
+
+test('loading state', async({ mount, page }) => {
+  await mount(
+    <TestApp>
+      <GasTrackerPriceSnippet
+        data={ data }
+        type="fast"
+        isLoading={ true }
+      />
+    </TestApp>,
+  );
+  await expect(page).toHaveScreenshot({ clip });
+});
+
+const gweiUnitsTest = test.extend({
+  context: contextWithEnvs([
+    { name: 'NEXT_PUBLIC_GAS_TRACKER_UNITS', value: '["gwei","usd"]' },
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  ]) as any,
+});
+
+gweiUnitsTest('with gwei as primary unit +@dark-mode', async({ mount, page }) => {
+  await mount(
+    <TestApp>
+      <GasTrackerPriceSnippet
+        data={ data }
+        type="slow"
+        isLoading={ false }
+      />
+    </TestApp>,
+  );
+  await expect(page).toHaveScreenshot({ clip });
+});
diff --git a/ui/gasTracker/GasTrackerPriceSnippet.tsx b/ui/gasTracker/GasTrackerPriceSnippet.tsx
new file mode 100644
index 0000000000..575fc2d732
--- /dev/null
+++ b/ui/gasTracker/GasTrackerPriceSnippet.tsx
@@ -0,0 +1,66 @@
+import { Box, Flex, Skeleton, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import type { GasPriceInfo, GasPrices } from 'types/api/stats';
+
+import { SECOND } from 'lib/consts';
+import { asymp } from 'lib/html-entities';
+import GasPrice from 'ui/shared/gas/GasPrice';
+import type { IconName } from 'ui/shared/IconSvg';
+import IconSvg from 'ui/shared/IconSvg';
+
+interface Props {
+  type: keyof GasPrices;
+  data: GasPriceInfo;
+  isLoading: boolean;
+}
+
+const TITLES: Record<keyof GasPrices, string> = {
+  fast: 'Fast',
+  average: 'Normal',
+  slow: 'Slow',
+};
+const ICONS: Record<keyof GasPrices, IconName> = {
+  fast: 'rocket_xl',
+  average: 'gas_xl',
+  slow: 'gas_xl',
+};
+
+const GasTrackerPriceSnippet = ({ data, type, isLoading }: Props) => {
+  const bgColors = {
+    fast: 'transparent',
+    average: useColorModeValue('gray.50', 'whiteAlpha.200'),
+    slow: useColorModeValue('gray.50', 'whiteAlpha.200'),
+  };
+
+  return (
+    <Box
+      as="li"
+      listStyleType="none"
+      px={ 9 }
+      py={ 6 }
+      w={{ lg: 'calc(100% / 3)' }}
+      bgColor={ bgColors[type] }
+    >
+      <Skeleton textStyle="h3" isLoaded={ !isLoading } w="fit-content">{ TITLES[type] }</Skeleton>
+      <Flex columnGap={ 3 } alignItems="center" mt={ 3 }>
+        <IconSvg name={ ICONS[type] } boxSize={{ base: '30px', xl: 10 }} isLoading={ isLoading } flexShrink={ 0 }/>
+        <Skeleton isLoaded={ !isLoading }>
+          <GasPrice data={ data } fontSize={{ base: '36px', xl: '48px' }} lineHeight="48px" fontWeight={ 600 } letterSpacing="-1px" fontFamily="heading"/>
+        </Skeleton>
+      </Flex>
+      <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary" mt={ 3 } w="fit-content">
+        { data.price && data.fiat_price && <GasPrice data={ data } prefix={ `${ asymp } ` } unitMode="secondary"/> }
+        <span> per transaction</span>
+        { data.time && <span> / { (data.time / SECOND).toLocaleString(undefined, { maximumFractionDigits: 1 }) }s</span> }
+      </Skeleton>
+      <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary" mt={ 2 } w="fit-content" whiteSpace="pre">
+        { data.base_fee && <span>Base { data.base_fee.toLocaleString(undefined, { maximumFractionDigits: 0 }) }</span> }
+        { data.base_fee && data.priority_fee && <span> / </span> }
+        { data.priority_fee && <span>Priority { data.priority_fee.toLocaleString(undefined, { maximumFractionDigits: 0 }) }</span> }
+      </Skeleton>
+    </Box>
+  );
+};
+
+export default React.memo(GasTrackerPriceSnippet);
diff --git a/ui/gasTracker/GasTrackerPrices.tsx b/ui/gasTracker/GasTrackerPrices.tsx
new file mode 100644
index 0000000000..ffbe0162e9
--- /dev/null
+++ b/ui/gasTracker/GasTrackerPrices.tsx
@@ -0,0 +1,39 @@
+import { Flex, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import type { GasPrices } from 'types/api/stats';
+
+import GasTrackerPriceSnippet from './GasTrackerPriceSnippet';
+
+interface Props {
+  prices: GasPrices;
+  isLoading: boolean;
+}
+
+const GasTrackerPrices = ({ prices, isLoading }: Props) => {
+  const borderColor = useColorModeValue('gray.200', 'whiteAlpha.300');
+
+  return (
+    <Flex
+      as="ul"
+      flexDir={{ base: 'column', lg: 'row' }}
+      borderColor={ borderColor }
+      borderWidth="2px"
+      borderRadius="xl"
+      overflow="hidden"
+      sx={{
+        'li:not(:last-child)': {
+          borderColor: borderColor,
+          borderRightWidth: { lg: '2px' },
+          borderBottomWidth: { base: '2px', lg: '0' },
+        },
+      }}
+    >
+      { prices.fast && <GasTrackerPriceSnippet type="fast" data={ prices.fast } isLoading={ isLoading }/> }
+      { prices.average && <GasTrackerPriceSnippet type="average" data={ prices.average } isLoading={ isLoading }/> }
+      { prices.slow && <GasTrackerPriceSnippet type="slow" data={ prices.slow } isLoading={ isLoading }/> }
+    </Flex>
+  );
+};
+
+export default React.memo(GasTrackerPrices);
diff --git a/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_dark-color-mode_with-gwei-as-primary-unit-dark-mode-1.png b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_dark-color-mode_with-gwei-as-primary-unit-dark-mode-1.png
new file mode 100644
index 0000000000..791fee07ea
Binary files /dev/null and b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_dark-color-mode_with-gwei-as-primary-unit-dark-mode-1.png differ
diff --git a/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_dark-color-mode_with-usd-as-primary-unit-dark-mode-1.png b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_dark-color-mode_with-usd-as-primary-unit-dark-mode-1.png
new file mode 100644
index 0000000000..1a7b39a125
Binary files /dev/null and b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_dark-color-mode_with-usd-as-primary-unit-dark-mode-1.png differ
diff --git a/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_default_loading-state-1.png b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_default_loading-state-1.png
new file mode 100644
index 0000000000..af5d0293cd
Binary files /dev/null and b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_default_loading-state-1.png differ
diff --git a/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_default_with-gwei-as-primary-unit-dark-mode-1.png b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_default_with-gwei-as-primary-unit-dark-mode-1.png
new file mode 100644
index 0000000000..28bef4c82c
Binary files /dev/null and b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_default_with-gwei-as-primary-unit-dark-mode-1.png differ
diff --git a/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_default_with-usd-as-primary-unit-dark-mode-1.png b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_default_with-usd-as-primary-unit-dark-mode-1.png
new file mode 100644
index 0000000000..ad7261ea29
Binary files /dev/null and b/ui/gasTracker/__screenshots__/GasTrackerPriceSnippet.pw.tsx_default_with-usd-as-primary-unit-dark-mode-1.png differ
diff --git a/ui/home/LatestBlocks.pw.tsx b/ui/home/LatestBlocks.pw.tsx
index 8450ba1aa0..140c7e6af9 100644
--- a/ui/home/LatestBlocks.pw.tsx
+++ b/ui/home/LatestBlocks.pw.tsx
@@ -11,7 +11,7 @@ import * as configs from 'playwright/utils/configs';
 
 import LatestBlocks from './LatestBlocks';
 
-const STATS_API_URL = buildApiUrl('homepage_stats');
+const STATS_API_URL = buildApiUrl('stats');
 const BLOCKS_API_URL = buildApiUrl('homepage_blocks');
 
 export const test = base.extend<socketServer.SocketServerFixture>({
diff --git a/ui/home/LatestBlocks.tsx b/ui/home/LatestBlocks.tsx
index 301963a6e2..e6afdf3213 100644
--- a/ui/home/LatestBlocks.tsx
+++ b/ui/home/LatestBlocks.tsx
@@ -24,7 +24,7 @@ const LatestBlocks = () => {
   const isMobile = useIsMobile();
   // const blocksMaxCount = isMobile ? 2 : 3;
   let blocksMaxCount: number;
-  if (config.features.optimisticRollup.isEnabled || config.UI.views.block.hiddenFields?.total_reward) {
+  if (config.features.rollup.isEnabled || config.UI.views.block.hiddenFields?.total_reward) {
     blocksMaxCount = isMobile ? 4 : 5;
   } else {
     blocksMaxCount = isMobile ? 2 : 3;
@@ -36,8 +36,9 @@ const LatestBlocks = () => {
   });
 
   const queryClient = useQueryClient();
-  const statsQueryResult = useApiQuery('homepage_stats', {
+  const statsQueryResult = useApiQuery('stats', {
     queryOptions: {
+      refetchOnMount: false,
       placeholderData: HOMEPAGE_STATS,
     },
   });
diff --git a/ui/home/LatestBlocksItem.tsx b/ui/home/LatestBlocksItem.tsx
index 1f8ee76a3d..b0d9f69006 100644
--- a/ui/home/LatestBlocksItem.tsx
+++ b/ui/home/LatestBlocksItem.tsx
@@ -59,14 +59,14 @@ const LatestBlocksItem = ({ block, isLoading }: Props) => {
         <Skeleton isLoaded={ !isLoading }>Txn</Skeleton>
         <Skeleton isLoaded={ !isLoading } color="text_secondary"><span>{ block.tx_count }</span></Skeleton>
 
-        { !config.features.optimisticRollup.isEnabled && !config.UI.views.block.hiddenFields?.total_reward && (
+        { !config.features.rollup.isEnabled && !config.UI.views.block.hiddenFields?.total_reward && (
           <>
             <Skeleton isLoaded={ !isLoading }>Reward</Skeleton>
             <Skeleton isLoaded={ !isLoading } color="text_secondary"><span>{ totalReward.dp(10).toFixed() }</span></Skeleton>
           </>
         ) }
 
-        { !config.features.optimisticRollup.isEnabled && !config.UI.views.block.hiddenFields?.miner && (
+        { !config.features.rollup.isEnabled && !config.UI.views.block.hiddenFields?.miner && (
           <>
             <Skeleton isLoaded={ !isLoading } textTransform="capitalize">{ getNetworkValidatorTitle() }</Skeleton>
             <AddressEntity
@@ -74,6 +74,7 @@ const LatestBlocksItem = ({ block, isLoading }: Props) => {
               isLoading={ isLoading }
               noIcon
               noCopy
+              truncation="constant"
             />
           </>
         ) }
diff --git a/ui/home/LatestDeposits.tsx b/ui/home/LatestDeposits.tsx
index dff2c945b8..ed5518e722 100644
--- a/ui/home/LatestDeposits.tsx
+++ b/ui/home/LatestDeposits.tsx
@@ -58,7 +58,7 @@ const LatestDeposits = () => {
   }
 
   if (data) {
-    const depositsUrl = route({ pathname: '/l2-deposits' });
+    const depositsUrl = route({ pathname: '/deposits' });
     return (
       <>
         <SocketNewItemsNotice borderBottomRadius={ 0 } url={ depositsUrl } num={ num } alert={ socketAlert } type="deposit" isLoading={ isPlaceholderData }/>
diff --git a/ui/home/LatestDepositsItem.tsx b/ui/home/LatestDepositsItem.tsx
index c6f8fdc7b8..813a41f743 100644
--- a/ui/home/LatestDepositsItem.tsx
+++ b/ui/home/LatestDepositsItem.tsx
@@ -6,7 +6,7 @@ import {
 } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2DepositsItem } from 'types/api/l2Deposits';
+import type { OptimisticL2DepositsItem } from 'types/api/optimisticL2';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
@@ -15,18 +15,18 @@ import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 
-const feature = config.features.optimisticRollup;
+const feature = config.features.rollup;
 
 type Props = {
-  item: L2DepositsItem;
+  item: OptimisticL2DepositsItem;
   isLoading?: boolean;
 }
 
-const LatestTxsItem = ({ item, isLoading }: Props) => {
+const LatestDepositsItem = ({ item, isLoading }: Props) => {
   const timeAgo = dayjs(item.l1_block_timestamp).fromNow();
   const isMobile = useIsMobile();
 
-  if (!feature.isEnabled) {
+  if (!feature.isEnabled || feature.type !== 'optimistic') {
     return null;
   }
 
@@ -46,6 +46,7 @@ const LatestTxsItem = ({ item, isLoading }: Props) => {
       hash={ item.l1_tx_hash }
       fontSize="sm"
       lineHeight={ 5 }
+      truncation={ isMobile ? 'constant_long' : 'dynamic' }
     />
   );
 
@@ -55,6 +56,7 @@ const LatestTxsItem = ({ item, isLoading }: Props) => {
       hash={ item.l2_tx_hash }
       fontSize="sm"
       lineHeight={ 5 }
+      truncation={ isMobile ? 'constant_long' : 'dynamic' }
     />
   );
 
@@ -116,4 +118,4 @@ const LatestTxsItem = ({ item, isLoading }: Props) => {
   );
 };
 
-export default React.memo(LatestTxsItem);
+export default React.memo(LatestDepositsItem);
diff --git a/ui/home/LatestTxs.tsx b/ui/home/LatestTxs.tsx
index d58f40c98b..37b4ea695a 100644
--- a/ui/home/LatestTxs.tsx
+++ b/ui/home/LatestTxs.tsx
@@ -4,6 +4,7 @@ import React from 'react';
 import { route } from 'nextjs-routes';
 
 import useApiQuery from 'lib/api/useApiQuery';
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import useNewTxsSocket from 'lib/hooks/useNewTxsSocket';
 import { TX } from 'stubs/tx';
@@ -42,15 +43,17 @@ const LatestTransactions = () => {
             />
           ))) }
         </Box>
-        <Box mb={ 4 } display={{ base: 'none', lg: 'block' }}>
-          { data.slice(0, txsCount).map(((tx, index) => (
-            <LatestTxsItem
-              key={ tx.hash + (isPlaceholderData ? index : '') }
-              tx={ tx }
-              isLoading={ isPlaceholderData }
-            />
-          ))) }
-        </Box>
+        <AddressHighlightProvider>
+          <Box mb={ 4 } display={{ base: 'none', lg: 'block' }}>
+            { data.slice(0, txsCount).map(((tx, index) => (
+              <LatestTxsItem
+                key={ tx.hash + (isPlaceholderData ? index : '') }
+                tx={ tx }
+                isLoading={ isPlaceholderData }
+              />
+            ))) }
+          </Box>
+        </AddressHighlightProvider>
         <Flex justifyContent="center">
           <LinkInternal fontSize="sm" href={ txsUrl }>View all transactions</LinkInternal>
         </Flex>
diff --git a/ui/home/LatestTxsItem.tsx b/ui/home/LatestTxsItem.tsx
index 6c3eaf5d54..80219ccb68 100644
--- a/ui/home/LatestTxsItem.tsx
+++ b/ui/home/LatestTxsItem.tsx
@@ -13,9 +13,9 @@ import type { Transaction } from 'types/api/transaction';
 import config from 'configs/app';
 import getValueWithUnit from 'lib/getValueWithUnit';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import { currencyUnits } from 'lib/units';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import IconSvg from 'ui/shared/IconSvg';
 import TxStatus from 'ui/shared/statusTag/TxStatus';
 import TxFeeStability from 'ui/shared/tx/TxFeeStability';
 import TxWatchListTags from 'ui/shared/tx/TxWatchListTags';
@@ -34,7 +34,10 @@ const LatestTxsItem = ({ tx, isLoading }: Props) => {
 
   return (
     <Grid
-      gridTemplateColumns={ columnNum === 2 ? '3fr 2fr' : '3fr 2fr 150px' }
+      gridTemplateColumns={{
+        lg: columnNum === 2 ? '3fr minmax(auto, 180px)' : '3fr minmax(auto, 180px) 150px',
+        xl: columnNum === 2 ? '3fr minmax(auto, 250px)' : '3fr minmax(auto, 275px) 150px',
+      }}
       gridGap={ 8 }
       width="100%"
       minW="700px"
@@ -45,16 +48,17 @@ const LatestTxsItem = ({ tx, isLoading }: Props) => {
       display={{ base: 'none', lg: 'grid' }}
     >
       <Flex overflow="hidden" w="100%">
-        <TxAdditionalInfo tx={ tx } isLoading={ isLoading }/>
+        <TxAdditionalInfo tx={ tx } isLoading={ isLoading } my="3px"/>
         <Box ml={ 3 } w="calc(100% - 40px)">
-          <HStack flexWrap="wrap">
+          <HStack flexWrap="wrap" my="3px">
             <TxType types={ tx.tx_types } isLoading={ isLoading }/>
             <TxStatus status={ tx.status } errorText={ tx.status === 'error' ? tx.result : undefined } isLoading={ isLoading }/>
             <TxWatchListTags tx={ tx } isLoading={ isLoading }/>
           </HStack>
           <Flex
-            mt={ 2 }
             alignItems="center"
+            mt="7px"
+            mb="3px"
           >
             <TxEntity
               isLoading={ isLoading }
@@ -76,43 +80,21 @@ const LatestTxsItem = ({ tx, isLoading }: Props) => {
           </Flex>
         </Box>
       </Flex>
-      <Grid alignItems="center" alignSelf="flex-start" templateColumns="24px auto">
-        <IconSvg
-          name="arrows/east"
-          boxSize={ 6 }
-          color="gray.500"
-          transform="rotate(90deg)"
-          isLoading={ isLoading }
-        />
-        <Box overflow="hidden" ml={ 1 }>
-          <AddressEntity
-            isLoading={ isLoading }
-            address={ tx.from }
-            fontSize="sm"
-            lineHeight={ 6 }
-            fontWeight="500"
-            mb={ 2 }
-          />
-          { dataTo && (
-            <AddressEntity
-              isLoading={ isLoading }
-              address={ dataTo }
-              fontSize="sm"
-              lineHeight={ 6 }
-              fontWeight="500"
-            />
-          ) }
-        </Box>
-      </Grid>
-      <Box>
+      <AddressFromTo
+        from={ tx.from }
+        to={ dataTo }
+        isLoading={ isLoading }
+        mode="compact"
+      />
+      <Flex flexDir="column">
         { !config.UI.views.tx.hiddenFields?.value && (
-          <Skeleton isLoaded={ !isLoading } mb={ 2 }>
-            <Text as="span" whiteSpace="pre">{ config.chain.currency.symbol } </Text>
+          <Skeleton isLoaded={ !isLoading } my="3px">
+            <Text as="span" whiteSpace="pre">{ currencyUnits.ether } </Text>
             <Text as="span" variant="secondary">{ getValueWithUnit(tx.value).dp(5).toFormat() }</Text>
           </Skeleton>
         ) }
         { !config.UI.views.tx.hiddenFields?.tx_fee && (
-          <Skeleton isLoaded={ !isLoading } display="flex" whiteSpace="pre">
+          <Skeleton isLoaded={ !isLoading } display="flex" whiteSpace="pre" my="3px">
             <Text as="span">Fee </Text>
             { tx.stability_fee ? (
               <TxFeeStability data={ tx.stability_fee } accuracy={ 5 } color="text_secondary" hideUsd/>
@@ -121,7 +103,7 @@ const LatestTxsItem = ({ tx, isLoading }: Props) => {
             ) }
           </Skeleton>
         ) }
-      </Box>
+      </Flex>
     </Grid>
   );
 };
diff --git a/ui/home/LatestTxsItemMobile.tsx b/ui/home/LatestTxsItemMobile.tsx
index eb96ff62f5..b75886f12e 100644
--- a/ui/home/LatestTxsItemMobile.tsx
+++ b/ui/home/LatestTxsItemMobile.tsx
@@ -12,9 +12,9 @@ import type { Transaction } from 'types/api/transaction';
 import config from 'configs/app';
 import getValueWithUnit from 'lib/getValueWithUnit';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import { currencyUnits } from 'lib/units';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import IconSvg from 'ui/shared/IconSvg';
 import TxStatus from 'ui/shared/statusTag/TxStatus';
 import TxFeeStability from 'ui/shared/tx/TxFeeStability';
 import TxWatchListTags from 'ui/shared/tx/TxWatchListTags';
@@ -58,7 +58,7 @@ const LatestTxsItem = ({ tx, isLoading }: Props) => {
           isLoading={ isLoading }
           hash={ tx.hash }
           fontWeight="700"
-          truncation="constant"
+          truncation="constant_long"
         />
         { tx.timestamp && (
           <Skeleton isLoaded={ !isLoading } color="text_secondary" fontWeight="400" fontSize="sm" ml={ 3 }>
@@ -66,40 +66,23 @@ const LatestTxsItem = ({ tx, isLoading }: Props) => {
           </Skeleton>
         ) }
       </Flex>
-      <Flex alignItems="center" mb={ 3 }>
-        <AddressEntity
-          isLoading={ isLoading }
-          address={ tx.from }
-          truncation="constant"
-          fontSize="sm"
-          fontWeight="500"
-          mr={ 2 }
-        />
-        <IconSvg
-          name="arrows/east"
-          boxSize={ 6 }
-          color="gray.500"
-          isLoading={ isLoading }
-        />
-        { dataTo && (
-          <AddressEntity
-            isLoading={ isLoading }
-            address={ dataTo }
-            truncation="constant"
-            fontSize="sm"
-            fontWeight="500"
-          />
-        ) }
-      </Flex>
+      <AddressFromTo
+        from={ tx.from }
+        to={ dataTo }
+        isLoading={ isLoading }
+        fontSize="sm"
+        fontWeight="500"
+        mb={ 3 }
+      />
       { !config.UI.views.tx.hiddenFields?.value && (
         <Skeleton isLoaded={ !isLoading } mb={ 2 } fontSize="sm" w="fit-content">
-          <Text as="span">Value { config.chain.currency.symbol } </Text>
+          <Text as="span">Value { currencyUnits.ether } </Text>
           <Text as="span" variant="secondary">{ getValueWithUnit(tx.value).dp(5).toFormat() }</Text>
         </Skeleton>
       ) }
       { !config.UI.views.tx.hiddenFields?.tx_fee && (
         <Skeleton isLoaded={ !isLoading } fontSize="sm" w="fit-content" display="flex" whiteSpace="pre">
-          <Text as="span">Fee { !config.UI.views.tx.hiddenFields?.fee_currency ? `${ config.chain.currency.symbol } ` : '' }</Text>
+          <Text as="span">Fee { !config.UI.views.tx.hiddenFields?.fee_currency ? `${ currencyUnits.ether } ` : '' }</Text>
           { tx.stability_fee ? (
             <TxFeeStability data={ tx.stability_fee } accuracy={ 5 } color="text_secondary" hideUsd/>
           ) : (
diff --git a/ui/home/LatestZkEvmL2Batches.pw.tsx b/ui/home/LatestZkEvmL2Batches.pw.tsx
index 5a470ac854..ee27d19012 100644
--- a/ui/home/LatestZkEvmL2Batches.pw.tsx
+++ b/ui/home/LatestZkEvmL2Batches.pw.tsx
@@ -13,7 +13,7 @@ const BATCHES_API_URL = buildApiUrl('homepage_zkevm_l2_batches');
 
 const test = base.extend({
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  context: contextWithEnvs(configs.featureEnvs.zkRollup) as any,
+  context: contextWithEnvs(configs.featureEnvs.zkEvmRollup) as any,
 });
 
 test('default view +@mobile +@dark-mode', async({ mount, page }) => {
diff --git a/ui/home/LatestZkEvmL2Batches.tsx b/ui/home/LatestZkEvmL2Batches.tsx
index e6a24214b7..246991b285 100644
--- a/ui/home/LatestZkEvmL2Batches.tsx
+++ b/ui/home/LatestZkEvmL2Batches.tsx
@@ -4,7 +4,7 @@ import { AnimatePresence } from 'framer-motion';
 import React from 'react';
 
 import type { SocketMessage } from 'lib/socket/types';
-import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2';
 
 import { route } from 'nextjs-routes';
 
@@ -73,7 +73,7 @@ const LatestZkEvmL2Batches = () => {
           </AnimatePresence>
         </VStack>
         <Flex justifyContent="center">
-          <LinkInternal fontSize="sm" href={ route({ pathname: '/zkevm-l2-txn-batches' }) }>View all batches</LinkInternal>
+          <LinkInternal fontSize="sm" href={ route({ pathname: '/batches' }) }>View all batches</LinkInternal>
         </Flex>
       </>
     );
diff --git a/ui/home/LatestZkevmL2BatchItem.tsx b/ui/home/LatestZkevmL2BatchItem.tsx
index bad789425e..b2d8b93bb3 100644
--- a/ui/home/LatestZkevmL2BatchItem.tsx
+++ b/ui/home/LatestZkevmL2BatchItem.tsx
@@ -6,12 +6,12 @@ import {
 import { motion } from 'framer-motion';
 import React from 'react';
 
-import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2';
 
 import { route } from 'nextjs-routes';
 
 import BlockTimestamp from 'ui/blocks/BlockTimestamp';
-import ZkEvmBatchEntityL2 from 'ui/shared/entities/block/ZkEvmBatchEntityL2';
+import BatchEntityL2 from 'ui/shared/entities/block/BatchEntityL2';
 import LinkInternal from 'ui/shared/LinkInternal';
 import ZkEvmL2TxnBatchStatus from 'ui/shared/statusTag/ZkEvmL2TxnBatchStatus';
 
@@ -35,7 +35,7 @@ const LatestZkevmL2BatchItem = ({ batch, isLoading }: Props) => {
       p={ 6 }
     >
       <Flex alignItems="center" overflow="hidden" w="100%" mb={ 3 }>
-        <ZkEvmBatchEntityL2
+        <BatchEntityL2
           isLoading={ isLoading }
           number={ batch.number }
           tailLength={ 2 }
@@ -57,7 +57,7 @@ const LatestZkevmL2BatchItem = ({ batch, isLoading }: Props) => {
         <Flex alignItems="center">
           <Skeleton isLoaded={ !isLoading } mr={ 2 }>Txn</Skeleton>
           <LinkInternal
-            href={ route({ pathname: '/zkevm-l2-txn-batch/[number]', query: { number: batch.number.toString(), tab: 'txs' } }) }
+            href={ route({ pathname: '/batches/[number]', query: { number: batch.number.toString(), tab: 'txs' } }) }
             isLoading={ isLoading }
           >
             <Skeleton isLoaded={ !isLoading }>
diff --git a/ui/home/Stats.pw.tsx b/ui/home/Stats.pw.tsx
index 06e0b0d88d..b16da823e4 100644
--- a/ui/home/Stats.pw.tsx
+++ b/ui/home/Stats.pw.tsx
@@ -10,7 +10,7 @@ import * as configs from 'playwright/utils/configs';
 
 import Stats from './Stats';
 
-const API_URL = buildApiUrl('homepage_stats');
+const API_URL = buildApiUrl('stats');
 
 test.describe('all items', () => {
   let component: Locator;
@@ -69,7 +69,7 @@ test.describe('3 items', () => {
   const extendedTest = test.extend({
     context: contextWithEnvs([
       { name: 'NEXT_PUBLIC_HOMEPAGE_SHOW_AVG_BLOCK_TIME', value: 'false' },
-      { name: 'NEXT_PUBLIC_HOMEPAGE_SHOW_GAS_TRACKER', value: 'false' },
+      { name: 'NEXT_PUBLIC_GAS_TRACKER_ENABLED', value: 'false' },
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     ]) as any,
   });
diff --git a/ui/home/Stats.tsx b/ui/home/Stats.tsx
index 3e0b2edbcf..eb2b49cdd7 100644
--- a/ui/home/Stats.tsx
+++ b/ui/home/Stats.tsx
@@ -8,16 +8,20 @@ import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';
 import { WEI } from 'lib/consts';
 import { HOMEPAGE_STATS } from 'stubs/stats';
-import GasInfoTooltipContent from 'ui/shared/GasInfoTooltipContent/GasInfoTooltipContent';
+import GasInfoTooltip from 'ui/shared/gas/GasInfoTooltip';
+import GasPrice from 'ui/shared/gas/GasPrice';
+import IconSvg from 'ui/shared/IconSvg';
 
 import StatsItem from './StatsItem';
 
-const hasGasTracker = config.UI.homepage.showGasTracker;
+const hasGasTracker = config.features.gasTracker.isEnabled;
 const hasAvgBlockTime = config.UI.homepage.showAvgBlockTime;
+const rollupFeature = config.features.rollup;
 
 const Stats = () => {
-  const { data, isPlaceholderData, isError } = useApiQuery('homepage_stats', {
+  const { data, isPlaceholderData, isError, dataUpdatedAt } = useApiQuery('stats', {
     queryOptions: {
+      refetchOnMount: false,
       placeholderData: HOMEPAGE_STATS,
     },
   });
@@ -25,14 +29,25 @@ const Stats = () => {
   const zkEvmLatestBatchQuery = useApiQuery('homepage_zkevm_latest_batch', {
     queryOptions: {
       placeholderData: 12345,
-      enabled: config.features.zkEvmRollup.isEnabled,
+      enabled: rollupFeature.isEnabled && rollupFeature.type === 'zkEvm',
     },
   });
 
-  if (isError || zkEvmLatestBatchQuery.isError) {
+  const zkSyncLatestBatchQuery = useApiQuery('homepage_zksync_latest_batch', {
+    queryOptions: {
+      placeholderData: 12345,
+      enabled: rollupFeature.isEnabled && rollupFeature.type === 'zkSync',
+    },
+  });
+
+  if (isError || zkEvmLatestBatchQuery.isError || zkSyncLatestBatchQuery.isError) {
     return null;
   }
 
+  const isLoading = isPlaceholderData ||
+    (rollupFeature.isEnabled && rollupFeature.type === 'zkEvm' && zkEvmLatestBatchQuery.isPlaceholderData) ||
+    (rollupFeature.isEnabled && rollupFeature.type === 'zkSync' && zkSyncLatestBatchQuery.isPlaceholderData);
+
   let content;
 
   const lastItemTouchStyle = { gridColumn: { base: 'span 2', lg: 'unset' } };
@@ -45,25 +60,49 @@ const Stats = () => {
     !data.gas_prices && itemsCount--;
     data.rootstock_locked_btc && itemsCount++;
     const isOdd = Boolean(itemsCount % 2);
-    const gasLabel = hasGasTracker && data.gas_prices ? <GasInfoTooltipContent gasPrices={ data.gas_prices }/> : null;
+    const gasInfoTooltip = hasGasTracker && data.gas_prices ? (
+      <GasInfoTooltip data={ data } dataUpdatedAt={ dataUpdatedAt }>
+        <IconSvg
+          isLoading={ isLoading }
+          name="info"
+          boxSize={ 5 }
+          display="block"
+          cursor="pointer"
+          _hover={{ color: 'link_hovered' }}
+          position="absolute"
+          top={{ base: 'calc(50% - 12px)', lg: '10px', xl: 'calc(50% - 12px)' }}
+          right="10px"
+        />
+      </GasInfoTooltip>
+    ) : null;
 
     content = (
       <>
-        { config.features.zkEvmRollup.isEnabled ? (
+        { rollupFeature.isEnabled && rollupFeature.type === 'zkEvm' && (
           <StatsItem
             icon="txn_batches"
             title="Latest batch"
             value={ (zkEvmLatestBatchQuery.data || 0).toLocaleString() }
-            url={ route({ pathname: '/zkevm-l2-txn-batches' }) }
-            isLoading={ zkEvmLatestBatchQuery.isPlaceholderData }
+            url={ route({ pathname: '/batches' }) }
+            isLoading={ isLoading }
           />
-        ) : (
+        ) }
+        { rollupFeature.isEnabled && rollupFeature.type === 'zkSync' && (
+          <StatsItem
+            icon="txn_batches"
+            title="Latest batch"
+            value={ (zkSyncLatestBatchQuery.data || 0).toLocaleString() }
+            url={ route({ pathname: '/batches' }) }
+            isLoading={ isLoading }
+          />
+        ) }
+        { !(rollupFeature.isEnabled && (rollupFeature.type === 'zkEvm' || rollupFeature.type === 'zkSync')) && (
           <StatsItem
             icon="block"
             title="Total blocks"
             value={ Number(data.total_blocks).toLocaleString() }
             url={ route({ pathname: '/blocks' }) }
-            isLoading={ isPlaceholderData }
+            isLoading={ isLoading }
           />
         ) }
         { hasAvgBlockTime && (
@@ -71,7 +110,7 @@ const Stats = () => {
             icon="clock-light"
             title="Average block time"
             value={ `${ (data.average_block_time / 1000).toFixed(1) }s` }
-            isLoading={ isPlaceholderData }
+            isLoading={ isLoading }
           />
         ) }
         <StatsItem
@@ -79,23 +118,23 @@ const Stats = () => {
           title="Total transactions"
           value={ Number(data.total_transactions).toLocaleString() }
           url={ route({ pathname: '/txs' }) }
-          isLoading={ isPlaceholderData }
+          isLoading={ isLoading }
         />
         <StatsItem
           icon="wallet"
           title="Wallet addresses"
           value={ Number(data.total_addresses).toLocaleString() }
           _last={ isOdd ? lastItemTouchStyle : undefined }
-          isLoading={ isPlaceholderData }
+          isLoading={ isLoading }
         />
         { hasGasTracker && data.gas_prices && (
           <StatsItem
             icon="gas"
             title="Gas tracker"
-            value={ data.gas_prices.average !== null ? `${ Number(data.gas_prices.average).toLocaleString() } Gwei` : 'N/A' }
+            value={ <GasPrice data={ data.gas_prices.average }/> }
             _last={ isOdd ? lastItemTouchStyle : undefined }
-            tooltipLabel={ gasLabel }
-            isLoading={ isPlaceholderData }
+            tooltip={ gasInfoTooltip }
+            isLoading={ isLoading }
           />
         ) }
         { data.rootstock_locked_btc && (
@@ -104,7 +143,7 @@ const Stats = () => {
             title="BTC Locked in 2WP"
             value={ `${ BigNumber(data.rootstock_locked_btc).div(WEI).dp(0).toFormat() } RBTC` }
             _last={ isOdd ? lastItemTouchStyle : undefined }
-            isLoading={ isPlaceholderData }
+            isLoading={ isLoading }
           />
         ) }
       </>
diff --git a/ui/home/StatsItem.tsx b/ui/home/StatsItem.tsx
index eec90102c9..f16f49bfd3 100644
--- a/ui/home/StatsItem.tsx
+++ b/ui/home/StatsItem.tsx
@@ -1,33 +1,24 @@
-import type { SystemStyleObject, TooltipProps } from '@chakra-ui/react';
-import { Skeleton, Flex, useColorModeValue, chakra, LightMode } from '@chakra-ui/react';
+import type { SystemStyleObject } from '@chakra-ui/react';
+import { Skeleton, Flex, useColorModeValue, chakra } from '@chakra-ui/react';
 import React from 'react';
 
 import breakpoints from 'theme/foundations/breakpoints';
-import Hint from 'ui/shared/Hint';
 import type { IconName } from 'ui/shared/IconSvg';
 import IconSvg from 'ui/shared/IconSvg';
 
 type Props = {
   icon: IconName;
   title: string;
-  value: string;
+  value: string | React.ReactNode;
   className?: string;
-  tooltipLabel?: React.ReactNode;
+  tooltip?: React.ReactNode;
   url?: string;
   isLoading?: boolean;
 }
 
 const LARGEST_BREAKPOINT = '1240px';
 
-const TOOLTIP_PROPS: Partial<TooltipProps> = {
-  hasArrow: false,
-  borderRadius: 'md',
-  placement: 'bottom-end',
-  offset: [ 0, 0 ],
-  bgColor: 'blackAlpha.900',
-};
-
-const StatsItem = ({ icon, title, value, className, tooltipLabel, url, isLoading }: Props) => {
+const StatsItem = ({ icon, title, value, className, tooltip, url, isLoading }: Props) => {
   const sxContainer: SystemStyleObject = {
     [`@media screen and (min-width: ${ breakpoints.lg }) and (max-width: ${ LARGEST_BREAKPOINT })`]: { flexDirection: 'column' },
   };
@@ -38,7 +29,6 @@ const StatsItem = ({ icon, title, value, className, tooltipLabel, url, isLoading
 
   const bgColor = useColorModeValue('blue.50', 'blue.800');
   const loadingBgColor = useColorModeValue('blackAlpha.50', 'whiteAlpha.50');
-  const infoColor = useColorModeValue('gray.600', 'gray.400');
 
   return (
     <Flex
@@ -68,22 +58,10 @@ const StatsItem = ({ icon, title, value, className, tooltipLabel, url, isLoading
           <span>{ title }</span>
         </Skeleton>
         <Skeleton isLoaded={ !isLoading } fontWeight={ 500 } fontSize="md" color={ useColorModeValue('black', 'white') } borderRadius="base">
-          <span>{ value }</span>
+          { typeof value === 'string' ? <span>{ value }</span> : value }
         </Skeleton>
       </Flex>
-      { tooltipLabel && !isLoading && (
-        <LightMode>
-          <Hint
-            label={ tooltipLabel }
-            tooltipProps={ TOOLTIP_PROPS }
-            boxSize={ 6 }
-            color={ infoColor }
-            position="absolute"
-            top={{ base: 'calc(50% - 12px)', lg: '10px', xl: 'calc(50% - 12px)' }}
-            right="10px"
-          />
-        </LightMode>
-      ) }
+      { tooltip }
     </Flex>
   );
 };
diff --git a/ui/home/Transactions.tsx b/ui/home/Transactions.tsx
index ad7a2b244a..810f8823fe 100644
--- a/ui/home/Transactions.tsx
+++ b/ui/home/Transactions.tsx
@@ -7,13 +7,14 @@ import LatestDeposits from 'ui/home/LatestDeposits';
 import LatestTxs from 'ui/home/LatestTxs';
 import LatestWatchlistTxs from 'ui/home/LatestWatchlistTxs';
 import TabsWithScroll from 'ui/shared/Tabs/TabsWithScroll';
+const rollupFeature = config.features.rollup;
 
 const TransactionsHome = () => {
   const hasAccount = useHasAccount();
-  if (config.features.optimisticRollup.isEnabled || hasAccount) {
+  if ((rollupFeature.isEnabled && rollupFeature.type === 'optimistic') || hasAccount) {
     const tabs = [
       { id: 'txn', title: 'Latest txn', component: <LatestTxs/> },
-      config.features.optimisticRollup.isEnabled && { id: 'deposits', title: 'Deposits (L1→L2 txn)', component: <LatestDeposits/> },
+      rollupFeature.isEnabled && rollupFeature.type === 'optimistic' && { id: 'deposits', title: 'Deposits (L1→L2 txn)', component: <LatestDeposits/> },
       hasAccount && { id: 'watchlist', title: 'Watch list', component: <LatestWatchlistTxs/> },
     ].filter(Boolean);
     return (
diff --git a/ui/home/__screenshots__/LatestDeposits.pw.tsx_mobile_default-view-mobile-dark-mode-1.png b/ui/home/__screenshots__/LatestDeposits.pw.tsx_mobile_default-view-mobile-dark-mode-1.png
index 080a71d98c..5e634c846f 100644
Binary files a/ui/home/__screenshots__/LatestDeposits.pw.tsx_mobile_default-view-mobile-dark-mode-1.png and b/ui/home/__screenshots__/LatestDeposits.pw.tsx_mobile_default-view-mobile-dark-mode-1.png differ
diff --git a/ui/home/__screenshots__/LatestTxs.pw.tsx_dark-color-mode_default-view-dark-mode-1.png b/ui/home/__screenshots__/LatestTxs.pw.tsx_dark-color-mode_default-view-dark-mode-1.png
index 0b1978fb30..34bc045c5e 100644
Binary files a/ui/home/__screenshots__/LatestTxs.pw.tsx_dark-color-mode_default-view-dark-mode-1.png and b/ui/home/__screenshots__/LatestTxs.pw.tsx_dark-color-mode_default-view-dark-mode-1.png differ
diff --git a/ui/home/__screenshots__/LatestTxs.pw.tsx_default_default-view-dark-mode-1.png b/ui/home/__screenshots__/LatestTxs.pw.tsx_default_default-view-dark-mode-1.png
index d6f9f5b45b..268424019d 100644
Binary files a/ui/home/__screenshots__/LatestTxs.pw.tsx_default_default-view-dark-mode-1.png and b/ui/home/__screenshots__/LatestTxs.pw.tsx_default_default-view-dark-mode-1.png differ
diff --git a/ui/home/__screenshots__/LatestTxs.pw.tsx_default_mobile-default-view-1.png b/ui/home/__screenshots__/LatestTxs.pw.tsx_default_mobile-default-view-1.png
index 6622d1c204..f389bf100e 100644
Binary files a/ui/home/__screenshots__/LatestTxs.pw.tsx_default_mobile-default-view-1.png and b/ui/home/__screenshots__/LatestTxs.pw.tsx_default_mobile-default-view-1.png differ
diff --git a/ui/home/__screenshots__/LatestTxs.pw.tsx_default_socket-new-item-1.png b/ui/home/__screenshots__/LatestTxs.pw.tsx_default_socket-new-item-1.png
index 78d3f47519..a3e9edc2c1 100644
Binary files a/ui/home/__screenshots__/LatestTxs.pw.tsx_default_socket-new-item-1.png and b/ui/home/__screenshots__/LatestTxs.pw.tsx_default_socket-new-item-1.png differ
diff --git a/ui/home/__screenshots__/Stats.pw.tsx_dark-color-mode_all-items-mobile-dark-mode-1.png b/ui/home/__screenshots__/Stats.pw.tsx_dark-color-mode_all-items-mobile-dark-mode-1.png
index 2f0b7c5e5e..8b9074f9ed 100644
Binary files a/ui/home/__screenshots__/Stats.pw.tsx_dark-color-mode_all-items-mobile-dark-mode-1.png and b/ui/home/__screenshots__/Stats.pw.tsx_dark-color-mode_all-items-mobile-dark-mode-1.png differ
diff --git a/ui/home/__screenshots__/Stats.pw.tsx_default_all-items-mobile-dark-mode-1.png b/ui/home/__screenshots__/Stats.pw.tsx_default_all-items-mobile-dark-mode-1.png
index 803a316ff3..b499ad0c42 100644
Binary files a/ui/home/__screenshots__/Stats.pw.tsx_default_all-items-mobile-dark-mode-1.png and b/ui/home/__screenshots__/Stats.pw.tsx_default_all-items-mobile-dark-mode-1.png differ
diff --git a/ui/home/__screenshots__/Stats.pw.tsx_default_all-items-screen-xl-1.png b/ui/home/__screenshots__/Stats.pw.tsx_default_all-items-screen-xl-1.png
index 33d351602e..39145e3259 100644
Binary files a/ui/home/__screenshots__/Stats.pw.tsx_default_all-items-screen-xl-1.png and b/ui/home/__screenshots__/Stats.pw.tsx_default_all-items-screen-xl-1.png differ
diff --git a/ui/home/__screenshots__/Stats.pw.tsx_mobile_4-items-default-view-mobile---default-1.png b/ui/home/__screenshots__/Stats.pw.tsx_mobile_4-items-default-view-mobile---default-1.png
index 278f0b12a3..766bd1d485 100644
Binary files a/ui/home/__screenshots__/Stats.pw.tsx_mobile_4-items-default-view-mobile---default-1.png and b/ui/home/__screenshots__/Stats.pw.tsx_mobile_4-items-default-view-mobile---default-1.png differ
diff --git a/ui/home/__screenshots__/Stats.pw.tsx_mobile_all-items-mobile-dark-mode-1.png b/ui/home/__screenshots__/Stats.pw.tsx_mobile_all-items-mobile-dark-mode-1.png
index d6cb844830..746912ab38 100644
Binary files a/ui/home/__screenshots__/Stats.pw.tsx_mobile_all-items-mobile-dark-mode-1.png and b/ui/home/__screenshots__/Stats.pw.tsx_mobile_all-items-mobile-dark-mode-1.png differ
diff --git a/ui/home/indicators/ChainIndicatorChart.tsx b/ui/home/indicators/ChainIndicatorChart.tsx
index 46f3cd64a6..6b0bc24fdb 100644
--- a/ui/home/indicators/ChainIndicatorChart.tsx
+++ b/ui/home/indicators/ChainIndicatorChart.tsx
@@ -23,11 +23,11 @@ const ChainIndicatorChart = ({ data }: Props) => {
   const axesConfig = React.useMemo(() => {
     return {
       x: { ticks: 4 },
-      y: { ticks: 3, nice: true },
+      y: { ticks: 3, nice: true, noLabel: true },
     };
   }, [ ]);
 
-  const { rect, ref, axis, innerWidth, innerHeight } = useTimeChartController({
+  const { rect, ref, axes, innerWidth, innerHeight, chartMargin } = useTimeChartController({
     data,
     margin: CHART_MARGIN,
     axesConfig,
@@ -35,16 +35,16 @@ const ChainIndicatorChart = ({ data }: Props) => {
 
   return (
     <svg width="100%" height="100%" ref={ ref } cursor="pointer">
-      <g transform={ `translate(${ CHART_MARGIN?.left || 0 },${ CHART_MARGIN?.top || 0 })` } opacity={ rect ? 1 : 0 }>
+      <g transform={ `translate(${ chartMargin.left || 0 },${ chartMargin.top || 0 })` } opacity={ rect ? 1 : 0 }>
         <ChartArea
           data={ data[0].items }
-          xScale={ axis.x.scale }
-          yScale={ axis.y.scale }
+          xScale={ axes.x.scale }
+          yScale={ axes.y.scale }
         />
         <ChartLine
           data={ data[0].items }
-          xScale={ axis.x.scale }
-          yScale={ axis.y.scale }
+          xScale={ axes.x.scale }
+          yScale={ axes.y.scale }
           stroke={ lineColor }
           animation="left"
           strokeWidth={ 3 }
@@ -54,8 +54,8 @@ const ChainIndicatorChart = ({ data }: Props) => {
             anchorEl={ overlayRef.current }
             width={ innerWidth }
             height={ innerHeight }
-            xScale={ axis.x.scale }
-            yScale={ axis.y.scale }
+            xScale={ axes.x.scale }
+            yScale={ axes.y.scale }
             data={ data }
           />
         </ChartOverlay>
diff --git a/ui/home/indicators/ChainIndicatorChartContainer.tsx b/ui/home/indicators/ChainIndicatorChartContainer.tsx
index 95f4f34904..02912afe98 100644
--- a/ui/home/indicators/ChainIndicatorChartContainer.tsx
+++ b/ui/home/indicators/ChainIndicatorChartContainer.tsx
@@ -22,6 +22,10 @@ const ChainIndicatorChartContainer = ({ data, isError, isPending }: Props) => {
       return <DataFetchAlert/>;
     }
 
+    if (data[0].items.length === 0) {
+      return <span>no data</span>;
+    }
+
     return <ChainIndicatorChart data={ data }/>;
   })();
 
diff --git a/ui/home/indicators/ChainIndicatorItem.tsx b/ui/home/indicators/ChainIndicatorItem.tsx
index 5a96c11fe2..ae54e4fddc 100644
--- a/ui/home/indicators/ChainIndicatorItem.tsx
+++ b/ui/home/indicators/ChainIndicatorItem.tsx
@@ -7,18 +7,20 @@ import type { ChainIndicatorId } from 'types/homepage';
 
 import type { ResourceError } from 'lib/api/resources';
 import useIsMobile from 'lib/hooks/useIsMobile';
+import IconSvg from 'ui/shared/IconSvg';
 
 interface Props {
   id: ChainIndicatorId;
   title: string;
   value: (stats: HomeStats) => string;
+  valueDiff?: (stats?: HomeStats) => number | null | undefined;
   icon: React.ReactNode;
   isSelected: boolean;
   onClick: (id: ChainIndicatorId) => void;
   stats: UseQueryResult<HomeStats, ResourceError<unknown>>;
 }
 
-const ChainIndicatorItem = ({ id, title, value, icon, isSelected, onClick, stats }: Props) => {
+const ChainIndicatorItem = ({ id, title, value, valueDiff, icon, isSelected, onClick, stats }: Props) => {
   const isMobile = useIsMobile();
 
   const activeBgColorDesktop = useColorModeValue('white', 'gray.900');
@@ -34,7 +36,7 @@ const ChainIndicatorItem = ({ id, title, value, icon, isSelected, onClick, stats
       return null;
     }
 
-    if (stats.isPending) {
+    if (stats.isPlaceholderData) {
       return (
         <Skeleton
           h={ 3 }
@@ -46,13 +48,32 @@ const ChainIndicatorItem = ({ id, title, value, icon, isSelected, onClick, stats
       );
     }
 
-    if (stats.isError) {
+    if (!stats.data) {
       return <Text variant="secondary" fontWeight={ 400 }>no data</Text>;
     }
 
     return <Text variant="secondary" fontWeight={ 600 }>{ value(stats.data) }</Text>;
   })();
 
+  const valueDiffContent = (() => {
+    if (isMobile || !valueDiff) {
+      return null;
+    }
+    const diff = valueDiff(stats.data);
+    if (diff === undefined || diff === null) {
+      return null;
+    }
+
+    const diffColor = diff >= 0 ? 'green.500' : 'red.500';
+
+    return (
+      <Skeleton isLoaded={ !stats.isPlaceholderData } ml={ 3 } display="flex" alignItems="center" color={ diffColor }>
+        <IconSvg name="up" boxSize={ 5 } mr={ 1 } transform={ diff < 0 ? 'rotate(180deg)' : 'rotate(0)' }/>
+        <Text color={ diffColor } fontWeight={ 600 }>{ diff }%</Text>
+      </Skeleton>
+    );
+  })();
+
   return (
     <Flex
       alignItems="center"
@@ -73,7 +94,10 @@ const ChainIndicatorItem = ({ id, title, value, icon, isSelected, onClick, stats
       { icon }
       <Box>
         <Text fontFamily="heading" fontWeight={ 500 }>{ title }</Text>
-        { valueContent }
+        <Flex alignItems="center">
+          { valueContent }
+          { valueDiffContent }
+        </Flex>
       </Box>
     </Flex>
   );
diff --git a/ui/home/indicators/ChainIndicators.pw.tsx b/ui/home/indicators/ChainIndicators.pw.tsx
index 59181fce54..23f5438277 100644
--- a/ui/home/indicators/ChainIndicators.pw.tsx
+++ b/ui/home/indicators/ChainIndicators.pw.tsx
@@ -10,8 +10,8 @@ import buildApiUrl from 'playwright/utils/buildApiUrl';
 
 import ChainIndicators from './ChainIndicators';
 
-const STATS_API_URL = buildApiUrl('homepage_stats');
-const TX_CHART_API_URL = buildApiUrl('homepage_chart_txs');
+const STATS_API_URL = buildApiUrl('stats');
+const TX_CHART_API_URL = buildApiUrl('stats_charts_txs');
 
 const test = base.extend({
   context: contextWithEnvs([
@@ -53,3 +53,44 @@ test.describe('daily txs chart', () => {
     });
   });
 });
+
+test('partial data', async({ page, mount }) => {
+  await page.route(STATS_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(statsMock.base),
+  }));
+  await page.route(TX_CHART_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(dailyTxsMock.partialData),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <ChainIndicators/>
+    </TestApp>,
+  );
+  await page.waitForFunction(() => {
+    return document.querySelector('path[data-name="gradient-chart-area"]')?.getAttribute('opacity') === '1';
+  });
+
+  await expect(component).toHaveScreenshot();
+});
+
+test('no data', async({ page, mount }) => {
+  await page.route(STATS_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(statsMock.noChartData),
+  }));
+  await page.route(TX_CHART_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(dailyTxsMock.noData),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <ChainIndicators/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/home/indicators/ChainIndicators.tsx b/ui/home/indicators/ChainIndicators.tsx
index d40148e763..0195d5dc1a 100644
--- a/ui/home/indicators/ChainIndicators.tsx
+++ b/ui/home/indicators/ChainIndicators.tsx
@@ -1,9 +1,11 @@
-import { Flex, Skeleton, Text, useColorModeValue } from '@chakra-ui/react';
+import { Box, Flex, Skeleton, Text, useColorModeValue } from '@chakra-ui/react';
 import React from 'react';
 
 import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';
+import { HOMEPAGE_STATS } from 'stubs/stats';
 import Hint from 'ui/shared/Hint';
+import IconSvg from 'ui/shared/IconSvg';
 
 import ChainIndicatorChartContainer from './ChainIndicatorChartContainer';
 import ChainIndicatorItem from './ChainIndicatorItem';
@@ -29,7 +31,12 @@ const ChainIndicators = () => {
   const indicator = indicators.find(({ id }) => id === selectedIndicator);
 
   const queryResult = useFetchChartData(indicator);
-  const statsQueryResult = useApiQuery('homepage_stats');
+  const statsQueryResult = useApiQuery('stats', {
+    queryOptions: {
+      refetchOnMount: false,
+      placeholderData: HOMEPAGE_STATS,
+    },
+  });
 
   const bgColorDesktop = useColorModeValue('white', 'gray.900');
   const bgColorMobile = useColorModeValue('white', 'black');
@@ -41,28 +48,48 @@ const ChainIndicators = () => {
   }
 
   const valueTitle = (() => {
-    if (statsQueryResult.isPending) {
+    if (statsQueryResult.isPlaceholderData) {
       return <Skeleton h="48px" w="215px" mt={ 3 } mb={ 4 }/>;
     }
 
-    if (statsQueryResult.isError) {
+    if (!statsQueryResult.data) {
       return <Text mt={ 3 } mb={ 4 }>There is no data</Text>;
     }
 
     return (
-      <Text fontWeight={ 600 } fontFamily="heading" fontSize="48px" lineHeight="48px" mt={ 3 } mb={ 4 }>
+      <Text fontWeight={ 600 } fontFamily="heading" fontSize="48px" lineHeight="48px" mt={ 3 }>
         { indicator?.value(statsQueryResult.data) }
       </Text>
     );
   })();
 
+  const valueDiff = (() => {
+    if (!statsQueryResult.data || !indicator?.valueDiff) {
+      return null;
+    }
+
+    const diff = indicator.valueDiff(statsQueryResult.data);
+    if (diff === undefined || diff === null) {
+      return null;
+    }
+
+    const diffColor = diff >= 0 ? 'green.500' : 'red.500';
+
+    return (
+      <Skeleton isLoaded={ !statsQueryResult.isPlaceholderData } display="flex" alignItems="center" color={ diffColor } mt={ 2 }>
+        <IconSvg name="up" boxSize={ 5 } mr={ 1 } transform={ diff < 0 ? 'rotate(180deg)' : 'rotate(0)' }/>
+        <Text color={ diffColor } fontWeight={ 600 }>{ diff }%</Text>
+      </Skeleton>
+    );
+  })();
+
   return (
     <Flex
       p={{ base: 0, lg: 8 }}
       borderRadius={{ base: 'none', lg: 'lg' }}
       boxShadow={{ base: 'none', lg: 'xl' }}
       bgColor={{ base: bgColorMobile, lg: bgColorDesktop }}
-      columnGap={ 12 }
+      columnGap={ 6 }
       rowGap={ 0 }
       flexDir={{ base: 'column', lg: 'row' }}
       w="100%"
@@ -74,7 +101,10 @@ const ChainIndicators = () => {
           <Text fontWeight={ 500 } fontFamily="heading" fontSize="lg">{ indicator?.title }</Text>
           { indicator?.hint && <Hint label={ indicator.hint } ml={ 1 }/> }
         </Flex>
-        { valueTitle }
+        <Box mb={ 4 }>
+          { valueTitle }
+          { valueDiff }
+        </Box>
         <ChainIndicatorChartContainer { ...queryResult }/>
       </Flex>
       { indicators.length > 1 && (
diff --git a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_daily-txs-chart-dark-mode-mobile-1.png b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_daily-txs-chart-dark-mode-mobile-1.png
index b354bd5198..f0bd10b718 100644
Binary files a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_daily-txs-chart-dark-mode-mobile-1.png and b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_daily-txs-chart-dark-mode-mobile-1.png differ
diff --git a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_daily-txs-chart-mobile-1.png b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_daily-txs-chart-mobile-1.png
index c2b269b416..24d453ca53 100644
Binary files a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_daily-txs-chart-mobile-1.png and b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_daily-txs-chart-mobile-1.png differ
diff --git a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_no-data-1.png b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_no-data-1.png
new file mode 100644
index 0000000000..e54da4cf27
Binary files /dev/null and b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_no-data-1.png differ
diff --git a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_partial-data-1.png b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_partial-data-1.png
new file mode 100644
index 0000000000..671945380b
Binary files /dev/null and b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_default_partial-data-1.png differ
diff --git a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_mobile_daily-txs-chart-dark-mode-mobile-1.png b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_mobile_daily-txs-chart-dark-mode-mobile-1.png
index 9a1b5d6269..5049e90c57 100644
Binary files a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_mobile_daily-txs-chart-dark-mode-mobile-1.png and b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_mobile_daily-txs-chart-dark-mode-mobile-1.png differ
diff --git a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_mobile_daily-txs-chart-mobile-1.png b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_mobile_daily-txs-chart-mobile-1.png
index 8c76d6185c..31472481b5 100644
Binary files a/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_mobile_daily-txs-chart-mobile-1.png and b/ui/home/indicators/__screenshots__/ChainIndicators.pw.tsx_mobile_daily-txs-chart-mobile-1.png differ
diff --git a/ui/home/indicators/types.ts b/ui/home/indicators/types.ts
index 1a4b4d1fc7..7ae2453ada 100644
--- a/ui/home/indicators/types.ts
+++ b/ui/home/indicators/types.ts
@@ -4,12 +4,13 @@ import type { TimeChartData } from 'ui/shared/chart/types';
 
 import type { ResourcePayload } from 'lib/api/resources';
 
-export type ChartsResources = 'homepage_chart_txs' | 'homepage_chart_market';
+export type ChartsResources = 'stats_charts_txs' | 'stats_charts_market';
 
 export interface TChainIndicator<R extends ChartsResources> {
   id: ChainIndicatorId;
   title: string;
   value: (stats: HomeStats) => string;
+  valueDiff?: (stats?: HomeStats) => number | null | undefined;
   icon: React.ReactNode;
   hint?: string;
   api: {
diff --git a/ui/home/indicators/useFetchChartData.tsx b/ui/home/indicators/useFetchChartData.tsx
index 1e7def5c96..ffebc2b685 100644
--- a/ui/home/indicators/useFetchChartData.tsx
+++ b/ui/home/indicators/useFetchChartData.tsx
@@ -8,7 +8,7 @@ import type { ResourcePayload } from 'lib/api/resources';
 import useApiQuery from 'lib/api/useApiQuery';
 
 export default function useFetchChartData<R extends ChartsResources>(indicator: TChainIndicator<R> | undefined): UseQueryResult<TimeChartData> {
-  const queryResult = useApiQuery(indicator?.api.resourceName || 'homepage_chart_txs', {
+  const queryResult = useApiQuery(indicator?.api.resourceName || 'stats_charts_txs', {
     queryOptions: { enabled: Boolean(indicator) },
   });
 
diff --git a/ui/home/indicators/utils/indicators.tsx b/ui/home/indicators/utils/indicators.tsx
index 39c4cbbcca..62783b7bee 100644
--- a/ui/home/indicators/utils/indicators.tsx
+++ b/ui/home/indicators/utils/indicators.tsx
@@ -1,24 +1,39 @@
 import React from 'react';
 
 import type { TChainIndicator } from '../types';
+import type { TimeChartItem, TimeChartItemRaw } from 'ui/shared/chart/types';
 
 import config from 'configs/app';
 import { sortByDateDesc } from 'ui/shared/chart/utils/sorts';
 import * as TokenEntity from 'ui/shared/entities/token/TokenEntity';
 import IconSvg from 'ui/shared/IconSvg';
 
-const dailyTxsIndicator: TChainIndicator<'homepage_chart_txs'> = {
+const nonNullTailReducer = (result: Array<TimeChartItemRaw>, item: TimeChartItemRaw) => {
+  if (item.value === null && result.length === 0) {
+    return result;
+  }
+  result.unshift(item);
+  return result;
+};
+
+const mapNullToZero: (item: TimeChartItemRaw) => TimeChartItem = (item) => ({ ...item, value: Number(item.value) });
+
+const dailyTxsIndicator: TChainIndicator<'stats_charts_txs'> = {
   id: 'daily_txs',
   title: 'Daily transactions',
-  value: (stats) => Number(stats.transactions_today).toLocaleString(undefined, { maximumFractionDigits: 2, notation: 'compact' }),
+  value: (stats) => stats.transactions_today === null ?
+    'N/A' :
+    Number(stats.transactions_today).toLocaleString(undefined, { maximumFractionDigits: 2, notation: 'compact' }),
   icon: <IconSvg name="transactions" boxSize={ 6 } bgColor="#56ACD1" borderRadius="base" color="white"/>,
   hint: `Number of transactions yesterday (0:00 - 23:59 UTC). The chart displays daily transactions for the past 30 days.`,
   api: {
-    resourceName: 'homepage_chart_txs',
+    resourceName: 'stats_charts_txs',
     dataFn: (response) => ([ {
       items: response.chart_data
         .map((item) => ({ date: new Date(item.date), value: item.tx_count }))
-        .sort(sortByDateDesc),
+        .sort(sortByDateDesc)
+        .reduceRight(nonNullTailReducer, [] as Array<TimeChartItemRaw>)
+        .map(mapNullToZero),
       name: 'Tx/day',
       valueFormatter: (x: number) => x.toLocaleString(undefined, { maximumFractionDigits: 2, notation: 'compact' }),
     } ]),
@@ -33,64 +48,87 @@ const nativeTokenData = {
   type: 'ERC-20' as const,
 };
 
-const coinPriceIndicator: TChainIndicator<'homepage_chart_market'> = {
+const coinPriceIndicator: TChainIndicator<'stats_charts_market'> = {
   id: 'coin_price',
   title: `${ config.chain.governanceToken.symbol || config.chain.currency.symbol } price`,
-  value: (stats) => '$' + Number(stats.coin_price).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 6 }),
+  value: (stats) => stats.coin_price === null ?
+    '$N/A' :
+    '$' + Number(stats.coin_price).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 6 }),
+  valueDiff: (stats) => stats?.coin_price !== null ? stats?.coin_price_change_percentage : null,
   icon: <TokenEntity.Icon token={ nativeTokenData } boxSize={ 6 } marginRight={ 0 }/>,
   hint: `${ config.chain.governanceToken.symbol || config.chain.currency.symbol } token daily price in USD.`,
   api: {
-    resourceName: 'homepage_chart_market',
+    resourceName: 'stats_charts_market',
     dataFn: (response) => ([ {
       items: response.chart_data
-        .map((item) => ({ date: new Date(item.date), value: Number(item.closing_price) }))
-        .sort(sortByDateDesc),
+        .map((item) => ({ date: new Date(item.date), value: item.closing_price }))
+        .sort(sortByDateDesc)
+        .reduceRight(nonNullTailReducer, [] as Array<TimeChartItemRaw>)
+        .map(mapNullToZero),
       name: `${ config.chain.governanceToken.symbol || config.chain.currency.symbol } price`,
       valueFormatter: (x: number) => '$' + x.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 6 }),
     } ]),
   },
 };
 
-const marketPriceIndicator: TChainIndicator<'homepage_chart_market'> = {
+const marketPriceIndicator: TChainIndicator<'stats_charts_market'> = {
   id: 'market_cap',
   title: 'Market cap',
-  value: (stats) => '$' + Number(stats.market_cap).toLocaleString(undefined, { maximumFractionDigits: 0, notation: 'compact' }),
+  value: (stats) => stats.market_cap === null ?
+    '$N/A' :
+    '$' + Number(stats.market_cap).toLocaleString(undefined, { maximumFractionDigits: 2, notation: 'compact' }),
   icon: <IconSvg name="globe" boxSize={ 6 } bgColor="#6A5DCC" borderRadius="base" color="white"/>,
   // eslint-disable-next-line max-len
   hint: 'The total market value of a cryptocurrency\'s circulating supply. It is analogous to the free-float capitalization in the stock market. Market Cap = Current Price x Circulating Supply.',
   api: {
-    resourceName: 'homepage_chart_market',
+    resourceName: 'stats_charts_market',
     dataFn: (response) => ([ {
       items: response.chart_data
         .map((item) => (
           {
             date: new Date(item.date),
-            value: item.market_cap ? Number(item.market_cap) : Number(item.closing_price) * Number(response.available_supply),
+            value: (() => {
+              if (item.market_cap !== undefined) {
+                return item.market_cap;
+              }
+
+              if (item.closing_price === null) {
+                return null;
+              }
+
+              return Number(item.closing_price) * Number(response.available_supply);
+            })(),
           }))
-        .sort(sortByDateDesc),
+        .sort(sortByDateDesc)
+        .reduceRight(nonNullTailReducer, [] as Array<TimeChartItemRaw>)
+        .map(mapNullToZero),
       name: 'Market cap',
-      valueFormatter: (x: number) => '$' + x.toLocaleString(undefined, { maximumFractionDigits: 0 }),
+      valueFormatter: (x: number) => '$' + x.toLocaleString(undefined, { maximumFractionDigits: 2 }),
     } ]),
   },
 };
 
-const tvlIndicator: TChainIndicator<'homepage_chart_market'> = {
+const tvlIndicator: TChainIndicator<'stats_charts_market'> = {
   id: 'tvl',
   title: 'Total value locked',
-  value: (stats) => '$' + Number(stats.tvl).toLocaleString(undefined, { maximumFractionDigits: 2, notation: 'compact' }),
+  value: (stats) => stats.tvl === null ?
+    '$N/A' :
+    '$' + Number(stats.tvl).toLocaleString(undefined, { maximumFractionDigits: 2, notation: 'compact' }),
   icon: <IconSvg name="lock" boxSize={ 6 } bgColor="#517FDB" borderRadius="base" color="white"/>,
   // eslint-disable-next-line max-len
   hint: 'Total value of digital assets locked or staked in a chain',
   api: {
-    resourceName: 'homepage_chart_market',
+    resourceName: 'stats_charts_market',
     dataFn: (response) => ([ {
       items: response.chart_data
         .map((item) => (
           {
             date: new Date(item.date),
-            value: item.tvl ? Number(item.tvl) : 0,
+            value: item.tvl !== undefined ? item.tvl : 0,
           }))
-        .sort(sortByDateDesc),
+        .sort(sortByDateDesc)
+        .reduceRight(nonNullTailReducer, [] as Array<TimeChartItemRaw>)
+        .map(mapNullToZero),
       name: 'TVL',
       valueFormatter: (x: number) => '$' + x.toLocaleString(undefined, { maximumFractionDigits: 2, notation: 'compact' }),
     } ]),
diff --git a/ui/marketplace/AppSecurityReport.tsx b/ui/marketplace/AppSecurityReport.tsx
new file mode 100644
index 0000000000..35301af312
--- /dev/null
+++ b/ui/marketplace/AppSecurityReport.tsx
@@ -0,0 +1,82 @@
+import { Box, Text, Link, Popover, PopoverTrigger, PopoverBody, PopoverContent, useDisclosure } from '@chakra-ui/react';
+import React from 'react';
+
+import type { MarketplaceAppSecurityReport } from 'types/client/marketplace';
+
+import config from 'configs/app';
+import { apos } from 'lib/html-entities';
+import * as mixpanel from 'lib/mixpanel/index';
+import IconSvg from 'ui/shared/IconSvg';
+import SolidityscanReportButton from 'ui/shared/solidityscanReport/SolidityscanReportButton';
+import SolidityscanReportDetails from 'ui/shared/solidityscanReport/SolidityscanReportDetails';
+import SolidityscanReportScore from 'ui/shared/solidityscanReport/SolidityscanReportScore';
+
+type Props = {
+  id: string;
+  securityReport?: MarketplaceAppSecurityReport;
+  height?: string | undefined;
+  showContractList: () => void;
+  isLoading?: boolean;
+  onlyIcon?: boolean;
+  source: 'Security view' | 'App modal' | 'App page';
+}
+
+const AppSecurityReport = ({ id, securityReport, height, showContractList, isLoading, onlyIcon, source }: Props) => {
+  const { isOpen, onToggle, onClose } = useDisclosure();
+
+  const handleButtonClick = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Security score', Info: id, Source: source });
+    onToggle();
+  }, [ id, source, onToggle ]);
+
+  const handleLinkClick = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Analyzed contracts', Info: id, Source: 'Security score popup' });
+    showContractList();
+  }, [ id, showContractList ]);
+
+  if (!securityReport && !isLoading) {
+    return null;
+  }
+
+  const {
+    securityScore = 0,
+    solidityScanContractsNumber = 0,
+    issueSeverityDistribution = {} as MarketplaceAppSecurityReport['overallInfo']['issueSeverityDistribution'],
+    totalIssues = 0,
+  } = securityReport?.overallInfo || {};
+
+  return (
+    <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy>
+      <PopoverTrigger>
+        <SolidityscanReportButton
+          score={ securityScore }
+          isLoading={ isLoading }
+          onClick={ handleButtonClick }
+          height={ height }
+          onlyIcon={ onlyIcon }
+        />
+      </PopoverTrigger>
+      <PopoverContent w={{ base: '100vw', lg: '328px' }}>
+        <PopoverBody px="26px" py="20px" fontSize="sm">
+          <Box mb={ 5 }>
+            { solidityScanContractsNumber } smart contract{ solidityScanContractsNumber === 1 ? ' was' : 's were' } evaluated to determine
+            this protocol{ apos }s overall security score on the { config.chain.name } network.
+          </Box>
+          <SolidityscanReportScore score={ securityScore } mb={ 5 }/>
+          { issueSeverityDistribution && totalIssues > 0 && (
+            <Box mb={ 5 }>
+              <Text py="7px" variant="secondary" fontSize="xs" fontWeight={ 500 }>Threat score & vulnerabilities</Text>
+              <SolidityscanReportDetails vulnerabilities={ issueSeverityDistribution } vulnerabilitiesCount={ totalIssues }/>
+            </Box>
+          ) }
+          <Link onClick={ handleLinkClick } display="inline-flex" alignItems="center">
+            Analyzed contracts
+            <IconSvg name="arrows/north-east" boxSize={ 5 } color="gray.400"/>
+          </Link>
+        </PopoverBody>
+      </PopoverContent>
+    </Popover>
+  );
+};
+
+export default AppSecurityReport;
diff --git a/ui/marketplace/ContractListButton.tsx b/ui/marketplace/ContractListButton.tsx
new file mode 100644
index 0000000000..6a8bfce05e
--- /dev/null
+++ b/ui/marketplace/ContractListButton.tsx
@@ -0,0 +1,66 @@
+import { Link, Tooltip, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+import type { MouseEvent } from 'react';
+
+import config from 'configs/app';
+import IconSvg from 'ui/shared/IconSvg';
+
+export enum ContractListButtonVariants {
+  ALL_CONTRACTS = 'all contracts',
+  VERIFIED_CONTRACTS = 'verified contracts',
+}
+
+const values = {
+  [ContractListButtonVariants.ALL_CONTRACTS]: {
+    icon: 'contracts' as const,
+    iconColor: 'gray.500',
+    tooltip: `Total number of contracts deployed by the protocol on ${ config.chain.name }`,
+  },
+  [ContractListButtonVariants.VERIFIED_CONTRACTS]: {
+    icon: 'contracts_verified' as const,
+    iconColor: 'green.500',
+    tooltip: `Number of verified contracts on ${ config.chain.name }`,
+  },
+};
+
+interface Props {
+  children: string | number;
+  onClick: (event: MouseEvent) => void;
+  variant: ContractListButtonVariants;
+  isLoading?: boolean;
+}
+
+const ContractListButton = ({ children, onClick, variant, isLoading }: Props) => {
+  const { icon, iconColor, tooltip } = values[variant];
+  return (
+    <Tooltip
+      label={ tooltip }
+      textAlign="center"
+      padding={ 2 }
+      isDisabled={ !tooltip }
+      openDelay={ 500 }
+      width="250px"
+    >
+      <Skeleton
+        isLoaded={ !isLoading }
+        display="inline-flex"
+        alignItems="center"
+        width={ isLoading ? '40px' : 'auto' }
+        height="30px"
+        borderRadius="base"
+      >
+        <Link
+          fontSize="sm"
+          onClick={ onClick }
+          fontWeight="500"
+          display="inline-flex"
+        >
+          { icon && <IconSvg name={ icon } boxSize={ 5 } color={ iconColor } mr={ 1 }/> }
+          { children }
+        </Link>
+      </Skeleton>
+    </Tooltip>
+  );
+};
+
+export default ContractListButton;
diff --git a/ui/marketplace/ContractListModal.tsx b/ui/marketplace/ContractListModal.tsx
new file mode 100644
index 0000000000..090c73891e
--- /dev/null
+++ b/ui/marketplace/ContractListModal.tsx
@@ -0,0 +1,119 @@
+import {
+  Box, Modal, Text, ModalBody,
+  ModalCloseButton, ModalContent, ModalHeader, ModalOverlay,
+} from '@chakra-ui/react';
+import React from 'react';
+
+import type { MarketplaceAppSecurityReport } from 'types/client/marketplace';
+import { ContractListTypes } from 'types/client/marketplace';
+
+import useIsMobile from 'lib/hooks/useIsMobile';
+import { apos } from 'lib/html-entities';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import IconSvg from 'ui/shared/IconSvg';
+
+import ContractSecurityReport from './ContractSecurityReport';
+
+type Props = {
+  onClose: () => void;
+  onBack?: () => void;
+  type: ContractListTypes;
+  contracts?: MarketplaceAppSecurityReport['contractsData'];
+}
+
+const titles = {
+  [ContractListTypes.ALL]: `All app${ apos }s smart contracts`,
+  [ContractListTypes.ANALYZED]: 'Analyzed contracts',
+  [ContractListTypes.VERIFIED]: 'Verified contracts',
+};
+
+const ContractListModal = ({ onClose, onBack, type, contracts }: Props) => {
+  const isMobile = useIsMobile();
+
+  const displayedContracts = React.useMemo(() => {
+    if (!contracts) {
+      return [];
+    }
+    switch (type) {
+      default:
+      case ContractListTypes.ALL:
+        return contracts;
+      case ContractListTypes.ANALYZED:
+        return contracts
+          .filter((contract) => Boolean(contract.solidityScanReport))
+          .sort((a, b) =>
+            (parseFloat(b.solidityScanReport?.scan_summary.score_v2 ?? '0')) - (parseFloat(a.solidityScanReport?.scan_summary.score_v2 ?? '0')),
+          );
+      case ContractListTypes.VERIFIED:
+        return contracts.filter((contract) => contract.isVerified);
+    }
+  }, [ contracts, type ]);
+
+  if (!contracts) {
+    return null;
+  }
+
+  return (
+    <Modal
+      isOpen={ Boolean(type) }
+      onClose={ onClose }
+      size={ isMobile ? 'full' : 'md' }
+      isCentered
+    >
+      <ModalOverlay/>
+      <ModalContent>
+        <ModalHeader display="flex" alignItems="center" mb={ 4 }>
+          { onBack && (
+            <IconSvg
+              name="arrows/east"
+              w={ 6 }
+              h={ 10 }
+              transform="rotate(180deg)"
+              verticalAlign="middle"
+              color="gray.400"
+              mr={ 3 }
+              cursor="pointer"
+              onClick={ onBack }
+            />
+          ) }
+          <Text fontWeight="500" textStyle="h3">
+            { titles[type] }
+          </Text>
+        </ModalHeader>
+        <ModalCloseButton/>
+        <ModalBody
+          maxH={ isMobile ? 'auto' : '352px' }
+          overflow="scroll"
+          mb={ 0 }
+          display="grid"
+          gridTemplateColumns="max-content 1fr"
+          rowGap={ 2 }
+          columnGap={ type === ContractListTypes.ANALYZED ? 4 : 0 }
+        >
+          { displayedContracts.map((contract) => (
+            <React.Fragment key={ contract.address }>
+              { type === ContractListTypes.ANALYZED && (
+                <Box gridColumn={ 1 }>
+                  <ContractSecurityReport securityReport={ contract.solidityScanReport }/>
+                </Box>
+              ) }
+              <AddressEntity
+                address={{
+                  hash: contract.address,
+                  name: contract.solidityScanReport?.contractname,
+                  is_contract: true,
+                  is_verified: contract.isVerified,
+                }}
+                noCopy
+                gridColumn={ 2 }
+                height="32px"
+              />
+            </React.Fragment>
+          )) }
+        </ModalBody>
+      </ModalContent>
+    </Modal>
+  );
+};
+
+export default ContractListModal;
diff --git a/ui/marketplace/ContractSecurityReport.tsx b/ui/marketplace/ContractSecurityReport.tsx
new file mode 100644
index 0000000000..42e28b06dd
--- /dev/null
+++ b/ui/marketplace/ContractSecurityReport.tsx
@@ -0,0 +1,64 @@
+import { Box, Text, Popover, PopoverTrigger, PopoverBody, PopoverContent, useDisclosure } from '@chakra-ui/react';
+import React from 'react';
+
+import type { SolidityscanReport } from 'types/api/contract';
+
+import config from 'configs/app';
+import * as mixpanel from 'lib/mixpanel/index';
+import LinkExternal from 'ui/shared/LinkExternal';
+import SolidityscanReportButton from 'ui/shared/solidityscanReport/SolidityscanReportButton';
+import SolidityscanReportDetails from 'ui/shared/solidityscanReport/SolidityscanReportDetails';
+import SolidityscanReportScore from 'ui/shared/solidityscanReport/SolidityscanReportScore';
+
+type Props = {
+  securityReport?: SolidityscanReport['scan_report'] | null;
+}
+
+const ContractSecurityReport = ({ securityReport }: Props) => {
+  const { isOpen, onToggle, onClose } = useDisclosure();
+
+  const handleClick = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Security score', Source: 'Analyzed contracts popup' });
+    onToggle();
+  }, [ onToggle ]);
+
+  if (!securityReport) {
+    return null;
+  }
+
+  const url = securityReport?.scanner_reference_url;
+  const {
+    score_v2: securityScore,
+    issue_severity_distribution: issueSeverityDistribution,
+  } = securityReport.scan_summary;
+
+  const totalIssues = Object.values(issueSeverityDistribution as Record<string, number>).reduce((acc, val) => acc + val, 0);
+
+  return (
+    <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy>
+      <PopoverTrigger>
+        <SolidityscanReportButton
+          score={ parseFloat(securityScore) }
+          onClick={ handleClick }
+        />
+      </PopoverTrigger>
+      <PopoverContent w={{ base: '100vw', lg: '328px' }}>
+        <PopoverBody px="26px" py="20px" fontSize="sm">
+          <Box mb={ 5 }>
+            The security score was derived from evaluating the smart contracts of a protocol on the { config.chain.name } network.
+          </Box>
+          <SolidityscanReportScore score={ parseFloat(securityScore) } mb={ 5 }/>
+          { issueSeverityDistribution && totalIssues > 0 && (
+            <Box mb={ 5 }>
+              <Text py="7px" variant="secondary" fontSize="xs" fontWeight={ 500 }>Threat score & vulnerabilities</Text>
+              <SolidityscanReportDetails vulnerabilities={ issueSeverityDistribution } vulnerabilitiesCount={ totalIssues }/>
+            </Box>
+          ) }
+          <LinkExternal href={ url }>View full report</LinkExternal>
+        </PopoverBody>
+      </PopoverContent>
+    </Popover>
+  );
+};
+
+export default ContractSecurityReport;
diff --git a/ui/marketplace/EmptySearchResult.tsx b/ui/marketplace/EmptySearchResult.tsx
new file mode 100644
index 0000000000..d3ccf59701
--- /dev/null
+++ b/ui/marketplace/EmptySearchResult.tsx
@@ -0,0 +1,41 @@
+import React from 'react';
+
+import { MarketplaceCategory } from 'types/client/marketplace';
+
+import config from 'configs/app';
+import { apos } from 'lib/html-entities';
+import EmptySearchResultDefault from 'ui/shared/EmptySearchResult';
+import IconSvg from 'ui/shared/IconSvg';
+import LinkExternal from 'ui/shared/LinkExternal';
+
+const feature = config.features.marketplace;
+
+type Props = {
+  favoriteApps: Array<string>;
+  selectedCategoryId?: string;
+}
+
+const EmptySearchResult = ({ favoriteApps, selectedCategoryId }: Props) => (
+  <EmptySearchResultDefault
+    text={
+      (selectedCategoryId === MarketplaceCategory.FAVORITES && !favoriteApps.length) ? (
+        <>
+          You don{ apos }t have any favorite apps.
+          Click on the <IconSvg name="star_outline" w={ 4 } h={ 4 } mb={ -0.5 }/> icon on the app{ apos }s card to add it to Favorites.
+        </>
+      ) : (
+        <>
+          No matching apps found.
+          { 'suggestIdeasFormUrl' in feature && (
+            <>
+              { ' ' }Have a groundbreaking idea or app suggestion?{ ' ' }
+              <LinkExternal href={ feature.suggestIdeasFormUrl }>Share it with us</LinkExternal>
+            </>
+          ) }
+        </>
+      )
+    }
+  />
+);
+
+export default React.memo(EmptySearchResult);
diff --git a/ui/marketplace/MarketplaceAppAlert.tsx b/ui/marketplace/MarketplaceAppAlert.tsx
new file mode 100644
index 0000000000..88436a603d
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppAlert.tsx
@@ -0,0 +1,51 @@
+import { Alert } from '@chakra-ui/react';
+import React from 'react';
+
+import type { IconName } from 'ui/shared/IconSvg';
+import IconSvg from 'ui/shared/IconSvg';
+
+type Props = {
+  internalWallet: boolean | undefined;
+  isWalletConnected: boolean;
+}
+
+const MarketplaceAppAlert = ({ internalWallet, isWalletConnected }: Props) => {
+  const message = React.useMemo(() => {
+    let icon: IconName = 'wallet';
+    let text = 'Connect your wallet to Blockscout for full-featured access';
+    let status: 'warning' | 'success' = 'warning';
+
+    if (isWalletConnected && internalWallet) {
+      icon = 'integration/full';
+      text = 'Your wallet is connected with Blockscout';
+      status = 'success';
+    } else if (!internalWallet) {
+      icon = 'integration/partial';
+      text = 'Connect your wallet in the app below';
+    }
+
+    return { icon, text, status };
+  }, [ isWalletConnected, internalWallet ]);
+
+  return (
+    <Alert
+      status={ message.status }
+      borderRadius="base"
+      px={ 3 }
+      py={{ base: 3, md: 1.5 }}
+      fontSize="sm"
+      lineHeight={ 5 }
+    >
+      <IconSvg
+        name={ message.icon }
+        color={ message.status === 'success' ? 'green.600' : 'current' }
+        boxSize={ 5 }
+        flexShrink={ 0 }
+        mr={ 2 }
+      />
+      { message.text }
+    </Alert>
+  );
+};
+
+export default MarketplaceAppAlert;
diff --git a/ui/marketplace/MarketplaceAppCard.tsx b/ui/marketplace/MarketplaceAppCard.tsx
index 249caa0bea..e387cb0809 100644
--- a/ui/marketplace/MarketplaceAppCard.tsx
+++ b/ui/marketplace/MarketplaceAppCard.tsx
@@ -4,16 +4,18 @@ import React, { useCallback } from 'react';
 
 import type { MarketplaceAppPreview } from 'types/client/marketplace';
 
+import * as mixpanel from 'lib/mixpanel/index';
 import IconSvg from 'ui/shared/IconSvg';
 
 import MarketplaceAppCardLink from './MarketplaceAppCardLink';
+import MarketplaceAppIntegrationIcon from './MarketplaceAppIntegrationIcon';
 
 interface Props extends MarketplaceAppPreview {
   onInfoClick: (id: string) => void;
   isFavorite: boolean;
-  onFavoriteClick: (id: string, isFavorite: boolean) => void;
+  onFavoriteClick: (id: string, isFavorite: boolean, source: 'Discovery view') => void;
   isLoading: boolean;
-  showDisclaimer: (id: string) => void;
+  onAppClick: (event: MouseEvent, id: string) => void;
 }
 
 const MarketplaceAppCard = ({
@@ -29,29 +31,22 @@ const MarketplaceAppCard = ({
   isFavorite,
   onFavoriteClick,
   isLoading,
-  showDisclaimer,
+  internalWallet,
+  onAppClick,
 }: Props) => {
   const categoriesLabel = categories.join(', ');
 
-  const handleClick = useCallback((event: MouseEvent) => {
-    const isShown = window.localStorage.getItem('marketplace-disclaimer-shown');
-    if (!isShown) {
-      event.preventDefault();
-      showDisclaimer(id);
-    }
-  }, [ showDisclaimer, id ]);
-
   const handleInfoClick = useCallback((event: MouseEvent) => {
     event.preventDefault();
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'More button', Info: id, Source: 'Discovery view' });
     onInfoClick(id);
   }, [ onInfoClick, id ]);
 
   const handleFavoriteClick = useCallback(() => {
-    onFavoriteClick(id, isFavorite);
+    onFavoriteClick(id, isFavorite, 'Discovery view');
   }, [ onFavoriteClick, id, isFavorite ]);
 
   const logoUrl = useColorModeValue(logo, logoDarkMode || logo);
-  const moreButtonBgGradient = `linear(to-r, ${ useColorModeValue('whiteAlpha.50', 'blackAlpha.50') }, ${ useColorModeValue('white', 'black') } 20%)`;
 
   return (
     <LinkBox
@@ -69,12 +64,14 @@ const MarketplaceAppCard = ({
       role="group"
     >
       <Box
-        display={{ base: 'grid', sm: 'block' }}
+        display={{ base: 'grid', sm: 'flex' }}
+        flexDirection="column"
         gridTemplateColumns={{ base: '64px 1fr', sm: '1fr' }}
         gridTemplateRows={{ base: 'none', sm: 'none' }}
-        gridRowGap={{ base: 2, sm: 'none' }}
-        gridColumnGap={{ base: 4, sm: 'none' }}
+        gridRowGap={{ base: 2, sm: 0 }}
+        gridColumnGap={{ base: 4, sm: 0 }}
         height="100%"
+        alignContent="start"
       >
         <Skeleton
           isLoaded={ !isLoading }
@@ -108,8 +105,9 @@ const MarketplaceAppCard = ({
             url={ url }
             external={ external }
             title={ title }
-            onClick={ handleClick }
+            onClick={ onAppClick }
           />
+          <MarketplaceAppIntegrationIcon external={ external } internalWallet={ internalWallet }/>
         </Skeleton>
 
         <Skeleton
@@ -125,44 +123,34 @@ const MarketplaceAppCard = ({
           isLoaded={ !isLoading }
           fontSize={{ base: 'xs', sm: 'sm' }}
           lineHeight="20px"
-          noOfLines={ 4 }
+          noOfLines={ 3 }
         >
           { shortDescription }
         </Skeleton>
 
         { !isLoading && (
           <Box
-            position="absolute"
-            right={{ base: 3, sm: '20px' }}
-            bottom={{ base: 3, sm: '20px' }}
-            paddingLeft={ 8 }
-            bgGradient={ moreButtonBgGradient }
+            display="flex"
+            position={{ base: 'absolute', sm: 'relative' }}
+            bottom={{ base: 3, sm: 0 }}
+            left={{ base: 3, sm: 0 }}
+            marginTop={{ base: 0, sm: 'auto' }}
+            paddingTop={{ base: 0, sm: 4 }}
           >
             <Link
               fontSize={{ base: 'xs', sm: 'sm' }}
-              display="flex"
-              alignItems="center"
               paddingRight={{ sm: 2 }}
-              maxW="100%"
-              overflow="hidden"
               href="#"
               onClick={ handleInfoClick }
             >
-            More
-
-              <IconSvg
-                name="arrows/north-east"
-                marginLeft={ 1 }
-                boxSize={ 4 }
-              />
+              More info
             </Link>
           </Box>
         ) }
 
         { !isLoading && (
           <IconButton
-            display={{ base: 'block', sm: isFavorite ? 'block' : 'none' }}
-            _groupHover={{ display: 'block' }}
+            display="block"
             position="absolute"
             right={{ base: 3, sm: '10px' }}
             top={{ base: 3, sm: '14px' }}
@@ -174,8 +162,8 @@ const MarketplaceAppCard = ({
             h={ 8 }
             onClick={ handleFavoriteClick }
             icon={ isFavorite ?
-              <IconSvg name="star_filled" w={ 4 } h={ 4 } color="yellow.400"/> :
-              <IconSvg name="star_outline" w={ 4 } h={ 4 } color="gray.300"/>
+              <IconSvg name="star_filled" w={ 5 } h={ 5 } color="yellow.400"/> :
+              <IconSvg name="star_outline" w={ 5 } h={ 5 } color="gray.400"/>
             }
           />
         ) }
diff --git a/ui/marketplace/MarketplaceAppCardLink.tsx b/ui/marketplace/MarketplaceAppCardLink.tsx
index 4fdf338e2e..6dd5853cd8 100644
--- a/ui/marketplace/MarketplaceAppCardLink.tsx
+++ b/ui/marketplace/MarketplaceAppCardLink.tsx
@@ -8,17 +8,21 @@ type Props = {
   url: string;
   external?: boolean;
   title: string;
-  onClick?: (event: MouseEvent) => void;
+  onClick?: (event: MouseEvent, id: string) => void;
 }
 
 const MarketplaceAppCardLink = ({ url, external, id, title, onClick }: Props) => {
+  const handleClick = React.useCallback((event: MouseEvent) => {
+    onClick?.(event, id);
+  }, [ onClick, id ]);
+
   return external ? (
-    <LinkOverlay href={ url } isExternal={ true }>
+    <LinkOverlay href={ url } isExternal={ true } marginRight={ 2 }>
       { title }
     </LinkOverlay>
   ) : (
     <NextLink href={{ pathname: '/apps/[id]', query: { id } }} passHref legacyBehavior>
-      <LinkOverlay onClick={ onClick }>
+      <LinkOverlay onClick={ handleClick } marginRight={ 2 }>
         { title }
       </LinkOverlay>
     </NextLink>
diff --git a/ui/marketplace/MarketplaceAppInfo.pw.tsx b/ui/marketplace/MarketplaceAppInfo.pw.tsx
new file mode 100644
index 0000000000..3419aaa5ec
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppInfo.pw.tsx
@@ -0,0 +1,35 @@
+import { test, expect, devices } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import { apps as appsMock } from 'mocks/apps/apps';
+import TestApp from 'playwright/TestApp';
+
+import MarketplaceAppInfo from './MarketplaceAppInfo';
+
+test('base view +@dark-mode', async({ mount, page }) => {
+  await mount(
+    <TestApp>
+      <MarketplaceAppInfo data={ appsMock[0] }/>
+    </TestApp>,
+  );
+
+  await page.getByText('Info').click();
+
+  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 500, height: 400 } });
+});
+
+test.describe('mobile', () => {
+  test.use({ viewport: devices['iPhone 13 Pro'].viewport });
+
+  test('base view', async({ mount, page }) => {
+    await mount(
+      <TestApp>
+        <MarketplaceAppInfo data={ appsMock[0] }/>
+      </TestApp>,
+    );
+
+    await page.getByLabel('Show project info').click();
+
+    await expect(page).toHaveScreenshot();
+  });
+});
diff --git a/ui/marketplace/MarketplaceAppInfo.tsx b/ui/marketplace/MarketplaceAppInfo.tsx
new file mode 100644
index 0000000000..00646e3291
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppInfo.tsx
@@ -0,0 +1,50 @@
+import {
+  Popover, PopoverTrigger, PopoverContent, PopoverBody,
+  Modal, ModalContent, ModalCloseButton, useDisclosure,
+} from '@chakra-ui/react';
+import React from 'react';
+
+import type { MarketplaceAppOverview } from 'types/client/marketplace';
+
+import useIsMobile from 'lib/hooks/useIsMobile';
+
+import Content from './MarketplaceAppInfo/Content';
+import TriggerButton from './MarketplaceAppInfo/TriggerButton';
+
+interface Props {
+  data: MarketplaceAppOverview | undefined;
+}
+
+const MarketplaceAppInfo = ({ data }: Props) => {
+  const isMobile = useIsMobile();
+  const { isOpen, onToggle, onClose } = useDisclosure();
+
+  if (isMobile) {
+    return (
+      <>
+        <TriggerButton onClick={ onToggle } onlyIcon/>
+        <Modal isOpen={ isOpen } onClose={ onClose } size="full">
+          <ModalContent>
+            <ModalCloseButton/>
+            <Content data={ data }/>
+          </ModalContent>
+        </Modal>
+      </>
+    );
+  }
+
+  return (
+    <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy>
+      <PopoverTrigger>
+        <TriggerButton onClick={ onToggle }/>
+      </PopoverTrigger>
+      <PopoverContent w="500px">
+        <PopoverBody px={ 6 } py={ 5 }>
+          <Content data={ data }/>
+        </PopoverBody>
+      </PopoverContent>
+    </Popover>
+  );
+};
+
+export default React.memo(MarketplaceAppInfo);
diff --git a/ui/marketplace/MarketplaceAppInfo/Content.tsx b/ui/marketplace/MarketplaceAppInfo/Content.tsx
new file mode 100644
index 0000000000..04b55b84b4
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppInfo/Content.tsx
@@ -0,0 +1,53 @@
+import { Flex, Text, Grid } from '@chakra-ui/react';
+import React from 'react';
+
+import type { MarketplaceAppOverview } from 'types/client/marketplace';
+
+import SocialLink from './SocialLink';
+import type { Props as SocialLinkProps } from './SocialLink';
+import WebsiteLink from './WebsiteLink';
+
+interface Props {
+  data: MarketplaceAppOverview | undefined;
+}
+
+const SOCIAL_LINKS: Array<Omit<SocialLinkProps, 'href'>> = [
+  { field: 'github', icon: 'social/github_filled', title: 'Github' },
+  { field: 'twitter', icon: 'social/twitter_filled', title: 'Twitter' },
+  { field: 'telegram', icon: 'social/telegram_filled', title: 'Telegram' },
+  { field: 'discord', icon: 'social/discord_filled', title: 'Discord' },
+];
+
+const Content = ({ data }: Props) => {
+  const socialLinks: Array<SocialLinkProps> = [];
+  SOCIAL_LINKS.forEach((link) => {
+    const href = data?.[link.field];
+    if (href) {
+      if (Array.isArray(href)) {
+        href.forEach((href) => socialLinks.push({ ...link, href }));
+      } else {
+        socialLinks.push({ ...link, href });
+      }
+    }
+  });
+
+  return (
+    <Flex fontSize="sm" flexDir="column" rowGap={ 5 }>
+      <div>
+        <Text variant="secondary" fontSize="xs">Project info</Text>
+        <Text fontSize="sm" mt={ 3 }>{ data?.shortDescription }</Text>
+        <WebsiteLink url={ data?.site }/>
+      </div>
+      { socialLinks.length > 0 && (
+        <div>
+          <Text variant="secondary" fontSize="xs">Links</Text>
+          <Grid templateColumns={{ base: 'repeat(2, 1fr)', lg: 'repeat(3, 1fr)' }} columnGap={ 4 } rowGap={ 3 } mt={ 3 }>
+            { socialLinks.map((link, index) => <SocialLink key={ index } { ...link }/>) }
+          </Grid>
+        </div>
+      ) }
+    </Flex>
+  );
+};
+
+export default Content;
diff --git a/ui/marketplace/MarketplaceAppInfo/SocialLink.tsx b/ui/marketplace/MarketplaceAppInfo/SocialLink.tsx
new file mode 100644
index 0000000000..da3464f6d6
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppInfo/SocialLink.tsx
@@ -0,0 +1,32 @@
+import { Link } from '@chakra-ui/react';
+import React from 'react';
+
+import type { MarketplaceAppSocialInfo } from 'types/client/marketplace';
+
+import type { IconName } from 'ui/shared/IconSvg';
+import IconSvg from 'ui/shared/IconSvg';
+
+export interface Props {
+  field: keyof MarketplaceAppSocialInfo;
+  icon: IconName;
+  title: string;
+  href?: string;
+}
+
+const SocialLink = ({ href, icon, title }: Props) => {
+  return (
+    <Link
+      href={ href }
+      aria-label={ title }
+      title={ title }
+      target="_blank"
+      display="inline-flex"
+      alignItems="center"
+    >
+      <IconSvg name={ icon } boxSize={ 5 } mr={ 2 } color="text_secondary"/>
+      <span>{ title }</span>
+    </Link>
+  );
+};
+
+export default SocialLink;
diff --git a/ui/marketplace/MarketplaceAppInfo/TriggerButton.tsx b/ui/marketplace/MarketplaceAppInfo/TriggerButton.tsx
new file mode 100644
index 0000000000..1f3f6371da
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppInfo/TriggerButton.tsx
@@ -0,0 +1,30 @@
+import { Button } from '@chakra-ui/react';
+import React from 'react';
+
+import IconSvg from 'ui/shared/IconSvg';
+
+interface Props {
+  onClick: () => void;
+  onlyIcon?: boolean;
+}
+
+const TriggerButton = ({ onClick, onlyIcon }: Props, ref: React.ForwardedRef<HTMLButtonElement>) => {
+  return (
+    <Button
+      ref={ ref }
+      size="sm"
+      variant="outline"
+      colorScheme="gray"
+      onClick={ onClick }
+      aria-label="Show project info"
+      fontWeight={ 500 }
+      px={ onlyIcon ? 1 : 2 }
+      h="32px"
+    >
+      <IconSvg name="info" boxSize={ 6 } mr={ onlyIcon ? 0 : 1 }/>
+      { !onlyIcon && <span>Info</span> }
+    </Button>
+  );
+};
+
+export default React.forwardRef(TriggerButton);
diff --git a/ui/marketplace/MarketplaceAppInfo/WebsiteLink.tsx b/ui/marketplace/MarketplaceAppInfo/WebsiteLink.tsx
new file mode 100644
index 0000000000..2a3dea9cca
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppInfo/WebsiteLink.tsx
@@ -0,0 +1,36 @@
+import { Link } from '@chakra-ui/react';
+import React from 'react';
+
+import IconSvg from 'ui/shared/IconSvg';
+
+interface Props {
+  url?: string | undefined;
+}
+
+const WebsiteLink = ({ url }: Props) => {
+  if (!url) {
+    return null;
+  }
+
+  function getHostname(url: string) {
+    try {
+      return new URL(url).hostname;
+    } catch (err) {}
+  }
+
+  return (
+    <Link
+      href={ url }
+      target="_blank"
+      display="inline-flex"
+      alignItems="center"
+      columnGap={ 1 }
+      mt={ 3 }
+    >
+      <IconSvg name="link" boxSize={ 5 } color="text_secondary"/>
+      <span>{ getHostname(url) }</span>
+    </Link>
+  );
+};
+
+export default WebsiteLink;
diff --git a/ui/marketplace/MarketplaceAppIntegrationIcon.tsx b/ui/marketplace/MarketplaceAppIntegrationIcon.tsx
new file mode 100644
index 0000000000..8ec443c35d
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppIntegrationIcon.tsx
@@ -0,0 +1,51 @@
+import { Tooltip } from '@chakra-ui/react';
+import React from 'react';
+
+import type { IconName } from 'ui/shared/IconSvg';
+import IconSvg from 'ui/shared/IconSvg';
+
+type Props = {
+  internalWallet: boolean | undefined;
+  external: boolean | undefined;
+}
+
+const MarketplaceAppIntegrationIcon = ({ external, internalWallet }: Props) => {
+  const [ icon, iconColor, text ] = React.useMemo(() => {
+    let icon: IconName = 'integration/partial';
+    let color = 'gray.400';
+    let text = 'This app opens in Blockscout without Blockscout wallet functionality. Use your external web3 wallet to connect directly to this application';
+
+    if (external) {
+      icon = 'arrows/north-east';
+      text = 'This app opens in a separate tab';
+    } else if (internalWallet) {
+      icon = 'integration/full';
+      color = 'green.500';
+      text = 'This app opens in Blockscout and your Blockscout wallet connects automatically';
+    }
+
+    return [ icon, color, text ];
+  }, [ external, internalWallet ]);
+
+  return (
+    <Tooltip
+      label={ text }
+      textAlign="center"
+      padding={ 2 }
+      openDelay={ 300 }
+      maxW={ 400 }
+    >
+      <IconSvg
+        name={ icon }
+        boxSize={ 5 }
+        color={ iconColor }
+        position="relative"
+        cursor="pointer"
+        verticalAlign="middle"
+        marginBottom={ 1 }
+      />
+    </Tooltip>
+  );
+};
+
+export default MarketplaceAppIntegrationIcon;
diff --git a/ui/marketplace/MarketplaceAppModal.pw.tsx b/ui/marketplace/MarketplaceAppModal.pw.tsx
new file mode 100644
index 0000000000..ba6aca1233
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppModal.pw.tsx
@@ -0,0 +1,41 @@
+import { test, expect, devices } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import type { MarketplaceAppWithSecurityReport } from 'types/client/marketplace';
+
+import { apps as appsMock } from 'mocks/apps/apps';
+import TestApp from 'playwright/TestApp';
+
+import MarketplaceAppModal from './MarketplaceAppModal';
+
+const props = {
+  onClose: () => {},
+  onFavoriteClick: () => {},
+  showContractList: () => {},
+  data: appsMock[0] as MarketplaceAppWithSecurityReport,
+  isFavorite: false,
+};
+
+const testFn: Parameters<typeof test>[1] = async({ mount, page }) => {
+  await page.route(appsMock[0].logo, (route) =>
+    route.fulfill({
+      status: 200,
+      path: './playwright/mocks/image_s.jpg',
+    }),
+  );
+
+  await mount(
+    <TestApp>
+      <MarketplaceAppModal { ...props }/>
+    </TestApp>,
+  );
+
+  await expect(page).toHaveScreenshot();
+};
+
+test('base view +@dark-mode', testFn);
+
+test.describe('mobile', () => {
+  test.use({ viewport: devices['iPhone 13 Pro'].viewport });
+  test('base view', testFn);
+});
diff --git a/ui/marketplace/MarketplaceAppModal.tsx b/ui/marketplace/MarketplaceAppModal.tsx
index d997621f8a..10fafef03e 100644
--- a/ui/marketplace/MarketplaceAppModal.tsx
+++ b/ui/marketplace/MarketplaceAppModal.tsx
@@ -1,23 +1,29 @@
 import {
   Box, Flex, Heading, IconButton, Image, Link, List, Modal, ModalBody,
-  ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, Tag, Text, useColorModeValue,
+  ModalCloseButton, ModalContent, ModalFooter, ModalOverlay, Tag, Text, useColorModeValue,
 } from '@chakra-ui/react';
 import React, { useCallback } from 'react';
 
-import type { MarketplaceAppOverview } from 'types/client/marketplace';
+import type { MarketplaceAppWithSecurityReport } from 'types/client/marketplace';
+import { ContractListTypes } from 'types/client/marketplace';
 
+import useFeatureValue from 'lib/growthbook/useFeatureValue';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import { nbsp } from 'lib/html-entities';
+import * as mixpanel from 'lib/mixpanel/index';
 import type { IconName } from 'ui/shared/IconSvg';
 import IconSvg from 'ui/shared/IconSvg';
 
+import AppSecurityReport from './AppSecurityReport';
+import ContractListButton, { ContractListButtonVariants } from './ContractListButton';
 import MarketplaceAppModalLink from './MarketplaceAppModalLink';
 
 type Props = {
   onClose: () => void;
   isFavorite: boolean;
-  onFavoriteClick: (id: string, isFavorite: boolean) => void;
-  data: MarketplaceAppOverview;
+  onFavoriteClick: (id: string, isFavorite: boolean, source: 'App modal') => void;
+  data: MarketplaceAppWithSecurityReport;
+  showContractList: (id: string, type: ContractListTypes, hasPreviousStep: boolean) => void;
 }
 
 const MarketplaceAppModal = ({
@@ -25,8 +31,13 @@ const MarketplaceAppModal = ({
   isFavorite,
   onFavoriteClick,
   data,
+  showContractList: showContractListProp,
 }: Props) => {
+  const { value: isExperiment } = useFeatureValue('security_score_exp', false);
+  const starOutlineIconColor = useColorModeValue('gray.600', 'gray.300');
+
   const {
+    id,
     title,
     url,
     external,
@@ -39,6 +50,7 @@ const MarketplaceAppModal = ({
     logo,
     logoDarkMode,
     categories,
+    securityReport,
   } = data;
 
   const socialLinks = [
@@ -50,15 +62,38 @@ const MarketplaceAppModal = ({
       icon: 'social/tweet' as IconName,
       url: twitter,
     } : null,
-    github ? {
-      icon: 'social/git' as IconName,
-      url: github,
-    } : null,
   ].filter(Boolean);
 
+  if (github) {
+    if (Array.isArray(github)) {
+      github.forEach((url) => socialLinks.push({ icon: 'social/git', url }));
+    } else {
+      socialLinks.push({ icon: 'social/git', url: github });
+    }
+  }
+
   const handleFavoriteClick = useCallback(() => {
-    onFavoriteClick(data.id, isFavorite);
-  }, [ onFavoriteClick, data.id, isFavorite ]);
+    onFavoriteClick(id, isFavorite, 'App modal');
+  }, [ onFavoriteClick, id, isFavorite ]);
+
+  const showContractList = useCallback((type: ContractListTypes) => {
+    onClose();
+    showContractListProp(id, type, true);
+  }, [ onClose, showContractListProp, id ]);
+
+  const showAllContracts = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Total contracts', Info: id, Source: 'App modal' });
+    showContractList(ContractListTypes.ALL);
+  }, [ showContractList, id ]);
+
+  const showVerifiedContracts = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Verified contracts', Info: id, Source: 'App modal' });
+    showContractList(ContractListTypes.VERIFIED);
+  }, [ showContractList, id ]);
+
+  const showAnalyzedContracts = React.useCallback(() => {
+    showContractList(ContractListTypes.ANALYZED);
+  }, [ showContractList ]);
 
   const isMobile = useIsMobile();
   const logoUrl = useColorModeValue(logo, logoDarkMode || logo);
@@ -73,10 +108,11 @@ const MarketplaceAppModal = ({
       <ModalOverlay/>
 
       <ModalContent>
-        <ModalHeader
+        <Box
           display="grid"
           gridTemplateColumns={{ base: 'auto 1fr' }}
           paddingRight={{ sm: 12 }}
+          marginBottom={{ base: 6, sm: 8 }}
         >
           <Flex
             alignItems="center"
@@ -117,29 +153,54 @@ const MarketplaceAppModal = ({
             gridColumn={{ base: '1 / 3', sm: 2 }}
             marginTop={{ base: 6, sm: 0 }}
           >
-            <Box display="flex">
-              <MarketplaceAppModalLink
-                id={ data.id }
-                url={ url }
-                external={ external }
-                title={ title }
-              />
+            <Flex flexWrap="wrap" gap={ 6 }>
+              <Flex width={{ base: '100%', sm: 'auto' }}>
+                <MarketplaceAppModalLink
+                  id={ data.id }
+                  url={ url }
+                  external={ external }
+                  title={ title }
+                />
 
-              <IconButton
-                aria-label="Mark as favorite"
-                title="Mark as favorite"
-                variant="outline"
-                colorScheme="gray"
-                w={ 9 }
-                h={ 8 }
-                onClick={ handleFavoriteClick }
-                icon={ isFavorite ?
-                  <IconSvg name="star_filled" w={ 4 } h={ 4 } color="yellow.400"/> :
-                  <IconSvg name="star_outline" w={ 4 } h={ 4 } color="gray.300"/> }
-              />
-            </Box>
+                <IconButton
+                  aria-label="Mark as favorite"
+                  title="Mark as favorite"
+                  variant="outline"
+                  colorScheme="gray"
+                  w={ 9 }
+                  h={ 8 }
+                  onClick={ handleFavoriteClick }
+                  icon={ isFavorite ?
+                    <IconSvg name="star_filled" w={ 5 } h={ 5 } color="yellow.400"/> :
+                    <IconSvg name="star_outline" w={ 5 } h={ 5 } color={ starOutlineIconColor }/> }
+                />
+              </Flex>
+
+              { (isExperiment && securityReport) && (
+                <Flex alignItems="center" gap={ 3 }>
+                  <AppSecurityReport
+                    id={ id }
+                    securityReport={ securityReport }
+                    showContractList={ showAnalyzedContracts }
+                    source="App modal"
+                  />
+                  <ContractListButton
+                    onClick={ showAllContracts }
+                    variant={ ContractListButtonVariants.ALL_CONTRACTS }
+                  >
+                    { securityReport.overallInfo.totalContractsNumber }
+                  </ContractListButton>
+                  <ContractListButton
+                    onClick={ showVerifiedContracts }
+                    variant={ ContractListButtonVariants.VERIFIED_CONTRACTS }
+                  >
+                    { securityReport.overallInfo.verifiedNumber }
+                  </ContractListButton>
+                </Flex>
+              ) }
+            </Flex>
           </Box>
-        </ModalHeader>
+        </Box>
 
         <ModalCloseButton/>
 
diff --git a/ui/marketplace/MarketplaceAppTopBar.tsx b/ui/marketplace/MarketplaceAppTopBar.tsx
new file mode 100644
index 0000000000..0b82faffeb
--- /dev/null
+++ b/ui/marketplace/MarketplaceAppTopBar.tsx
@@ -0,0 +1,100 @@
+import { chakra, Flex, Tooltip, Skeleton, useBoolean, Box } from '@chakra-ui/react';
+import React from 'react';
+
+import type { MarketplaceAppOverview, MarketplaceAppSecurityReport } from 'types/client/marketplace';
+import { ContractListTypes } from 'types/client/marketplace';
+
+import { route } from 'nextjs-routes';
+
+import { useAppContext } from 'lib/contexts/app';
+import useFeatureValue from 'lib/growthbook/useFeatureValue';
+import useIsMobile from 'lib/hooks/useIsMobile';
+import IconSvg from 'ui/shared/IconSvg';
+import LinkExternal from 'ui/shared/LinkExternal';
+import LinkInternal from 'ui/shared/LinkInternal';
+
+import AppSecurityReport from './AppSecurityReport';
+import ContractListModal from './ContractListModal';
+import MarketplaceAppAlert from './MarketplaceAppAlert';
+import MarketplaceAppInfo from './MarketplaceAppInfo';
+
+type Props = {
+  data: MarketplaceAppOverview | undefined;
+  isLoading: boolean;
+  isWalletConnected: boolean;
+  securityReport?: MarketplaceAppSecurityReport;
+}
+
+const MarketplaceAppTopBar = ({ data, isLoading, isWalletConnected, securityReport }: Props) => {
+  const [ showContractList, setShowContractList ] = useBoolean(false);
+  const appProps = useAppContext();
+  const isMobile = useIsMobile();
+  const { value: isExperiment } = useFeatureValue('security_score_exp', false);
+
+  const goBackUrl = React.useMemo(() => {
+    if (appProps.referrer && appProps.referrer.includes('/apps') && !appProps.referrer.includes('/apps/')) {
+      return appProps.referrer;
+    }
+    return route({ pathname: '/apps' });
+  }, [ appProps.referrer ]);
+
+  function getHostname(url: string | undefined) {
+    try {
+      return new URL(url || '').hostname;
+    } catch (err) {}
+  }
+
+  return (
+    <>
+      <Flex alignItems="center" flexWrap="wrap" mb={{ base: 6, md: 2 }} rowGap={ 3 } columnGap={ 2 }>
+        <Tooltip label="Back to dApps list" order={ 1 }>
+          <LinkInternal display="inline-flex" href={ goBackUrl } h="32px" isLoading={ isLoading }>
+            <IconSvg name="arrows/east" boxSize={ 6 } transform="rotate(180deg)" margin="auto" color="gray.400"/>
+          </LinkInternal>
+        </Tooltip>
+        <Skeleton width={{ base: '100%', md: 'auto' }} order={{ base: 5, md: 2 }} isLoaded={ !isLoading }>
+          <MarketplaceAppAlert internalWallet={ data?.internalWallet } isWalletConnected={ isWalletConnected }/>
+        </Skeleton>
+        <Skeleton order={{ base: 2, md: 3 }} isLoaded={ !isLoading }>
+          <MarketplaceAppInfo data={ data }/>
+        </Skeleton>
+        { (isExperiment && (securityReport || isLoading)) && (
+          <Box order={{ base: 3, md: 4 }}>
+            <AppSecurityReport
+              id={ data?.id || '' }
+              securityReport={ securityReport }
+              showContractList={ setShowContractList.on }
+              isLoading={ isLoading }
+              onlyIcon={ isMobile }
+              source="App page"
+            />
+          </Box>
+        ) }
+        <LinkExternal
+          order={{ base: 4, md: 5 }}
+          href={ data?.url }
+          variant="subtle"
+          fontSize="sm"
+          lineHeight={ 5 }
+          minW={ 0 }
+          maxW={{ base: 'calc(100% - 114px)', md: 'auto' }}
+          display="flex"
+          isLoading={ isLoading }
+        >
+          <chakra.span isTruncated>
+            { getHostname(data?.url) }
+          </chakra.span>
+        </LinkExternal>
+      </Flex>
+      { showContractList && (
+        <ContractListModal
+          type={ ContractListTypes.ANALYZED }
+          contracts={ securityReport?.contractsData }
+          onClose={ setShowContractList.off }
+        />
+      ) }
+    </>
+  );
+};
+
+export default MarketplaceAppTopBar;
diff --git a/ui/marketplace/MarketplaceCategoriesMenu.tsx b/ui/marketplace/MarketplaceCategoriesMenu.tsx
deleted file mode 100644
index 38e452db62..0000000000
--- a/ui/marketplace/MarketplaceCategoriesMenu.tsx
+++ /dev/null
@@ -1,70 +0,0 @@
-import { Box, Button, Menu, MenuButton, MenuList, Skeleton } from '@chakra-ui/react';
-import React from 'react';
-
-import { MarketplaceCategory } from 'types/client/marketplace';
-
-import IconSvg from 'ui/shared/IconSvg';
-
-import MarketplaceCategoriesMenuItem from './MarketplaceCategoriesMenuItem';
-
-type Props = {
-  categories: Array<string>;
-  selectedCategoryId: string;
-  onSelect: (category: string) => void;
-  isLoading: boolean;
-}
-
-const MarketplaceCategoriesMenu = ({ selectedCategoryId, onSelect, categories, isLoading }: Props) => {
-  const options = React.useMemo(() => ([
-    MarketplaceCategory.FAVORITES,
-    MarketplaceCategory.ALL,
-    ...categories,
-  ]), [ categories ]);
-
-  if (isLoading) {
-    return (
-      <Skeleton
-        h="40px"
-        w={{ base: '100%', sm: '120px' }}
-        borderRadius="base"
-        mb={{ base: 2, sm: 0 }}
-        mr={{ base: 0, sm: 2 }}
-      />
-    );
-  }
-
-  return (
-    <Menu>
-      <MenuButton
-        as={ Button }
-        mb={{ base: 2, sm: 0 }}
-        mr={{ base: 0, sm: 2 }}
-        size="md"
-        variant="outline"
-        colorScheme="gray"
-        flexShrink={ 0 }
-      >
-        <Box
-          as="span"
-          display="flex"
-          alignItems="center"
-        >
-          { selectedCategoryId }
-          <IconSvg transform="rotate(-90deg)" ml={{ base: 'auto', sm: 1 }} name="arrows/east-mini" w={ 5 } h={ 5 }/>
-        </Box>
-      </MenuButton>
-
-      <MenuList zIndex={ 3 }>
-        { options.map((category: string) => (
-          <MarketplaceCategoriesMenuItem
-            key={ category }
-            id={ category }
-            onClick={ onSelect }
-          />
-        )) }
-      </MenuList>
-    </Menu>
-  );
-};
-
-export default React.memo(MarketplaceCategoriesMenu);
diff --git a/ui/marketplace/MarketplaceCategoriesMenuItem.tsx b/ui/marketplace/MarketplaceCategoriesMenuItem.tsx
deleted file mode 100644
index 3d9c983c9e..0000000000
--- a/ui/marketplace/MarketplaceCategoriesMenuItem.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { MenuItem } from '@chakra-ui/react';
-import React, { useCallback } from 'react';
-
-import { MarketplaceCategory } from 'types/client/marketplace';
-
-import type { IconName } from 'ui/shared/IconSvg';
-import IconSvg from 'ui/shared/IconSvg';
-
-type Props = {
-  id: string;
-  onClick: (category: string) => void;
-}
-
-const ICONS: Record<string, IconName> = {
-  [MarketplaceCategory.FAVORITES]: 'star_filled',
-};
-
-const MarketplaceCategoriesMenuItem = ({ id, onClick }: Props) => {
-  const handleSelection = useCallback(() => {
-    onClick(id);
-  }, [ id, onClick ]);
-
-  return (
-    <MenuItem
-      key={ id }
-      onClick={ handleSelection }
-      display="flex"
-      alignItems="center"
-    >
-      { id in ICONS && <IconSvg mr={ 3 } name={ ICONS[id] } w={ 4 } h={ 4 } color="blackAlpha.800"/> }
-      { id }
-    </MenuItem>
-  );
-};
-
-export default MarketplaceCategoriesMenuItem;
diff --git a/ui/marketplace/MarketplaceList.tsx b/ui/marketplace/MarketplaceList.tsx
index 98abb23dd6..e9fb933919 100644
--- a/ui/marketplace/MarketplaceList.tsx
+++ b/ui/marketplace/MarketplaceList.tsx
@@ -1,23 +1,23 @@
 import { Grid } from '@chakra-ui/react';
 import React from 'react';
+import type { MouseEvent } from 'react';
 
 import type { MarketplaceAppPreview } from 'types/client/marketplace';
 
-import { apos } from 'lib/html-entities';
-import EmptySearchResult from 'ui/shared/EmptySearchResult';
-
+import EmptySearchResult from './EmptySearchResult';
 import MarketplaceAppCard from './MarketplaceAppCard';
 
 type Props = {
   apps: Array<MarketplaceAppPreview>;
-  onAppClick: (id: string) => void;
+  showAppInfo: (id: string) => void;
   favoriteApps: Array<string>;
-  onFavoriteClick: (id: string, isFavorite: boolean) => void;
+  onFavoriteClick: (id: string, isFavorite: boolean, source: 'Discovery view') => void;
   isLoading: boolean;
-  showDisclaimer: (id: string) => void;
+  selectedCategoryId?: string;
+  onAppClick: (event: MouseEvent, id: string) => void;
 }
 
-const MarketplaceList = ({ apps, onAppClick, favoriteApps, onFavoriteClick, isLoading, showDisclaimer }: Props) => {
+const MarketplaceList = ({ apps, showAppInfo, favoriteApps, onFavoriteClick, isLoading, selectedCategoryId, onAppClick }: Props) => {
   return apps.length > 0 ? (
     <Grid
       templateColumns={{
@@ -30,7 +30,7 @@ const MarketplaceList = ({ apps, onAppClick, favoriteApps, onFavoriteClick, isLo
       { apps.map((app, index) => (
         <MarketplaceAppCard
           key={ app.id + (isLoading ? index : '') }
-          onInfoClick={ onAppClick }
+          onInfoClick={ showAppInfo }
           id={ app.id }
           external={ app.external }
           url={ app.url }
@@ -42,12 +42,13 @@ const MarketplaceList = ({ apps, onAppClick, favoriteApps, onFavoriteClick, isLo
           isFavorite={ favoriteApps.includes(app.id) }
           onFavoriteClick={ onFavoriteClick }
           isLoading={ isLoading }
-          showDisclaimer={ showDisclaimer }
+          internalWallet={ app.internalWallet }
+          onAppClick={ onAppClick }
         />
       )) }
     </Grid>
   ) : (
-    <EmptySearchResult text={ `Couldn${ apos }t find an app that matches your filter query.` }/>
+    <EmptySearchResult selectedCategoryId={ selectedCategoryId } favoriteApps={ favoriteApps }/>
   );
 };
 
diff --git a/ui/marketplace/MarketplaceListWithScores.tsx b/ui/marketplace/MarketplaceListWithScores.tsx
new file mode 100644
index 0000000000..6d86eb63ba
--- /dev/null
+++ b/ui/marketplace/MarketplaceListWithScores.tsx
@@ -0,0 +1,86 @@
+import { Hide, Show } from '@chakra-ui/react';
+import React from 'react';
+import type { MouseEvent } from 'react';
+
+import type { MarketplaceAppWithSecurityReport, ContractListTypes } from 'types/client/marketplace';
+
+import DataListDisplay from 'ui/shared/DataListDisplay';
+
+import EmptySearchResult from './EmptySearchResult';
+import ListItem from './MarketplaceListWithScores/ListItem';
+import Table from './MarketplaceListWithScores/Table';
+
+interface Props {
+  apps: Array<MarketplaceAppWithSecurityReport>;
+  showAppInfo: (id: string) => void;
+  favoriteApps: Array<string>;
+  onFavoriteClick: (id: string, isFavorite: boolean, source: 'Security view') => void;
+  isLoading: boolean;
+  selectedCategoryId?: string;
+  onAppClick: (event: MouseEvent, id: string) => void;
+  showContractList: (id: string, type: ContractListTypes) => void;
+}
+
+const MarketplaceListWithScores = ({
+  apps,
+  showAppInfo,
+  favoriteApps,
+  onFavoriteClick,
+  isLoading,
+  selectedCategoryId,
+  onAppClick,
+  showContractList,
+}: Props) => {
+
+  const displayedApps = React.useMemo(() => apps.sort((a, b) => {
+    if (!a.securityReport) {
+      return 1;
+    } else if (!b.securityReport) {
+      return -1;
+    }
+    return b.securityReport.overallInfo.securityScore - a.securityReport.overallInfo.securityScore;
+  }), [ apps ]);
+
+  const content = apps.length > 0 ? (
+    <>
+      <Show below="lg" ssr={ false }>
+        { displayedApps.map((app, index) => (
+          <ListItem
+            key={ app.id + (isLoading ? index : '') }
+            app={ app }
+            onInfoClick={ showAppInfo }
+            isFavorite={ favoriteApps.includes(app.id) }
+            onFavoriteClick={ onFavoriteClick }
+            isLoading={ isLoading }
+            onAppClick={ onAppClick }
+            showContractList={ showContractList }
+          />
+        )) }
+      </Show>
+      <Hide below="lg" ssr={ false }>
+        <Table
+          apps={ displayedApps }
+          isLoading={ isLoading }
+          onAppClick={ onAppClick }
+          favoriteApps={ favoriteApps }
+          onFavoriteClick={ onFavoriteClick }
+          onInfoClick={ showAppInfo }
+          showContractList={ showContractList }
+        />
+      </Hide>
+    </>
+  ) : null;
+
+  return apps.length > 0 ? (
+    <DataListDisplay
+      isError={ false }
+      items={ apps }
+      emptyText="No apps found."
+      content={ content }
+    />
+  ) : (
+    <EmptySearchResult selectedCategoryId={ selectedCategoryId } favoriteApps={ favoriteApps }/>
+  );
+};
+
+export default MarketplaceListWithScores;
diff --git a/ui/marketplace/MarketplaceListWithScores/AppLink.tsx b/ui/marketplace/MarketplaceListWithScores/AppLink.tsx
new file mode 100644
index 0000000000..bf1b1d6af7
--- /dev/null
+++ b/ui/marketplace/MarketplaceListWithScores/AppLink.tsx
@@ -0,0 +1,73 @@
+import { Flex, Skeleton, LinkBox, Image, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+import type { MouseEvent } from 'react';
+
+import type { MarketplaceAppPreview } from 'types/client/marketplace';
+
+import MarketplaceAppCardLink from '../MarketplaceAppCardLink';
+import MarketplaceAppIntegrationIcon from '../MarketplaceAppIntegrationIcon';
+
+interface Props {
+  app: MarketplaceAppPreview;
+  isLoading: boolean | undefined;
+  onAppClick: (event: MouseEvent, id: string) => void;
+  isLarge?: boolean;
+}
+
+const AppLink = ({ app, isLoading, onAppClick, isLarge = false }: Props) => {
+  const { id, url, external, title, logo, logoDarkMode, internalWallet, categories } = app;
+
+  const logoUrl = useColorModeValue(logo, logoDarkMode || logo);
+
+  const categoriesLabel = categories.join(', ');
+
+  return (
+    <LinkBox display="flex" height="100%" width="100%" role="group" alignItems="center" mb={ isLarge ? 0 : 4 }>
+      <Skeleton
+        isLoaded={ !isLoading }
+        w={ isLarge ? '56px' : '48px' }
+        h={ isLarge ? '56px' : '48px' }
+        display="flex"
+        alignItems="center"
+        justifyContent="center"
+        mr={ isLarge ? 3 : 4 }
+      >
+        <Image
+          src={ isLoading ? undefined : logoUrl }
+          alt={ `${ title } app icon` }
+          borderRadius="8px"
+        />
+      </Skeleton>
+
+      <Flex direction="column">
+        <Skeleton
+          isLoaded={ !isLoading }
+          marginBottom={ 0 }
+          fontSize="sm"
+          fontWeight="semibold"
+          fontFamily="heading"
+          display="inline-block"
+          mb={ 1 }
+        >
+          <MarketplaceAppCardLink
+            id={ id }
+            url={ url }
+            external={ external }
+            title={ title }
+            onClick={ onAppClick }
+          />
+          <MarketplaceAppIntegrationIcon external={ external } internalWallet={ internalWallet }/>
+        </Skeleton>
+        <Skeleton
+          isLoaded={ !isLoading }
+          color="text_secondary"
+          fontSize={ isLarge ? 'sm' : 'xs' }
+        >
+          <span>{ categoriesLabel }</span>
+        </Skeleton>
+      </Flex>
+    </LinkBox>
+  );
+};
+
+export default AppLink;
diff --git a/ui/marketplace/MarketplaceListWithScores/ListItem.tsx b/ui/marketplace/MarketplaceListWithScores/ListItem.tsx
new file mode 100644
index 0000000000..4b5a8988f4
--- /dev/null
+++ b/ui/marketplace/MarketplaceListWithScores/ListItem.tsx
@@ -0,0 +1,126 @@
+import { Flex, IconButton, Text } from '@chakra-ui/react';
+import React from 'react';
+import type { MouseEvent } from 'react';
+
+import type { MarketplaceAppWithSecurityReport } from 'types/client/marketplace';
+import { ContractListTypes } from 'types/client/marketplace';
+
+import * as mixpanel from 'lib/mixpanel/index';
+import IconSvg from 'ui/shared/IconSvg';
+import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
+
+import AppSecurityReport from '../AppSecurityReport';
+import ContractListButton, { ContractListButtonVariants } from '../ContractListButton';
+import AppLink from './AppLink';
+import MoreInfoButton from './MoreInfoButton';
+
+type Props = {
+  app: MarketplaceAppWithSecurityReport;
+  onInfoClick: (id: string) => void;
+  isFavorite: boolean;
+  onFavoriteClick: (id: string, isFavorite: boolean, source: 'Security view') => void;
+  isLoading: boolean;
+  onAppClick: (event: MouseEvent, id: string) => void;
+  showContractList: (id: string, type: ContractListTypes) => void;
+}
+
+const ListItem = ({ app, onInfoClick, isFavorite, onFavoriteClick, isLoading, onAppClick, showContractList }: Props) => {
+  const { id, securityReport } = app;
+
+  const handleInfoClick = React.useCallback((event: MouseEvent) => {
+    event.preventDefault();
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'More button', Info: id, Source: 'Security view' });
+    onInfoClick(id);
+  }, [ onInfoClick, id ]);
+
+  const handleFavoriteClick = React.useCallback(() => {
+    onFavoriteClick(id, isFavorite, 'Security view');
+  }, [ onFavoriteClick, id, isFavorite ]);
+
+  const showAllContracts = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Total contracts', Info: id, Source: 'Security view' });
+    showContractList(id, ContractListTypes.ALL);
+  }, [ showContractList, id ]);
+
+  const showVerifiedContracts = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Verified contracts', Info: id, Source: 'Security view' });
+    showContractList(id, ContractListTypes.VERIFIED);
+  }, [ showContractList, id ]);
+
+  const showAnalyzedContracts = React.useCallback(() => {
+    showContractList(id, ContractListTypes.ANALYZED);
+  }, [ showContractList, id ]);
+
+  return (
+    <ListItemMobile
+      rowGap={ 3 }
+      py={ 3 }
+      _first={{ borderTop: 'none', paddingTop: 0 }}
+      _last={{ borderBottom: 'none', paddingBottom: 0 }}
+    >
+      <Flex
+        direction="column"
+        justifyContent="stretch"
+        padding={ 3 }
+        width="100%"
+      >
+        <Flex position="relative">
+          <AppLink app={ app } isLoading={ isLoading } onAppClick={ onAppClick }/>
+          { !isLoading && (
+            <IconButton
+              position="absolute"
+              right={ -1 }
+              top={ -1 }
+              aria-label="Mark as favorite"
+              title="Mark as favorite"
+              variant="ghost"
+              colorScheme="gray"
+              w={ 9 }
+              h={ 8 }
+              onClick={ handleFavoriteClick }
+              icon={ isFavorite ?
+                <IconSvg name="star_filled" w={ 5 } h={ 5 } color="yellow.400"/> :
+                <IconSvg name="star_outline" w={ 5 } h={ 5 } color="gray.400"/>
+              }
+            />
+          ) }
+        </Flex>
+        <Flex alignItems="center">
+          <Flex flex={ 1 } gap={ 3 } alignItems="center">
+            { (securityReport || isLoading) ? (
+              <>
+                <AppSecurityReport
+                  id={ id }
+                  isLoading={ isLoading }
+                  securityReport={ securityReport }
+                  showContractList={ showAnalyzedContracts }
+                  height="30px"
+                  source="Security view"
+                />
+                <ContractListButton
+                  onClick={ showAllContracts }
+                  variant={ ContractListButtonVariants.ALL_CONTRACTS }
+                  isLoading={ isLoading }
+                >
+                  { securityReport?.overallInfo.totalContractsNumber ?? 0 }
+                </ContractListButton>
+                <ContractListButton
+                  onClick={ showVerifiedContracts }
+                  variant={ ContractListButtonVariants.VERIFIED_CONTRACTS }
+                  isLoading={ isLoading }
+                >
+                  { securityReport?.overallInfo.verifiedNumber ?? 0 }
+                </ContractListButton>
+              </>
+            ) : (
+              <Text variant="secondary" fontSize="sm" fontWeight={ 500 }>Data will be available soon</Text>
+            ) }
+          </Flex>
+          <MoreInfoButton onClick={ handleInfoClick } isLoading={ isLoading }/>
+        </Flex>
+      </Flex>
+    </ListItemMobile>
+  );
+};
+
+export default ListItem;
diff --git a/ui/marketplace/MarketplaceListWithScores/MoreInfoButton.tsx b/ui/marketplace/MarketplaceListWithScores/MoreInfoButton.tsx
new file mode 100644
index 0000000000..d96bddb66c
--- /dev/null
+++ b/ui/marketplace/MarketplaceListWithScores/MoreInfoButton.tsx
@@ -0,0 +1,29 @@
+import { Link, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+import type { MouseEvent } from 'react';
+
+interface Props {
+  onClick: (event: MouseEvent) => void;
+  isLoading?: boolean;
+}
+
+const MoreInfoButton = ({ onClick, isLoading }: Props) => (
+  <Skeleton
+    isLoaded={ !isLoading }
+    display="inline-flex"
+    alignItems="center"
+    height="30px"
+    borderRadius="base"
+  >
+    <Link
+      fontSize="sm"
+      onClick={ onClick }
+      fontWeight="500"
+      display="inline-flex"
+    >
+      More info
+    </Link>
+  </Skeleton>
+);
+
+export default MoreInfoButton;
diff --git a/ui/marketplace/MarketplaceListWithScores/Table.tsx b/ui/marketplace/MarketplaceListWithScores/Table.tsx
new file mode 100644
index 0000000000..1e8cbddf56
--- /dev/null
+++ b/ui/marketplace/MarketplaceListWithScores/Table.tsx
@@ -0,0 +1,52 @@
+import { Table as ChakraTable, Tbody, Th, Tr } from '@chakra-ui/react';
+import React from 'react';
+import type { MouseEvent } from 'react';
+
+import type { MarketplaceAppWithSecurityReport, ContractListTypes } from 'types/client/marketplace';
+
+import { default as Thead } from 'ui/shared/TheadSticky';
+
+import TableItem from './TableItem';
+
+type Props = {
+  apps: Array<MarketplaceAppWithSecurityReport>;
+  isLoading?: boolean;
+  favoriteApps: Array<string>;
+  onFavoriteClick: (id: string, isFavorite: boolean, source: 'Security view') => void;
+  onAppClick: (event: MouseEvent, id: string) => void;
+  onInfoClick: (id: string) => void;
+  showContractList: (id: string, type: ContractListTypes) => void;
+}
+
+const Table = ({ apps, isLoading, favoriteApps, onFavoriteClick, onAppClick, onInfoClick, showContractList }: Props) => {
+  return (
+    <ChakraTable>
+      <Thead top={ 0 }>
+        <Tr>
+          <Th w="5%"></Th>
+          <Th w="40%">App</Th>
+          <Th w="15%">Contracts score</Th>
+          <Th w="10%">Total</Th>
+          <Th w="10%">Verified</Th>
+          <Th w="20%"></Th>
+        </Tr>
+      </Thead>
+      <Tbody>
+        { apps.map((app, index) => (
+          <TableItem
+            key={ app.id + (isLoading ? index : '') }
+            app={ app }
+            isLoading={ isLoading }
+            isFavorite={ favoriteApps.includes(app.id) }
+            onFavoriteClick={ onFavoriteClick }
+            onAppClick={ onAppClick }
+            onInfoClick={ onInfoClick }
+            showContractList={ showContractList }
+          />
+        )) }
+      </Tbody>
+    </ChakraTable>
+  );
+};
+
+export default Table;
diff --git a/ui/marketplace/MarketplaceListWithScores/TableItem.tsx b/ui/marketplace/MarketplaceListWithScores/TableItem.tsx
new file mode 100644
index 0000000000..c77b5c5c78
--- /dev/null
+++ b/ui/marketplace/MarketplaceListWithScores/TableItem.tsx
@@ -0,0 +1,126 @@
+import { Td, Tr, IconButton, Skeleton, Text } from '@chakra-ui/react';
+import React from 'react';
+import type { MouseEvent } from 'react';
+
+import type { MarketplaceAppWithSecurityReport } from 'types/client/marketplace';
+import { ContractListTypes } from 'types/client/marketplace';
+
+import * as mixpanel from 'lib/mixpanel/index';
+import IconSvg from 'ui/shared/IconSvg';
+
+import AppSecurityReport from '../AppSecurityReport';
+import ContractListButton, { ContractListButtonVariants } from '../ContractListButton';
+import AppLink from './AppLink';
+import MoreInfoButton from './MoreInfoButton';
+
+type Props = {
+  app: MarketplaceAppWithSecurityReport;
+  isLoading?: boolean;
+  isFavorite: boolean;
+  onFavoriteClick: (id: string, isFavorite: boolean, source: 'Security view') => void;
+  onAppClick: (event: MouseEvent, id: string) => void;
+  onInfoClick: (id: string) => void;
+  showContractList: (id: string, type: ContractListTypes) => void;
+}
+
+const TableItem = ({
+  app,
+  isLoading,
+  isFavorite,
+  onFavoriteClick,
+  onAppClick,
+  onInfoClick,
+  showContractList,
+}: Props) => {
+
+  const { id, securityReport } = app;
+
+  const handleInfoClick = React.useCallback((event: MouseEvent) => {
+    event.preventDefault();
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'More button', Info: id, Source: 'Security view' });
+    onInfoClick(id);
+  }, [ onInfoClick, id ]);
+
+  const handleFavoriteClick = React.useCallback(() => {
+    onFavoriteClick(id, isFavorite, 'Security view');
+  }, [ onFavoriteClick, id, isFavorite ]);
+
+  const showAllContracts = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Total contracts', Info: id, Source: 'Security view' });
+    showContractList(id, ContractListTypes.ALL);
+  }, [ showContractList, id ]);
+
+  const showVerifiedContracts = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Verified contracts', Info: id, Source: 'Security view' });
+    showContractList(id, ContractListTypes.VERIFIED);
+  }, [ showContractList, id ]);
+
+  const showAnalyzedContracts = React.useCallback(() => {
+    showContractList(id, ContractListTypes.ANALYZED);
+  }, [ showContractList, id ]);
+
+  return (
+    <Tr>
+      <Td verticalAlign="middle" px={ 2 }>
+        <Skeleton isLoaded={ !isLoading }>
+          <IconButton
+            aria-label="Mark as favorite"
+            title="Mark as favorite"
+            variant="ghost"
+            colorScheme="gray"
+            w={ 9 }
+            h={ 8 }
+            onClick={ handleFavoriteClick }
+            icon={ isFavorite ?
+              <IconSvg name="star_filled" w={ 5 } h={ 5 } color="yellow.400"/> :
+              <IconSvg name="star_outline" w={ 5 } h={ 5 } color="gray.400"/>
+            }
+          />
+        </Skeleton>
+      </Td>
+      <Td verticalAlign="middle">
+        <AppLink app={ app } isLoading={ isLoading } onAppClick={ onAppClick } isLarge/>
+      </Td>
+      { (securityReport || isLoading) ? (
+        <>
+          <Td verticalAlign="middle">
+            <AppSecurityReport
+              id={ id }
+              securityReport={ securityReport }
+              showContractList={ showAnalyzedContracts }
+              isLoading={ isLoading }
+              source="Security view"
+            />
+          </Td>
+          <Td verticalAlign="middle">
+            <ContractListButton
+              onClick={ showAllContracts }
+              variant={ ContractListButtonVariants.ALL_CONTRACTS }
+              isLoading={ isLoading }
+            >
+              { securityReport?.overallInfo.totalContractsNumber ?? 0 }
+            </ContractListButton>
+          </Td>
+          <Td verticalAlign="middle">
+            <ContractListButton
+              onClick={ showVerifiedContracts }
+              variant={ ContractListButtonVariants.VERIFIED_CONTRACTS }
+              isLoading={ isLoading }
+            >
+              { securityReport?.overallInfo.verifiedNumber ?? 0 }
+            </ContractListButton>
+          </Td>
+        </>
+      ) : (
+        <Td verticalAlign="middle" colSpan={ 3 }>
+          <Text variant="secondary" fontSize="sm" fontWeight={ 500 }>Data will be available soon</Text>
+        </Td>
+      ) }
+      <Td verticalAlign="middle" isNumeric>
+        <MoreInfoButton onClick={ handleInfoClick } isLoading={ isLoading }/>
+      </Td>
+    </Tr>
+  );
+};
+
+export default TableItem;
diff --git a/ui/marketplace/__screenshots__/MarketplaceAppInfo.pw.tsx_dark-color-mode_base-view-dark-mode-1.png b/ui/marketplace/__screenshots__/MarketplaceAppInfo.pw.tsx_dark-color-mode_base-view-dark-mode-1.png
new file mode 100644
index 0000000000..c94b12f754
Binary files /dev/null and b/ui/marketplace/__screenshots__/MarketplaceAppInfo.pw.tsx_dark-color-mode_base-view-dark-mode-1.png differ
diff --git a/ui/marketplace/__screenshots__/MarketplaceAppInfo.pw.tsx_default_base-view-dark-mode-1.png b/ui/marketplace/__screenshots__/MarketplaceAppInfo.pw.tsx_default_base-view-dark-mode-1.png
new file mode 100644
index 0000000000..92f7b3afe2
Binary files /dev/null and b/ui/marketplace/__screenshots__/MarketplaceAppInfo.pw.tsx_default_base-view-dark-mode-1.png differ
diff --git a/ui/marketplace/__screenshots__/MarketplaceAppInfo.pw.tsx_default_mobile-base-view-1.png b/ui/marketplace/__screenshots__/MarketplaceAppInfo.pw.tsx_default_mobile-base-view-1.png
new file mode 100644
index 0000000000..d4a9242e2b
Binary files /dev/null and b/ui/marketplace/__screenshots__/MarketplaceAppInfo.pw.tsx_default_mobile-base-view-1.png differ
diff --git a/ui/marketplace/__screenshots__/MarketplaceAppModal.pw.tsx_dark-color-mode_base-view-dark-mode-1.png b/ui/marketplace/__screenshots__/MarketplaceAppModal.pw.tsx_dark-color-mode_base-view-dark-mode-1.png
new file mode 100644
index 0000000000..fcabbdefd3
Binary files /dev/null and b/ui/marketplace/__screenshots__/MarketplaceAppModal.pw.tsx_dark-color-mode_base-view-dark-mode-1.png differ
diff --git a/ui/marketplace/__screenshots__/MarketplaceAppModal.pw.tsx_default_base-view-dark-mode-1.png b/ui/marketplace/__screenshots__/MarketplaceAppModal.pw.tsx_default_base-view-dark-mode-1.png
new file mode 100644
index 0000000000..a0e8738779
Binary files /dev/null and b/ui/marketplace/__screenshots__/MarketplaceAppModal.pw.tsx_default_base-view-dark-mode-1.png differ
diff --git a/ui/marketplace/__screenshots__/MarketplaceAppModal.pw.tsx_default_mobile-base-view-1.png b/ui/marketplace/__screenshots__/MarketplaceAppModal.pw.tsx_default_mobile-base-view-1.png
new file mode 100644
index 0000000000..e0e15c3dd9
Binary files /dev/null and b/ui/marketplace/__screenshots__/MarketplaceAppModal.pw.tsx_default_mobile-base-view-1.png differ
diff --git a/ui/marketplace/useAutoConnectWallet.tsx b/ui/marketplace/useAutoConnectWallet.tsx
new file mode 100644
index 0000000000..0321694f81
--- /dev/null
+++ b/ui/marketplace/useAutoConnectWallet.tsx
@@ -0,0 +1,39 @@
+import { useRouter } from 'next/router';
+import { useEffect, useRef } from 'react';
+
+import removeQueryParam from 'lib/router/removeQueryParam';
+import updateQueryParam from 'lib/router/updateQueryParam';
+import useWallet from 'ui/snippets/walletMenu/useWallet';
+
+export default function useAutoConnectWallet() {
+  const router = useRouter();
+  const { isWalletConnected, isModalOpen, connect } = useWallet({ source: 'Swap button' });
+  const isConnectionStarted = useRef(false);
+
+  useEffect(() => {
+    if (router.query.action !== 'connect') {
+      return;
+    }
+
+    let timer: ReturnType<typeof setTimeout>;
+
+    if (!isWalletConnected && !isModalOpen) {
+      if (!isConnectionStarted.current) {
+        timer = setTimeout(() => {
+          if (!isWalletConnected) {
+            connect();
+            isConnectionStarted.current = true;
+          }
+        }, 500);
+      } else {
+        isConnectionStarted.current = false;
+        updateQueryParam(router, 'action', 'tooltip');
+      }
+    } else if (isWalletConnected) {
+      isConnectionStarted.current = false;
+      removeQueryParam(router, 'action');
+    }
+
+    return () => clearTimeout(timer);
+  }, [ isWalletConnected, isModalOpen, connect, router ]);
+}
diff --git a/ui/marketplace/useMarketplace.tsx b/ui/marketplace/useMarketplace.tsx
index 7c8c86b9ea..cbf635478d 100644
--- a/ui/marketplace/useMarketplace.tsx
+++ b/ui/marketplace/useMarketplace.tsx
@@ -1,14 +1,16 @@
 import _pickBy from 'lodash/pickBy';
-import _unique from 'lodash/uniq';
 import { useRouter } from 'next/router';
 import React from 'react';
 
-import { MarketplaceCategory } from 'types/client/marketplace';
+import type { ContractListTypes } from 'types/client/marketplace';
+import { MarketplaceCategory, MarketplaceDisplayType } from 'types/client/marketplace';
 
 import useDebounce from 'lib/hooks/useDebounce';
+import * as mixpanel from 'lib/mixpanel/index';
 import getQueryParamString from 'lib/router/getQueryParamString';
 
 import useMarketplaceApps from './useMarketplaceApps';
+import useMarketplaceCategories from './useMarketplaceCategories';
 
 const favoriteAppsLocalStorageKey = 'favoriteApps';
 
@@ -24,15 +26,26 @@ export default function useMarketplace() {
   const router = useRouter();
   const defaultCategoryId = getQueryParamString(router.query.category);
   const defaultFilterQuery = getQueryParamString(router.query.filter);
+  const defaultDisplayType = getQueryParamString(router.query.tab);
 
   const [ selectedAppId, setSelectedAppId ] = React.useState<string | null>(null);
   const [ selectedCategoryId, setSelectedCategoryId ] = React.useState<string>(MarketplaceCategory.ALL);
+  const [ selectedDisplayType, setSelectedDisplayType ] = React.useState<string>(
+    Object.values(MarketplaceDisplayType).includes(defaultDisplayType as MarketplaceDisplayType) ?
+      defaultDisplayType :
+      MarketplaceDisplayType.DEFAULT,
+  );
   const [ filterQuery, setFilterQuery ] = React.useState(defaultFilterQuery);
   const [ favoriteApps, setFavoriteApps ] = React.useState<Array<string>>([]);
+  const [ isFavoriteAppsLoaded, setIsFavoriteAppsLoaded ] = React.useState<boolean>(false);
   const [ isAppInfoModalOpen, setIsAppInfoModalOpen ] = React.useState<boolean>(false);
   const [ isDisclaimerModalOpen, setIsDisclaimerModalOpen ] = React.useState<boolean>(false);
+  const [ contractListModalType, setContractListModalType ] = React.useState<ContractListTypes | null>(null);
+  const [ hasPreviousStep, setHasPreviousStep ] = React.useState<boolean>(false);
+
+  const handleFavoriteClick = React.useCallback((id: string, isFavorite: boolean, source: 'Discovery view' | 'Security view' | 'App modal') => {
+    mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Favorite app', Info: id, Source: source });
 
-  const handleFavoriteClick = React.useCallback((id: string, isFavorite: boolean) => {
     const favoriteApps = getFavoriteApps();
 
     if (isFavorite) {
@@ -56,30 +69,47 @@ export default function useMarketplace() {
     setIsDisclaimerModalOpen(true);
   }, []);
 
+  const showContractList = React.useCallback((id: string, type: ContractListTypes, hasPreviousStep?: boolean) => {
+    setSelectedAppId(id);
+    setContractListModalType(type);
+    if (hasPreviousStep) {
+      setHasPreviousStep(true);
+    }
+  }, []);
+
   const debouncedFilterQuery = useDebounce(filterQuery, 500);
   const clearSelectedAppId = React.useCallback(() => {
     setSelectedAppId(null);
     setIsAppInfoModalOpen(false);
     setIsDisclaimerModalOpen(false);
+    setContractListModalType(null);
+    setHasPreviousStep(false);
   }, []);
 
   const handleCategoryChange = React.useCallback((newCategory: string) => {
+    mixpanel.logEvent(mixpanel.EventTypes.FILTERS, { Source: 'Marketplace', 'Filter name': newCategory });
     setSelectedCategoryId(newCategory);
   }, []);
 
-  const { isPlaceholderData, isError, error, data, displayedApps } = useMarketplaceApps(debouncedFilterQuery, selectedCategoryId, favoriteApps);
+  const handleDisplayTypeChange = React.useCallback((newDisplayType: MarketplaceDisplayType) => {
+    setSelectedDisplayType(newDisplayType);
+  }, []);
 
-  const categories = React.useMemo(() => {
-    return _unique(data?.map(app => app.categories).flat()) || [];
-  }, [ data ]);
+  const {
+    isPlaceholderData, isError, error, data, displayedApps,
+  } = useMarketplaceApps(debouncedFilterQuery, selectedCategoryId, favoriteApps, isFavoriteAppsLoaded);
+  const {
+    isPlaceholderData: isCategoriesPlaceholderData, data: categories,
+  } = useMarketplaceCategories(data, isPlaceholderData);
 
   React.useEffect(() => {
     setFavoriteApps(getFavoriteApps());
+    setIsFavoriteAppsLoaded(true);
   }, [ ]);
 
   React.useEffect(() => {
     if (!isPlaceholderData && !isError) {
-      const isValidDefaultCategory = categories.includes(defaultCategoryId);
+      const isValidDefaultCategory = categories.map(c => c.name).includes(defaultCategoryId);
       isValidDefaultCategory && setSelectedCategoryId(defaultCategoryId);
     }
     // run only when data is loaded
@@ -90,7 +120,13 @@ export default function useMarketplace() {
     const query = _pickBy({
       category: selectedCategoryId === MarketplaceCategory.ALL ? undefined : selectedCategoryId,
       filter: debouncedFilterQuery,
+      tab: selectedDisplayType === MarketplaceDisplayType.DEFAULT ? undefined : selectedDisplayType,
     }, Boolean);
+
+    if (debouncedFilterQuery.length > 0) {
+      mixpanel.logEvent(mixpanel.EventTypes.LOCAL_SEARCH, { Source: 'Marketplace', 'Search query': debouncedFilterQuery });
+    }
+
     router.replace(
       { pathname: '/apps', query },
       undefined,
@@ -99,7 +135,7 @@ export default function useMarketplace() {
   // omit router in the deps because router.push() somehow modifies it
   // and we get infinite re-renders then
   // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [ debouncedFilterQuery, selectedCategoryId ]);
+  }, [ debouncedFilterQuery, selectedCategoryId, selectedDisplayType ]);
 
   return React.useMemo(() => ({
     selectedCategoryId,
@@ -119,6 +155,13 @@ export default function useMarketplace() {
     isAppInfoModalOpen,
     isDisclaimerModalOpen,
     showDisclaimer,
+    appsTotal: data?.length || 0,
+    isCategoriesPlaceholderData,
+    showContractList,
+    contractListModalType,
+    selectedDisplayType,
+    onDisplayTypeChange: handleDisplayTypeChange,
+    hasPreviousStep,
   }), [
     selectedCategoryId,
     categories,
@@ -136,5 +179,12 @@ export default function useMarketplace() {
     isAppInfoModalOpen,
     isDisclaimerModalOpen,
     showDisclaimer,
+    data?.length,
+    isCategoriesPlaceholderData,
+    showContractList,
+    contractListModalType,
+    selectedDisplayType,
+    handleDisplayTypeChange,
+    hasPreviousStep,
   ]);
 }
diff --git a/ui/marketplace/useMarketplaceApps.tsx b/ui/marketplace/useMarketplaceApps.tsx
index 0e07ca2893..8aca496b9c 100644
--- a/ui/marketplace/useMarketplaceApps.tsx
+++ b/ui/marketplace/useMarketplaceApps.tsx
@@ -1,53 +1,111 @@
 import { useQuery } from '@tanstack/react-query';
 import React from 'react';
 
-import type { MarketplaceAppOverview } from 'types/client/marketplace';
+import type { MarketplaceAppWithSecurityReport } from 'types/client/marketplace';
 import { MarketplaceCategory } from 'types/client/marketplace';
 
 import config from 'configs/app';
 import type { ResourceError } from 'lib/api/resources';
-import useApiFetch from 'lib/hooks/useFetch';
+import useApiFetch from 'lib/api/useApiFetch';
+import useFetch from 'lib/hooks/useFetch';
 import { MARKETPLACE_APP } from 'stubs/marketplace';
 
+import useSecurityReports from './useSecurityReports';
+
 const feature = config.features.marketplace;
-const configUrl = feature.isEnabled ? feature.configUrl : '';
 
-function isAppNameMatches(q: string, app: MarketplaceAppOverview) {
+function isAppNameMatches(q: string, app: MarketplaceAppWithSecurityReport) {
   return app.title.toLowerCase().includes(q.toLowerCase());
 }
 
-function isAppCategoryMatches(category: string, app: MarketplaceAppOverview, favoriteApps: Array<string>) {
+function isAppCategoryMatches(category: string, app: MarketplaceAppWithSecurityReport, favoriteApps: Array<string>) {
   return category === MarketplaceCategory.ALL ||
       (category === MarketplaceCategory.FAVORITES && favoriteApps.includes(app.id)) ||
       app.categories.includes(category);
 }
 
-export default function useMarketplaceApps(filter: string, selectedCategoryId: string = MarketplaceCategory.ALL, favoriteApps: Array<string> = []) {
+function sortApps(apps: Array<MarketplaceAppWithSecurityReport>, favoriteApps: Array<string>) {
+  return apps.sort((a, b) => {
+    const priorityA = a.priority || 0;
+    const priorityB = b.priority || 0;
+    // First, sort by favorite apps
+    if (favoriteApps.includes(a.id) !== favoriteApps.includes(b.id)) {
+      return favoriteApps.includes(a.id) ? -1 : 1;
+    }
+    // Then sort by priority (descending)
+    if (priorityB !== priorityA) {
+      return priorityB - priorityA;
+    }
+    // If priority is the same, sort by internalWallet (true first)
+    if (a.internalWallet !== b.internalWallet) {
+      return a.internalWallet ? -1 : 1;
+    }
+    // If internalWallet is also the same, sort by external (false first)
+    if (a.external !== b.external) {
+      return a.external ? 1 : -1;
+    }
+    // If all criteria are the same, keep original order (stable sort)
+    return 0;
+  });
+}
+
+export default function useMarketplaceApps(
+  filter: string,
+  selectedCategoryId: string = MarketplaceCategory.ALL,
+  favoriteApps: Array<string> | undefined = undefined,
+  isFavoriteAppsLoaded: boolean = false, // eslint-disable-line @typescript-eslint/no-inferrable-types
+) {
+  const fetch = useFetch();
   const apiFetch = useApiFetch();
-  const { isPlaceholderData, isError, error, data } = useQuery<unknown, ResourceError<unknown>, Array<MarketplaceAppOverview>>({
-    queryKey: [ 'marketplace-apps' ],
-    queryFn: async() => apiFetch(configUrl, undefined, { resource: 'marketplace-apps' }),
-    select: (data) => (data as Array<MarketplaceAppOverview>).sort((a, b) => a.title.localeCompare(b.title)),
+
+  const { data: securityReports, isPlaceholderData: isSecurityReportsPlaceholderData } = useSecurityReports();
+
+  // Update favorite apps only when selectedCategoryId changes to avoid sortApps to be called on each favorite app click
+  const [ snapshotFavoriteApps, setSnapshotFavoriteApps ] = React.useState<Array<string> | undefined>();
+
+  React.useEffect(() => {
+    if (isFavoriteAppsLoaded) {
+      setSnapshotFavoriteApps(favoriteApps);
+    }
+  }, [ selectedCategoryId, isFavoriteAppsLoaded ]); // eslint-disable-line react-hooks/exhaustive-deps
+
+  const { isPlaceholderData, isError, error, data } = useQuery<unknown, ResourceError<unknown>, Array<MarketplaceAppWithSecurityReport>>({
+    queryKey: [ 'marketplace-dapps', snapshotFavoriteApps, favoriteApps ],
+    queryFn: async() => {
+      if (!feature.isEnabled) {
+        return [];
+      } else if ('configUrl' in feature) {
+        return fetch<Array<MarketplaceAppWithSecurityReport>, unknown>(feature.configUrl, undefined, { resource: 'marketplace-dapps' });
+      } else {
+        return apiFetch('marketplace_dapps', { pathParams: { chainId: config.chain.id } });
+      }
+    },
+    select: (data) => sortApps(data as Array<MarketplaceAppWithSecurityReport>, snapshotFavoriteApps || []),
     placeholderData: feature.isEnabled ? Array(9).fill(MARKETPLACE_APP) : undefined,
     staleTime: Infinity,
-    enabled: feature.isEnabled,
+    enabled: feature.isEnabled && (!favoriteApps || Boolean(snapshotFavoriteApps)),
   });
 
+  const appsWithSecurityReports = React.useMemo(() =>
+    data?.map((app) => ({ ...app, securityReport: securityReports?.[app.id] })),
+  [ data, securityReports ]);
+
   const displayedApps = React.useMemo(() => {
-    return data?.filter(app => isAppNameMatches(filter, app) && isAppCategoryMatches(selectedCategoryId, app, favoriteApps)) || [];
-  }, [ selectedCategoryId, data, filter, favoriteApps ]);
+    return appsWithSecurityReports?.filter(app => isAppNameMatches(filter, app) && isAppCategoryMatches(selectedCategoryId, app, favoriteApps || [])) || [];
+  }, [ selectedCategoryId, appsWithSecurityReports, filter, favoriteApps ]);
 
   return React.useMemo(() => ({
     data,
     displayedApps,
     error,
     isError,
-    isPlaceholderData,
+    isPlaceholderData: isPlaceholderData || isSecurityReportsPlaceholderData,
   }), [
     data,
     displayedApps,
     error,
     isError,
     isPlaceholderData,
+    isSecurityReportsPlaceholderData,
   ]);
 }
diff --git a/ui/marketplace/useMarketplaceCategories.tsx b/ui/marketplace/useMarketplaceCategories.tsx
new file mode 100644
index 0000000000..68b2a8f542
--- /dev/null
+++ b/ui/marketplace/useMarketplaceCategories.tsx
@@ -0,0 +1,57 @@
+import { useQuery } from '@tanstack/react-query';
+import React from 'react';
+
+import type { MarketplaceAppOverview } from 'types/client/marketplace';
+
+import config from 'configs/app';
+import type { ResourceError } from 'lib/api/resources';
+import useApiFetch from 'lib/hooks/useFetch';
+import { CATEGORIES } from 'stubs/marketplace';
+
+const feature = config.features.marketplace;
+const categoriesUrl = (feature.isEnabled && feature.categoriesUrl) || '';
+
+export default function useMarketplaceCategories(apps: Array<MarketplaceAppOverview> | undefined, isAppsPlaceholderData: boolean) {
+  const apiFetch = useApiFetch();
+
+  const { isPlaceholderData, data } = useQuery<unknown, ResourceError<unknown>, Array<string>>({
+    queryKey: [ 'marketplace-categories' ],
+    queryFn: async() => apiFetch(categoriesUrl, undefined, { resource: 'marketplace-categories' }),
+    placeholderData: categoriesUrl ? CATEGORIES : undefined,
+    staleTime: Infinity,
+    enabled: Boolean(categoriesUrl),
+  });
+
+  const categories = React.useMemo(() => {
+    if (isAppsPlaceholderData || isPlaceholderData) {
+      return CATEGORIES.map(category => ({ name: category, count: 0 }));
+    }
+
+    let categoryNames: Array<string> = [];
+    const grouped: { [key: string]: number } = {};
+
+    apps?.forEach(app => {
+      app.categories.forEach(category => {
+        if (grouped[category] === undefined) {
+          grouped[category] = 0;
+        }
+        grouped[category]++;
+      });
+    });
+
+    if (data?.length && !isPlaceholderData) {
+      categoryNames = data;
+    } else {
+      categoryNames = Object.keys(grouped);
+    }
+
+    return categoryNames
+      .map(category => ({ name: category, count: grouped[category] || 0 }))
+      .filter(c => c.count > 0);
+  }, [ apps, isAppsPlaceholderData, data, isPlaceholderData ]);
+
+  return React.useMemo(() => ({
+    isPlaceholderData: isAppsPlaceholderData || isPlaceholderData,
+    data: categories,
+  }), [ isPlaceholderData, isAppsPlaceholderData, categories ]);
+}
diff --git a/ui/marketplace/useMarketplaceWallet.tsx b/ui/marketplace/useMarketplaceWallet.tsx
index 17370ea6bd..24e2f6858c 100644
--- a/ui/marketplace/useMarketplaceWallet.tsx
+++ b/ui/marketplace/useMarketplaceWallet.tsx
@@ -1,14 +1,15 @@
 import type { TypedData } from 'abitype';
 import { useCallback } from 'react';
 import type { Account, SignTypedDataParameters } from 'viem';
-import { useAccount, useSendTransaction, useSwitchNetwork, useNetwork, useSignMessage, useSignTypedData } from 'wagmi';
+import { useAccount, useSendTransaction, useSwitchChain, useSignMessage, useSignTypedData } from 'wagmi';
 
 import config from 'configs/app';
+import * as mixpanel from 'lib/mixpanel/index';
 
 type SendTransactionArgs = {
   chainId?: number;
   mode?: 'prepared';
-  to: string;
+  to: `0x${ string }`;
 };
 
 export type SignTypedDataArgs<
@@ -20,31 +21,39 @@ export type SignTypedDataArgs<
   TPrimaryType extends string = string,
 > = SignTypedDataParameters<TTypedData, TPrimaryType, Account>;
 
-export default function useMarketplaceWallet() {
-  const { address } = useAccount();
-  const { chain } = useNetwork();
+export default function useMarketplaceWallet(appId: string) {
+  const { address, chainId } = useAccount();
   const { sendTransactionAsync } = useSendTransaction();
   const { signMessageAsync } = useSignMessage();
   const { signTypedDataAsync } = useSignTypedData();
-  const { switchNetworkAsync } = useSwitchNetwork({ chainId: Number(config.chain.id) });
+  const { switchChainAsync } = useSwitchChain();
+
+  const logEvent = useCallback((event: mixpanel.EventPayload<mixpanel.EventTypes.WALLET_ACTION>['Action']) => {
+    mixpanel.logEvent(
+      mixpanel.EventTypes.WALLET_ACTION,
+      { Action: event, Address: address, AppId: appId },
+    );
+  }, [ address, appId ]);
 
   const switchNetwork = useCallback(async() => {
-    if (Number(config.chain.id) !== chain?.id) {
-      await switchNetworkAsync?.();
+    if (Number(config.chain.id) !== chainId) {
+      await switchChainAsync?.({ chainId: Number(config.chain.id) });
     }
-  }, [ chain, switchNetworkAsync ]);
+  }, [ chainId, switchChainAsync ]);
 
   const sendTransaction = useCallback(async(transaction: SendTransactionArgs) => {
     await switchNetwork();
     const tx = await sendTransactionAsync(transaction);
-    return tx.hash;
-  }, [ sendTransactionAsync, switchNetwork ]);
+    logEvent('Send Transaction');
+    return tx;
+  }, [ sendTransactionAsync, switchNetwork, logEvent ]);
 
   const signMessage = useCallback(async(message: string) => {
     await switchNetwork();
     const signature = await signMessageAsync({ message });
+    logEvent('Sign Message');
     return signature;
-  }, [ signMessageAsync, switchNetwork ]);
+  }, [ signMessageAsync, switchNetwork, logEvent ]);
 
   const signTypedData = useCallback(async(typedData: SignTypedDataArgs) => {
     await switchNetwork();
@@ -52,8 +61,9 @@ export default function useMarketplaceWallet() {
       typedData.domain.chainId = Number(typedData.domain.chainId);
     }
     const signature = await signTypedDataAsync(typedData);
+    logEvent('Sign Typed Data');
     return signature;
-  }, [ signTypedDataAsync, switchNetwork ]);
+  }, [ signTypedDataAsync, switchNetwork, logEvent ]);
 
   return {
     address,
diff --git a/ui/marketplace/useSecurityReports.tsx b/ui/marketplace/useSecurityReports.tsx
new file mode 100644
index 0000000000..c15aef2d8a
--- /dev/null
+++ b/ui/marketplace/useSecurityReports.tsx
@@ -0,0 +1,35 @@
+import { useQuery } from '@tanstack/react-query';
+
+import type { MarketplaceAppSecurityReport, MarketplaceAppSecurityReportRaw } from 'types/client/marketplace';
+
+import config from 'configs/app';
+import type { ResourceError } from 'lib/api/resources';
+import useApiFetch from 'lib/hooks/useFetch';
+
+const feature = config.features.marketplace;
+const securityReportsUrl = (feature.isEnabled && feature.securityReportsUrl) || '';
+
+export default function useSecurityReports() {
+  const apiFetch = useApiFetch();
+
+  return useQuery<unknown, ResourceError<unknown>, Record<string, MarketplaceAppSecurityReport>>({
+    queryKey: [ 'marketplace-security-reports' ],
+    queryFn: async() => apiFetch(securityReportsUrl, undefined, { resource: 'marketplace-security-reports' }),
+    select: (data) => {
+      const securityReports: Record<string, MarketplaceAppSecurityReport> = {};
+      (data as Array<MarketplaceAppSecurityReportRaw>).forEach((item) => {
+        const report = item.chainsData[config.chain.id || ''];
+        if (report) {
+          const issues: Record<string, number> = report.overallInfo.issueSeverityDistribution;
+          report.overallInfo.totalIssues = Object.values(issues).reduce((acc, val) => acc + val, 0);
+          report.overallInfo.securityScore = Number(report.overallInfo.securityScore.toFixed(2));
+        }
+        securityReports[item.appName] = report;
+      });
+      return securityReports;
+    },
+    placeholderData: securityReportsUrl ? {} : undefined,
+    staleTime: Infinity,
+    enabled: Boolean(securityReportsUrl),
+  });
+}
diff --git a/ui/nameDomain/NameDomainDetails.tsx b/ui/nameDomain/NameDomainDetails.tsx
new file mode 100644
index 0000000000..91a74c95ee
--- /dev/null
+++ b/ui/nameDomain/NameDomainDetails.tsx
@@ -0,0 +1,176 @@
+import { Grid, Skeleton, Tooltip, Flex } from '@chakra-ui/react';
+import type { UseQueryResult } from '@tanstack/react-query';
+import React from 'react';
+
+import type { EnsDomainDetailed } from 'types/api/ens';
+
+import { route } from 'nextjs-routes';
+
+import type { ResourceError } from 'lib/api/resources';
+import dayjs from 'lib/date/dayjs';
+import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import NftEntity from 'ui/shared/entities/nft/NftEntity';
+import IconSvg from 'ui/shared/IconSvg';
+import LinkInternal from 'ui/shared/LinkInternal';
+import TextSeparator from 'ui/shared/TextSeparator';
+
+import NameDomainExpiryStatus from './NameDomainExpiryStatus';
+
+interface Props {
+  query: UseQueryResult<EnsDomainDetailed, ResourceError<unknown>>;
+}
+
+const NameDomainDetails = ({ query }: Props) => {
+  const isLoading = query.isPlaceholderData;
+
+  const otherAddresses = Object.entries(query.data?.other_addresses ?? {});
+  const hasExpired = query.data?.expiry_date && dayjs(query.data.expiry_date).isBefore(dayjs());
+
+  return (
+    <Grid columnGap={ 8 } rowGap={ 3 } templateColumns={{ base: 'minmax(0, 1fr)', lg: 'max-content minmax(728px, auto)' }}>
+      { query.data?.registration_date && (
+        <DetailsInfoItem
+          title="Registration date"
+          hint="The date the name was registered"
+          isLoading={ isLoading }
+        >
+          <IconSvg name="clock" boxSize={ 5 } color="gray.500" verticalAlign="middle" isLoading={ isLoading } mr={ 2 }/>
+          <Skeleton isLoaded={ !isLoading } display="inline" whiteSpace="pre-wrap" lineHeight="20px">
+            { dayjs(query.data.registration_date).format('llll') }
+          </Skeleton>
+        </DetailsInfoItem>
+      ) }
+      { query.data?.expiry_date && (
+        <DetailsInfoItem
+          title="Expiration date"
+          // eslint-disable-next-line max-len
+          hint="The date the name expires, upon which there is a 90 day grace period for the owner to renew. After the 90 days, the name is released to the market"
+          isLoading={ isLoading }
+          display="inline-block"
+        >
+          <IconSvg name="clock" boxSize={ 5 } color="gray.500" verticalAlign="middle" isLoading={ isLoading } mr={ 2 } mt="-2px"/>
+          { hasExpired && (
+            <>
+              <Skeleton isLoaded={ !isLoading } display="inline" whiteSpace="pre-wrap" lineHeight="24px">
+                { dayjs(query.data.expiry_date).fromNow() }
+              </Skeleton>
+              <TextSeparator color="gray.500"/>
+            </>
+          ) }
+          <Skeleton isLoaded={ !isLoading } display="inline" whiteSpace="pre-wrap" lineHeight="24px">
+            { dayjs(query.data.expiry_date).format('llll') }
+          </Skeleton>
+          <TextSeparator color="gray.500"/>
+          <Skeleton isLoaded={ !isLoading } color="text_secondary" display="inline">
+            <NameDomainExpiryStatus date={ query.data?.expiry_date }/>
+          </Skeleton>
+        </DetailsInfoItem>
+      ) }
+      { query.data?.registrant && (
+        <DetailsInfoItem
+          title="Registrant"
+          hint="The account that owns the domain name and has the rights to edit its ownership and records"
+          isLoading={ isLoading }
+          columnGap={ 2 }
+          flexWrap="nowrap"
+        >
+          <AddressEntity
+            address={ query.data.registrant }
+            isLoading={ isLoading }
+          />
+          <Tooltip label="Lookup for related domain names">
+            <LinkInternal
+              flexShrink={ 0 }
+              display="inline-flex"
+              href={ route({ pathname: '/name-domains', query: { owned_by: 'true', resolved_to: 'true', address: query.data.registrant.hash } }) }
+            >
+              <IconSvg name="search" boxSize={ 5 } isLoading={ isLoading }/>
+            </LinkInternal>
+          </Tooltip>
+        </DetailsInfoItem>
+      ) }
+      { query.data?.owner && (
+        <DetailsInfoItem
+          title="Owner"
+          hint="The account that owns the rights to edit the records of this domain name"
+          isLoading={ isLoading }
+          columnGap={ 2 }
+          flexWrap="nowrap"
+        >
+          <AddressEntity
+            address={ query.data.owner }
+            isLoading={ isLoading }
+          />
+          <Tooltip label="Lookup for related domain names">
+            <LinkInternal
+              flexShrink={ 0 }
+              display="inline-flex"
+              href={ route({ pathname: '/name-domains', query: { owned_by: 'true', resolved_to: 'true', address: query.data.owner.hash } }) }
+            >
+              <IconSvg name="search" boxSize={ 5 } isLoading={ isLoading }/>
+            </LinkInternal>
+          </Tooltip>
+        </DetailsInfoItem>
+      ) }
+      { query.data?.wrapped_owner && (
+        <DetailsInfoItem
+          title="Manager"
+          hint="Owner of this NFT domain in NameWrapper contract"
+          isLoading={ isLoading }
+          columnGap={ 2 }
+          flexWrap="nowrap"
+        >
+          <AddressEntity
+            address={ query.data.wrapped_owner }
+            isLoading={ isLoading }
+          />
+          <Tooltip label="Lookup for related domain names">
+            <LinkInternal
+              flexShrink={ 0 }
+              display="inline-flex"
+              href={ route({ pathname: '/name-domains', query: { owned_by: 'true', resolved_to: 'true', address: query.data.wrapped_owner.hash } }) }
+            >
+              <IconSvg name="search" boxSize={ 5 } isLoading={ isLoading }/>
+            </LinkInternal>
+          </Tooltip>
+        </DetailsInfoItem>
+      ) }
+      { query.data?.tokens.map((token) => (
+        <DetailsInfoItem
+          key={ token.type }
+          title={ token.type === 'WRAPPED_DOMAIN_TOKEN' ? 'Wrapped token ID' : 'Token ID' }
+          hint={ `The ${ token.type === 'WRAPPED_DOMAIN_TOKEN' ? 'wrapped ' : '' }token ID of this domain name NFT` }
+          isLoading={ isLoading }
+          wordBreak="break-all"
+          whiteSpace="pre-wrap"
+        >
+          <NftEntity hash={ token.contract_hash } id={ token.id } isLoading={ isLoading } noIcon/>
+        </DetailsInfoItem>
+      )) }
+      { otherAddresses.length > 0 && (
+        <DetailsInfoItem
+          title="Other addresses"
+          hint="Other cryptocurrency addresses added to this domain name"
+          isLoading={ isLoading }
+          flexDir="column"
+          alignItems="flex-start"
+        >
+          { otherAddresses.map(([ type, address ]) => (
+            <Flex key={ type } columnGap={ 2 } minW="0" w="100%" overflow="hidden">
+              <Skeleton isLoaded={ !isLoading }>{ type }</Skeleton>
+              <AddressEntity
+                address={{ hash: address }}
+                isLoading={ isLoading }
+                noLink
+                noIcon
+              />
+            </Flex>
+          )) }
+        </DetailsInfoItem>
+      ) }
+    </Grid>
+  );
+};
+
+export default React.memo(NameDomainDetails);
diff --git a/ui/nameDomain/NameDomainExpiryStatus.tsx b/ui/nameDomain/NameDomainExpiryStatus.tsx
new file mode 100644
index 0000000000..4a6460d068
--- /dev/null
+++ b/ui/nameDomain/NameDomainExpiryStatus.tsx
@@ -0,0 +1,29 @@
+import { chakra } from '@chakra-ui/react';
+import React from 'react';
+
+import dayjs from 'lib/date/dayjs';
+
+interface Props {
+  date: string | undefined;
+}
+
+const NameDomainExpiryStatus = ({ date }: Props) => {
+  if (!date) {
+    return null;
+  }
+
+  const hasExpired = dayjs(date).isBefore(dayjs());
+
+  if (hasExpired) {
+    return <chakra.span color="red.600">Expired</chakra.span>;
+  }
+
+  const diff = dayjs(date).diff(dayjs(), 'day');
+  if (diff < 30) {
+    return <chakra.span color="red.600">{ diff } days left</chakra.span>;
+  }
+
+  return <chakra.span color="text_secondary">Expires { dayjs(date).fromNow() }</chakra.span>;
+};
+
+export default React.memo(NameDomainExpiryStatus);
diff --git a/ui/nameDomain/NameDomainHistory.tsx b/ui/nameDomain/NameDomainHistory.tsx
new file mode 100644
index 0000000000..ba5747ad46
--- /dev/null
+++ b/ui/nameDomain/NameDomainHistory.tsx
@@ -0,0 +1,67 @@
+import { Box, Hide, Show } from '@chakra-ui/react';
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import config from 'configs/app';
+import useApiQuery from 'lib/api/useApiQuery';
+import getQueryParamString from 'lib/router/getQueryParamString';
+import { ENS_DOMAIN_EVENT } from 'stubs/ENS';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+
+import NameDomainHistoryListItem from './history/NameDomainHistoryListItem';
+import NameDomainHistoryTable from './history/NameDomainHistoryTable';
+import { getNextSortValue, type Sort, type SortField } from './history/utils';
+
+const NameDomainHistory = () => {
+  const router = useRouter();
+  const domainName = getQueryParamString(router.query.name);
+
+  const [ sort, setSort ] = React.useState<Sort>();
+
+  const { isPlaceholderData, isError, data } = useApiQuery('domain_events', {
+    pathParams: { name: domainName, chainId: config.chain.id },
+    queryOptions: {
+      placeholderData: { items: Array(4).fill(ENS_DOMAIN_EVENT) },
+    },
+  });
+
+  const handleSortToggle = React.useCallback((event: React.MouseEvent) => {
+    if (isPlaceholderData) {
+      return;
+    }
+    const field = (event.currentTarget as HTMLDivElement).getAttribute('data-field') as SortField | undefined;
+
+    if (field) {
+      setSort(getNextSortValue(field));
+    }
+  }, [ isPlaceholderData ]);
+
+  const content = (
+    <>
+      <Show below="lg" ssr={ false }>
+        <Box>
+          { data?.items.map((item, index) => <NameDomainHistoryListItem key={ index } { ...item } isLoading={ isPlaceholderData }/>) }
+        </Box>
+      </Show>
+      <Hide below="lg" ssr={ false }>
+        <NameDomainHistoryTable
+          data={ data }
+          isLoading={ isPlaceholderData }
+          sort={ sort }
+          onSortToggle={ handleSortToggle }
+        />
+      </Hide>
+    </>
+  );
+
+  return (
+    <DataListDisplay
+      isError={ isError }
+      items={ data?.items }
+      emptyText="There are no events for this domain."
+      content={ content }
+    />
+  );
+};
+
+export default React.memo(NameDomainHistory);
diff --git a/ui/nameDomain/history/NameDomainHistoryListItem.tsx b/ui/nameDomain/history/NameDomainHistoryListItem.tsx
new file mode 100644
index 0000000000..11cf9877fa
--- /dev/null
+++ b/ui/nameDomain/history/NameDomainHistoryListItem.tsx
@@ -0,0 +1,52 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { EnsDomainEvent } from 'types/api/ens';
+
+import dayjs from 'lib/date/dayjs';
+import Tag from 'ui/shared/chakra/Tag';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
+
+type Props = EnsDomainEvent & {
+  isLoading?: boolean;
+}
+
+const NameDomainHistoryListItem = ({ isLoading, transaction_hash: transactionHash, timestamp, from_address: fromAddress, action }: Props) => {
+  return (
+    <ListItemMobileGrid.Container>
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Txn hash</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <TxEntity hash={ transactionHash } isLoading={ isLoading } fontWeight={ 500 } truncation="constant_long"/>
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Age</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <Skeleton isLoaded={ !isLoading } color="text_secondary" display="inline-block">
+          <span>{ dayjs(timestamp).fromNow() }</span>
+        </Skeleton>
+      </ListItemMobileGrid.Value>
+
+      { fromAddress && (
+        <>
+          <ListItemMobileGrid.Label isLoading={ isLoading }>From</ListItemMobileGrid.Label>
+          <ListItemMobileGrid.Value>
+            <AddressEntity address={ fromAddress } isLoading={ isLoading } truncation="constant"/>
+          </ListItemMobileGrid.Value>
+        </>
+      ) }
+
+      { action && (
+        <>
+          <ListItemMobileGrid.Label isLoading={ isLoading }>Method</ListItemMobileGrid.Label>
+          <ListItemMobileGrid.Value>
+            <Tag colorScheme="gray" isLoading={ isLoading }>{ action }</Tag>
+          </ListItemMobileGrid.Value>
+        </>
+      ) }
+    </ListItemMobileGrid.Container>
+  );
+};
+
+export default React.memo(NameDomainHistoryListItem);
diff --git a/ui/nameDomain/history/NameDomainHistoryTable.tsx b/ui/nameDomain/history/NameDomainHistoryTable.tsx
new file mode 100644
index 0000000000..f6560372eb
--- /dev/null
+++ b/ui/nameDomain/history/NameDomainHistoryTable.tsx
@@ -0,0 +1,60 @@
+import { Table, Tbody, Tr, Th, Link } from '@chakra-ui/react';
+import React from 'react';
+
+import type { EnsDomainEventsResponse } from 'types/api/ens';
+
+import IconSvg from 'ui/shared/IconSvg';
+import { default as Thead } from 'ui/shared/TheadSticky';
+
+import NameDomainHistoryTableItem from './NameDomainHistoryTableItem';
+import type { Sort } from './utils';
+import { sortFn } from './utils';
+
+interface Props {
+  data: EnsDomainEventsResponse | undefined;
+  isLoading?: boolean;
+  sort: Sort | undefined;
+  onSortToggle: (event: React.MouseEvent) => void;
+}
+
+const NameDomainHistoryTable = ({ data, isLoading, sort, onSortToggle }: Props) => {
+  const sortIconTransform = sort?.includes('asc') ? 'rotate(-90deg)' : 'rotate(90deg)';
+
+  return (
+    <Table variant="simple" size="sm">
+      <Thead top={ 0 }>
+        <Tr>
+          <Th width="25%">Txn hash</Th>
+          <Th width="25%" pl={ 9 }>
+            <Link display="flex" alignItems="center" justifyContent="flex-start" position="relative" data-field="timestamp" onClick={ onSortToggle }>
+              { sort?.includes('timestamp') && (
+                <IconSvg
+                  name="arrows/east"
+                  boxSize={ 4 }
+                  transform={ sortIconTransform }
+                  color="link"
+                  position="absolute"
+                  left={ -5 }
+                  top={ 0 }
+                />
+              ) }
+              <span>Age</span>
+            </Link>
+          </Th>
+          <Th width="25%">From</Th>
+          <Th width="25%">Method</Th>
+        </Tr>
+      </Thead>
+      <Tbody>
+        {
+          data?.items
+            .slice()
+            .sort(sortFn(sort))
+            .map((item, index) => <NameDomainHistoryTableItem key={ index } { ...item } isLoading={ isLoading }/>)
+        }
+      </Tbody>
+    </Table>
+  );
+};
+
+export default React.memo(NameDomainHistoryTable);
diff --git a/ui/nameDomain/history/NameDomainHistoryTableItem.tsx b/ui/nameDomain/history/NameDomainHistoryTableItem.tsx
new file mode 100644
index 0000000000..ff28b0ffe3
--- /dev/null
+++ b/ui/nameDomain/history/NameDomainHistoryTableItem.tsx
@@ -0,0 +1,43 @@
+import { Tr, Td, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { EnsDomainEvent } from 'types/api/ens';
+
+import dayjs from 'lib/date/dayjs';
+import Tag from 'ui/shared/chakra/Tag';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+
+type Props = EnsDomainEvent & {
+  isLoading?: boolean;
+}
+
+const NameDomainHistoryTableItem = ({ isLoading, transaction_hash: transactionHash, from_address: fromAddress, action, timestamp }: Props) => {
+
+  return (
+    <Tr>
+      <Td verticalAlign="middle">
+        <TxEntity
+          hash={ transactionHash }
+          isLoading={ isLoading }
+          fontWeight={ 700 }
+          noIcon
+          truncation="constant_long"
+        />
+      </Td>
+      <Td pl={ 9 } verticalAlign="middle">
+        <Skeleton isLoaded={ !isLoading } color="text_secondary" display="inline-block">
+          <span>{ dayjs(timestamp).fromNow() }</span>
+        </Skeleton>
+      </Td>
+      <Td verticalAlign="middle">
+        { fromAddress && <AddressEntity address={ fromAddress } isLoading={ isLoading } truncation="constant"/> }
+      </Td>
+      <Td verticalAlign="middle">
+        { action && <Tag colorScheme="gray" isLoading={ isLoading }>{ action }</Tag> }
+      </Td>
+    </Tr>
+  );
+};
+
+export default React.memo(NameDomainHistoryTableItem);
diff --git a/ui/nameDomain/history/utils.ts b/ui/nameDomain/history/utils.ts
new file mode 100644
index 0000000000..168050df2d
--- /dev/null
+++ b/ui/nameDomain/history/utils.ts
@@ -0,0 +1,27 @@
+import type { EnsDomainEvent } from 'types/api/ens';
+
+import getNextSortValueShared from 'ui/shared/sort/getNextSortValue';
+
+export type SortField = 'timestamp';
+export type Sort = `${ SortField }-asc` | `${ SortField }-desc`;
+
+const SORT_SEQUENCE: Record<SortField, Array<Sort | undefined>> = {
+  timestamp: [ 'timestamp-desc', 'timestamp-asc', undefined ],
+};
+
+export const getNextSortValue = (getNextSortValueShared<SortField, Sort>).bind(undefined, SORT_SEQUENCE);
+
+export const sortFn = (sort: Sort | undefined) => (a: EnsDomainEvent, b: EnsDomainEvent) => {
+  switch (sort) {
+    case 'timestamp-asc': {
+      return b.timestamp.localeCompare(a.timestamp);
+    }
+
+    case 'timestamp-desc': {
+      return a.timestamp.localeCompare(b.timestamp);
+    }
+
+    default:
+      return 0;
+  }
+};
diff --git a/ui/nameDomains/NameDomainsActionBar.tsx b/ui/nameDomains/NameDomainsActionBar.tsx
new file mode 100644
index 0000000000..ff57107799
--- /dev/null
+++ b/ui/nameDomains/NameDomainsActionBar.tsx
@@ -0,0 +1,113 @@
+import { Checkbox, CheckboxGroup, HStack, Text } from '@chakra-ui/react';
+import React from 'react';
+
+import type { EnsDomainLookupFiltersOptions } from 'types/api/ens';
+import type { PaginationParams } from 'ui/shared/pagination/types';
+
+import useIsInitialLoading from 'lib/hooks/useIsInitialLoading';
+import ActionBar from 'ui/shared/ActionBar';
+import FilterInput from 'ui/shared/filters/FilterInput';
+import PopoverFilter from 'ui/shared/filters/PopoverFilter';
+import Pagination from 'ui/shared/pagination/Pagination';
+import Sort from 'ui/shared/sort/Sort';
+
+import type { Sort as TSort } from './utils';
+import { SORT_OPTIONS } from './utils';
+
+interface Props {
+  pagination: PaginationParams;
+  searchTerm: string | undefined;
+  onSearchChange: (value: string) => void;
+  filterValue: EnsDomainLookupFiltersOptions;
+  onFilterValueChange: (nextValue: EnsDomainLookupFiltersOptions) => void;
+  sort: TSort | undefined;
+  onSortChange: (nextValue: TSort | undefined) => void;
+  isLoading: boolean;
+  isAddressSearch: boolean;
+}
+
+const NameDomainsActionBar = ({
+  searchTerm,
+  onSearchChange,
+  filterValue,
+  onFilterValueChange,
+  sort,
+  onSortChange,
+  isLoading,
+  isAddressSearch,
+  pagination,
+}: Props) => {
+  const isInitialLoading = useIsInitialLoading(isLoading);
+
+  const searchInput = (
+    <FilterInput
+      w={{ base: '100%', lg: '360px' }}
+      minW={{ base: 'auto', lg: '250px' }}
+      size="xs"
+      onChange={ onSearchChange }
+      placeholder="Search by name"
+      initialValue={ searchTerm }
+      isLoading={ isInitialLoading }
+    />
+  );
+
+  const filter = (
+    <PopoverFilter appliedFiltersNum={ filterValue.length } contentProps={{ w: '220px' }} isLoading={ isInitialLoading }>
+      <div>
+        <CheckboxGroup size="lg" onChange={ onFilterValueChange } value={ filterValue } defaultValue={ filterValue }>
+          <Text variant="secondary" fontWeight={ 600 } mb={ 3 } fontSize="sm">Address</Text>
+          <Checkbox value="owned_by" display="block" isDisabled={ !isAddressSearch }>
+            Owned by
+          </Checkbox>
+          <Checkbox
+            value="resolved_to"
+            display="block"
+            mt={ 5 }
+            mb={ 4 }
+            pb={ 4 }
+            borderBottom="1px solid"
+            borderColor="divider"
+            isDisabled={ !isAddressSearch }
+          >
+            Resolved to address
+          </Checkbox>
+          <Text variant="secondary" fontWeight={ 600 } mb={ 3 } fontSize="sm">Status</Text>
+          <Checkbox value="with_inactive" display="block">
+            Include expired
+          </Checkbox>
+        </CheckboxGroup>
+      </div>
+    </PopoverFilter>
+  );
+
+  const sortButton = (
+    <Sort
+      options={ SORT_OPTIONS }
+      sort={ sort }
+      setSort={ onSortChange }
+      isLoading={ isInitialLoading }
+    />
+  );
+
+  return (
+    <>
+      <HStack spacing={ 3 } mb={ 6 } display={{ base: 'flex', lg: 'none' }}>
+        { filter }
+        { sortButton }
+        { searchInput }
+      </HStack>
+      <ActionBar
+        mt={ -6 }
+        display={{ base: pagination.isVisible ? 'flex' : 'none', lg: 'flex' }}
+      >
+        <HStack spacing={ 3 } display={{ base: 'none', lg: 'flex' }}>
+          { filter }
+          { searchInput }
+        </HStack>
+        <Pagination { ...pagination } ml="auto"/>
+      </ActionBar>
+    </>
+  );
+};
+
+export default React.memo(NameDomainsActionBar);
diff --git a/ui/nameDomains/NameDomainsListItem.tsx b/ui/nameDomains/NameDomainsListItem.tsx
new file mode 100644
index 0000000000..ac7275d9cc
--- /dev/null
+++ b/ui/nameDomains/NameDomainsListItem.tsx
@@ -0,0 +1,60 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { EnsDomain } from 'types/api/ens';
+
+import dayjs from 'lib/date/dayjs';
+import NameDomainExpiryStatus from 'ui/nameDomain/NameDomainExpiryStatus';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import EnsEntity from 'ui/shared/entities/ens/EnsEntity';
+import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
+
+interface Props extends EnsDomain {
+  isLoading: boolean;
+}
+
+const NameDomainsListItem = ({ name, isLoading, resolved_address: resolvedAddress, registration_date: registrationDate, expiry_date: expiryDate }: Props) => {
+  return (
+    <ListItemMobileGrid.Container>
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Domain</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <EnsEntity name={ name } isLoading={ isLoading } fontWeight={ 500 }/>
+      </ListItemMobileGrid.Value>
+
+      { resolvedAddress && (
+        <>
+          <ListItemMobileGrid.Label isLoading={ isLoading }>Address</ListItemMobileGrid.Label>
+          <ListItemMobileGrid.Value>
+            <AddressEntity address={ resolvedAddress } isLoading={ isLoading } fontWeight={ 500 }/>
+          </ListItemMobileGrid.Value>
+        </>
+      ) }
+
+      { registrationDate && (
+        <>
+          <ListItemMobileGrid.Label isLoading={ isLoading }>Registered on</ListItemMobileGrid.Label>
+          <ListItemMobileGrid.Value>
+            <Skeleton isLoaded={ !isLoading }>
+              <div>{ dayjs(registrationDate).format('MMM DD YYYY HH:mm:ss A') }</div>
+              <div> { dayjs(registrationDate).fromNow() }</div>
+            </Skeleton>
+          </ListItemMobileGrid.Value>
+        </>
+      ) }
+
+      { expiryDate && (
+        <>
+          <ListItemMobileGrid.Label isLoading={ isLoading }>Expiration date</ListItemMobileGrid.Label>
+          <ListItemMobileGrid.Value>
+            <Skeleton isLoaded={ !isLoading } whiteSpace="pre-wrap">
+              <div>{ dayjs(expiryDate).format('MMM DD YYYY HH:mm:ss A') } </div>
+              <NameDomainExpiryStatus date={ expiryDate }/>
+            </Skeleton>
+          </ListItemMobileGrid.Value>
+        </>
+      ) }
+    </ListItemMobileGrid.Container>
+  );
+};
+
+export default React.memo(NameDomainsListItem);
diff --git a/ui/nameDomains/NameDomainsTable.tsx b/ui/nameDomains/NameDomainsTable.tsx
new file mode 100644
index 0000000000..ec46b7cec8
--- /dev/null
+++ b/ui/nameDomains/NameDomainsTable.tsx
@@ -0,0 +1,54 @@
+import { Table, Tbody, Tr, Th, Link } from '@chakra-ui/react';
+import React from 'react';
+
+import type { EnsDomainLookupResponse } from 'types/api/ens';
+
+import IconSvg from 'ui/shared/IconSvg';
+import { default as Thead } from 'ui/shared/TheadSticky';
+
+import NameDomainsTableItem from './NameDomainsTableItem';
+import { type Sort } from './utils';
+
+interface Props {
+  data: EnsDomainLookupResponse | undefined;
+  isLoading?: boolean;
+  sort: Sort | undefined;
+  onSortToggle: (event: React.MouseEvent) => void;
+}
+
+const NameDomainsTable = ({ data, isLoading, sort, onSortToggle }: Props) => {
+  const sortIconTransform = sort?.toLowerCase().includes('asc') ? 'rotate(-90deg)' : 'rotate(90deg)';
+
+  return (
+    <Table variant="simple" size="sm">
+      <Thead top={ 80 }>
+        <Tr>
+          <Th width="25%">Domain</Th>
+          <Th width="25%">Address</Th>
+          <Th width="25%" pl={ 9 }>
+            <Link display="flex" alignItems="center" justifyContent="flex-start" position="relative" data-field="registration_date" onClick={ onSortToggle }>
+              { sort?.includes('registration_date') && (
+                <IconSvg
+                  name="arrows/east"
+                  boxSize={ 4 }
+                  transform={ sortIconTransform }
+                  color="link"
+                  position="absolute"
+                  left={ -5 }
+                  top={ 0 }
+                />
+              ) }
+              <span>Registered on</span>
+            </Link>
+          </Th>
+          <Th width="25%">Expiration date</Th>
+        </Tr>
+      </Thead>
+      <Tbody>
+        { data?.items.map((item, index) => <NameDomainsTableItem key={ index } { ...item } isLoading={ isLoading }/>) }
+      </Tbody>
+    </Table>
+  );
+};
+
+export default React.memo(NameDomainsTable);
diff --git a/ui/nameDomains/NameDomainsTableItem.tsx b/ui/nameDomains/NameDomainsTableItem.tsx
new file mode 100644
index 0000000000..a4147ae8cf
--- /dev/null
+++ b/ui/nameDomains/NameDomainsTableItem.tsx
@@ -0,0 +1,45 @@
+import { chakra, Tr, Td, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { EnsDomain } from 'types/api/ens';
+
+import dayjs from 'lib/date/dayjs';
+import NameDomainExpiryStatus from 'ui/nameDomain/NameDomainExpiryStatus';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import EnsEntity from 'ui/shared/entities/ens/EnsEntity';
+
+type Props = EnsDomain & {
+  isLoading?: boolean;
+}
+
+const NameDomainsTableItem = ({ isLoading, name, resolved_address: resolvedAddress, registration_date: registrationDate, expiry_date: expiryDate }: Props) => {
+
+  return (
+    <Tr>
+      <Td verticalAlign="middle">
+        <EnsEntity name={ name } isLoading={ isLoading } fontWeight={ 600 }/>
+      </Td>
+      <Td verticalAlign="middle">
+        { resolvedAddress && <AddressEntity address={ resolvedAddress } isLoading={ isLoading } fontWeight={ 500 }/> }
+      </Td>
+      <Td verticalAlign="middle" pl={ 9 }>
+        { registrationDate && (
+          <Skeleton isLoaded={ !isLoading }>
+            { dayjs(registrationDate).format('MMM DD YYYY HH:mm:ss A') }
+            <chakra.span color="text_secondary"> { dayjs(registrationDate).fromNow() }</chakra.span>
+          </Skeleton>
+        ) }
+      </Td>
+      <Td verticalAlign="middle">
+        { expiryDate && (
+          <Skeleton isLoaded={ !isLoading } whiteSpace="pre-wrap">
+            <span>{ dayjs(expiryDate).format('MMM DD YYYY HH:mm:ss A') } </span>
+            <NameDomainExpiryStatus date={ expiryDate }/>
+          </Skeleton>
+        ) }
+      </Td>
+    </Tr>
+  );
+};
+
+export default React.memo(NameDomainsTableItem);
diff --git a/ui/nameDomains/utils.ts b/ui/nameDomains/utils.ts
new file mode 100644
index 0000000000..c240e5c93e
--- /dev/null
+++ b/ui/nameDomains/utils.ts
@@ -0,0 +1,19 @@
+import type { EnsLookupSorting } from 'types/api/ens';
+
+import getNextSortValueShared from 'ui/shared/sort/getNextSortValue';
+import type { Option } from 'ui/shared/sort/Sort';
+
+export type SortField = EnsLookupSorting['sort'];
+export type Sort = `${ EnsLookupSorting['sort'] }-${ EnsLookupSorting['order'] }`;
+
+export const SORT_OPTIONS: Array<Option<Sort>> = [
+  { title: 'Default', id: undefined },
+  { title: 'Registered on descending', id: 'registration_date-DESC' },
+  { title: 'Registered on ascending', id: 'registration_date-ASC' },
+];
+
+const SORT_SEQUENCE: Record<SortField, Array<Sort | undefined>> = {
+  registration_date: [ 'registration_date-DESC', 'registration_date-ASC', undefined ],
+};
+
+export const getNextSortValue = (getNextSortValueShared<SortField, Sort>).bind(undefined, SORT_SEQUENCE);
diff --git a/ui/l2OutputRoots/OutputRootsListItem.tsx b/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsListItem.tsx
similarity index 78%
rename from ui/l2OutputRoots/OutputRootsListItem.tsx
rename to ui/outputRoots/optimisticL2/OptimisticL2OutputRootsListItem.tsx
index 4a4a9337d0..2e61672773 100644
--- a/ui/l2OutputRoots/OutputRootsListItem.tsx
+++ b/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsListItem.tsx
@@ -1,24 +1,24 @@
 import { Flex, Skeleton } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2OutputRootsItem } from 'types/api/l2OutputRoots';
+import type { OptimisticL2OutputRootsItem } from 'types/api/optimisticL2';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
 import CopyToClipboard from 'ui/shared/CopyToClipboard';
 import BlockEntityL2 from 'ui/shared/entities/block/BlockEntityL2';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
-import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
+import HashStringShorten from 'ui/shared/HashStringShorten';
 import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
-type Props = { item: L2OutputRootsItem; isLoading?: boolean };
+type Props = { item: OptimisticL2OutputRootsItem; isLoading?: boolean };
 
-const OutputRootsListItem = ({ item, isLoading }: Props) => {
+const OptimisticL2OutputRootsListItem = ({ item, isLoading }: Props) => {
   const timeAgo = dayjs(item.l1_timestamp).fromNow();
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'optimistic') {
     return null;
   }
 
@@ -55,14 +55,15 @@ const OutputRootsListItem = ({ item, isLoading }: Props) => {
           hash={ item.l1_tx_hash }
           fontSize="sm"
           lineHeight={ 5 }
+          truncation="constant_long"
         />
       </ListItemMobileGrid.Value>
 
       <ListItemMobileGrid.Label isLoading={ isLoading }>Output root</ListItemMobileGrid.Label>
       <ListItemMobileGrid.Value>
-        <Flex overflow="hidden" whiteSpace="nowrap" alignItems="center" w="100%" justifyContent="space-between">
-          <Skeleton isLoaded={ !isLoading } color="text_secondary" w="calc(100% - 24px)">
-            <HashStringShortenDynamic hash={ item.output_root }/>
+        <Flex overflow="hidden" whiteSpace="nowrap" alignItems="center" w="100%" justifyContent="start">
+          <Skeleton isLoaded={ !isLoading } color="text_secondary">
+            <HashStringShorten hash={ item.output_root } type="long"/>
           </Skeleton>
           <CopyToClipboard text={ item.output_root } isLoading={ isLoading }/>
         </Flex>
@@ -72,4 +73,4 @@ const OutputRootsListItem = ({ item, isLoading }: Props) => {
   );
 };
 
-export default OutputRootsListItem;
+export default OptimisticL2OutputRootsListItem;
diff --git a/ui/l2OutputRoots/OutputRootsTable.tsx b/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsTable.tsx
similarity index 50%
rename from ui/l2OutputRoots/OutputRootsTable.tsx
rename to ui/outputRoots/optimisticL2/OptimisticL2OutputRootsTable.tsx
index 96ce6c9c40..b23ba918c8 100644
--- a/ui/l2OutputRoots/OutputRootsTable.tsx
+++ b/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsTable.tsx
@@ -1,24 +1,24 @@
 import { Table, Tbody, Th, Tr } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2OutputRootsItem } from 'types/api/l2OutputRoots';
+import type { OptimisticL2OutputRootsItem } from 'types/api/optimisticL2';
 
 import { default as Thead } from 'ui/shared/TheadSticky';
 
-import OutputRootsTableItem from './OutputRootsTableItem';
+import OptimisticL2OutputRootsTableItem from './OptimisticL2OutputRootsTableItem';
 
 type Props = {
-  items: Array<L2OutputRootsItem>;
+  items: Array<OptimisticL2OutputRootsItem>;
   top: number;
   isLoading?: boolean;
 }
 
-const OutputRootsTable = ({ items, top, isLoading }: Props) => {
+const OptimisticL2OutputRootsTable = ({ items, top, isLoading }: Props) => {
   return (
     <Table variant="simple" size="sm" minW="900px">
       <Thead top={ top }>
         <Tr>
-          <Th width="140px">L2 output index</Th>
+          <Th width="160px">L2 output index</Th>
           <Th width="20%">Age</Th>
           <Th width="20%">L2 block #</Th>
           <Th width="30%">L1 txn hash</Th>
@@ -27,11 +27,15 @@ const OutputRootsTable = ({ items, top, isLoading }: Props) => {
       </Thead>
       <Tbody>
         { items.map((item, index) => (
-          <OutputRootsTableItem key={ item.l2_output_index + (Number(isLoading ? index : '') ? String(index) : '') } item={ item } isLoading={ isLoading }/>
+          <OptimisticL2OutputRootsTableItem
+            key={ item.l2_output_index + (Number(isLoading ? index : '') ? String(index) : '') }
+            item={ item }
+            isLoading={ isLoading }
+          />
         )) }
       </Tbody>
     </Table>
   );
 };
 
-export default OutputRootsTable;
+export default OptimisticL2OutputRootsTable;
diff --git a/ui/l2OutputRoots/OutputRootsTableItem.tsx b/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsTableItem.tsx
similarity index 66%
rename from ui/l2OutputRoots/OutputRootsTableItem.tsx
rename to ui/outputRoots/optimisticL2/OptimisticL2OutputRootsTableItem.tsx
index e64b613a82..6a2e6d9fb5 100644
--- a/ui/l2OutputRoots/OutputRootsTableItem.tsx
+++ b/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsTableItem.tsx
@@ -1,23 +1,23 @@
 import { Flex, Td, Tr, Skeleton } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2OutputRootsItem } from 'types/api/l2OutputRoots';
+import type { OptimisticL2OutputRootsItem } from 'types/api/optimisticL2';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
 import CopyToClipboard from 'ui/shared/CopyToClipboard';
 import BlockEntityL2 from 'ui/shared/entities/block/BlockEntityL2';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
-import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
+import HashStringShorten from 'ui/shared/HashStringShorten';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
-type Props = { item: L2OutputRootsItem; isLoading?: boolean };
+type Props = { item: OptimisticL2OutputRootsItem; isLoading?: boolean };
 
-const OutputRootsTableItem = ({ item, isLoading }: Props) => {
+const OptimisticL2OutputRootsTableItem = ({ item, isLoading }: Props) => {
   const timeAgo = dayjs(item.l1_timestamp).fromNow();
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'optimistic') {
     return null;
   }
 
@@ -36,6 +36,7 @@ const OutputRootsTableItem = ({ item, isLoading }: Props) => {
           fontSize="sm"
           lineHeight={ 5 }
           fontWeight={ 600 }
+          noIcon
         />
       </Td>
       <Td verticalAlign="middle" pr={ 12 }>
@@ -44,12 +45,14 @@ const OutputRootsTableItem = ({ item, isLoading }: Props) => {
           hash={ item.l1_tx_hash }
           fontSize="sm"
           lineHeight={ 5 }
+          noIcon
+          truncation="constant_long"
         />
       </Td>
       <Td verticalAlign="middle">
-        <Flex overflow="hidden" whiteSpace="nowrap" w="100%" alignItems="center">
-          <Skeleton isLoaded={ !isLoading } w="calc(100% - 36px)">
-            <HashStringShortenDynamic hash={ item.output_root }/>
+        <Flex overflow="hidden" w="100%" alignItems="center">
+          <Skeleton isLoaded={ !isLoading }>
+            <HashStringShorten hash={ item.output_root } type="long"/>
           </Skeleton>
           <CopyToClipboard text={ item.output_root } ml={ 2 } isLoading={ isLoading }/>
         </Flex>
@@ -58,4 +61,4 @@ const OutputRootsTableItem = ({ item, isLoading }: Props) => {
   );
 };
 
-export default OutputRootsTableItem;
+export default OptimisticL2OutputRootsTableItem;
diff --git a/ui/pages/Accounts.pw.tsx b/ui/pages/Accounts.pw.tsx
index 84072417be..77eb639235 100644
--- a/ui/pages/Accounts.pw.tsx
+++ b/ui/pages/Accounts.pw.tsx
@@ -21,6 +21,7 @@ const addresses: AddressesResponse = {
       ...addressMocks.token,
       tx_count: '109123890123',
       coin_balance: '22222345678901234567890000',
+      ens_domain_name: null,
     }, {
       ...addressMocks.withoutName,
       tx_count: '11',
diff --git a/ui/pages/Address.tsx b/ui/pages/Address.tsx
index f5e75429f1..9f3d0b4da6 100644
--- a/ui/pages/Address.tsx
+++ b/ui/pages/Address.tsx
@@ -1,4 +1,4 @@
-import { Box, Flex, HStack } from '@chakra-ui/react';
+import { Box, Flex, HStack, useColorModeValue } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
@@ -10,7 +10,9 @@ import { useAppContext } from 'lib/contexts/app';
 import useContractTabs from 'lib/hooks/useContractTabs';
 import useIsSafeAddress from 'lib/hooks/useIsSafeAddress';
 import getQueryParamString from 'lib/router/getQueryParamString';
-import { ADDRESS_INFO, ADDRESS_TABS_COUNTERS } from 'stubs/address';
+import { ADDRESS_TABS_COUNTERS } from 'stubs/address';
+import { USER_OPS_ACCOUNT } from 'stubs/userOps';
+import AddressAccountHistory from 'ui/address/AddressAccountHistory';
 import AddressBlocksValidated from 'ui/address/AddressBlocksValidated';
 import AddressCoinBalance from 'ui/address/AddressCoinBalance';
 import AddressContract from 'ui/address/AddressContract';
@@ -20,14 +22,18 @@ import AddressLogs from 'ui/address/AddressLogs';
 import AddressTokens from 'ui/address/AddressTokens';
 import AddressTokenTransfers from 'ui/address/AddressTokenTransfers';
 import AddressTxs from 'ui/address/AddressTxs';
+import AddressUserOps from 'ui/address/AddressUserOps';
 import AddressWithdrawals from 'ui/address/AddressWithdrawals';
 import AddressFavoriteButton from 'ui/address/details/AddressFavoriteButton';
 import AddressQrCode from 'ui/address/details/AddressQrCode';
+import AddressEnsDomains from 'ui/address/ensDomains/AddressEnsDomains';
 import SolidityscanReport from 'ui/address/SolidityscanReport';
+import useAddressQuery from 'ui/address/utils/useAddressQuery';
 import AccountActionsMenu from 'ui/shared/AccountActionsMenu/AccountActionsMenu';
 import TextAd from 'ui/shared/ad/TextAd';
 import AddressAddToWallet from 'ui/shared/address/AddressAddToWallet';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import EnsEntity from 'ui/shared/entities/ens/EnsEntity';
 import EntityTags from 'ui/shared/EntityTags';
 import IconSvg from 'ui/shared/IconSvg';
 import NetworkExplorers from 'ui/shared/NetworkExplorers';
@@ -37,6 +43,8 @@ import TabsSkeleton from 'ui/shared/Tabs/TabsSkeleton';
 
 const TOKEN_TABS = [ 'tokens_erc20', 'tokens_nfts', 'tokens_nfts_collection', 'tokens_nfts_list' ];
 
+const txInterpretation = config.features.txInterpretation;
+
 const AddressPageContent = () => {
   const router = useRouter();
   const appProps = useAppContext();
@@ -44,23 +52,26 @@ const AddressPageContent = () => {
   const tabsScrollRef = React.useRef<HTMLDivElement>(null);
   const hash = getQueryParamString(router.query.hash);
 
-  const addressQuery = useApiQuery('address', {
+  const addressQuery = useAddressQuery({ hash });
+
+  const addressTabsCountersQuery = useApiQuery('address_tabs_counters', {
     pathParams: { hash },
     queryOptions: {
       enabled: Boolean(hash),
-      placeholderData: ADDRESS_INFO,
+      placeholderData: ADDRESS_TABS_COUNTERS,
     },
   });
 
-  const addressTabsCountersQuery = useApiQuery('address_tabs_counters', {
+  const userOpsAccountQuery = useApiQuery('user_ops_account', {
     pathParams: { hash },
     queryOptions: {
-      enabled: Boolean(hash),
-      placeholderData: ADDRESS_TABS_COUNTERS,
+      enabled: Boolean(hash) && config.features.userOps.isEnabled,
+      placeholderData: USER_OPS_ACCOUNT,
     },
   });
 
   const isSafeAddress = useIsSafeAddress(!addressQuery.isPlaceholderData && addressQuery.data?.is_contract ? hash : undefined);
+  const safeIconColor = useColorModeValue('black', 'white');
 
   const contractTabs = useContractTabs(addressQuery.data);
 
@@ -72,6 +83,21 @@ const AddressPageContent = () => {
         count: addressTabsCountersQuery.data?.transactions_count,
         component: <AddressTxs scrollRef={ tabsScrollRef }/>,
       },
+      txInterpretation.isEnabled && txInterpretation.provider === 'noves' ?
+        {
+          id: 'account_history',
+          title: 'Account history',
+          component: <AddressAccountHistory scrollRef={ tabsScrollRef }/>,
+        } :
+        undefined,
+      config.features.userOps.isEnabled && Boolean(userOpsAccountQuery.data?.total_ops) ?
+        {
+          id: 'user_ops',
+          title: 'User operations',
+          count: userOpsAccountQuery.data?.total_ops,
+          component: <AddressUserOps/>,
+        } :
+        undefined,
       config.features.beaconChain.isEnabled && addressTabsCountersQuery.data?.withdrawals_count ?
         {
           id: 'withdrawals',
@@ -138,22 +164,26 @@ const AddressPageContent = () => {
         subTabs: contractTabs.map(tab => tab.id),
       } : undefined,
     ].filter(Boolean);
-  }, [ addressQuery.data, contractTabs, addressTabsCountersQuery.data ]);
+  }, [ addressQuery.data, contractTabs, addressTabsCountersQuery.data, userOpsAccountQuery.data ]);
+
+  const isLoading = addressQuery.isPlaceholderData || (config.features.userOps.isEnabled && userOpsAccountQuery.isPlaceholderData);
 
   const tags = (
     <EntityTags
       data={ addressQuery.data }
-      isLoading={ addressQuery.isPlaceholderData }
+      isLoading={ isLoading }
       tagsBefore={ [
         !addressQuery.data?.is_contract ? { label: 'eoa', display_name: 'EOA' } : undefined,
+        config.features.validators.isEnabled && addressQuery.data?.has_validated_blocks ? { label: 'validator', display_name: 'Validator' } : undefined,
         addressQuery.data?.implementation_address ? { label: 'proxy', display_name: 'Proxy' } : undefined,
         addressQuery.data?.token ? { label: 'token', display_name: 'Token' } : undefined,
         isSafeAddress ? { label: 'safe', display_name: 'Multisig: Safe' } : undefined,
+        config.features.userOps.isEnabled && userOpsAccountQuery.data ? { label: 'user_ops_acc', display_name: 'Smart contract wallet' } : undefined,
       ] }
     />
   );
 
-  const content = addressQuery.isError ? null : <RoutedTabs tabs={ tabs } tabListProps={{ mt: 8 }}/>;
+  const content = (addressQuery.isError || addressQuery.isDegradedData) ? null : <RoutedTabs tabs={ tabs } tabListProps={{ mt: 8 }}/>;
 
   const backLink = React.useMemo(() => {
     const hasGoBackLink = appProps.referrer && appProps.referrer.includes('/accounts');
@@ -168,18 +198,28 @@ const AddressPageContent = () => {
     };
   }, [ appProps.referrer ]);
 
-  const isLoading = addressQuery.isPlaceholderData;
-
   const titleSecondRow = (
     <Flex alignItems="center" w="100%" columnGap={ 2 } rowGap={ 2 } flexWrap={{ base: 'wrap', lg: 'nowrap' }}>
+      { addressQuery.data?.ens_domain_name && (
+        <EnsEntity
+          name={ addressQuery.data?.ens_domain_name }
+          fontFamily="heading"
+          fontSize="lg"
+          fontWeight={ 500 }
+          mr={ 1 }
+          maxW="300px"
+        />
+      ) }
       <AddressEntity
-        address={{ ...addressQuery.data, hash, name: '' }}
+        address={{ ...addressQuery.data, hash, name: '', ens_domain_name: '' }}
         isLoading={ isLoading }
         fontFamily="heading"
         fontSize="lg"
         fontWeight={ 500 }
         noLink
         isSafeAddress={ isSafeAddress }
+        iconColor={ isSafeAddress ? safeIconColor : undefined }
+        mr={ 4 }
       />
       { !isLoading && addressQuery.data?.is_contract && addressQuery.data.token &&
         <AddressAddToWallet token={ addressQuery.data.token } variant="button"/> }
@@ -190,6 +230,8 @@ const AddressPageContent = () => {
       <AccountActionsMenu isLoading={ isLoading }/>
       <HStack ml="auto" gap={ 2 }/>
       { addressQuery.data?.is_contract && addressQuery.data?.is_verified && config.UI.views.address.solidityscanEnabled && <SolidityscanReport hash={ hash }/> }
+      { !isLoading && addressQuery.data && config.features.nameService.isEnabled &&
+        <AddressEnsDomains addressHash={ hash } mainDomainName={ addressQuery.data.ens_domain_name }/> }
       <NetworkExplorers type="address" pathParam={ hash }/>
     </Flex>
   );
@@ -204,10 +246,14 @@ const AddressPageContent = () => {
         secondRow={ titleSecondRow }
         isLoading={ isLoading }
       />
+      { config.features.metasuites.isEnabled && <Box display="none" id="meta-suites__address" data-ready={ !isLoading }/> }
       <AddressDetails addressQuery={ addressQuery } scrollRef={ tabsScrollRef }/>
       { /* should stay before tabs to scroll up with pagination */ }
       <Box ref={ tabsScrollRef }></Box>
-      { (addressQuery.isPlaceholderData || addressTabsCountersQuery.isPlaceholderData) ? <TabsSkeleton tabs={ tabs }/> : content }
+      { (isLoading || addressTabsCountersQuery.isPlaceholderData) ?
+        <TabsSkeleton tabs={ tabs }/> :
+        content
+      }
     </>
   );
 };
diff --git a/ui/pages/Withdrawals.pw.tsx b/ui/pages/BeaconChainWithdrawals.pw.tsx
similarity index 93%
rename from ui/pages/Withdrawals.pw.tsx
rename to ui/pages/BeaconChainWithdrawals.pw.tsx
index 15dd8bfbdc..ab4cc8fa7a 100644
--- a/ui/pages/Withdrawals.pw.tsx
+++ b/ui/pages/BeaconChainWithdrawals.pw.tsx
@@ -7,7 +7,7 @@ import TestApp from 'playwright/TestApp';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
 import * as configs from 'playwright/utils/configs';
 
-import Withdrawals from './Withdrawals';
+import BeaconChainWithdrawals from './BeaconChainWithdrawals';
 
 const test = base.extend({
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -35,7 +35,7 @@ test('base view +@mobile', async({ mount, page }) => {
 
   const component = await mount(
     <TestApp>
-      <Withdrawals/>
+      <BeaconChainWithdrawals/>
     </TestApp>,
   );
 
diff --git a/ui/pages/Withdrawals.tsx b/ui/pages/BeaconChainWithdrawals.tsx
similarity index 83%
rename from ui/pages/Withdrawals.tsx
rename to ui/pages/BeaconChainWithdrawals.tsx
index 16e16afc9e..73e4d0294b 100644
--- a/ui/pages/Withdrawals.tsx
+++ b/ui/pages/BeaconChainWithdrawals.tsx
@@ -5,14 +5,15 @@ import React from 'react';
 import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';
 import getCurrencyValue from 'lib/getCurrencyValue';
+import { currencyUnits } from 'lib/units';
 import { generateListStub } from 'stubs/utils';
 import { WITHDRAWAL } from 'stubs/withdrawals';
 import DataListDisplay from 'ui/shared/DataListDisplay';
 import PageTitle from 'ui/shared/Page/PageTitle';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import StickyPaginationWithText from 'ui/shared/StickyPaginationWithText';
-import WithdrawalsListItem from 'ui/withdrawals/WithdrawalsListItem';
-import WithdrawalsTable from 'ui/withdrawals/WithdrawalsTable';
+import BeaconChainWithdrawalsListItem from 'ui/withdrawals/beaconChain/BeaconChainWithdrawalsListItem';
+import BeaconChainWithdrawalsTable from 'ui/withdrawals/beaconChain/BeaconChainWithdrawalsTable';
 
 const feature = config.features.beaconChain;
 
@@ -40,7 +41,7 @@ const Withdrawals = () => {
     <>
       <Show below="lg" ssr={ false }>
         { data.items.map(((item, index) => (
-          <WithdrawalsListItem
+          <BeaconChainWithdrawalsListItem
             key={ item.index + (isPlaceholderData ? String(index) : '') }
             item={ item }
             view="list"
@@ -49,7 +50,7 @@ const Withdrawals = () => {
         ))) }
       </Show>
       <Hide below="lg" ssr={ false }>
-        <WithdrawalsTable items={ data.items } view="list" top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
+        <BeaconChainWithdrawalsTable items={ data.items } view="list" top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
       </Hide>
     </>
   ) : null;
@@ -64,7 +65,7 @@ const Withdrawals = () => {
         { countersQuery.data && (
           <Text lineHeight={{ base: '24px', lg: '32px' }}>
             { BigNumber(countersQuery.data.withdrawal_count).toFormat() } withdrawals processed
-        and { getCurrencyValue({ value: countersQuery.data.withdrawal_sum }).valueStr } { feature.currency.symbol } withdrawn
+        and { getCurrencyValue({ value: countersQuery.data.withdrawal_sum }).valueStr } { currencyUnits.ether } withdrawn
           </Text>
         ) }
       </Skeleton>
diff --git a/ui/pages/Blob.pw.tsx b/ui/pages/Blob.pw.tsx
new file mode 100644
index 0000000000..1f0f56227e
--- /dev/null
+++ b/ui/pages/Blob.pw.tsx
@@ -0,0 +1,68 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import * as textAdMock from 'mocks/ad/textAd';
+import * as blobsMock from 'mocks/blobs/blobs';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
+
+import Blob from './Blob';
+
+const BLOB_API_URL = buildApiUrl('blob', { hash: blobsMock.base1.hash });
+const hooksConfig = {
+  router: {
+    query: { hash: blobsMock.base1.hash },
+  },
+};
+
+test.beforeEach(async({ page }) => {
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(textAdMock.duck),
+  }));
+  await page.route(textAdMock.duck.ad.thumbnail, (route) => {
+    return route.fulfill({
+      status: 200,
+      path: './playwright/mocks/image_s.jpg',
+    });
+  });
+});
+
+test('base view +@mobile +@dark-mode', async({ mount, page }) => {
+  await page.route(BLOB_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(blobsMock.base1),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <Blob/>
+    </TestApp>,
+    { hooksConfig },
+  );
+
+  await expect(component).toHaveScreenshot({
+    mask: [ page.locator(configs.adsBannerSelector) ],
+    maskColor: configs.maskColor,
+  });
+});
+
+test('without data', async({ mount, page }) => {
+  await page.route(BLOB_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(blobsMock.withoutData),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <Blob/>
+    </TestApp>,
+    { hooksConfig },
+  );
+
+  await expect(component).toHaveScreenshot({
+    mask: [ page.locator(configs.adsBannerSelector) ],
+    maskColor: configs.maskColor,
+  });
+});
diff --git a/ui/pages/Blob.tsx b/ui/pages/Blob.tsx
new file mode 100644
index 0000000000..4df70d1ba9
--- /dev/null
+++ b/ui/pages/Blob.tsx
@@ -0,0 +1,59 @@
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import getQueryParamString from 'lib/router/getQueryParamString';
+import { BLOB } from 'stubs/blobs';
+import BlobInfo from 'ui/blob/BlobInfo';
+import TextAd from 'ui/shared/ad/TextAd';
+import isCustomAppError from 'ui/shared/AppError/isCustomAppError';
+import DataFetchAlert from 'ui/shared/DataFetchAlert';
+import BlobEntity from 'ui/shared/entities/blob/BlobEntity';
+import PageTitle from 'ui/shared/Page/PageTitle';
+
+const BlobPageContent = () => {
+  const router = useRouter();
+  const hash = getQueryParamString(router.query.hash);
+
+  const { data, isPlaceholderData, isError, error } = useApiQuery('blob', {
+    pathParams: { hash },
+    queryOptions: {
+      placeholderData: BLOB,
+      refetchOnMount: false,
+    },
+  });
+
+  const content = (() => {
+    if (isError) {
+      if (isCustomAppError(error)) {
+        throwOnResourceLoadError({ resource: 'blob', error, isError: true });
+      }
+
+      return <DataFetchAlert/>;
+    }
+
+    if (!data) {
+      return null;
+    }
+
+    return <BlobInfo data={ data } isLoading={ isPlaceholderData }/>;
+  })();
+
+  const titleSecondRow = (
+    <BlobEntity hash={ hash } noLink fontWeight={ 500 } fontFamily="heading"/>
+  );
+
+  return (
+    <>
+      <TextAd mb={ 6 }/>
+      <PageTitle
+        title="Blob details"
+        secondRow={ titleSecondRow }
+      />
+      { content }
+    </>
+  );
+};
+
+export default BlobPageContent;
diff --git a/ui/pages/Block.tsx b/ui/pages/Block.tsx
index a1bbb094c5..0c2478c649 100644
--- a/ui/pages/Block.tsx
+++ b/ui/pages/Block.tsx
@@ -6,22 +6,23 @@ import type { PaginationParams } from 'ui/shared/pagination/types';
 import type { RoutedTab } from 'ui/shared/Tabs/types';
 
 import config from 'configs/app';
-import useApiQuery from 'lib/api/useApiQuery';
 import { useAppContext } from 'lib/contexts/app';
+import throwOnAbsentParamError from 'lib/errors/throwOnAbsentParamError';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import getQueryParamString from 'lib/router/getQueryParamString';
-import { BLOCK } from 'stubs/block';
-import { TX } from 'stubs/tx';
-import { generateListStub } from 'stubs/utils';
-import { WITHDRAWAL } from 'stubs/withdrawals';
 import BlockDetails from 'ui/block/BlockDetails';
 import BlockWithdrawals from 'ui/block/BlockWithdrawals';
+import useBlockBlobTxsQuery from 'ui/block/useBlockBlobTxsQuery';
+import useBlockQuery from 'ui/block/useBlockQuery';
+import useBlockTxsQuery from 'ui/block/useBlockTxsQuery';
+import useBlockWithdrawalsQuery from 'ui/block/useBlockWithdrawalsQuery';
 import TextAd from 'ui/shared/ad/TextAd';
+import ServiceDegradationWarning from 'ui/shared/alerts/ServiceDegradationWarning';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import NetworkExplorers from 'ui/shared/NetworkExplorers';
 import PageTitle from 'ui/shared/Page/PageTitle';
 import Pagination from 'ui/shared/pagination/Pagination';
-import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import RoutedTabs from 'ui/shared/Tabs/RoutedTabs';
 import TabsSkeleton from 'ui/shared/Tabs/TabsSkeleton';
 import TxsWithFrontendSorting from 'ui/txs/TxsWithFrontendSorting';
@@ -39,54 +40,52 @@ const BlockPageContent = () => {
   const heightOrHash = getQueryParamString(router.query.height_or_hash);
   const tab = getQueryParamString(router.query.tab);
 
-  const blockQuery = useApiQuery('block', {
-    pathParams: { height_or_hash: heightOrHash },
-    queryOptions: {
-      enabled: Boolean(heightOrHash),
-      placeholderData: BLOCK,
-    },
-  });
-
-  const blockTxsQuery = useQueryWithPages({
-    resourceName: 'block_txs',
-    pathParams: { height_or_hash: heightOrHash },
-    options: {
-      enabled: Boolean(!blockQuery.isPlaceholderData && blockQuery.data?.height && tab === 'txs'),
-      placeholderData: generateListStub<'block_txs'>(TX, 50, { next_page_params: {
-        block_number: 9004925,
-        index: 49,
-        items_count: 50,
-      } }),
-    },
-  });
-
-  const blockWithdrawalsQuery = useQueryWithPages({
-    resourceName: 'block_withdrawals',
-    pathParams: { height_or_hash: heightOrHash },
-    options: {
-      enabled: Boolean(!blockQuery.isPlaceholderData && blockQuery.data?.height && config.features.beaconChain.isEnabled && tab === 'withdrawals'),
-      placeholderData: generateListStub<'block_withdrawals'>(WITHDRAWAL, 50, { next_page_params: {
-        index: 5,
-        items_count: 50,
-      } }),
-    },
-  });
-
-  if (!heightOrHash) {
-    throw new Error('Block not found', { cause: { status: 404 } });
-  }
-
-  if (blockQuery.isError) {
-    throw new Error(undefined, { cause: blockQuery.error });
-  }
+  const blockQuery = useBlockQuery({ heightOrHash });
+  const blockTxsQuery = useBlockTxsQuery({ heightOrHash, blockQuery, tab });
+  const blockWithdrawalsQuery = useBlockWithdrawalsQuery({ heightOrHash, blockQuery, tab });
+  const blockBlobTxsQuery = useBlockBlobTxsQuery({ heightOrHash, blockQuery, tab });
 
   const tabs: Array<RoutedTab> = React.useMemo(() => ([
-    { id: 'index', title: 'Details', component: <BlockDetails query={ blockQuery }/> },
-    { id: 'txs', title: 'Transactions', component: <TxsWithFrontendSorting query={ blockTxsQuery } showBlockInfo={ false } showSocketInfo={ false }/> },
+    {
+      id: 'index',
+      title: 'Details',
+      component: (
+        <>
+          { blockQuery.isDegradedData && <ServiceDegradationWarning isLoading={ blockQuery.isPlaceholderData } mb={ 6 }/> }
+          <BlockDetails query={ blockQuery }/>
+        </>
+      ),
+    },
+    {
+      id: 'txs',
+      title: 'Transactions',
+      component: (
+        <>
+          { blockTxsQuery.isDegradedData && <ServiceDegradationWarning isLoading={ blockTxsQuery.isPlaceholderData } mb={ 6 }/> }
+          <TxsWithFrontendSorting query={ blockTxsQuery } showBlockInfo={ false } showSocketInfo={ false }/>
+        </>
+      ),
+    },
+    blockQuery.data?.blob_tx_count ?
+      {
+        id: 'blob_txs',
+        title: 'Blob txns',
+        component: (
+          <TxsWithFrontendSorting query={ blockBlobTxsQuery } showBlockInfo={ false } showSocketInfo={ false }/>
+        ),
+      } : null,
     config.features.beaconChain.isEnabled && Boolean(blockQuery.data?.withdrawals_count) ?
-      { id: 'withdrawals', title: 'Withdrawals', component: <BlockWithdrawals blockWithdrawalsQuery={ blockWithdrawalsQuery }/> } :
-      null,
-  ].filter(Boolean)), [ blockQuery, blockTxsQuery, blockWithdrawalsQuery ]);
+      {
+        id: 'withdrawals',
+        title: 'Withdrawals',
+        component: (
+          <>
+            { blockWithdrawalsQuery.isDegradedData && <ServiceDegradationWarning isLoading={ blockWithdrawalsQuery.isPlaceholderData } mb={ 6 }/> }
+            <BlockWithdrawals blockWithdrawalsQuery={ blockWithdrawalsQuery }/>
+          </>
+        ),
+      } : null,
+  ].filter(Boolean)), [ blockBlobTxsQuery, blockQuery, blockTxsQuery, blockWithdrawalsQuery ]);
 
   const hasPagination = !isMobile && (
     (tab === 'txs' && blockTxsQuery.pagination.isVisible) ||
@@ -113,7 +112,21 @@ const BlockPageContent = () => {
     };
   }, [ appProps.referrer ]);
 
-  const title = blockQuery.data?.type === 'reorg' ? `Reorged block #${ blockQuery.data?.height }` : `Block #${ blockQuery.data?.height }`;
+  throwOnAbsentParamError(heightOrHash);
+  throwOnResourceLoadError(blockQuery);
+
+  const title = (() => {
+    switch (blockQuery.data?.type) {
+      case 'reorg':
+        return `Reorged block #${ blockQuery.data?.height }`;
+
+      case 'uncle':
+        return `Uncle block #${ blockQuery.data?.height }`;
+
+      default:
+        return `Block #${ blockQuery.data?.height }`;
+    }
+  })();
   const titleSecondRow = (
     <>
       { !config.UI.views.block.hiddenFields?.miner && (
diff --git a/ui/pages/Blocks.pw.tsx b/ui/pages/Blocks.pw.tsx
index 330e6b5bfa..95e0bc452a 100644
--- a/ui/pages/Blocks.pw.tsx
+++ b/ui/pages/Blocks.pw.tsx
@@ -1,19 +1,15 @@
-import { test as base, expect, devices } from '@playwright/experimental-ct-react';
+import type { BrowserContext } from '@playwright/test';
 import React from 'react';
 
-import * as textAdMock from 'mocks/ad/textAd';
 import * as blockMock from 'mocks/blocks/block';
 import * as statsMock from 'mocks/stats/index';
 import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
 import * as socketServer from 'playwright/fixtures/socketServer';
-import TestApp from 'playwright/TestApp';
-import buildApiUrl from 'playwright/utils/buildApiUrl';
+import { test, expect, devices } from 'playwright/lib';
 import * as configs from 'playwright/utils/configs';
 
 import Blocks from './Blocks';
 
-const BLOCKS_API_URL = buildApiUrl('blocks') + '?type=block';
-const STATS_API_URL = buildApiUrl('homepage_stats');
 const hooksConfig = {
   router: {
     query: { tab: 'blocks' },
@@ -21,70 +17,28 @@ const hooksConfig = {
   },
 };
 
-const test = base.extend<socketServer.SocketServerFixture>({
-  createSocket: socketServer.createSocket,
-});
-
 // FIXME
 // test cases which use socket cannot run in parallel since the socket server always run on the same port
 test.describe.configure({ mode: 'serial' });
 
-test.beforeEach(async({ page }) => {
-  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(textAdMock.duck),
-  }));
-  await page.route(textAdMock.duck.ad.thumbnail, (route) => {
-    return route.fulfill({
-      status: 200,
-      path: './playwright/mocks/image_s.jpg',
-    });
-  });
-});
+test('base view +@dark-mode', async({ render, mockApiResponse }) => {
+  await mockApiResponse('blocks', blockMock.baseListResponse, { queryParams: { type: 'block' } });
+  await mockApiResponse('stats', statsMock.base);
 
-test('base view +@dark-mode', async({ mount, page }) => {
-  await page.route(BLOCKS_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(blockMock.baseListResponse),
-  }));
-  await page.route(STATS_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(statsMock.base),
-  }));
-
-  const component = await mount(
-    <TestApp>
-      <Blocks/>
-    </TestApp>,
-    { hooksConfig },
-  );
-  await page.waitForResponse(BLOCKS_API_URL);
+  const component = await render(<Blocks/>, { hooksConfig });
 
   await expect(component).toHaveScreenshot();
 });
 
-const hiddenFieldsTest = test.extend({
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  context: contextWithEnvs(configs.viewsEnvs.block.hiddenFields) as any,
+const hiddenFieldsTest = test.extend<{ context: BrowserContext }>({
+  context: contextWithEnvs(configs.viewsEnvs.block.hiddenFields),
 });
 
-hiddenFieldsTest('hidden fields', async({ mount, page }) => {
-  await page.route(BLOCKS_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(blockMock.baseListResponse),
-  }));
-  await page.route(STATS_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(statsMock.base),
-  }));
-
-  const component = await mount(
-    <TestApp>
-      <Blocks/>
-    </TestApp>,
-    { hooksConfig },
-  );
-  await page.waitForResponse(BLOCKS_API_URL);
+hiddenFieldsTest('hidden fields', async({ render, mockApiResponse }) => {
+  await mockApiResponse('blocks', blockMock.baseListResponse, { queryParams: { type: 'block' } });
+  await mockApiResponse('stats', statsMock.base);
+
+  const component = await render(<Blocks/>, { hooksConfig });
 
   await expect(component).toHaveScreenshot();
 });
@@ -92,66 +46,33 @@ hiddenFieldsTest('hidden fields', async({ mount, page }) => {
 test.describe('mobile', () => {
   test.use({ viewport: devices['iPhone 13 Pro'].viewport });
 
-  test(' base view', async({ mount, page }) => {
-    await page.route(BLOCKS_API_URL, (route) => route.fulfill({
-      status: 200,
-      body: JSON.stringify(blockMock.baseListResponse),
-    }));
-    await page.route(STATS_API_URL, (route) => route.fulfill({
-      status: 200,
-      body: JSON.stringify(statsMock.base),
-    }));
-
-    const component = await mount(
-      <TestApp>
-        <Blocks/>
-      </TestApp>,
-      { hooksConfig },
-    );
-    await page.waitForResponse(BLOCKS_API_URL);
+  test(' base view', async({ render, mockApiResponse }) => {
+    await mockApiResponse('blocks', blockMock.baseListResponse, { queryParams: { type: 'block' } });
+    await mockApiResponse('stats', statsMock.base);
+
+    const component = await render(<Blocks/>, { hooksConfig });
 
     await expect(component).toHaveScreenshot();
   });
 
-  const hiddenFieldsTest = test.extend({
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    context: contextWithEnvs(configs.viewsEnvs.block.hiddenFields) as any,
+  const hiddenFieldsTest = test.extend<{ context: BrowserContext }>({
+    context: contextWithEnvs(configs.viewsEnvs.block.hiddenFields),
   });
 
-  hiddenFieldsTest('hidden fields', async({ mount, page }) => {
-    await page.route(BLOCKS_API_URL, (route) => route.fulfill({
-      status: 200,
-      body: JSON.stringify(blockMock.baseListResponse),
-    }));
-    await page.route(STATS_API_URL, (route) => route.fulfill({
-      status: 200,
-      body: JSON.stringify(statsMock.base),
-    }));
-
-    const component = await mount(
-      <TestApp>
-        <Blocks/>
-      </TestApp>,
-      { hooksConfig },
-    );
-    await page.waitForResponse(BLOCKS_API_URL);
+  hiddenFieldsTest('hidden fields', async({ render, mockApiResponse }) => {
+    await mockApiResponse('blocks', blockMock.baseListResponse, { queryParams: { type: 'block' } });
+    await mockApiResponse('stats', statsMock.base);
+
+    const component = await render(<Blocks/>, { hooksConfig });
 
     await expect(component).toHaveScreenshot();
   });
 });
 
-test('new item from socket', async({ mount, page, createSocket }) => {
-  await page.route(BLOCKS_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(blockMock.baseListResponse),
-  }));
+test('new item from socket', async({ render, mockApiResponse, createSocket }) => {
+  await mockApiResponse('blocks', blockMock.baseListResponse, { queryParams: { type: 'block' } });
 
-  const component = await mount(
-    <TestApp withSocket>
-      <Blocks/>
-    </TestApp>,
-    { hooksConfig },
-  );
+  const component = await render(<Blocks/>, { hooksConfig }, { withSocket: true });
 
   const socket = await createSocket();
   const channel = await socketServer.joinChannel(socket, 'blocks:new_block');
@@ -167,18 +88,10 @@ test('new item from socket', async({ mount, page, createSocket }) => {
   await expect(component).toHaveScreenshot();
 });
 
-test('socket error', async({ mount, page, createSocket }) => {
-  await page.route(BLOCKS_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(blockMock.baseListResponse),
-  }));
-
-  const component = await mount(
-    <TestApp withSocket>
-      <Blocks/>
-    </TestApp>,
-    { hooksConfig },
-  );
+test('socket error', async({ render, mockApiResponse, createSocket }) => {
+  await mockApiResponse('blocks', blockMock.baseListResponse, { queryParams: { type: 'block' } });
+
+  const component = await render(<Blocks/>, { hooksConfig }, { withSocket: true });
 
   const socket = await createSocket();
   await socketServer.joinChannel(socket, 'blocks:new_block');
diff --git a/ui/pages/ContractVerificationForAddress.tsx b/ui/pages/ContractVerificationForAddress.tsx
index f11c58efb0..d4dceb9259 100644
--- a/ui/pages/ContractVerificationForAddress.tsx
+++ b/ui/pages/ContractVerificationForAddress.tsx
@@ -5,6 +5,7 @@ import type { SmartContractVerificationMethod } from 'types/api/contract';
 
 import useApiQuery from 'lib/api/useApiQuery';
 import { useAppContext } from 'lib/contexts/app';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import getQueryParamString from 'lib/router/getQueryParamString';
 import ContractVerificationForm from 'ui/contractVerification/ContractVerificationForm';
 import useFormConfigQuery from 'ui/contractVerification/useFormConfigQuery';
@@ -27,9 +28,7 @@ const ContractVerificationForAddress = () => {
     },
   });
 
-  if (contractQuery.isError && contractQuery.error.status === 404) {
-    throw Error('Not found', { cause: contractQuery.error as unknown as Error });
-  }
+  throwOnResourceLoadError(contractQuery);
 
   const configQuery = useFormConfigQuery(Boolean(hash));
 
diff --git a/ui/pages/CsvExport.tsx b/ui/pages/CsvExport.tsx
index b8a0315d62..38a9b66a7b 100644
--- a/ui/pages/CsvExport.tsx
+++ b/ui/pages/CsvExport.tsx
@@ -8,11 +8,12 @@ import type { CsvExportParams } from 'types/client/address';
 import type { ResourceName } from 'lib/api/resources';
 import useApiQuery from 'lib/api/useApiQuery';
 import { useAppContext } from 'lib/contexts/app';
+import throwOnAbsentParamError from 'lib/errors/throwOnAbsentParamError';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import { nbsp } from 'lib/html-entities';
 import CsvExportForm from 'ui/csvExport/CsvExportForm';
 import ContentLoader from 'ui/shared/ContentLoader';
-import DataFetchAlert from 'ui/shared/DataFetchAlert';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import PageTitle from 'ui/shared/Page/PageTitle';
 
@@ -62,7 +63,8 @@ const CsvExport = () => {
   const isMobile = useIsMobile();
 
   const addressHash = router.query.address?.toString() || '';
-  const exportType = router.query.type?.toString() || '';
+  const exportTypeParam = router.query.type?.toString() || '';
+  const exportType = isCorrectExportType(exportTypeParam) ? EXPORT_TYPES[exportTypeParam] : null;
   const filterTypeFromQuery = router.query.filterType?.toString() || null;
   const filterValueFromQuery = router.query.filterValue?.toString();
 
@@ -86,17 +88,20 @@ const CsvExport = () => {
     };
   }, [ appProps.referrer ]);
 
-  if (!isCorrectExportType(exportType) || !addressHash || addressQuery.error?.status === 400) {
-    throw Error('Not found', { cause: { status: 404 } });
+  throwOnAbsentParamError(addressHash);
+  throwOnAbsentParamError(exportType);
+
+  if (!exportType) {
+    return null;
   }
 
-  const filterType = filterTypeFromQuery === EXPORT_TYPES[exportType].filterType ? filterTypeFromQuery : null;
+  const filterType = filterTypeFromQuery === exportType.filterType ? filterTypeFromQuery : null;
   const filterValue = (() => {
     if (!filterType || !filterValueFromQuery) {
       return null;
     }
 
-    if (EXPORT_TYPES[exportType].filterValues && !EXPORT_TYPES[exportType].filterValues?.includes(filterValueFromQuery)) {
+    if (exportType.filterValues && !exportType.filterValues?.includes(filterValueFromQuery)) {
       return null;
     }
 
@@ -104,9 +109,7 @@ const CsvExport = () => {
   })();
 
   const content = (() => {
-    if (addressQuery.isError) {
-      return <DataFetchAlert/>;
-    }
+    throwOnResourceLoadError(addressQuery);
 
     if (addressQuery.isPending) {
       return <ContentLoader/>;
@@ -115,10 +118,10 @@ const CsvExport = () => {
     return (
       <CsvExportForm
         hash={ addressHash }
-        resource={ EXPORT_TYPES[exportType].resource }
+        resource={ exportType.resource }
         filterType={ filterType }
         filterValue={ filterValue }
-        fileNameTemplate={ EXPORT_TYPES[exportType].fileNameTemplate }
+        fileNameTemplate={ exportType.fileNameTemplate }
       />
     );
   })();
@@ -130,7 +133,7 @@ const CsvExport = () => {
         backLink={ backLink }
       />
       <Flex mb={ 10 } whiteSpace="pre-wrap" flexWrap="wrap">
-        <span>Export { EXPORT_TYPES[exportType].text } for address </span>
+        <span>Export { exportType.text } for address </span>
         <AddressEntity
           address={{ hash: addressHash, is_contract: true, implementation_name: null }}
           truncation={ isMobile ? 'constant' : 'dynamic' }
@@ -139,7 +142,7 @@ const CsvExport = () => {
         <span>{ nbsp }</span>
         { filterType && filterValue && <span>with applied filter by { filterType } ({ filterValue }) </span> }
         <span>to CSV file. </span>
-        <span>Exports are limited to the last 10K { EXPORT_TYPES[exportType].text }.</span>
+        <span>Exports are limited to the last 10K { exportType.text }.</span>
       </Flex>
       { content }
     </>
diff --git a/ui/pages/GasTracker.pw.tsx b/ui/pages/GasTracker.pw.tsx
new file mode 100644
index 0000000000..976adeb445
--- /dev/null
+++ b/ui/pages/GasTracker.pw.tsx
@@ -0,0 +1,55 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import * as textAdMock from 'mocks/ad/textAd';
+import * as statsMock from 'mocks/stats/index';
+import * as statsLineMock from 'mocks/stats/line';
+import * as statsLinesMock from 'mocks/stats/lines';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+
+import GasTracker from './GasTracker';
+
+const STATS_LINES_API_URL = buildApiUrl('stats_lines');
+const GAS_PRICE_CHART_API_URL = buildApiUrl('stats_line', { id: 'averageGasPrice' }) + '?**';
+const STATS_API_URL = buildApiUrl('stats');
+
+test.beforeEach(async({ page }) => {
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(textAdMock.duck),
+  }));
+  await page.route(textAdMock.duck.ad.thumbnail, (route) => {
+    return route.fulfill({
+      status: 200,
+      path: './playwright/mocks/image_s.jpg',
+    });
+  });
+});
+
+test('base view +@dark-mode +@mobile', async({ mount, page }) => {
+  await page.route(STATS_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify({ ...statsMock.base, coin_price: '2442.789' }),
+  }));
+  await page.route(STATS_LINES_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(statsLinesMock.base),
+  }));
+  await page.route(GAS_PRICE_CHART_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(statsLineMock.averageGasPrice),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <GasTracker/>
+    </TestApp>,
+  );
+  await page.waitForResponse(GAS_PRICE_CHART_API_URL);
+  await page.waitForFunction(() => {
+    return document.querySelector('path[data-name="chart-Averagegasprice-small"]')?.getAttribute('opacity') === '1';
+  });
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/pages/GasTracker.tsx b/ui/pages/GasTracker.tsx
new file mode 100644
index 0000000000..ecb4928257
--- /dev/null
+++ b/ui/pages/GasTracker.tsx
@@ -0,0 +1,79 @@
+import { Box, Flex, Skeleton, chakra } from '@chakra-ui/react';
+import React from 'react';
+
+import config from 'configs/app';
+import useApiQuery from 'lib/api/useApiQuery';
+import dayjs from 'lib/date/dayjs';
+import { HOMEPAGE_STATS } from 'stubs/stats';
+import GasTrackerChart from 'ui/gasTracker/GasTrackerChart';
+import GasTrackerNetworkUtilization from 'ui/gasTracker/GasTrackerNetworkUtilization';
+import GasTrackerPrices from 'ui/gasTracker/GasTrackerPrices';
+import GasInfoUpdateTimer from 'ui/shared/gas/GasInfoUpdateTimer';
+import PageTitle from 'ui/shared/Page/PageTitle';
+
+const GasTracker = () => {
+  const { data, isPlaceholderData, isError, error, dataUpdatedAt } = useApiQuery('stats', {
+    queryOptions: {
+      placeholderData: HOMEPAGE_STATS,
+      refetchOnMount: false,
+    },
+  });
+
+  if (isError) {
+    throw new Error(undefined, { cause: error });
+  }
+
+  const isLoading = isPlaceholderData;
+
+  const titleSecondRow = (
+    <Flex
+      alignItems={{ base: 'flex-start', lg: 'center' }}
+      fontFamily="heading"
+      fontSize="lg"
+      fontWeight={ 500 }
+      w="100%"
+      columnGap={ 3 }
+      rowGap={ 1 }
+      flexDir={{ base: 'column', lg: 'row' }}
+    >
+      { data?.network_utilization_percentage && <GasTrackerNetworkUtilization percentage={ data.network_utilization_percentage } isLoading={ isLoading }/> }
+      { data?.gas_price_updated_at && (
+        <Skeleton isLoaded={ !isLoading } whiteSpace="pre" display="flex" alignItems="center">
+          <span>Last updated </span>
+          <chakra.span color="text_secondary">{ dayjs(data.gas_price_updated_at).format('DD MMM, HH:mm:ss') }</chakra.span>
+          { data.gas_prices_update_in !== 0 && (
+            <GasInfoUpdateTimer
+              key={ dataUpdatedAt }
+              startTime={ dataUpdatedAt }
+              duration={ data.gas_prices_update_in }
+              size={ 5 }
+              ml={ 2 }
+            />
+          ) }
+        </Skeleton>
+      ) }
+      { data?.coin_price && (
+        <Skeleton isLoaded={ !isLoading } ml={{ base: 0, lg: 'auto' }} whiteSpace="pre">
+          <chakra.span color="text_secondary">{ config.chain.currency.symbol }</chakra.span>
+          <span> ${ Number(data.coin_price).toLocaleString(undefined, { maximumFractionDigits: 2 }) }</span>
+        </Skeleton>
+      ) }
+    </Flex>
+  );
+
+  return (
+    <>
+      <PageTitle
+        title="Gas tracker"
+        secondRow={ titleSecondRow }
+        withTextAd
+      />
+      { data?.gas_prices && <GasTrackerPrices prices={ data.gas_prices } isLoading={ isLoading }/> }
+      <Box mt={ 12 }>
+        <GasTrackerChart/>
+      </Box>
+    </>
+  );
+};
+
+export default GasTracker;
diff --git a/ui/pages/Home.pw.tsx b/ui/pages/Home.pw.tsx
index 30e9dd0a05..6c3c18cc8c 100644
--- a/ui/pages/Home.pw.tsx
+++ b/ui/pages/Home.pw.tsx
@@ -17,7 +17,7 @@ test.describe('default view', () => {
   let component: Locator;
 
   test.beforeEach(async({ page, mount }) => {
-    await page.route(buildApiUrl('homepage_stats'), (route) => route.fulfill({
+    await page.route(buildApiUrl('stats'), (route) => route.fulfill({
       status: 200,
       body: JSON.stringify(statsMock.base),
     }));
@@ -36,7 +36,7 @@ test.describe('default view', () => {
         txMock.withTokenTransfer,
       ]),
     }));
-    await page.route(buildApiUrl('homepage_chart_txs'), (route) => route.fulfill({
+    await page.route(buildApiUrl('stats_charts_txs'), (route) => route.fulfill({
       status: 200,
       body: JSON.stringify(dailyTxsMock.base),
     }));
@@ -104,7 +104,7 @@ test.describe('mobile', () => {
   test.use({ viewport: devices['iPhone 13 Pro'].viewport });
 
   test('base view', async({ mount, page }) => {
-    await page.route(buildApiUrl('homepage_stats'), (route) => route.fulfill({
+    await page.route(buildApiUrl('stats'), (route) => route.fulfill({
       status: 200,
       body: JSON.stringify(statsMock.base),
     }));
@@ -123,7 +123,7 @@ test.describe('mobile', () => {
         txMock.withTokenTransfer,
       ]),
     }));
-    await page.route(buildApiUrl('homepage_chart_txs'), (route) => route.fulfill({
+    await page.route(buildApiUrl('stats_charts_txs'), (route) => route.fulfill({
       status: 200,
       body: JSON.stringify(dailyTxsMock.base),
     }));
diff --git a/ui/pages/Home.tsx b/ui/pages/Home.tsx
index 14d9cc2684..2176842285 100644
--- a/ui/pages/Home.tsx
+++ b/ui/pages/Home.tsx
@@ -12,6 +12,8 @@ import ProfileMenuDesktop from 'ui/snippets/profileMenu/ProfileMenuDesktop';
 import SearchBar from 'ui/snippets/searchBar/SearchBar';
 import WalletMenuDesktop from 'ui/snippets/walletMenu/WalletMenuDesktop';
 
+const rollupFeature = config.features.rollup;
+
 const Home = () => {
   return (
     <Box as="main">
@@ -44,7 +46,7 @@ const Home = () => {
       <ChainIndicators/>
       <AdBanner mt={{ base: 6, lg: 8 }} mx="auto" display="flex" justifyContent="center"/>
       <Flex mt={ 8 } direction={{ base: 'column', lg: 'row' }} columnGap={ 12 } rowGap={ 8 }>
-        { config.features.zkEvmRollup.isEnabled ? <LatestZkEvmL2Batches/> : <LatestBlocks/> }
+        { rollupFeature.isEnabled && rollupFeature.type === 'zkEvm' ? <LatestZkEvmL2Batches/> : <LatestBlocks/> }
         <Box flexGrow={ 1 }>
           <Transactions/>
         </Box>
diff --git a/ui/pages/Login.pw.tsx b/ui/pages/Login.pw.tsx
new file mode 100644
index 0000000000..5a56a8b55c
--- /dev/null
+++ b/ui/pages/Login.pw.tsx
@@ -0,0 +1,25 @@
+import { test as base, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import contextWithFeatures from 'playwright/fixtures/contextWithFeatures';
+import TestApp from 'playwright/TestApp';
+
+import Login from './Login';
+
+const testWithFeature = base.extend({
+  context: contextWithFeatures([
+    { id: 'test_value', value: 'kitty' },
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  ]) as any,
+});
+
+testWithFeature('has feature text', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <Login/>
+    </TestApp>,
+  );
+
+  const featureText = component.getByText('kitty');
+  await expect(featureText).toBeVisible();
+});
diff --git a/ui/pages/Login.tsx b/ui/pages/Login.tsx
index 9b2ff4e0f2..f737bae160 100644
--- a/ui/pages/Login.tsx
+++ b/ui/pages/Login.tsx
@@ -6,6 +6,7 @@ import React from 'react';
 
 import config from 'configs/app';
 import * as cookies from 'lib/cookies';
+import useFeatureValue from 'lib/growthbook/useFeatureValue';
 import useGradualIncrement from 'lib/hooks/useGradualIncrement';
 import useToast from 'lib/hooks/useToast';
 import PageTitle from 'ui/shared/Page/PageTitle';
@@ -15,6 +16,8 @@ const Login = () => {
   const toast = useToast();
   const [ num, setNum ] = useGradualIncrement(0);
 
+  const testFeature = useFeatureValue('test_value', 'fallback');
+
   const [ isFormVisible, setFormVisibility ] = React.useState(false);
   const [ token, setToken ] = React.useState('');
 
@@ -77,12 +80,15 @@ const Login = () => {
           <Button onClick={ handleSetTokenClick }>Set cookie</Button>
         </>
       ) }
-      <Button colorScheme="red" onClick={ checkSentry }>Check Sentry</Button>
-      <Button colorScheme="teal" onClick={ checkMixpanel }>Check Mixpanel</Button>
+      <Flex columnGap={ 2 }>
+        <Button colorScheme="red" onClick={ checkSentry }>Check Sentry</Button>
+        <Button colorScheme="teal" onClick={ checkMixpanel }>Check Mixpanel</Button>
+      </Flex>
       <Flex columnGap={ 2 } alignItems="center">
         <Box w="50px" textAlign="center">{ num }</Box>
         <Button onClick={ handleNumIncrement } size="sm">add</Button>
       </Flex>
+      <Box>Test feature value: <b>{ testFeature.isLoading ? 'loading...' : JSON.stringify(testFeature.value) }</b></Box>
     </VStack>
   );
 
diff --git a/ui/pages/Marketplace.pw.tsx b/ui/pages/Marketplace.pw.tsx
new file mode 100644
index 0000000000..06a2e2cb85
--- /dev/null
+++ b/ui/pages/Marketplace.pw.tsx
@@ -0,0 +1,86 @@
+import { test as base, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import { buildExternalAssetFilePath } from 'configs/app/utils';
+import { apps as appsMock } from 'mocks/apps/apps';
+import { securityReports as securityReportsMock } from 'mocks/apps/securityReports';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+import * as app from 'playwright/utils/app';
+
+import Marketplace from './Marketplace';
+
+const MARKETPLACE_CONFIG_URL = app.url + buildExternalAssetFilePath('NEXT_PUBLIC_MARKETPLACE_CONFIG_URL', 'https://marketplace-config.json') || '';
+const MARKETPLACE_SECURITY_REPORTS_URL =
+  app.url + buildExternalAssetFilePath('NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL', 'https://marketplace-security-reports.json') || '';
+
+const test = base.extend({
+  context: contextWithEnvs([
+    { name: 'NEXT_PUBLIC_MARKETPLACE_CONFIG_URL', value: MARKETPLACE_CONFIG_URL },
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  ]) as any,
+});
+
+test('base view +@mobile +@dark-mode', async({ mount, page }) => {
+  await page.route(MARKETPLACE_CONFIG_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(appsMock),
+  }));
+
+  await Promise.all(appsMock.map(app =>
+    page.route(app.logo, (route) =>
+      route.fulfill({
+        status: 200,
+        path: './playwright/mocks/image_s.jpg',
+      }),
+    ),
+  ));
+
+  const component = await mount(
+    <TestApp>
+      <Marketplace/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
+
+const testWithScoreFeature = test.extend({
+  context: contextWithEnvs([
+    { name: 'NEXT_PUBLIC_MARKETPLACE_CONFIG_URL', value: MARKETPLACE_CONFIG_URL },
+    { name: 'NEXT_PUBLIC_MARKETPLACE_SECURITY_REPORTS_URL', value: MARKETPLACE_SECURITY_REPORTS_URL },
+    { name: 'pw_feature:security_score_exp', value: 'true' },
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  ]) as any,
+});
+
+testWithScoreFeature('with scores +@mobile +@dark-mode', async({ mount, page }) => {
+  await page.route(MARKETPLACE_CONFIG_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(appsMock),
+  }));
+
+  await page.route(MARKETPLACE_SECURITY_REPORTS_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(securityReportsMock),
+  }));
+
+  await Promise.all(appsMock.map(app =>
+    page.route(app.logo, (route) =>
+      route.fulfill({
+        status: 200,
+        path: './playwright/mocks/image_s.jpg',
+      }),
+    ),
+  ));
+
+  const component = await mount(
+    <TestApp>
+      <Marketplace/>
+    </TestApp>,
+  );
+
+  await component.getByText('Apps scores').click();
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/pages/Marketplace.tsx b/ui/pages/Marketplace.tsx
index 7024498b39..7a57b14c97 100644
--- a/ui/pages/Marketplace.tsx
+++ b/ui/pages/Marketplace.tsx
@@ -1,16 +1,49 @@
-import { Box } from '@chakra-ui/react';
+import { Box, Menu, MenuButton, MenuItem, MenuList, Flex, IconButton, Skeleton } from '@chakra-ui/react';
 import React from 'react';
+import type { MouseEvent } from 'react';
+
+import { MarketplaceCategory, MarketplaceDisplayType } from 'types/client/marketplace';
+import type { TabItem } from 'ui/shared/Tabs/types';
 
 import config from 'configs/app';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import useFeatureValue from 'lib/growthbook/useFeatureValue';
+import useIsMobile from 'lib/hooks/useIsMobile';
+import ContractListModal from 'ui/marketplace/ContractListModal';
 import MarketplaceAppModal from 'ui/marketplace/MarketplaceAppModal';
-import MarketplaceCategoriesMenu from 'ui/marketplace/MarketplaceCategoriesMenu';
 import MarketplaceDisclaimerModal from 'ui/marketplace/MarketplaceDisclaimerModal';
 import MarketplaceList from 'ui/marketplace/MarketplaceList';
+import MarketplaceListWithScores from 'ui/marketplace/MarketplaceListWithScores';
 import FilterInput from 'ui/shared/filters/FilterInput';
+import IconSvg from 'ui/shared/IconSvg';
+import type { IconName } from 'ui/shared/IconSvg';
+import LinkExternal from 'ui/shared/LinkExternal';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import RadioButtonGroup from 'ui/shared/radioButtonGroup/RadioButtonGroup';
+import TabsSkeleton from 'ui/shared/Tabs/TabsSkeleton';
+import TabsWithScroll from 'ui/shared/Tabs/TabsWithScroll';
 
 import useMarketplace from '../marketplace/useMarketplace';
 const feature = config.features.marketplace;
 
+const links: Array<{ label: string; href: string; icon: IconName }> = [];
+if (feature.isEnabled) {
+  if (feature.submitFormUrl) {
+    links.push({
+      label: 'Submit app',
+      href: feature.submitFormUrl,
+      icon: 'plus' as IconName,
+    });
+  }
+  if (feature.suggestIdeasFormUrl) {
+    links.push({
+      label: 'Suggest ideas',
+      href: feature.suggestIdeasFormUrl,
+      icon: 'edit' as IconName,
+    });
+  }
+}
+
 const Marketplace = () => {
   const {
     isPlaceholderData,
@@ -30,49 +63,188 @@ const Marketplace = () => {
     isAppInfoModalOpen,
     isDisclaimerModalOpen,
     showDisclaimer,
+    appsTotal,
+    isCategoriesPlaceholderData,
+    showContractList,
+    contractListModalType,
+    selectedDisplayType,
+    onDisplayTypeChange,
+    hasPreviousStep,
   } = useMarketplace();
 
-  if (isError) {
-    throw new Error('Unable to get apps list', { cause: error });
-  }
+  const isMobile = useIsMobile();
+  const { value: isExperiment } = useFeatureValue('security_score_exp', false);
+
+  const categoryTabs = React.useMemo(() => {
+    const tabs: Array<TabItem> = categories.map(category => ({
+      id: category.name,
+      title: category.name,
+      count: category.count,
+      component: null,
+    }));
+
+    tabs.unshift({
+      id: MarketplaceCategory.ALL,
+      title: MarketplaceCategory.ALL,
+      count: appsTotal,
+      component: null,
+    });
+
+    tabs.unshift({
+      id: MarketplaceCategory.FAVORITES,
+      title: () => <IconSvg name="star_outline" w={ 5 } h={ 5 }/>,
+      count: null,
+      component: null,
+    });
+
+    return tabs;
+  }, [ categories, appsTotal ]);
+
+  const selectedCategoryIndex = React.useMemo(() => {
+    const index = categoryTabs.findIndex(c => c.id === selectedCategoryId);
+    return index === -1 ? 0 : index;
+  }, [ categoryTabs, selectedCategoryId ]);
+
+  const selectedApp = displayedApps.find(app => app.id === selectedAppId);
+
+  const handleCategoryChange = React.useCallback((index: number) => {
+    onCategoryChange(categoryTabs[index].id);
+  }, [ categoryTabs, onCategoryChange ]);
+
+  const handleAppClick = React.useCallback((event: MouseEvent, id: string) => {
+    const isShown = window.localStorage.getItem('marketplace-disclaimer-shown');
+    if (!isShown) {
+      event.preventDefault();
+      showDisclaimer(id);
+    }
+  }, [ showDisclaimer ]);
+
+  const handleGoBackInContractListModal = React.useCallback(() => {
+    clearSelectedAppId();
+    if (selectedApp) {
+      showAppInfo(selectedApp.id);
+    }
+  }, [ clearSelectedAppId, showAppInfo, selectedApp ]);
+
+  throwOnResourceLoadError(isError && error ? { isError, error } : { isError: false, error: null });
 
   if (!feature.isEnabled) {
     return null;
   }
 
-  const selectedApp = displayedApps.find(app => app.id === selectedAppId);
-
   return (
     <>
-      <Box
-        display="flex"
-        flexDirection={{ base: 'column', sm: 'row' }}
-      >
-        <MarketplaceCategoriesMenu
-          categories={ categories }
-          selectedCategoryId={ selectedCategoryId }
-          onSelect={ onCategoryChange }
-          isLoading={ isPlaceholderData }
-        />
+      <PageTitle
+        title="DAppscout"
+        contentAfter={ (isMobile && links.length > 1) ? (
+          <Menu>
+            <MenuButton
+              as={ IconButton }
+              size="sm"
+              variant="outline"
+              colorScheme="gray"
+              px="9px"
+              ml="auto"
+              icon={ <IconSvg name="dots" boxSize="18px"/> }
+            />
+            <MenuList minW="max-content">
+              { links.map(({ label, href, icon }) => (
+                <MenuItem key={ label } as="a" href={ href } target="_blank" py={ 2 } px={ 4 }>
+                  <IconSvg name={ icon } boxSize={ 4 } mr={ 2.5 }/>
+                  { label }
+                  <IconSvg name="arrows/north-east" boxSize={ 4 } color="gray.400" ml={ 2 }/>
+                </MenuItem>
+              )) }
+            </MenuList>
+          </Menu>
+        ) : (
+          <Flex ml="auto">
+            { links.map(({ label, href }) => (
+              <LinkExternal key={ label } href={ href } variant="subtle" fontSize="sm" lineHeight={ 5 } ml={ 2 }>
+                { label }
+              </LinkExternal>
+            )) }
+          </Flex>
+        ) }
+      />
+      <Box marginTop={{ base: 0, lg: 8 }}>
+        { (isCategoriesPlaceholderData) ? (
+          <TabsSkeleton tabs={ categoryTabs }/>
+        ) : (
+          <TabsWithScroll
+            tabs={ categoryTabs }
+            onTabChange={ handleCategoryChange }
+            defaultTabIndex={ selectedCategoryIndex }
+            marginBottom={ -2 }
+          />
+        ) }
+      </Box>
 
+      <Flex direction={{ base: 'column', lg: 'row' }} mb={{ base: 4, lg: 6 }} gap={{ base: 4, lg: 3 }}>
+        { (feature.securityReportsUrl && isExperiment) && (
+          <Skeleton isLoaded={ !isPlaceholderData }>
+            <RadioButtonGroup<MarketplaceDisplayType>
+              onChange={ onDisplayTypeChange }
+              defaultValue={ selectedDisplayType }
+              name="type"
+              options={ [
+                {
+                  title: 'Discovery',
+                  value: MarketplaceDisplayType.DEFAULT,
+                  icon: 'apps_xs',
+                  onlyIcon: false,
+                },
+                {
+                  title: 'Apps scores',
+                  value: MarketplaceDisplayType.SCORES,
+                  icon: 'apps_list',
+                  onlyIcon: false,
+                  contentAfter: (
+                    <IconSvg
+                      name={ isMobile ? 'beta_xs' : 'beta' }
+                      h={ 3 }
+                      w={ isMobile ? 3 : 7 }
+                      ml={ 1 }
+                    />
+                  ),
+                },
+              ] }
+              autoWidth
+            />
+          </Skeleton>
+        ) }
         <FilterInput
           initialValue={ filterQuery }
           onChange={ onSearchInputChange }
-          marginBottom={{ base: '4', lg: '6' }}
-          w="100%"
-          placeholder="Find app"
+          placeholder="Find app by name or keyword..."
           isLoading={ isPlaceholderData }
+          size={ (feature.securityReportsUrl && isExperiment) ? 'xs' : 'sm' }
+          flex="1"
         />
-      </Box>
+      </Flex>
 
-      <MarketplaceList
-        apps={ displayedApps }
-        onAppClick={ showAppInfo }
-        favoriteApps={ favoriteApps }
-        onFavoriteClick={ onFavoriteClick }
-        isLoading={ isPlaceholderData }
-        showDisclaimer={ showDisclaimer }
-      />
+      { (selectedDisplayType === MarketplaceDisplayType.SCORES && feature.securityReportsUrl && isExperiment) ? (
+        <MarketplaceListWithScores
+          apps={ displayedApps }
+          showAppInfo={ showAppInfo }
+          favoriteApps={ favoriteApps }
+          onFavoriteClick={ onFavoriteClick }
+          isLoading={ isPlaceholderData }
+          selectedCategoryId={ selectedCategoryId }
+          onAppClick={ handleAppClick }
+          showContractList={ showContractList }
+        />
+      ) : (
+        <MarketplaceList
+          apps={ displayedApps }
+          showAppInfo={ showAppInfo }
+          favoriteApps={ favoriteApps }
+          onFavoriteClick={ onFavoriteClick }
+          isLoading={ isPlaceholderData }
+          selectedCategoryId={ selectedCategoryId }
+          onAppClick={ handleAppClick }
+        />
+      ) }
 
       { (selectedApp && isAppInfoModalOpen) && (
         <MarketplaceAppModal
@@ -80,6 +252,7 @@ const Marketplace = () => {
           isFavorite={ favoriteApps.includes(selectedApp.id) }
           onFavoriteClick={ onFavoriteClick }
           data={ selectedApp }
+          showContractList={ showContractList }
         />
       ) }
 
@@ -90,6 +263,15 @@ const Marketplace = () => {
           appId={ selectedApp.id }
         />
       ) }
+
+      { (selectedApp && contractListModalType) && (
+        <ContractListModal
+          type={ contractListModalType }
+          contracts={ selectedApp?.securityReport?.contractsData }
+          onClose={ clearSelectedAppId }
+          onBack={ hasPreviousStep ? handleGoBackInContractListModal : undefined }
+        />
+      ) }
     </>
   );
 };
diff --git a/ui/pages/MarketplaceApp.pw.tsx b/ui/pages/MarketplaceApp.pw.tsx
new file mode 100644
index 0000000000..b6b86599f2
--- /dev/null
+++ b/ui/pages/MarketplaceApp.pw.tsx
@@ -0,0 +1,60 @@
+import { Flex } from '@chakra-ui/react';
+import { test as base, expect, devices } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import { buildExternalAssetFilePath } from 'configs/app/utils';
+import { apps as appsMock } from 'mocks/apps/apps';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+import * as app from 'playwright/utils/app';
+
+import MarketplaceApp from './MarketplaceApp';
+
+const MARKETPLACE_CONFIG_URL = app.url + buildExternalAssetFilePath('NEXT_PUBLIC_MARKETPLACE_CONFIG_URL', 'https://marketplace-config.json') || '';
+
+const hooksConfig = {
+  router: {
+    query: { id: appsMock[0].id },
+    isReady: true,
+  },
+};
+
+const testFn: Parameters<typeof test>[1] = async({ mount, page }) => {
+  await page.route(MARKETPLACE_CONFIG_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(appsMock),
+  }));
+
+  await page.route(appsMock[0].url, (route) =>
+    route.fulfill({
+      status: 200,
+      path: './mocks/apps/app.html',
+    }),
+  );
+
+  const component = await mount(
+    <TestApp>
+      { /* added Flex as a Layout because the iframe has negative margins */ }
+      <Flex flexDirection="column" mx={{ base: 4, lg: 6 }}>
+        <MarketplaceApp/>
+      </Flex>
+    </TestApp>,
+    { hooksConfig },
+  );
+
+  await expect(component).toHaveScreenshot();
+};
+
+const test = base.extend({
+  context: contextWithEnvs([
+    { name: 'NEXT_PUBLIC_MARKETPLACE_CONFIG_URL', value: MARKETPLACE_CONFIG_URL },
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  ]) as any,
+});
+
+test('base view +@dark-mode', testFn);
+
+test.describe('mobile', () => {
+  test.use({ viewport: devices['iPhone 13 Pro'].viewport });
+  test('base view', testFn);
+});
diff --git a/ui/pages/MarketplaceApp.tsx b/ui/pages/MarketplaceApp.tsx
index 44d87aa0b2..c04ba4fecf 100644
--- a/ui/pages/MarketplaceApp.tsx
+++ b/ui/pages/MarketplaceApp.tsx
@@ -10,15 +10,19 @@ import { route } from 'nextjs-routes';
 
 import config from 'configs/app';
 import type { ResourceError } from 'lib/api/resources';
-import useApiFetch from 'lib/hooks/useFetch';
+import useApiFetch from 'lib/api/useApiFetch';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import useFetch from 'lib/hooks/useFetch';
 import * as metadata from 'lib/metadata';
 import getQueryParamString from 'lib/router/getQueryParamString';
 import ContentLoader from 'ui/shared/ContentLoader';
 
+import MarketplaceAppTopBar from '../marketplace/MarketplaceAppTopBar';
+import useAutoConnectWallet from '../marketplace/useAutoConnectWallet';
 import useMarketplaceWallet from '../marketplace/useMarketplaceWallet';
+import useSecurityReports from '../marketplace/useSecurityReports';
 
 const feature = config.features.marketplace;
-const configUrl = feature.isEnabled ? feature.configUrl : '';
 
 const IFRAME_SANDBOX_ATTRIBUTE = 'allow-forms allow-orientation-lock ' +
 'allow-pointer-lock allow-popups-to-escape-sandbox ' +
@@ -94,28 +98,37 @@ const MarketplaceAppContent = ({ address, data, isPending }: Props) => {
 };
 
 const MarketplaceApp = () => {
-  const { address, sendTransaction, signMessage, signTypedData } = useMarketplaceWallet();
-
+  const fetch = useFetch();
   const apiFetch = useApiFetch();
   const router = useRouter();
   const id = getQueryParamString(router.query.id);
+  const { address, sendTransaction, signMessage, signTypedData } = useMarketplaceWallet(id);
+  useAutoConnectWallet();
+
+  const { data: securityReports, isLoading: isSecurityReportsLoading } = useSecurityReports();
 
-  const { isPending, isError, error, data } = useQuery<unknown, ResourceError<unknown>, MarketplaceAppOverview>({
-    queryKey: [ 'marketplace-apps', id ],
+  const query = useQuery<unknown, ResourceError<unknown>, MarketplaceAppOverview>({
+    queryKey: [ 'marketplace-dapps', id ],
     queryFn: async() => {
-      const result = await apiFetch<Array<MarketplaceAppOverview>, unknown>(configUrl, undefined, { resource: 'marketplace-apps' });
-      if (!Array.isArray(result)) {
-        throw result;
-      }
-      const item = result.find((app: MarketplaceAppOverview) => app.id === id);
-      if (!item) {
-        throw { status: 404 };
+      if (!feature.isEnabled) {
+        return null;
+      } else if ('configUrl' in feature) {
+        const result = await fetch<Array<MarketplaceAppOverview>, unknown>(feature.configUrl, undefined, { resource: 'marketplace-dapps' });
+        if (!Array.isArray(result)) {
+          throw result;
+        }
+        const item = result.find((app: MarketplaceAppOverview) => app.id === id);
+        if (!item) {
+          throw { status: 404 };
+        }
+        return item;
+      } else {
+        return apiFetch('marketplace_dapp', { pathParams: { chainId: config.chain.id, dappId: id } });
       }
-
-      return item;
     },
     enabled: feature.isEnabled,
   });
+  const { data, isPending } = query;
 
   useEffect(() => {
     if (data) {
@@ -126,21 +139,27 @@ const MarketplaceApp = () => {
     }
   }, [ data ]);
 
-  if (isError) {
-    throw new Error('Unable to load app', { cause: error });
-  }
+  throwOnResourceLoadError(query);
 
   return (
-    <DappscoutIframeProvider
-      address={ address }
-      appUrl={ data?.url }
-      rpcUrl={ config.chain.rpcUrl }
-      sendTransaction={ sendTransaction }
-      signMessage={ signMessage }
-      signTypedData={ signTypedData }
-    >
-      <MarketplaceAppContent address={ address } data={ data } isPending={ isPending }/>
-    </DappscoutIframeProvider>
+    <>
+      <MarketplaceAppTopBar
+        data={ data }
+        isLoading={ isPending || isSecurityReportsLoading }
+        isWalletConnected={ Boolean(address) }
+        securityReport={ securityReports?.[id] }
+      />
+      <DappscoutIframeProvider
+        address={ address }
+        appUrl={ data?.url }
+        rpcUrl={ config.chain.rpcUrl }
+        sendTransaction={ sendTransaction }
+        signMessage={ signMessage }
+        signTypedData={ signTypedData }
+      >
+        <MarketplaceAppContent address={ address } data={ data } isPending={ isPending }/>
+      </DappscoutIframeProvider>
+    </>
   );
 };
 
diff --git a/ui/pages/MyProfile.tsx b/ui/pages/MyProfile.tsx
index 91fe658d80..bd3972ef6d 100644
--- a/ui/pages/MyProfile.tsx
+++ b/ui/pages/MyProfile.tsx
@@ -44,7 +44,7 @@ const MyProfile = () => {
           <Input
             required
             disabled
-            value={ data.email }
+            value={ data.email || '' }
           />
           <FormLabel>Email</FormLabel>
         </FormControl>
diff --git a/ui/pages/NameDomain.pw.tsx b/ui/pages/NameDomain.pw.tsx
new file mode 100644
index 0000000000..d91b3297b5
--- /dev/null
+++ b/ui/pages/NameDomain.pw.tsx
@@ -0,0 +1,79 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import config from 'configs/app';
+import * as textAdMock from 'mocks/ad/textAd';
+import * as ensDomainMock from 'mocks/ens/domain';
+import * as ensDomainEventsMock from 'mocks/ens/events';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+
+import NameDomain from './NameDomain';
+
+const DOMAIN_API_URL = buildApiUrl('domain_info', { chainId: config.chain.id, name: ensDomainMock.ensDomainA.name });
+const DOMAIN_EVENTS_API_URL = buildApiUrl('domain_events', { chainId: config.chain.id, name: ensDomainMock.ensDomainA.name });
+
+test.beforeEach(async({ page }) => {
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(textAdMock.duck),
+  }));
+  await page.route(textAdMock.duck.ad.thumbnail, (route) => {
+    return route.fulfill({
+      status: 200,
+      path: './playwright/mocks/image_s.jpg',
+    });
+  });
+});
+
+test('details tab', async({ mount, page }) => {
+  await page.route(DOMAIN_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(ensDomainMock.ensDomainA),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <NameDomain/>
+    </TestApp>,
+    { hooksConfig: {
+      router: {
+        query: { name: ensDomainMock.ensDomainA.name },
+        isReady: true,
+      },
+    } },
+  );
+
+  await expect(component).toHaveScreenshot();
+});
+
+test('history tab +@mobile', async({ mount, page }) => {
+  await page.route(DOMAIN_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(ensDomainMock.ensDomainA),
+  }));
+  await page.route(DOMAIN_EVENTS_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify({
+      items: [
+        ensDomainEventsMock.ensDomainEventA,
+        ensDomainEventsMock.ensDomainEventB,
+      ],
+      totalRecords: 2,
+    }),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <NameDomain/>
+    </TestApp>,
+    { hooksConfig: {
+      router: {
+        query: { name: ensDomainMock.ensDomainA.name, tab: 'history' },
+        isReady: true,
+      },
+    } },
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/pages/NameDomain.tsx b/ui/pages/NameDomain.tsx
new file mode 100644
index 0000000000..cf3977e8c5
--- /dev/null
+++ b/ui/pages/NameDomain.tsx
@@ -0,0 +1,99 @@
+import { Flex, Tooltip } from '@chakra-ui/react';
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import type { RoutedTab } from 'ui/shared/Tabs/types';
+
+import { route } from 'nextjs-routes';
+
+import config from 'configs/app';
+import useApiQuery from 'lib/api/useApiQuery';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import getQueryParamString from 'lib/router/getQueryParamString';
+import { ENS_DOMAIN } from 'stubs/ENS';
+import NameDomainDetails from 'ui/nameDomain/NameDomainDetails';
+import NameDomainHistory from 'ui/nameDomain/NameDomainHistory';
+import TextAd from 'ui/shared/ad/TextAd';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import EnsEntity from 'ui/shared/entities/ens/EnsEntity';
+import IconSvg from 'ui/shared/IconSvg';
+import LinkInternal from 'ui/shared/LinkInternal';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import RoutedTabs from 'ui/shared/Tabs/RoutedTabs';
+import TabsSkeleton from 'ui/shared/Tabs/TabsSkeleton';
+import useTabIndexFromQuery from 'ui/shared/Tabs/useTabIndexFromQuery';
+
+const NameDomain = () => {
+  const router = useRouter();
+  const domainName = getQueryParamString(router.query.name);
+
+  const infoQuery = useApiQuery('domain_info', {
+    pathParams: { name: domainName, chainId: config.chain.id },
+    queryOptions: {
+      placeholderData: ENS_DOMAIN,
+    },
+  });
+
+  const tabs: Array<RoutedTab> = [
+    { id: 'details', title: 'Details', component: <NameDomainDetails query={ infoQuery }/> },
+    { id: 'history', title: 'History', component: <NameDomainHistory/> },
+  ];
+
+  const tabIndex = useTabIndexFromQuery(tabs);
+
+  throwOnResourceLoadError(infoQuery);
+
+  const isLoading = infoQuery.isPlaceholderData;
+
+  const titleSecondRow = (
+    <Flex
+      columnGap={ 3 }
+      rowGap={ 3 }
+      fontFamily="heading"
+      fontSize="lg"
+      fontWeight={ 500 }
+      alignItems="center"
+      w="100%"
+      flexWrap={{ base: 'wrap', lg: 'nowrap' }}
+    >
+      <EnsEntity
+        name={ domainName }
+        isLoading={ isLoading }
+        noLink
+        maxW={{ lg: infoQuery.data?.resolved_address ? '300px' : 'min-content' }}
+      />
+      { infoQuery.data?.resolved_address && (
+        <Flex alignItems="center" maxW="100%" columnGap={ 3 }>
+          <AddressEntity
+            address={ infoQuery.data?.resolved_address }
+            isLoading={ isLoading }
+          />
+          <Tooltip label="Lookup for related domain names">
+            <LinkInternal
+              flexShrink={ 0 }
+              display="inline-flex"
+              href={ route({ pathname: '/name-domains', query: { owned_by: 'true', resolved_to: 'true', address: infoQuery.data?.resolved_address?.hash } }) }
+            >
+              <IconSvg name="search" boxSize={ 5 } isLoading={ isLoading }/>
+            </LinkInternal>
+          </Tooltip>
+        </Flex>
+      ) }
+    </Flex>
+  );
+
+  return (
+    <>
+      <TextAd mb={ 6 }/>
+      <PageTitle title="Name details" secondRow={ titleSecondRow }/>
+      { infoQuery.isPlaceholderData ? (
+        <>
+          <TabsSkeleton tabs={ tabs } mt={ 6 }/>
+          { tabs[tabIndex]?.component }
+        </>
+      ) : <RoutedTabs tabs={ tabs }/> }
+    </>
+  );
+};
+
+export default NameDomain;
diff --git a/ui/pages/NameDomains.pw.tsx b/ui/pages/NameDomains.pw.tsx
new file mode 100644
index 0000000000..6a522b6faf
--- /dev/null
+++ b/ui/pages/NameDomains.pw.tsx
@@ -0,0 +1,50 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import config from 'configs/app';
+import * as textAdMock from 'mocks/ad/textAd';
+import * as ensDomainMock from 'mocks/ens/domain';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+
+import NameDomains from './NameDomains';
+
+const DOMAINS_LOOKUP_API_URL = buildApiUrl('domains_lookup', { chainId: config.chain.id }) + '?only_active=true';
+
+test.beforeEach(async({ page }) => {
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(textAdMock.duck),
+  }));
+  await page.route(textAdMock.duck.ad.thumbnail, (route) => {
+    return route.fulfill({
+      status: 200,
+      path: './playwright/mocks/image_s.jpg',
+    });
+  });
+});
+
+test('default view +@mobile', async({ mount, page }) => {
+  await page.route(DOMAINS_LOOKUP_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify({
+      items: [
+        ensDomainMock.ensDomainA,
+        ensDomainMock.ensDomainB,
+        ensDomainMock.ensDomainC,
+        ensDomainMock.ensDomainD,
+      ],
+      next_page_params: {
+        token_id: '<token-id>',
+      },
+    }),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <NameDomains/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/pages/NameDomains.tsx b/ui/pages/NameDomains.tsx
new file mode 100644
index 0000000000..4c52c067d7
--- /dev/null
+++ b/ui/pages/NameDomains.tsx
@@ -0,0 +1,212 @@
+import { Box, Hide, Show } from '@chakra-ui/react';
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import type { EnsDomainLookupFiltersOptions, EnsLookupSorting } from 'types/api/ens';
+
+import config from 'configs/app';
+import useDebounce from 'lib/hooks/useDebounce';
+import { apos } from 'lib/html-entities';
+import getQueryParamString from 'lib/router/getQueryParamString';
+import { ADDRESS_REGEXP } from 'lib/validations/address';
+import { ENS_DOMAIN } from 'stubs/ENS';
+import { generateListStub } from 'stubs/utils';
+import NameDomainsActionBar from 'ui/nameDomains/NameDomainsActionBar';
+import NameDomainsListItem from 'ui/nameDomains/NameDomainsListItem';
+import NameDomainsTable from 'ui/nameDomains/NameDomainsTable';
+import type { Sort, SortField } from 'ui/nameDomains/utils';
+import { SORT_OPTIONS, getNextSortValue } from 'ui/nameDomains/utils';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import getSortParamsFromValue from 'ui/shared/sort/getSortParamsFromValue';
+import getSortValueFromQuery from 'ui/shared/sort/getSortValueFromQuery';
+
+const NameDomains = () => {
+  const router = useRouter();
+
+  const q = getQueryParamString(router.query.name) || getQueryParamString(router.query.address);
+  const ownedBy = getQueryParamString(router.query.owned_by);
+  const resolvedTo = getQueryParamString(router.query.resolved_to);
+  const onlyActive = getQueryParamString(router.query.only_active);
+
+  const initialFilters: EnsDomainLookupFiltersOptions = [
+    ownedBy === 'true' ? 'owned_by' as const : undefined,
+    resolvedTo === 'true' ? 'resolved_to' as const : undefined,
+    onlyActive === 'false' ? 'with_inactive' as const : undefined,
+  ].filter(Boolean);
+  const initialSort = getSortValueFromQuery<Sort>(router.query, SORT_OPTIONS);
+
+  const [ searchTerm, setSearchTerm ] = React.useState<string>(q || '');
+  const [ filterValue, setFilterValue ] = React.useState<EnsDomainLookupFiltersOptions>(initialFilters);
+  const [ sort, setSort ] = React.useState<Sort | undefined>(initialSort);
+
+  const debouncedSearchTerm = useDebounce(searchTerm, 300);
+  const isAddressSearch = React.useMemo(() => ADDRESS_REGEXP.test(debouncedSearchTerm), [ debouncedSearchTerm ]);
+  const sortParams = getSortParamsFromValue<Sort, EnsLookupSorting['sort'], EnsLookupSorting['order']>(sort);
+
+  const addressesLookupQuery = useQueryWithPages({
+    resourceName: 'addresses_lookup',
+    pathParams: { chainId: config.chain.id },
+    filters: {
+      address: debouncedSearchTerm,
+      resolved_to: filterValue.includes('resolved_to'),
+      owned_by: filterValue.includes('owned_by'),
+      only_active: !filterValue.includes('with_inactive'),
+    },
+    sorting: sortParams,
+    options: {
+      enabled: isAddressSearch,
+      placeholderData: generateListStub<'addresses_lookup'>(ENS_DOMAIN, 50, { next_page_params: null }),
+    },
+  });
+
+  const domainsLookupQuery = useQueryWithPages({
+    resourceName: 'domains_lookup',
+    pathParams: { chainId: config.chain.id },
+    filters: {
+      name: debouncedSearchTerm,
+      only_active: !filterValue.includes('with_inactive'),
+    },
+    sorting: sortParams,
+    options: {
+      enabled: !isAddressSearch,
+      placeholderData: generateListStub<'domains_lookup'>(ENS_DOMAIN, 50, { next_page_params: null }),
+    },
+  });
+
+  const query = isAddressSearch ? addressesLookupQuery : domainsLookupQuery;
+  const { data, isError, isPlaceholderData: isLoading, onFilterChange, onSortingChange } = query;
+
+  React.useEffect(() => {
+    const hasInactiveFilter = filterValue.some((value) => value === 'with_inactive');
+    if (isAddressSearch) {
+      setFilterValue([ 'owned_by' as const, 'resolved_to' as const, hasInactiveFilter ? 'with_inactive' as const : undefined ].filter(Boolean));
+      onFilterChange<'addresses_lookup'>({
+        address: debouncedSearchTerm,
+        resolved_to: true,
+        owned_by: true,
+        only_active: !hasInactiveFilter,
+      });
+    } else {
+      setFilterValue([ hasInactiveFilter ? 'with_inactive' as const : undefined ].filter(Boolean));
+      onFilterChange<'domains_lookup'>({
+        name: debouncedSearchTerm,
+        only_active: !hasInactiveFilter,
+      });
+    }
+  // should run only the type of search changes
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [ isAddressSearch ]);
+
+  const handleSortToggle = React.useCallback((event: React.MouseEvent) => {
+    if (isLoading) {
+      return;
+    }
+    const field = (event.currentTarget as HTMLDivElement).getAttribute('data-field') as SortField | undefined;
+
+    if (field) {
+      setSort((prevValue) => {
+        const nextSortValue = getNextSortValue(field)(prevValue);
+        onSortingChange(getSortParamsFromValue(nextSortValue));
+        return nextSortValue;
+      });
+    }
+  }, [ isLoading, onSortingChange ]);
+
+  const handleSearchTermChange = React.useCallback((value: string) => {
+    setSearchTerm(value);
+    const isAddressSearch = ADDRESS_REGEXP.test(value);
+    if (isAddressSearch) {
+      onFilterChange<'addresses_lookup'>({
+        address: value,
+        resolved_to: filterValue.includes('resolved_to'),
+        owned_by: filterValue.includes('owned_by'),
+        only_active: !filterValue.includes('with_inactive'),
+      });
+    } else {
+      onFilterChange<'domains_lookup'>({
+        name: value,
+        only_active: !filterValue.includes('with_inactive'),
+      });
+    }
+  }, [ onFilterChange, filterValue ]);
+
+  const handleFilterValueChange = React.useCallback((value: EnsDomainLookupFiltersOptions) => {
+    setFilterValue(value);
+
+    const isAddressSearch = ADDRESS_REGEXP.test(debouncedSearchTerm);
+    if (isAddressSearch) {
+      onFilterChange<'addresses_lookup'>({
+        address: debouncedSearchTerm,
+        resolved_to: value.includes('resolved_to'),
+        owned_by: value.includes('owned_by'),
+        only_active: !value.includes('with_inactive'),
+      });
+    } else {
+      onFilterChange<'domains_lookup'>({
+        name: debouncedSearchTerm,
+        only_active: !value.includes('with_inactive'),
+      });
+    }
+  }, [ debouncedSearchTerm, onFilterChange ]);
+
+  const hasActiveFilters = Boolean(debouncedSearchTerm) || filterValue.length > 0;
+
+  const content = (
+    <>
+      <Show below="lg" ssr={ false }>
+        <Box>
+          { data?.items.map((item, index) => (
+            <NameDomainsListItem
+              key={ item.id + (isLoading ? index : '') }
+              { ...item }
+              isLoading={ isLoading }
+            />
+          )) }
+        </Box>
+      </Show>
+      <Hide below="lg" ssr={ false }>
+        <NameDomainsTable
+          data={ data }
+          isLoading={ isLoading }
+          sort={ sort }
+          onSortToggle={ handleSortToggle }
+        />
+      </Hide>
+    </>
+  );
+
+  const actionBar = (
+    <NameDomainsActionBar
+      isLoading={ isLoading }
+      searchTerm={ searchTerm }
+      onSearchChange={ handleSearchTermChange }
+      filterValue={ filterValue }
+      onFilterValueChange={ handleFilterValueChange }
+      sort={ sort }
+      onSortChange={ setSort }
+      isAddressSearch={ isAddressSearch }
+      pagination={ query.pagination }
+    />
+  );
+
+  return (
+    <>
+      <PageTitle title="Name services lookup" withTextAd/>
+      <DataListDisplay
+        isError={ isError }
+        items={ data?.items }
+        emptyText="There are no name domains."
+        filterProps={{
+          emptyFilteredText: `Couldn${ apos }t find name domains that match your filter query.`,
+          hasActiveFilters,
+        }}
+        content={ content }
+        actionBar={ actionBar }
+      />
+    </>
+  );
+};
+
+export default NameDomains;
diff --git a/ui/pages/L2Deposits.pw.tsx b/ui/pages/OptimisticL2Deposits.pw.tsx
similarity index 94%
rename from ui/pages/L2Deposits.pw.tsx
rename to ui/pages/OptimisticL2Deposits.pw.tsx
index 94c62178b8..b1737edd05 100644
--- a/ui/pages/L2Deposits.pw.tsx
+++ b/ui/pages/OptimisticL2Deposits.pw.tsx
@@ -7,7 +7,7 @@ import TestApp from 'playwright/TestApp';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
 import * as configs from 'playwright/utils/configs';
 
-import L2Deposits from './L2Deposits';
+import OptimisticL2Deposits from './OptimisticL2Deposits';
 
 const DEPOSITS_API_URL = buildApiUrl('l2_deposits');
 const DEPOSITS_COUNT_API_URL = buildApiUrl('l2_deposits_count');
@@ -40,7 +40,7 @@ test('base view +@mobile', async({ mount, page }) => {
 
   const component = await mount(
     <TestApp>
-      <L2Deposits/>
+      <OptimisticL2Deposits/>
     </TestApp>,
   );
 
diff --git a/ui/pages/L2Deposits.tsx b/ui/pages/OptimisticL2Deposits.tsx
similarity index 82%
rename from ui/pages/L2Deposits.tsx
rename to ui/pages/OptimisticL2Deposits.tsx
index 707511145a..c23a842eee 100644
--- a/ui/pages/L2Deposits.tsx
+++ b/ui/pages/OptimisticL2Deposits.tsx
@@ -5,14 +5,14 @@ import useApiQuery from 'lib/api/useApiQuery';
 import { rightLineArrow, nbsp } from 'lib/html-entities';
 import { L2_DEPOSIT_ITEM } from 'stubs/L2';
 import { generateListStub } from 'stubs/utils';
-import DepositsListItem from 'ui/l2Deposits/DepositsListItem';
-import DepositsTable from 'ui/l2Deposits/DepositsTable';
+import OptimisticDepositsListItem from 'ui/deposits/optimisticL2/OptimisticDepositsListItem';
+import OptimisticDepositsTable from 'ui/deposits/optimisticL2/OptimisticDepositsTable';
 import DataListDisplay from 'ui/shared/DataListDisplay';
 import PageTitle from 'ui/shared/Page/PageTitle';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import StickyPaginationWithText from 'ui/shared/StickyPaginationWithText';
 
-const L2Deposits = () => {
+const OptimisticL2Deposits = () => {
   const { data, isError, isPlaceholderData, pagination } = useQueryWithPages({
     resourceName: 'l2_deposits',
     options: {
@@ -40,7 +40,7 @@ const L2Deposits = () => {
     <>
       <Show below="lg" ssr={ false }>
         { data.items.map(((item, index) => (
-          <DepositsListItem
+          <OptimisticDepositsListItem
             key={ item.l2_tx_hash + (isPlaceholderData ? index : '') }
             isLoading={ isPlaceholderData }
             item={ item }
@@ -48,7 +48,7 @@ const L2Deposits = () => {
         ))) }
       </Show>
       <Hide below="lg" ssr={ false }>
-        <DepositsTable items={ data.items } top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
+        <OptimisticDepositsTable items={ data.items } top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
       </Hide>
     </>
   ) : null;
@@ -76,7 +76,7 @@ const L2Deposits = () => {
       <DataListDisplay
         isError={ isError }
         items={ data?.items }
-        emptyText="There are no withdrawals."
+        emptyText="There are no deposits."
         content={ content }
         actionBar={ actionBar }
       />
@@ -84,4 +84,4 @@ const L2Deposits = () => {
   );
 };
 
-export default L2Deposits;
+export default OptimisticL2Deposits;
diff --git a/ui/pages/L2OutputRoots.pw.tsx b/ui/pages/OptimisticL2OutputRoots.pw.tsx
similarity index 93%
rename from ui/pages/L2OutputRoots.pw.tsx
rename to ui/pages/OptimisticL2OutputRoots.pw.tsx
index d4f85eec48..8c19f64377 100644
--- a/ui/pages/L2OutputRoots.pw.tsx
+++ b/ui/pages/OptimisticL2OutputRoots.pw.tsx
@@ -7,7 +7,7 @@ import TestApp from 'playwright/TestApp';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
 import * as configs from 'playwright/utils/configs';
 
-import OutputRoots from './L2OutputRoots';
+import OptimisticL2OutputRoots from './OptimisticL2OutputRoots';
 
 const test = base.extend({
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -40,7 +40,7 @@ test('base view +@mobile', async({ mount, page }) => {
 
   const component = await mount(
     <TestApp>
-      <OutputRoots/>
+      <OptimisticL2OutputRoots/>
     </TestApp>,
   );
 
diff --git a/ui/pages/L2OutputRoots.tsx b/ui/pages/OptimisticL2OutputRoots.tsx
similarity index 83%
rename from ui/pages/L2OutputRoots.tsx
rename to ui/pages/OptimisticL2OutputRoots.tsx
index c66211c781..dac63f79cf 100644
--- a/ui/pages/L2OutputRoots.tsx
+++ b/ui/pages/OptimisticL2OutputRoots.tsx
@@ -4,14 +4,14 @@ import React from 'react';
 import useApiQuery from 'lib/api/useApiQuery';
 import { L2_OUTPUT_ROOTS_ITEM } from 'stubs/L2';
 import { generateListStub } from 'stubs/utils';
-import OutputRootsListItem from 'ui/l2OutputRoots/OutputRootsListItem';
-import OutputRootsTable from 'ui/l2OutputRoots/OutputRootsTable';
+import OptimisticL2OutputRootsListItem from 'ui/outputRoots/optimisticL2/OptimisticL2OutputRootsListItem';
+import OptimisticL2OutputRootsTable from 'ui/outputRoots/optimisticL2/OptimisticL2OutputRootsTable';
 import DataListDisplay from 'ui/shared/DataListDisplay';
 import PageTitle from 'ui/shared/Page/PageTitle';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import StickyPaginationWithText from 'ui/shared/StickyPaginationWithText';
 
-const L2OutputRoots = () => {
+const OptimisticL2OutputRoots = () => {
   const { data, isError, isPlaceholderData, pagination } = useQueryWithPages({
     resourceName: 'l2_output_roots',
     options: {
@@ -38,7 +38,7 @@ const L2OutputRoots = () => {
     <>
       <Show below="lg" ssr={ false }>
         { data.items.map(((item, index) => (
-          <OutputRootsListItem
+          <OptimisticL2OutputRootsListItem
             key={ item.l2_output_index + (isPlaceholderData ? String(index) : '') }
             item={ item }
             isLoading={ isPlaceholderData }
@@ -46,7 +46,7 @@ const L2OutputRoots = () => {
         ))) }
       </Show>
       <Hide below="lg" ssr={ false }>
-        <OutputRootsTable items={ data.items } top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
+        <OptimisticL2OutputRootsTable items={ data.items } top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
       </Hide>
     </>
   ) : null;
@@ -82,4 +82,4 @@ const L2OutputRoots = () => {
   );
 };
 
-export default L2OutputRoots;
+export default OptimisticL2OutputRoots;
diff --git a/ui/pages/L2TxnBatches.pw.tsx b/ui/pages/OptimisticL2TxnBatches.pw.tsx
similarity index 94%
rename from ui/pages/L2TxnBatches.pw.tsx
rename to ui/pages/OptimisticL2TxnBatches.pw.tsx
index 4216bb0c3b..fb6c40a307 100644
--- a/ui/pages/L2TxnBatches.pw.tsx
+++ b/ui/pages/OptimisticL2TxnBatches.pw.tsx
@@ -7,7 +7,7 @@ import TestApp from 'playwright/TestApp';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
 import * as configs from 'playwright/utils/configs';
 
-import L2TxnBatches from './L2TxnBatches';
+import OptimisticL2TxnBatches from './OptimisticL2TxnBatches';
 
 const test = base.extend({
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -40,7 +40,7 @@ test('base view +@mobile', async({ mount, page }) => {
 
   const component = await mount(
     <TestApp>
-      <L2TxnBatches/>
+      <OptimisticL2TxnBatches/>
     </TestApp>,
   );
 
diff --git a/ui/pages/L2TxnBatches.tsx b/ui/pages/OptimisticL2TxnBatches.tsx
similarity index 82%
rename from ui/pages/L2TxnBatches.tsx
rename to ui/pages/OptimisticL2TxnBatches.tsx
index 4afaa838aa..6d8decf462 100644
--- a/ui/pages/L2TxnBatches.tsx
+++ b/ui/pages/OptimisticL2TxnBatches.tsx
@@ -5,14 +5,14 @@ import useApiQuery from 'lib/api/useApiQuery';
 import { nbsp } from 'lib/html-entities';
 import { L2_TXN_BATCHES_ITEM } from 'stubs/L2';
 import { generateListStub } from 'stubs/utils';
-import TxnBatchesListItem from 'ui/l2TxnBatches/TxnBatchesListItem';
-import TxnBatchesTable from 'ui/l2TxnBatches/TxnBatchesTable';
 import DataListDisplay from 'ui/shared/DataListDisplay';
 import PageTitle from 'ui/shared/Page/PageTitle';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import StickyPaginationWithText from 'ui/shared/StickyPaginationWithText';
+import OptimisticL2TxnBatchesListItem from 'ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesListItem';
+import OptimisticL2TxnBatchesTable from 'ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesTable';
 
-const L2TxnBatches = () => {
+const OptimisticL2TxnBatches = () => {
   const { data, isError, isPlaceholderData, pagination } = useQueryWithPages({
     resourceName: 'l2_txn_batches',
     options: {
@@ -39,14 +39,16 @@ const L2TxnBatches = () => {
     <>
       <Show below="lg" ssr={ false }>
         { data.items.map(((item, index) => (
-          <TxnBatchesListItem
+          <OptimisticL2TxnBatchesListItem
             key={ item.l2_block_number + (isPlaceholderData ? String(index) : '') }
             item={ item }
             isLoading={ isPlaceholderData }
           />
         ))) }
       </Show>
-      <Hide below="lg" ssr={ false }><TxnBatchesTable items={ data.items } top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/></Hide>
+      <Hide below="lg" ssr={ false }>
+        <OptimisticL2TxnBatchesTable items={ data.items } top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
+      </Hide>
     </>
   ) : null;
 
@@ -81,4 +83,4 @@ const L2TxnBatches = () => {
   );
 };
 
-export default L2TxnBatches;
+export default OptimisticL2TxnBatches;
diff --git a/ui/pages/L2Withdrawals.pw.tsx b/ui/pages/OptimisticL2Withdrawals.pw.tsx
similarity index 93%
rename from ui/pages/L2Withdrawals.pw.tsx
rename to ui/pages/OptimisticL2Withdrawals.pw.tsx
index 5ea8399a3f..70742da848 100644
--- a/ui/pages/L2Withdrawals.pw.tsx
+++ b/ui/pages/OptimisticL2Withdrawals.pw.tsx
@@ -7,7 +7,7 @@ import TestApp from 'playwright/TestApp';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
 import * as configs from 'playwright/utils/configs';
 
-import L2Withdrawals from './L2Withdrawals';
+import OptimisticL2Withdrawals from './OptimisticL2Withdrawals';
 
 const test = base.extend({
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -40,7 +40,7 @@ test('base view +@mobile', async({ mount, page }) => {
 
   const component = await mount(
     <TestApp>
-      <L2Withdrawals/>
+      <OptimisticL2Withdrawals/>
     </TestApp>,
   );
 
diff --git a/ui/pages/OptimisticL2Withdrawals.tsx b/ui/pages/OptimisticL2Withdrawals.tsx
new file mode 100644
index 0000000000..6e941ff3de
--- /dev/null
+++ b/ui/pages/OptimisticL2Withdrawals.tsx
@@ -0,0 +1,84 @@
+import { Hide, Show, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import { rightLineArrow, nbsp } from 'lib/html-entities';
+import { L2_WITHDRAWAL_ITEM } from 'stubs/L2';
+import { generateListStub } from 'stubs/utils';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import StickyPaginationWithText from 'ui/shared/StickyPaginationWithText';
+import OptimisticL2WithdrawalsListItem from 'ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsListItem';
+import OptimisticL2WithdrawalsTable from 'ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsTable';
+
+const OptimisticL2Withdrawals = () => {
+  const { data, isError, isPlaceholderData, pagination } = useQueryWithPages({
+    resourceName: 'l2_withdrawals',
+    options: {
+      placeholderData: generateListStub<'l2_withdrawals'>(
+        L2_WITHDRAWAL_ITEM,
+        50,
+        {
+          next_page_params: {
+            items_count: 50,
+            nonce: '',
+          },
+        },
+      ),
+    },
+  });
+
+  const countersQuery = useApiQuery('l2_withdrawals_count', {
+    queryOptions: {
+      placeholderData: 23700,
+    },
+  });
+
+  const content = data?.items ? (
+    <>
+      <Show below="lg" ssr={ false }>{ data.items.map(((item, index) => (
+        <OptimisticL2WithdrawalsListItem
+          key={ String(item.msg_nonce_version) + item.msg_nonce + (isPlaceholderData ? index : '') }
+          item={ item }
+          isLoading={ isPlaceholderData }
+        />
+      ))) }</Show>
+      <Hide below="lg" ssr={ false }>
+        <OptimisticL2WithdrawalsTable items={ data.items } top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
+      </Hide>
+    </>
+  ) : null;
+
+  const text = (() => {
+    if (countersQuery.isError) {
+      return null;
+    }
+
+    return (
+      <Skeleton
+        isLoaded={ !countersQuery.isPlaceholderData }
+        display="inline-block"
+      >
+        A total of { countersQuery.data?.toLocaleString() } withdrawals found
+      </Skeleton>
+    );
+  })();
+
+  const actionBar = <StickyPaginationWithText text={ text } pagination={ pagination }/>;
+
+  return (
+    <>
+      <PageTitle title={ `Withdrawals (L2${ nbsp }${ rightLineArrow }${ nbsp }L1)` } withTextAd/>
+      <DataListDisplay
+        isError={ isError }
+        items={ data?.items }
+        emptyText="There are no withdrawals."
+        content={ content }
+        actionBar={ actionBar }
+      />
+    </>
+  );
+};
+
+export default OptimisticL2Withdrawals;
diff --git a/ui/pages/SearchResults.pw.tsx b/ui/pages/SearchResults.pw.tsx
index 4e78e6f35f..f773fd56bb 100644
--- a/ui/pages/SearchResults.pw.tsx
+++ b/ui/pages/SearchResults.pw.tsx
@@ -8,6 +8,7 @@ import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
 import TestApp from 'playwright/TestApp';
 import * as app from 'playwright/utils/app';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
 
 import SearchResults from './SearchResults';
 
@@ -32,6 +33,7 @@ test.describe('search by name ', () => {
           searchMock.token1,
           searchMock.token2,
           searchMock.contract1,
+          searchMock.address2,
           searchMock.label1,
         ],
       }),
@@ -91,6 +93,7 @@ test('search by block number +@mobile', async({ mount, page }) => {
       items: [
         searchMock.block1,
         searchMock.block2,
+        searchMock.block3,
       ],
     }),
   }));
@@ -155,6 +158,61 @@ test('search by tx hash +@mobile', async({ mount, page }) => {
   await expect(component.locator('main')).toHaveScreenshot();
 });
 
+test('search by blob hash +@mobile', async({ mount, page }) => {
+  const hooksConfig = {
+    router: {
+      query: { q: searchMock.blob1.blob_hash },
+    },
+  };
+  await page.route(buildApiUrl('search') + `?q=${ searchMock.blob1.blob_hash }`, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify({
+      items: [
+        searchMock.blob1,
+      ],
+    }),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <SearchResults/>
+    </TestApp>,
+    { hooksConfig },
+  );
+
+  await expect(component.locator('main')).toHaveScreenshot();
+});
+
+const testWithUserOps = test.extend({
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  context: contextWithEnvs(configs.featureEnvs.userOps) as any,
+});
+
+testWithUserOps('search by user op hash +@mobile', async({ mount, page }) => {
+  const hooksConfig = {
+    router: {
+      query: { q: searchMock.userOp1.user_operation_hash },
+    },
+  };
+  await page.route(buildApiUrl('search') + `?q=${ searchMock.userOp1.user_operation_hash }`, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify({
+      items: [
+        searchMock.userOp1,
+      ],
+    }),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <SearchResults/>
+    </TestApp>,
+    { hooksConfig },
+  );
+
+  await expect(component.locator('main')).toHaveScreenshot();
+});
+
 test.describe('with apps', () => {
   const MARKETPLACE_CONFIG_URL = app.url + buildExternalAssetFilePath('NEXT_PUBLIC_MARKETPLACE_CONFIG_URL', 'https://marketplace-config.json') || '';
   const extendedTest = test.extend({
diff --git a/ui/pages/SearchResults.tsx b/ui/pages/SearchResults.tsx
index 51e86fde9a..608956a9df 100644
--- a/ui/pages/SearchResults.tsx
+++ b/ui/pages/SearchResults.tsx
@@ -3,6 +3,7 @@ import { useRouter } from 'next/router';
 import type { FormEvent } from 'react';
 import React from 'react';
 
+import config from 'configs/app';
 import useMarketplaceApps from 'ui/marketplace/useMarketplaceApps';
 import SearchResultListItem from 'ui/searchResults/SearchResultListItem';
 import SearchResultsInput from 'ui/searchResults/SearchResultsInput';
@@ -52,6 +53,17 @@ const SearchResultsPageContent = () => {
           router.replace({ pathname: '/tx/[hash]', query: { hash: redirectCheckQuery.data.parameter } });
           return;
         }
+        case 'user_operation': {
+          if (config.features.userOps.isEnabled) {
+            router.replace({ pathname: '/op/[hash]', query: { hash: redirectCheckQuery.data.parameter } });
+            return;
+          }
+          break;
+        }
+        case 'blob': {
+          router.replace({ pathname: '/blobs/[hash]', query: { hash: redirectCheckQuery.data.parameter } });
+          return;
+        }
       }
     }
 
@@ -62,12 +74,19 @@ const SearchResultsPageContent = () => {
     event.preventDefault();
   }, [ ]);
 
+  const displayedItems = (data?.items || []).filter((item) => {
+    if (!config.features.userOps.isEnabled && item.type === 'user_operation') {
+      return false;
+    }
+    return true;
+  });
+
   const content = (() => {
     if (isError) {
       return <DataFetchAlert/>;
     }
 
-    const hasData = data?.items.length || (pagination.page === 1 && marketplaceApps.displayedApps.length);
+    const hasData = displayedItems.length || (pagination.page === 1 && marketplaceApps.displayedApps.length);
 
     if (!hasData) {
       return null;
@@ -83,7 +102,7 @@ const SearchResultsPageContent = () => {
               searchTerm={ debouncedSearchTerm }
             />
           )) }
-          { data && data.items.map((item, index) => (
+          { displayedItems.map((item, index) => (
             <SearchResultListItem
               key={ (isPlaceholderData ? 'placeholder_' : 'actual_') + index }
               data={ item }
@@ -110,7 +129,7 @@ const SearchResultsPageContent = () => {
                   searchTerm={ debouncedSearchTerm }
                 />
               )) }
-              { data && data.items.map((item, index) => (
+              { displayedItems.map((item, index) => (
                 <SearchResultTableItem
                   key={ (isPlaceholderData ? 'placeholder_' : 'actual_') + index }
                   data={ item }
@@ -130,7 +149,7 @@ const SearchResultsPageContent = () => {
       return null;
     }
 
-    const resultsCount = pagination.page === 1 && !data?.next_page_params ? (data?.items.length || 0) + marketplaceApps.displayedApps.length : '50+';
+    const resultsCount = pagination.page === 1 && !data?.next_page_params ? (displayedItems.length || 0) + marketplaceApps.displayedApps.length : '50+';
 
     const text = isPlaceholderData && pagination.page === 1 ? (
       <Skeleton h={ 6 } w="280px" borderRadius="full" mb={ pagination.isVisible ? 0 : 6 }/>
@@ -141,7 +160,7 @@ const SearchResultsPageContent = () => {
           <chakra.span fontWeight={ 700 }>
             { resultsCount }
           </chakra.span>
-          <span> matching result{ (((data?.items.length || 0) + marketplaceApps.displayedApps.length) > 1) || pagination.page > 1 ? 's' : '' } for </span>
+          <span> matching result{ (((displayedItems.length || 0) + marketplaceApps.displayedApps.length) > 1) || pagination.page > 1 ? 's' : '' } for </span>
           “<chakra.span fontWeight={ 700 }>{ debouncedSearchTerm }</chakra.span>”
         </Box>
       )
diff --git a/ui/pages/ShibariumDeposits.pw.tsx b/ui/pages/ShibariumDeposits.pw.tsx
new file mode 100644
index 0000000000..75fa82ba5e
--- /dev/null
+++ b/ui/pages/ShibariumDeposits.pw.tsx
@@ -0,0 +1,43 @@
+import { test as base, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import { data as depositsData } from 'mocks/shibarium/deposits';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
+
+import ShibariumDeposits from './ShibariumDeposits';
+
+const DEPOSITS_API_URL = buildApiUrl('shibarium_deposits');
+const DEPOSITS_COUNT_API_URL = buildApiUrl('shibarium_deposits_count');
+
+const test = base.extend({
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  context: contextWithEnvs(configs.featureEnvs.shibariumRollup) as any,
+});
+
+test('base view +@mobile', async({ mount, page }) => {
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: '',
+  }));
+
+  await page.route(DEPOSITS_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(depositsData),
+  }));
+
+  await page.route(DEPOSITS_COUNT_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: '3971111',
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <ShibariumDeposits/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/pages/ShibariumDeposits.tsx b/ui/pages/ShibariumDeposits.tsx
new file mode 100644
index 0000000000..d7d981a6e0
--- /dev/null
+++ b/ui/pages/ShibariumDeposits.tsx
@@ -0,0 +1,86 @@
+import { Hide, Show, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import { rightLineArrow, nbsp } from 'lib/html-entities';
+import { SHIBARIUM_DEPOSIT_ITEM } from 'stubs/shibarium';
+import { generateListStub } from 'stubs/utils';
+import DepositsListItem from 'ui/deposits/shibarium/DepositsListItem';
+import DepositsTable from 'ui/deposits/shibarium/DepositsTable';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import StickyPaginationWithText from 'ui/shared/StickyPaginationWithText';
+
+const L2Deposits = () => {
+  const { data, isError, isPlaceholderData, pagination } = useQueryWithPages({
+    resourceName: 'shibarium_deposits',
+    options: {
+      placeholderData: generateListStub<'shibarium_deposits'>(
+        SHIBARIUM_DEPOSIT_ITEM,
+        50,
+        {
+          next_page_params: {
+            items_count: 50,
+            block_number: 9045200,
+          },
+        },
+      ),
+    },
+  });
+
+  const countersQuery = useApiQuery('shibarium_deposits_count', {
+    queryOptions: {
+      placeholderData: 1927029,
+    },
+  });
+
+  const content = data?.items ? (
+    <>
+      <Show below="lg" ssr={ false }>
+        { data.items.map(((item, index) => (
+          <DepositsListItem
+            key={ item.l2_transaction_hash + (isPlaceholderData ? index : '') }
+            isLoading={ isPlaceholderData }
+            item={ item }
+          />
+        ))) }
+      </Show>
+      <Hide below="lg" ssr={ false }>
+        <DepositsTable items={ data.items } top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/>
+      </Hide>
+    </>
+  ) : null;
+
+  const text = (() => {
+    if (countersQuery.isError) {
+      return null;
+    }
+
+    return (
+      <Skeleton
+        isLoaded={ !countersQuery.isPlaceholderData }
+        display="inline-block"
+      >
+        A total of { countersQuery.data?.toLocaleString() } deposits found
+      </Skeleton>
+    );
+  })();
+
+  const actionBar = <StickyPaginationWithText text={ text } pagination={ pagination }/>;
+
+  return (
+    <>
+      <PageTitle title={ `Deposits (L1${ nbsp }${ rightLineArrow }${ nbsp }L2)` } withTextAd/>
+      <DataListDisplay
+        isError={ isError }
+        items={ data?.items }
+        emptyText="There are no deposits."
+        content={ content }
+        actionBar={ actionBar }
+      />
+    </>
+  );
+};
+
+export default L2Deposits;
diff --git a/ui/pages/ShibariumWithdrawals.pw.tsx b/ui/pages/ShibariumWithdrawals.pw.tsx
new file mode 100644
index 0000000000..98d3ff3836
--- /dev/null
+++ b/ui/pages/ShibariumWithdrawals.pw.tsx
@@ -0,0 +1,47 @@
+import { test as base, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import { data as withdrawalsData } from 'mocks/shibarium/withdrawals';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
+
+import ShibariuWithdrawals from './ShibariumWithdrawals';
+
+const test = base.extend({
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  context: contextWithEnvs(configs.featureEnvs.shibariumRollup) as any,
+});
+
+const WITHDRAWALS_API_URL = buildApiUrl('shibarium_withdrawals');
+const WITHDRAWALS_COUNT_API_URL = buildApiUrl('shibarium_withdrawals_count');
+
+test('base view +@mobile', async({ mount, page }) => {
+  // test on mobile is flaky
+  // my assumption is there is not enough time to calculate hashes truncation so component is unstable
+  // so I raised the test timeout to check if it helps
+  test.slow();
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: '',
+  }));
+
+  await page.route(WITHDRAWALS_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(withdrawalsData),
+  }));
+
+  await page.route(WITHDRAWALS_COUNT_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: '397',
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <ShibariuWithdrawals/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot({ timeout: 10_000 });
+});
diff --git a/ui/pages/L2Withdrawals.tsx b/ui/pages/ShibariumWithdrawals.tsx
similarity index 78%
rename from ui/pages/L2Withdrawals.tsx
rename to ui/pages/ShibariumWithdrawals.tsx
index 8d17f7ed25..0891e72962 100644
--- a/ui/pages/L2Withdrawals.tsx
+++ b/ui/pages/ShibariumWithdrawals.tsx
@@ -3,33 +3,33 @@ import React from 'react';
 
 import useApiQuery from 'lib/api/useApiQuery';
 import { rightLineArrow, nbsp } from 'lib/html-entities';
-import { L2_WITHDRAWAL_ITEM } from 'stubs/L2';
+import { SHIBARIUM_WITHDRAWAL_ITEM } from 'stubs/shibarium';
 import { generateListStub } from 'stubs/utils';
-import WithdrawalsListItem from 'ui/l2Withdrawals/WithdrawalsListItem';
-import WithdrawalsTable from 'ui/l2Withdrawals/WithdrawalsTable';
 import DataListDisplay from 'ui/shared/DataListDisplay';
 import PageTitle from 'ui/shared/Page/PageTitle';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import StickyPaginationWithText from 'ui/shared/StickyPaginationWithText';
+import WithdrawalsListItem from 'ui/withdrawals/shibarium/WithdrawalsListItem';
+import WithdrawalsTable from 'ui/withdrawals/shibarium/WithdrawalsTable';
 
 const L2Withdrawals = () => {
   const { data, isError, isPlaceholderData, pagination } = useQueryWithPages({
-    resourceName: 'l2_withdrawals',
+    resourceName: 'shibarium_withdrawals',
     options: {
-      placeholderData: generateListStub<'l2_withdrawals'>(
-        L2_WITHDRAWAL_ITEM,
+      placeholderData: generateListStub<'shibarium_withdrawals'>(
+        SHIBARIUM_WITHDRAWAL_ITEM,
         50,
         {
           next_page_params: {
             items_count: 50,
-            nonce: '',
+            block_number: 123,
           },
         },
       ),
     },
   });
 
-  const countersQuery = useApiQuery('l2_withdrawals_count', {
+  const countersQuery = useApiQuery('shibarium_withdrawals_count', {
     queryOptions: {
       placeholderData: 23700,
     },
@@ -39,7 +39,7 @@ const L2Withdrawals = () => {
     <>
       <Show below="lg" ssr={ false }>{ data.items.map(((item, index) => (
         <WithdrawalsListItem
-          key={ item.l2_tx_hash + (isPlaceholderData ? index : '') }
+          key={ item.l2_transaction_hash + (isPlaceholderData ? index : '') }
           item={ item }
           isLoading={ isPlaceholderData }
         />
diff --git a/ui/pages/Token.tsx b/ui/pages/Token.tsx
index aedc8ce28e..8ffcf9c455 100644
--- a/ui/pages/Token.tsx
+++ b/ui/pages/Token.tsx
@@ -17,8 +17,10 @@ import * as metadata from 'lib/metadata';
 import getQueryParamString from 'lib/router/getQueryParamString';
 import useSocketChannel from 'lib/socket/useSocketChannel';
 import useSocketMessage from 'lib/socket/useSocketMessage';
+import { NFT_TOKEN_TYPE_IDS } from 'lib/token/tokenTypes';
 import * as addressStubs from 'stubs/address';
 import * as tokenStubs from 'stubs/token';
+import { getTokenHoldersStub } from 'stubs/token';
 import { generateListStub } from 'stubs/utils';
 import AddressContract from 'ui/address/AddressContract';
 import AddressQrCode from 'ui/address/details/AddressQrCode';
@@ -118,7 +120,7 @@ const TokenPageContent = () => {
   }, [ tokenQuery.data, tokenQuery.isPlaceholderData ]);
 
   const hasData = (tokenQuery.data && !tokenQuery.isPlaceholderData) && (contractQuery.data && !contractQuery.isPlaceholderData);
-  const hasInventoryTab = tokenQuery.data?.type === 'ERC-1155' || tokenQuery.data?.type === 'ERC-721';
+  const hasInventoryTab = tokenQuery.data?.type && NFT_TOKEN_TYPE_IDS.includes(tokenQuery.data.type);
 
   const transfersQuery = useQueryWithPages({
     resourceName: 'token_transfers',
@@ -161,8 +163,7 @@ const TokenPageContent = () => {
     scrollRef,
     options: {
       enabled: Boolean(hashString && tab === 'holders' && hasData),
-      placeholderData: generateListStub<'token_holders'>(
-        tokenQuery.data?.type === 'ERC-1155' ? tokenStubs.TOKEN_HOLDER_ERC_1155 : tokenStubs.TOKEN_HOLDER_ERC_20, 50, { next_page_params: null }),
+      placeholderData: getTokenHoldersStub(tokenQuery.data?.type, null),
     },
   });
 
@@ -174,7 +175,7 @@ const TokenPageContent = () => {
   const contractTabs = useContractTabs(contractQuery.data);
 
   const tabs: Array<RoutedTab> = [
-    (tokenQuery.data?.type === 'ERC-1155' || tokenQuery.data?.type === 'ERC-721') ? {
+    hasInventoryTab ? {
       id: 'inventory',
       title: 'Inventory',
       component: <TokenInventory inventoryQuery={ inventoryQuery } tokenQuery={ tokenQuery } ownerFilter={ ownerFilter }/>,
@@ -212,7 +213,7 @@ const TokenPageContent = () => {
   }
 
   // default tab for nfts is token inventory
-  if (((tokenQuery.data?.type === 'ERC-1155' || tokenQuery.data?.type === 'ERC-721') && !tab) || tab === 'inventory') {
+  if ((hasInventoryTab && !tab) || tab === 'inventory') {
     pagination = inventoryQuery.pagination;
   }
 
diff --git a/ui/pages/TokenInstance.tsx b/ui/pages/TokenInstance.tsx
index 38e938e504..6471e822b9 100644
--- a/ui/pages/TokenInstance.tsx
+++ b/ui/pages/TokenInstance.tsx
@@ -7,12 +7,16 @@ import type { RoutedTab } from 'ui/shared/Tabs/types';
 
 import useApiQuery from 'lib/api/useApiQuery';
 import { useAppContext } from 'lib/contexts/app';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import * as metadata from 'lib/metadata';
 import * as regexp from 'lib/regexp';
-import { TOKEN_INSTANCE, TOKEN_INFO_ERC_1155 } from 'stubs/token';
-import * as tokenStubs from 'stubs/token';
-import { generateListStub } from 'stubs/utils';
+import {
+  TOKEN_INSTANCE,
+  TOKEN_INFO_ERC_1155,
+  getTokenInstanceTransfersStub,
+  getTokenInstanceHoldersStub,
+} from 'stubs/token';
 import AddressQrCode from 'ui/address/details/AddressQrCode';
 import AccountActionsMenu from 'ui/shared/AccountActionsMenu/AccountActionsMenu';
 import TextAd from 'ui/shared/ad/TextAd';
@@ -65,11 +69,7 @@ const TokenInstanceContent = () => {
     scrollRef,
     options: {
       enabled: Boolean(hash && id && (!tab || tab === 'token_transfers') && !tokenInstanceQuery.isPlaceholderData && tokenInstanceQuery.data),
-      placeholderData: generateListStub<'token_instance_transfers'>(
-        tokenQuery.data?.type === 'ERC-1155' ? tokenStubs.TOKEN_TRANSFER_ERC_1155 : tokenStubs.TOKEN_TRANSFER_ERC_721,
-        10,
-        { next_page_params: null },
-      ),
+      placeholderData: getTokenInstanceTransfersStub(tokenQuery.data?.type, null),
     },
   });
 
@@ -85,8 +85,7 @@ const TokenInstanceContent = () => {
     scrollRef,
     options: {
       enabled: Boolean(hash && tab === 'holders' && shouldFetchHolders),
-      placeholderData: generateListStub<'token_instance_holders'>(
-        tokenQuery.data?.type === 'ERC-1155' ? tokenStubs.TOKEN_HOLDER_ERC_1155 : tokenStubs.TOKEN_HOLDER_ERC_20, 10, { next_page_params: null }),
+      placeholderData: getTokenInstanceHoldersStub(tokenQuery.data?.type, null),
     },
   });
 
@@ -129,9 +128,7 @@ const TokenInstanceContent = () => {
     ) },
   ].filter(Boolean);
 
-  if (tokenInstanceQuery.isError) {
-    throw Error('Token instance fetch failed', { cause: tokenInstanceQuery.error });
-  }
+  throwOnResourceLoadError(tokenInstanceQuery);
 
   const tokenTag = <Tag isLoading={ tokenInstanceQuery.isPlaceholderData }>{ tokenQuery.data?.type }</Tag>;
 
diff --git a/ui/pages/Transaction.tsx b/ui/pages/Transaction.tsx
index 57328ecc58..a41b8addcd 100644
--- a/ui/pages/Transaction.tsx
+++ b/ui/pages/Transaction.tsx
@@ -4,17 +4,21 @@ import React from 'react';
 import type { RoutedTab } from 'ui/shared/Tabs/types';
 
 import config from 'configs/app';
-import useApiQuery from 'lib/api/useApiQuery';
 import { useAppContext } from 'lib/contexts/app';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import getQueryParamString from 'lib/router/getQueryParamString';
-import { TX } from 'stubs/tx';
+import { publicClient } from 'lib/web3/client';
 import TextAd from 'ui/shared/ad/TextAd';
+import isCustomAppError from 'ui/shared/AppError/isCustomAppError';
 import EntityTags from 'ui/shared/EntityTags';
 import PageTitle from 'ui/shared/Page/PageTitle';
 import RoutedTabs from 'ui/shared/Tabs/RoutedTabs';
 import TabsSkeleton from 'ui/shared/Tabs/TabsSkeleton';
 import useTabIndexFromQuery from 'ui/shared/Tabs/useTabIndexFromQuery';
+import TxAssetFlows from 'ui/tx/TxAssetFlows';
+import TxBlobs from 'ui/tx/TxBlobs';
 import TxDetails from 'ui/tx/TxDetails';
+import TxDetailsDegraded from 'ui/tx/TxDetailsDegraded';
 import TxDetailsWrapped from 'ui/tx/TxDetailsWrapped';
 import TxInternals from 'ui/tx/TxInternals';
 import TxLogs from 'ui/tx/TxLogs';
@@ -22,36 +26,51 @@ import TxRawTrace from 'ui/tx/TxRawTrace';
 import TxState from 'ui/tx/TxState';
 import TxSubHeading from 'ui/tx/TxSubHeading';
 import TxTokenTransfer from 'ui/tx/TxTokenTransfer';
+import TxUserOps from 'ui/tx/TxUserOps';
+import useTxQuery from 'ui/tx/useTxQuery';
+
+const txInterpretation = config.features.txInterpretation;
 
 const TransactionPageContent = () => {
   const router = useRouter();
   const appProps = useAppContext();
 
   const hash = getQueryParamString(router.query.hash);
+  const txQuery = useTxQuery();
+  const { data, isPlaceholderData, isError, error, errorUpdateCount } = txQuery;
+
+  const showDegradedView = publicClient && (isError || isPlaceholderData) && errorUpdateCount > 0;
 
-  const { data, isPlaceholderData } = useApiQuery('tx', {
-    pathParams: { hash },
-    queryOptions: {
-      enabled: Boolean(hash),
-      placeholderData: TX,
-    },
-  });
-
-  const tabs: Array<RoutedTab> = [
-    {
-      id: 'index',
-      title: config.features.suave.isEnabled && data?.wrapped ? 'Confidential compute tx details' : 'Details',
-      component: <TxDetails/>,
-    },
-    config.features.suave.isEnabled && data?.wrapped ?
-      { id: 'wrapped', title: 'Regular tx details', component: <TxDetailsWrapped data={ data.wrapped }/> } :
-      undefined,
-    { id: 'token_transfers', title: 'Token transfers', component: <TxTokenTransfer/> },
-    { id: 'internal', title: 'Internal txns', component: <TxInternals/> },
-    { id: 'logs', title: 'Logs', component: <TxLogs/> },
-    { id: 'state', title: 'State', component: <TxState/> },
-    { id: 'raw_trace', title: 'Raw trace', component: <TxRawTrace/> },
-  ].filter(Boolean);
+  const tabs: Array<RoutedTab> = (() => {
+    const detailsComponent = showDegradedView ?
+      <TxDetailsDegraded hash={ hash } txQuery={ txQuery }/> :
+      <TxDetails txQuery={ txQuery }/>;
+
+    return [
+      {
+        id: 'index',
+        title: config.features.suave.isEnabled && data?.wrapped ? 'Confidential compute tx details' : 'Details',
+        component: detailsComponent,
+      },
+      txInterpretation.isEnabled && txInterpretation.provider === 'noves' ?
+        { id: 'asset_flows', title: 'Asset Flows', component: <TxAssetFlows hash={ hash }/> } :
+        undefined,
+      config.features.suave.isEnabled && data?.wrapped ?
+        { id: 'wrapped', title: 'Regular tx details', component: <TxDetailsWrapped data={ data.wrapped }/> } :
+        undefined,
+      { id: 'token_transfers', title: 'Token transfers', component: <TxTokenTransfer txQuery={ txQuery }/> },
+      config.features.userOps.isEnabled ?
+        { id: 'user_ops', title: 'User operations', component: <TxUserOps txQuery={ txQuery }/> } :
+        undefined,
+      { id: 'internal', title: 'Internal txns', component: <TxInternals txQuery={ txQuery }/> },
+      txQuery.data?.blob_versioned_hashes?.length ?
+        { id: 'blobs', title: 'Blobs', component: <TxBlobs txQuery={ txQuery }/> } :
+        undefined,
+      { id: 'logs', title: 'Logs', component: <TxLogs txQuery={ txQuery }/> },
+      { id: 'state', title: 'State', component: <TxState txQuery={ txQuery }/> },
+      { id: 'raw_trace', title: 'Raw trace', component: <TxRawTrace txQuery={ txQuery }/> },
+    ].filter(Boolean);
+  })();
 
   const tabIndex = useTabIndexFromQuery(tabs);
 
@@ -75,7 +94,26 @@ const TransactionPageContent = () => {
     };
   }, [ appProps.referrer ]);
 
-  const titleSecondRow = <TxSubHeading hash={ hash } hasTag={ Boolean(data?.tx_tag) }/>;
+  const titleSecondRow = <TxSubHeading hash={ hash } hasTag={ Boolean(data?.tx_tag) } txQuery={ txQuery }/>;
+
+  const content = (() => {
+    if (isPlaceholderData && !showDegradedView) {
+      return (
+        <>
+          <TabsSkeleton tabs={ tabs } mt={ 6 }/>
+          { tabs[tabIndex]?.component }
+        </>
+      );
+    }
+
+    return <RoutedTabs tabs={ tabs }/>;
+  })();
+
+  if (isError && !showDegradedView) {
+    if (isCustomAppError(error)) {
+      throwOnResourceLoadError({ resource: 'tx', error, isError: true });
+    }
+  }
 
   return (
     <>
@@ -86,12 +124,7 @@ const TransactionPageContent = () => {
         contentAfter={ tags }
         secondRow={ titleSecondRow }
       />
-      { isPlaceholderData ? (
-        <>
-          <TabsSkeleton tabs={ tabs } mt={ 6 }/>
-          { tabs[tabIndex]?.component }
-        </>
-      ) : <RoutedTabs tabs={ tabs }/> }
+      { content }
     </>
   );
 };
diff --git a/ui/pages/Transactions.tsx b/ui/pages/Transactions.tsx
index 2d7027aa47..4517b4d985 100644
--- a/ui/pages/Transactions.tsx
+++ b/ui/pages/Transactions.tsx
@@ -7,6 +7,7 @@ import config from 'configs/app';
 import useHasAccount from 'lib/hooks/useHasAccount';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import useNewTxsSocket from 'lib/hooks/useNewTxsSocket';
+import getQueryParamString from 'lib/router/getQueryParamString';
 import { TX } from 'stubs/tx';
 import { generateListStub } from 'stubs/utils';
 import PageTitle from 'ui/shared/Page/PageTitle';
@@ -26,11 +27,19 @@ const Transactions = () => {
   const verifiedTitle = config.chain.verificationType === 'validation' ? 'Validated' : 'Mined';
   const router = useRouter();
   const isMobile = useIsMobile();
-  const txsQuery = useQueryWithPages({
-    resourceName: router.query.tab === 'pending' ? 'txs_pending' : 'txs_validated',
-    filters: { filter: router.query.tab === 'pending' ? 'pending' : 'validated' },
+  const tab = getQueryParamString(router.query.tab);
+
+  React.useEffect(() => {
+    if (tab === 'blob_txs' && !config.features.dataAvailability.isEnabled) {
+      router.replace({ pathname: '/txs' }, undefined, { shallow: true });
+    }
+  }, [ router, tab ]);
+
+  const txsValidatedQuery = useQueryWithPages({
+    resourceName: 'txs_validated',
+    filters: { filter: 'validated' },
     options: {
-      enabled: !router.query.tab || router.query.tab === 'validated' || router.query.tab === 'pending',
+      enabled: !tab || tab === 'validated',
       placeholderData: generateListStub<'txs_validated'>(TX, 50, { next_page_params: {
         block_number: 9005713,
         index: 5,
@@ -40,10 +49,36 @@ const Transactions = () => {
     },
   });
 
+  const txsPendingQuery = useQueryWithPages({
+    resourceName: 'txs_pending',
+    filters: { filter: 'pending' },
+    options: {
+      enabled: tab === 'pending',
+      placeholderData: generateListStub<'txs_pending'>(TX, 50, { next_page_params: {
+        inserted_at: '2024-02-05T07:04:47.749818Z',
+        hash: '0x00',
+        filter: 'pending',
+      } }),
+    },
+  });
+
+  const txsWithBlobsQuery = useQueryWithPages({
+    resourceName: 'txs_with_blobs',
+    filters: { type: 'blob_transaction' },
+    options: {
+      enabled: config.features.dataAvailability.isEnabled && tab === 'blob_txs',
+      placeholderData: generateListStub<'txs_with_blobs'>(TX, 50, { next_page_params: {
+        block_number: 10602877,
+        index: 8,
+        items_count: 50,
+      } }),
+    },
+  });
+
   const txsWatchlistQuery = useQueryWithPages({
     resourceName: 'txs_watchlist',
     options: {
-      enabled: router.query.tab === 'watchlist',
+      enabled: tab === 'watchlist',
       placeholderData: generateListStub<'txs_watchlist'>(TX, 50, { next_page_params: {
         block_number: 9005713,
         index: 5,
@@ -61,15 +96,32 @@ const Transactions = () => {
       id: 'validated',
       title: verifiedTitle,
       component:
-        <TxsWithFrontendSorting query={ txsQuery } showSocketInfo={ txsQuery.pagination.page === 1 } socketInfoNum={ num } socketInfoAlert={ socketAlert }/> },
+        <TxsWithFrontendSorting
+          query={ txsValidatedQuery }
+          showSocketInfo={ txsValidatedQuery.pagination.page === 1 }
+          socketInfoNum={ num }
+          socketInfoAlert={ socketAlert }
+        /> },
     {
       id: 'pending',
       title: 'Pending',
       component: (
         <TxsWithFrontendSorting
-          query={ txsQuery }
+          query={ txsPendingQuery }
           showBlockInfo={ false }
-          showSocketInfo={ txsQuery.pagination.page === 1 }
+          showSocketInfo={ txsPendingQuery.pagination.page === 1 }
+          socketInfoNum={ num }
+          socketInfoAlert={ socketAlert }
+        />
+      ),
+    },
+    config.features.dataAvailability.isEnabled && {
+      id: 'blob_txs',
+      title: 'Blob txns',
+      component: (
+        <TxsWithFrontendSorting
+          query={ txsWithBlobsQuery }
+          showSocketInfo={ txsWithBlobsQuery.pagination.page === 1 }
           socketInfoNum={ num }
           socketInfoAlert={ socketAlert }
         />
@@ -82,7 +134,14 @@ const Transactions = () => {
     } : undefined,
   ].filter(Boolean);
 
-  const pagination = router.query.tab === 'watchlist' ? txsWatchlistQuery.pagination : txsQuery.pagination;
+  const pagination = (() => {
+    switch (tab) {
+      case 'pending': return txsPendingQuery.pagination;
+      case 'watchlist': return txsWatchlistQuery.pagination;
+      case 'blob_txs': return txsWithBlobsQuery.pagination;
+      default: return txsValidatedQuery.pagination;
+    }
+  })();
 
   return (
     <>
diff --git a/ui/pages/UserOp.pw.tsx b/ui/pages/UserOp.pw.tsx
new file mode 100644
index 0000000000..8b7b114c8c
--- /dev/null
+++ b/ui/pages/UserOp.pw.tsx
@@ -0,0 +1,73 @@
+import { test as base, expect, devices } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import { userOpData } from 'mocks/userOps/userOp';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
+
+import UserOp from './UserOp';
+
+const test = base.extend({
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  context: contextWithEnvs(configs.featureEnvs.userOps) as any,
+});
+
+const USER_OP_API_URL = buildApiUrl('user_op', { hash: userOpData.hash });
+
+test('base view', async({ mount, page }) => {
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: '',
+  }));
+
+  await page.route(USER_OP_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(userOpData),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <UserOp/>
+    </TestApp>,
+    { hooksConfig: {
+      router: {
+        query: { hash: userOpData.hash },
+        isReady: true,
+      },
+    } },
+  );
+
+  await expect(component).toHaveScreenshot();
+});
+
+test.describe('mobile', () => {
+  test.use({ viewport: devices['iPhone 13 Pro'].viewport });
+
+  test('base view', async({ mount, page }) => {
+    await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+      status: 200,
+      body: '',
+    }));
+
+    await page.route(USER_OP_API_URL, (route) => route.fulfill({
+      status: 200,
+      body: JSON.stringify(userOpData),
+    }));
+
+    const component = await mount(
+      <TestApp>
+        <UserOp/>
+      </TestApp>,
+      { hooksConfig: {
+        router: {
+          query: { hash: userOpData.hash },
+          isReady: true,
+        },
+      } },
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+});
diff --git a/ui/pages/UserOp.tsx b/ui/pages/UserOp.tsx
new file mode 100644
index 0000000000..4132e39757
--- /dev/null
+++ b/ui/pages/UserOp.tsx
@@ -0,0 +1,114 @@
+import { inRange } from 'lodash';
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import type { Log } from 'types/api/log';
+import type { TokenTransfer } from 'types/api/tokenTransfer';
+import type { RoutedTab } from 'ui/shared/Tabs/types';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import { useAppContext } from 'lib/contexts/app';
+import throwOnAbsentParamError from 'lib/errors/throwOnAbsentParamError';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import getQueryParamString from 'lib/router/getQueryParamString';
+import { USER_OP } from 'stubs/userOps';
+import TextAd from 'ui/shared/ad/TextAd';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import RoutedTabs from 'ui/shared/Tabs/RoutedTabs';
+import TabsSkeleton from 'ui/shared/Tabs/TabsSkeleton';
+import useTabIndexFromQuery from 'ui/shared/Tabs/useTabIndexFromQuery';
+import TxLogs from 'ui/tx/TxLogs';
+import TxTokenTransfer from 'ui/tx/TxTokenTransfer';
+import useTxQuery from 'ui/tx/useTxQuery';
+import UserOpDetails from 'ui/userOp/UserOpDetails';
+import UserOpRaw from 'ui/userOp/UserOpRaw';
+import UserOpSubHeading from 'ui/userOp/UserOpSubHeading';
+
+const UserOp = () => {
+  const router = useRouter();
+  const appProps = useAppContext();
+  const hash = getQueryParamString(router.query.hash);
+
+  const userOpQuery = useApiQuery('user_op', {
+    pathParams: { hash },
+    queryOptions: {
+      enabled: Boolean(hash),
+      placeholderData: USER_OP,
+    },
+  });
+
+  const txQuery = useTxQuery({ hash: userOpQuery.data?.transaction_hash, isEnabled: !userOpQuery.isPlaceholderData });
+
+  const filterTokenTransfersByLogIndex = React.useCallback((tt: TokenTransfer) => {
+    if (!userOpQuery.data) {
+      return true;
+    } else {
+      if (inRange(Number(tt.log_index), userOpQuery.data?.user_logs_start_index, userOpQuery.data?.user_logs_start_index + userOpQuery.data?.user_logs_count)) {
+        return true;
+      }
+      return false;
+    }
+  }, [ userOpQuery.data ]);
+
+  const filterLogsByLogIndex = React.useCallback((log: Log) => {
+    if (!userOpQuery.data) {
+      return true;
+    } else {
+      if (inRange(log.index, userOpQuery.data?.user_logs_start_index, userOpQuery.data?.user_logs_start_index + userOpQuery.data?.user_logs_count)) {
+        return true;
+      }
+      return false;
+    }
+  }, [ userOpQuery.data ]);
+
+  const tabs: Array<RoutedTab> = React.useMemo(() => ([
+    { id: 'index', title: 'Details', component: <UserOpDetails query={ userOpQuery }/> },
+    {
+      id: 'token_transfers',
+      title: 'Token transfers',
+      component: <TxTokenTransfer txQuery={ txQuery } tokenTransferFilter={ filterTokenTransfersByLogIndex }/>,
+    },
+    { id: 'logs', title: 'Logs', component: <TxLogs txQuery={ txQuery } logsFilter={ filterLogsByLogIndex }/> },
+    { id: 'raw', title: 'Raw', component: <UserOpRaw rawData={ userOpQuery.data?.raw } isLoading={ userOpQuery.isPlaceholderData }/> },
+  ]), [ userOpQuery, txQuery, filterTokenTransfersByLogIndex, filterLogsByLogIndex ]);
+
+  const tabIndex = useTabIndexFromQuery(tabs);
+
+  const backLink = React.useMemo(() => {
+    const hasGoBackLink = appProps.referrer && appProps.referrer.includes('/ops');
+
+    if (!hasGoBackLink) {
+      return;
+    }
+
+    return {
+      label: 'Back to user operations list',
+      url: appProps.referrer,
+    };
+  }, [ appProps.referrer ]);
+
+  throwOnAbsentParamError(hash);
+  throwOnResourceLoadError(userOpQuery);
+
+  const titleSecondRow = <UserOpSubHeading hash={ hash }/>;
+
+  return (
+    <>
+      <TextAd mb={ 6 }/>
+      <PageTitle
+        title="User operation details"
+        backLink={ backLink }
+        secondRow={ titleSecondRow }
+      />
+      { userOpQuery.isPlaceholderData ? (
+        <>
+          <TabsSkeleton tabs={ tabs } mt={ 6 }/>
+          { tabs[tabIndex]?.component }
+        </>
+      ) :
+        <RoutedTabs tabs={ tabs }/> }
+    </>
+  );
+};
+
+export default UserOp;
diff --git a/ui/pages/UserOps.pw.tsx b/ui/pages/UserOps.pw.tsx
new file mode 100644
index 0000000000..4d0cb8fe1d
--- /dev/null
+++ b/ui/pages/UserOps.pw.tsx
@@ -0,0 +1,40 @@
+import { Box } from '@chakra-ui/react';
+import { test as base, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import { userOpsData } from 'mocks/userOps/userOps';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
+
+import UserOps from './UserOps';
+
+const test = base.extend({
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  context: contextWithEnvs(configs.featureEnvs.userOps) as any,
+});
+
+const USER_OPS_API_URL = buildApiUrl('user_ops');
+
+test('base view +@mobile', async({ mount, page }) => {
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: '',
+  }));
+
+  await page.route(USER_OPS_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(userOpsData),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <Box pt={{ base: '106px', lg: 0 }}>
+        <UserOps/>
+      </Box>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/pages/UserOps.tsx b/ui/pages/UserOps.tsx
new file mode 100644
index 0000000000..189421d712
--- /dev/null
+++ b/ui/pages/UserOps.tsx
@@ -0,0 +1,28 @@
+import React from 'react';
+
+import { USER_OPS_ITEM } from 'stubs/userOps';
+import { generateListStub } from 'stubs/utils';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import UserOpsContent from 'ui/userOps/UserOpsContent';
+
+const UserOps = () => {
+  const query = useQueryWithPages({
+    resourceName: 'user_ops',
+    options: {
+      placeholderData: generateListStub<'user_ops'>(USER_OPS_ITEM, 50, { next_page_params: {
+        page_token: '10355938,0x5956a847d8089e254e02e5111cad6992b99ceb9e5c2dc4343fd53002834c4dc6',
+        page_size: 50,
+      } }),
+    },
+  });
+
+  return (
+    <>
+      <PageTitle title="User operations" withTextAd/>
+      <UserOpsContent query={ query }/>
+    </>
+  );
+};
+
+export default UserOps;
diff --git a/ui/pages/Validators.pw.tsx b/ui/pages/Validators.pw.tsx
new file mode 100644
index 0000000000..4ea86e6fe4
--- /dev/null
+++ b/ui/pages/Validators.pw.tsx
@@ -0,0 +1,22 @@
+import type { BrowserContext } from '@playwright/test';
+import React from 'react';
+
+import * as validatorsMock from 'mocks/validators/index';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import { test as base, expect } from 'playwright/lib';
+import * as configs from 'playwright/utils/configs';
+
+import Validators from './Validators';
+
+const test = base.extend<{ context: BrowserContext }>({
+  context: contextWithEnvs(configs.featureEnvs.validators),
+});
+
+test('base view +@mobile', async({ render, mockApiResponse }) => {
+  await mockApiResponse('validators', validatorsMock.validatorsResponse, { pathParams: { chainType: 'stability' } });
+  await mockApiResponse('validators_counters', validatorsMock.validatorsCountersResponse, { pathParams: { chainType: 'stability' } });
+
+  const component = await render(<Validators/>);
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/pages/Validators.tsx b/ui/pages/Validators.tsx
new file mode 100644
index 0000000000..2756b59083
--- /dev/null
+++ b/ui/pages/Validators.tsx
@@ -0,0 +1,158 @@
+import { Box, Hide, HStack, Show } from '@chakra-ui/react';
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import { getFeaturePayload } from 'configs/app/features/types';
+import type { ValidatorsFilters, ValidatorsSorting, ValidatorsSortingField, ValidatorsSortingValue } from 'types/api/validators';
+
+import config from 'configs/app';
+// import useDebounce from 'lib/hooks/useDebounce';
+import useIsMobile from 'lib/hooks/useIsMobile';
+import { apos } from 'lib/html-entities';
+import getQueryParamString from 'lib/router/getQueryParamString';
+import { generateListStub } from 'stubs/utils';
+import { VALIDATOR } from 'stubs/validators';
+import ActionBar from 'ui/shared/ActionBar';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+// import FilterInput from 'ui/shared/filters/FilterInput';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import Pagination from 'ui/shared/pagination/Pagination';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import getSortParamsFromValue from 'ui/shared/sort/getSortParamsFromValue';
+import getSortValueFromQuery from 'ui/shared/sort/getSortValueFromQuery';
+import Sort from 'ui/shared/sort/Sort';
+import { SORT_OPTIONS } from 'ui/validators/utils';
+import ValidatorsCounters from 'ui/validators/ValidatorsCounters';
+import ValidatorsFilter from 'ui/validators/ValidatorsFilter';
+import ValidatorsList from 'ui/validators/ValidatorsList';
+import ValidatorsTable from 'ui/validators/ValidatorsTable';
+
+const Validators = () => {
+  const router = useRouter();
+  // const [ searchTerm, setSearchTerm ] = React.useState(getQueryParamString(router.query.address_hash) || undefined);
+  const [ statusFilter, setStatusFilter ] = React.useState(getQueryParamString(router.query.state_filter) as ValidatorsFilters['state_filter'] || undefined);
+  const [ sort, setSort ] =
+    React.useState<ValidatorsSortingValue | undefined>(getSortValueFromQuery<ValidatorsSortingValue>(router.query, SORT_OPTIONS));
+
+  // const debouncedSearchTerm = useDebounce(searchTerm || '', 300);
+
+  const isMobile = useIsMobile();
+
+  const { isError, isPlaceholderData, data, pagination, onFilterChange, onSortingChange } = useQueryWithPages({
+    resourceName: 'validators',
+    pathParams: { chainType: getFeaturePayload(config.features.validators)?.chainType },
+    filters: {
+      // address_hash: debouncedSearchTerm,
+      state_filter: statusFilter,
+    },
+    sorting: getSortParamsFromValue<ValidatorsSortingValue, ValidatorsSortingField, ValidatorsSorting['order']>(sort),
+    options: {
+      enabled: config.features.validators.isEnabled,
+      placeholderData: generateListStub<'validators'>(
+        VALIDATOR,
+        50,
+        { next_page_params: null },
+      ),
+    },
+  });
+
+  // const handleSearchTermChange = React.useCallback((value: string) => {
+  //   onFilterChange({
+  //     address_hash: value,
+  //     state_filter: statusFilter
+  //   });
+  //   setSearchTerm(value);
+  // }, [ statusFilter, onFilterChange ]);
+
+  const handleStateFilterChange = React.useCallback((value: string | Array<string>) => {
+    if (Array.isArray(value)) {
+      return;
+    }
+
+    const state = value === 'all' ? undefined : value as ValidatorsFilters['state_filter'];
+
+    onFilterChange({
+      // address_hash: debouncedSearchTerm,
+      state_filter: state,
+    });
+    setStatusFilter(state);
+  }, [ onFilterChange ]);
+
+  const handleSortChange = React.useCallback((value?: ValidatorsSortingValue) => {
+    setSort(value);
+    onSortingChange(getSortParamsFromValue(value));
+  }, [ onSortingChange ]);
+
+  const filterMenu = <ValidatorsFilter onChange={ handleStateFilterChange } defaultValue={ statusFilter } isActive={ Boolean(statusFilter) }/>;
+
+  // const filterInput = (
+  //   <FilterInput
+  //     w={{ base: '100%', lg: '350px' }}
+  //     size="xs"
+  //     onChange={ handleSearchTermChange }
+  //     placeholder="Search by validator's address hash"
+  //     initialValue={ searchTerm }
+  //   />
+  // );
+
+  const sortButton = (
+    <Sort
+      options={ SORT_OPTIONS }
+      sort={ sort }
+      setSort={ handleSortChange }
+    />
+  );
+
+  const actionBar = (
+    <>
+      <HStack spacing={ 3 } mb={ 6 } display={{ base: 'flex', lg: 'none' }}>
+        { filterMenu }
+        { sortButton }
+        { /* { filterInput } */ }
+      </HStack>
+      { (!isMobile || pagination.isVisible) && (
+        <ActionBar mt={ -6 }>
+          <HStack spacing={ 3 } display={{ base: 'none', lg: 'flex' }}>
+            { filterMenu }
+            { /* { filterInput } */ }
+          </HStack>
+          <Pagination ml="auto" { ...pagination }/>
+        </ActionBar>
+      ) }
+    </>
+  );
+
+  const content = data?.items ? (
+    <>
+      <Show below="lg" ssr={ false }>
+        <ValidatorsList data={ data.items } isLoading={ isPlaceholderData }/>
+      </Show>
+      <Hide below="lg" ssr={ false }>
+        <ValidatorsTable data={ data.items } sort={ sort } setSorting={ handleSortChange } isLoading={ isPlaceholderData }/>
+      </Hide>
+    </>
+  ) : null;
+
+  return (
+    <Box>
+      <PageTitle title="Validators" withTextAd/>
+      <ValidatorsCounters/>
+      <DataListDisplay
+        isError={ isError }
+        items={ data?.items }
+        emptyText="There are no verified contracts."
+        filterProps={{
+          emptyFilteredText: `Couldn${ apos }t find any validator that matches your query.`,
+          hasActiveFilters: Boolean(
+            // searchTerm ||
+            statusFilter,
+          ),
+        }}
+        content={ content }
+        actionBar={ actionBar }
+      />
+    </Box>
+  );
+};
+
+export default Validators;
diff --git a/ui/pages/VerifiedAddresses.pw.tsx b/ui/pages/VerifiedAddresses.pw.tsx
index 3c881b21d6..4b64d5e23b 100644
--- a/ui/pages/VerifiedAddresses.pw.tsx
+++ b/ui/pages/VerifiedAddresses.pw.tsx
@@ -1,69 +1,50 @@
-import { test, expect } from '@playwright/experimental-ct-react';
 import React from 'react';
 
 import * as mocks from 'mocks/account/verifiedAddresses';
-import TestApp from 'playwright/TestApp';
-import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as profileMock from 'mocks/user/profile';
+import authFixture from 'playwright/fixtures/auth';
+import { test as base, expect } from 'playwright/lib';
 
 import VerifiedAddresses from './VerifiedAddresses';
 
-const VERIFIED_ADDRESS_URL = buildApiUrl('verified_addresses', { chainId: '1' });
-const TOKEN_INFO_APPLICATIONS_URL = buildApiUrl('token_info_applications', { chainId: '1', id: undefined });
-
-test.beforeEach(async({ context }) => {
-  await context.route(mocks.TOKEN_INFO_APPLICATION_BASE.iconUrl, (route) => {
-    return route.fulfill({
-      status: 200,
-      path: './playwright/mocks/image_s.jpg',
-    });
-  });
+const test = base.extend({
+  context: ({ context }, use) => {
+    authFixture(context);
+    use(context);
+  },
 });
 
-test('base view +@mobile', async({ mount, page }) => {
-  await page.route(VERIFIED_ADDRESS_URL, (route) => route.fulfill({
-    body: JSON.stringify(mocks.VERIFIED_ADDRESS_RESPONSE.DEFAULT),
-  }));
-
-  await page.route(TOKEN_INFO_APPLICATIONS_URL, (route) => route.fulfill({
-    body: JSON.stringify(mocks.TOKEN_INFO_APPLICATIONS_RESPONSE.DEFAULT),
-  }));
+test.beforeEach(async({ mockAssetResponse }) => {
+  await mockAssetResponse(mocks.TOKEN_INFO_APPLICATION_BASE.iconUrl, './playwright/mocks/image_s.jpg');
+});
 
-  const component = await mount(
-    <TestApp>
-      <VerifiedAddresses/>
-    </TestApp>,
-  );
+test('base view +@mobile', async({ render, mockApiResponse }) => {
+  await mockApiResponse('verified_addresses', mocks.VERIFIED_ADDRESS_RESPONSE.DEFAULT, { pathParams: { chainId: '1' } });
+  await mockApiResponse('token_info_applications', mocks.TOKEN_INFO_APPLICATIONS_RESPONSE.DEFAULT, { pathParams: { chainId: '1', id: undefined } });
+  await mockApiResponse('user_info', profileMock.base);
 
+  const component = await render(<VerifiedAddresses/>);
   await expect(component).toHaveScreenshot();
 });
 
-test('address verification flow', async({ mount, page }) => {
-  const CHECK_ADDRESS_URL = buildApiUrl('address_verification', { chainId: '1', type: ':prepare' });
-  const VERIFY_ADDRESS_URL = buildApiUrl('address_verification', { chainId: '1', type: ':verify' });
+test('user without email', async({ render, mockApiResponse }) => {
+  await mockApiResponse('verified_addresses', mocks.VERIFIED_ADDRESS_RESPONSE.DEFAULT, { pathParams: { chainId: '1' } });
+  await mockApiResponse('token_info_applications', mocks.TOKEN_INFO_APPLICATIONS_RESPONSE.DEFAULT, { pathParams: { chainId: '1', id: undefined } });
+  await mockApiResponse('user_info', profileMock.withoutEmail);
 
-  await page.route(VERIFIED_ADDRESS_URL, (route) => route.fulfill({
-    body: JSON.stringify(mocks.VERIFIED_ADDRESS_RESPONSE.DEFAULT),
-  }));
+  const component = await render(<VerifiedAddresses/>);
 
-  await page.route(TOKEN_INFO_APPLICATIONS_URL, (route) => route.fulfill({
-    body: JSON.stringify(mocks.TOKEN_INFO_APPLICATIONS_RESPONSE.DEFAULT),
-  }));
+  await expect(component).toHaveScreenshot();
+});
 
-  await page.route(CHECK_ADDRESS_URL, (route) => route.fulfill({
-    body: JSON.stringify(mocks.ADDRESS_CHECK_RESPONSE.SUCCESS),
-  }));
+test('address verification flow', async({ render, mockApiResponse, page }) => {
+  await mockApiResponse('verified_addresses', mocks.VERIFIED_ADDRESS_RESPONSE.DEFAULT, { pathParams: { chainId: '1' } });
+  await mockApiResponse('token_info_applications', mocks.TOKEN_INFO_APPLICATIONS_RESPONSE.DEFAULT, { pathParams: { chainId: '1', id: undefined } });
+  await mockApiResponse('address_verification', mocks.ADDRESS_CHECK_RESPONSE.SUCCESS as never, { pathParams: { chainId: '1', type: ':prepare' } });
+  await mockApiResponse('address_verification', mocks.ADDRESS_VERIFY_RESPONSE.SUCCESS as never, { pathParams: { chainId: '1', type: ':verify' } });
+  await mockApiResponse('user_info', profileMock.base);
 
-  await page.route(VERIFY_ADDRESS_URL, (route) => {
-    return route.fulfill({
-      body: JSON.stringify(mocks.ADDRESS_VERIFY_RESPONSE.SUCCESS),
-    });
-  });
-
-  await mount(
-    <TestApp>
-      <VerifiedAddresses/>
-    </TestApp>,
-  );
+  await render(<VerifiedAddresses/>);
 
   // open modal
   await page.getByRole('button', { name: /add address/i }).click();
@@ -74,6 +55,7 @@ test('address verification flow', async({ mount, page }) => {
   await page.getByRole('button', { name: /continue/i }).click();
 
   // fill second step
+  await page.getByText('Sign manually').click();
   const signatureInput = page.getByLabel(/signature hash/i);
   await signatureInput.fill(mocks.SIGNATURE);
   await page.getByRole('button', { name: /verify/i }).click();
@@ -84,33 +66,20 @@ test('address verification flow', async({ mount, page }) => {
   await expect(page).toHaveScreenshot();
 });
 
-test('application update flow', async({ mount, page }) => {
-  const TOKEN_INFO_APPLICATION_URL = buildApiUrl('token_info_applications', { chainId: '1', id: mocks.TOKEN_INFO_APPLICATION.UPDATED_ITEM.id });
-  const FORM_CONFIG_URL = buildApiUrl('token_info_applications_config', { chainId: '1' });
-
-  await page.route(VERIFIED_ADDRESS_URL, (route) => route.fulfill({
-    body: JSON.stringify(mocks.VERIFIED_ADDRESS_RESPONSE.DEFAULT),
-  }));
-
-  await page.route(TOKEN_INFO_APPLICATIONS_URL, (route) => route.fulfill({
-    body: JSON.stringify(mocks.TOKEN_INFO_APPLICATIONS_RESPONSE.FOR_UPDATE),
-  }));
+test('application update flow', async({ render, mockApiResponse, page }) => {
+  await mockApiResponse('verified_addresses', mocks.VERIFIED_ADDRESS_RESPONSE.DEFAULT, { pathParams: { chainId: '1' } });
+  await mockApiResponse('token_info_applications', mocks.TOKEN_INFO_APPLICATIONS_RESPONSE.FOR_UPDATE, { pathParams: { chainId: '1', id: undefined } });
+  await mockApiResponse('user_info', profileMock.base);
+  await mockApiResponse('token_info_applications_config', mocks.TOKEN_INFO_FORM_CONFIG, { pathParams: { chainId: '1' } });
 
-  await page.route(FORM_CONFIG_URL, (route) => route.fulfill({
-    body: JSON.stringify(mocks.TOKEN_INFO_FORM_CONFIG),
-  }));
-
-  // PUT request
-  await page.route(TOKEN_INFO_APPLICATION_URL, (route) => route.fulfill({
-    body: JSON.stringify(mocks.TOKEN_INFO_APPLICATION.UPDATED_ITEM),
-  }));
-
-  await mount(
-    <TestApp>
-      <VerifiedAddresses/>
-    </TestApp>,
+  await mockApiResponse(
+    'token_info_applications',
+    mocks.TOKEN_INFO_APPLICATION.UPDATED_ITEM as never, // this mock is for PUT request
+    { pathParams: { chainId: '1', id: mocks.TOKEN_INFO_APPLICATION.UPDATED_ITEM.id } },
   );
 
+  await render(<VerifiedAddresses/>);
+
   // open form
   await page.locator('tr').filter({ hasText: 'waiting for update' }).locator('button[aria-label="edit"]').click();
 
diff --git a/ui/pages/VerifiedAddresses.tsx b/ui/pages/VerifiedAddresses.tsx
index 76a2134829..417ad31710 100644
--- a/ui/pages/VerifiedAddresses.tsx
+++ b/ui/pages/VerifiedAddresses.tsx
@@ -1,4 +1,4 @@
-import { OrderedList, ListItem, chakra, Button, useDisclosure, Show, Hide, Skeleton, Link } from '@chakra-ui/react';
+import { OrderedList, ListItem, chakra, Button, useDisclosure, Show, Hide, Skeleton, Link, Alert } from '@chakra-ui/react';
 import { useQueryClient } from '@tanstack/react-query';
 import { useRouter } from 'next/router';
 import React from 'react';
@@ -7,6 +7,7 @@ import type { VerifiedAddress, TokenInfoApplication, TokenInfoApplications, Veri
 
 import config from 'configs/app';
 import useApiQuery, { getResourceKey } from 'lib/api/useApiQuery';
+import useFetchProfileInfo from 'lib/hooks/useFetchProfileInfo';
 import useRedirectForInvalidAuthToken from 'lib/hooks/useRedirectForInvalidAuthToken';
 import { PAGE_TYPE_DICT } from 'lib/mixpanel/getPageType';
 import getQueryParamString from 'lib/router/getQueryParamString';
@@ -37,16 +38,20 @@ const VerifiedAddresses = () => {
   const modalProps = useDisclosure();
   const queryClient = useQueryClient();
 
+  const userInfoQuery = useFetchProfileInfo();
+
   const addressesQuery = useApiQuery('verified_addresses', {
     pathParams: { chainId: config.chain.id },
     queryOptions: {
       placeholderData: { verifiedAddresses: Array(3).fill(VERIFIED_ADDRESS) },
+      enabled: Boolean(userInfoQuery.data?.email),
     },
   });
   const applicationsQuery = useApiQuery('token_info_applications', {
     pathParams: { chainId: config.chain.id, id: undefined },
     queryOptions: {
       placeholderData: { submissions: Array(3).fill(TOKEN_INFO_APPLICATION) },
+      enabled: Boolean(userInfoQuery.data?.email),
       select: (data) => {
         return {
           ...data,
@@ -57,6 +62,7 @@ const VerifiedAddresses = () => {
   });
 
   const isLoading = addressesQuery.isPlaceholderData || applicationsQuery.isPlaceholderData;
+  const userWithoutEmail = userInfoQuery.data && !userInfoQuery.data.email;
 
   const handleGoBack = React.useCallback(() => {
     setSelectedAddress(undefined);
@@ -100,13 +106,23 @@ const VerifiedAddresses = () => {
       });
   }, [ queryClient ]);
 
-  const addButton = (
-    <Skeleton mt={ 8 } isLoaded={ !isLoading } display="inline-block">
-      <Button size="lg" onClick={ modalProps.onOpen }>
-          Add address
-      </Button>
-    </Skeleton>
-  );
+  const addButton = (() => {
+    if (userWithoutEmail) {
+      return (
+        <Button size="lg" isDisabled mt={ 8 }>
+            Add address
+        </Button>
+      );
+    }
+
+    return (
+      <Skeleton mt={ 8 } isLoaded={ !isLoading } display="inline-block">
+        <Button size="lg" onClick={ modalProps.onOpen }>
+            Add address
+        </Button>
+      </Skeleton>
+    );
+  })();
 
   const backLink = React.useMemo(() => {
     if (!selectedAddress) {
@@ -135,35 +151,53 @@ const VerifiedAddresses = () => {
     );
   }
 
-  const content = addressesQuery.data?.verifiedAddresses ? (
-    <>
-      <Show below="lg" key="content-mobile" ssr={ false }>
-        { addressesQuery.data.verifiedAddresses.map((item, index) => (
-          <VerifiedAddressesListItem
-            key={ item.contractAddress + (isLoading ? index : '') }
-            item={ item }
-            application={ applicationsQuery.data?.submissions?.find(({ tokenAddress }) => tokenAddress.toLowerCase() === item.contractAddress.toLowerCase()) }
-            onAdd={ handleItemAdd }
-            onEdit={ handleItemEdit }
-            isLoading={ isLoading }
-          />
-        )) }
-      </Show>
-      <Hide below="lg" key="content-desktop" ssr={ false }>
-        <VerifiedAddressesTable
-          data={ addressesQuery.data.verifiedAddresses }
-          applications={ applicationsQuery.data?.submissions }
-          onItemEdit={ handleItemEdit }
-          onItemAdd={ handleItemAdd }
-          isLoading={ isLoading }
-        />
-      </Hide>
-    </>
-  ) : null;
+  const content = (() => {
+    if (userWithoutEmail) {
+      return null;
+    }
+
+    if (addressesQuery.data?.verifiedAddresses) {
+      return (
+        <>
+          <Show below="lg" key="content-mobile" ssr={ false }>
+            { addressesQuery.data.verifiedAddresses.map((item, index) => (
+              <VerifiedAddressesListItem
+                key={ item.contractAddress + (isLoading ? index : '') }
+                item={ item }
+                application={
+                  applicationsQuery.data?.submissions
+                    ?.find(({ tokenAddress }) => tokenAddress.toLowerCase() === item.contractAddress.toLowerCase())
+                }
+                onAdd={ handleItemAdd }
+                onEdit={ handleItemEdit }
+                isLoading={ isLoading }
+              />
+            )) }
+          </Show>
+          <Hide below="lg" key="content-desktop" ssr={ false }>
+            <VerifiedAddressesTable
+              data={ addressesQuery.data.verifiedAddresses }
+              applications={ applicationsQuery.data?.submissions }
+              onItemEdit={ handleItemEdit }
+              onItemAdd={ handleItemAdd }
+              isLoading={ isLoading }
+            />
+          </Hide>
+        </>
+      );
+    }
+
+    return null;
+  })();
 
   return (
     <>
       <PageTitle title="My verified addresses"/>
+      { userWithoutEmail && (
+        <Alert status="warning" mb={ 6 }>
+          You need a valid email address to verify addresses. Please logout of MyAccount then login using your email to proceed.
+        </Alert>
+      ) }
       <AccountPageDescription allowCut={ false }>
         <span>
           Verify ownership of a smart contract address to easily update information in Blockscout.
@@ -188,7 +222,7 @@ const VerifiedAddresses = () => {
         <AdminSupportText mt={ 5 }/>
       </AccountPageDescription>
       <DataListDisplay
-        isError={ addressesQuery.isError || applicationsQuery.isError }
+        isError={ userInfoQuery.isError || addressesQuery.isError || applicationsQuery.isError }
         items={ addressesQuery.data?.verifiedAddresses }
         content={ content }
         emptyText=""
diff --git a/ui/pages/ZkEvmL2TxnBatch.pw.tsx b/ui/pages/ZkEvmL2TxnBatch.pw.tsx
index 852ecc3afb..b2d2e49f51 100644
--- a/ui/pages/ZkEvmL2TxnBatch.pw.tsx
+++ b/ui/pages/ZkEvmL2TxnBatch.pw.tsx
@@ -11,7 +11,7 @@ import ZkEvmL2TxnBatch from './ZkEvmL2TxnBatch';
 
 const test = base.extend({
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  context: contextWithEnvs(configs.featureEnvs.zkRollup) as any,
+  context: contextWithEnvs(configs.featureEnvs.zkEvmRollup) as any,
 });
 
 const hooksConfig = {
diff --git a/ui/pages/ZkEvmL2TxnBatch.tsx b/ui/pages/ZkEvmL2TxnBatch.tsx
index 388703bf41..48301dd891 100644
--- a/ui/pages/ZkEvmL2TxnBatch.tsx
+++ b/ui/pages/ZkEvmL2TxnBatch.tsx
@@ -5,6 +5,8 @@ import type { RoutedTab } from 'ui/shared/Tabs/types';
 
 import useApiQuery from 'lib/api/useApiQuery';
 import { useAppContext } from 'lib/contexts/app';
+import throwOnAbsentParamError from 'lib/errors/throwOnAbsentParamError';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import getQueryParamString from 'lib/router/getQueryParamString';
 import { TX_ZKEVM_L2 } from 'stubs/tx';
 import { generateListStub } from 'stubs/utils';
@@ -14,8 +16,8 @@ import PageTitle from 'ui/shared/Page/PageTitle';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import RoutedTabs from 'ui/shared/Tabs/RoutedTabs';
 import TabsSkeleton from 'ui/shared/Tabs/TabsSkeleton';
+import ZkEvmL2TxnBatchDetails from 'ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails';
 import TxsWithFrontendSorting from 'ui/txs/TxsWithFrontendSorting';
-import ZkEvmL2TxnBatchDetails from 'ui/zkEvmL2TxnBatches/ZkEvmL2TxnBatchDetails';
 
 const ZkEvmL2TxnBatch = () => {
   const router = useRouter();
@@ -41,13 +43,8 @@ const ZkEvmL2TxnBatch = () => {
     },
   });
 
-  if (!number) {
-    throw new Error('Tx batch not found', { cause: { status: 404 } });
-  }
-
-  if (batchQuery.isError) {
-    throw new Error(undefined, { cause: batchQuery.error });
-  }
+  throwOnAbsentParamError(number);
+  throwOnResourceLoadError(batchQuery);
 
   const tabs: Array<RoutedTab> = React.useMemo(() => ([
     { id: 'index', title: 'Details', component: <ZkEvmL2TxnBatchDetails query={ batchQuery }/> },
diff --git a/ui/pages/ZkEvmL2TxnBatches.pw.tsx b/ui/pages/ZkEvmL2TxnBatches.pw.tsx
index 8c403a4620..a94f883bda 100644
--- a/ui/pages/ZkEvmL2TxnBatches.pw.tsx
+++ b/ui/pages/ZkEvmL2TxnBatches.pw.tsx
@@ -11,7 +11,7 @@ import ZkEvmL2TxnBatches from './ZkEvmL2TxnBatches';
 
 const test = base.extend({
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  context: contextWithEnvs(configs.featureEnvs.zkRollup) as any,
+  context: contextWithEnvs(configs.featureEnvs.zkEvmRollup) as any,
 });
 
 const BATCHES_API_URL = buildApiUrl('zkevm_l2_txn_batches');
diff --git a/ui/pages/ZkEvmL2TxnBatches.tsx b/ui/pages/ZkEvmL2TxnBatches.tsx
index 562be180c9..5f20907025 100644
--- a/ui/pages/ZkEvmL2TxnBatches.tsx
+++ b/ui/pages/ZkEvmL2TxnBatches.tsx
@@ -8,8 +8,8 @@ import DataListDisplay from 'ui/shared/DataListDisplay';
 import PageTitle from 'ui/shared/Page/PageTitle';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import StickyPaginationWithText from 'ui/shared/StickyPaginationWithText';
-import ZkEvmTxnBatchesListItem from 'ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesListItem';
-import ZkEvmTxnBatchesTable from 'ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesTable';
+import ZkEvmTxnBatchesListItem from 'ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesListItem';
+import ZkEvmTxnBatchesTable from 'ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesTable';
 
 const ZkEvmL2TxnBatches = () => {
   const { data, isError, isPlaceholderData, pagination } = useQueryWithPages({
diff --git a/ui/pages/ZkSyncL2TxnBatch.pw.tsx b/ui/pages/ZkSyncL2TxnBatch.pw.tsx
new file mode 100644
index 0000000000..055a678cf3
--- /dev/null
+++ b/ui/pages/ZkSyncL2TxnBatch.pw.tsx
@@ -0,0 +1,60 @@
+import { test as base, expect, devices } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import * as zkSyncTxnBatchMock from 'mocks/zkSync/zkSyncTxnBatch';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
+
+import ZkSyncL2TxnBatch from './ZkSyncL2TxnBatch';
+
+const test = base.extend({
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  context: contextWithEnvs(configs.featureEnvs.zkSyncRollup) as any,
+});
+
+const hooksConfig = {
+  router: {
+    query: { number: String(zkSyncTxnBatchMock.base.number) },
+  },
+};
+
+test.beforeEach(async({ page }) => {
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: '',
+  }));
+
+  await page.route(BATCH_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(zkSyncTxnBatchMock.base),
+  }));
+});
+
+const BATCH_API_URL = buildApiUrl('zksync_l2_txn_batch', { number: String(zkSyncTxnBatchMock.base.number) });
+
+test('base view', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <ZkSyncL2TxnBatch/>
+    </TestApp>,
+    { hooksConfig },
+  );
+
+  await expect(component).toHaveScreenshot();
+});
+
+test.describe('mobile', () => {
+  test.use({ viewport: devices['iPhone 13 Pro'].viewport });
+  test('base view', async({ mount }) => {
+    const component = await mount(
+      <TestApp>
+        <ZkSyncL2TxnBatch/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+});
diff --git a/ui/pages/ZkSyncL2TxnBatch.tsx b/ui/pages/ZkSyncL2TxnBatch.tsx
new file mode 100644
index 0000000000..14608aa143
--- /dev/null
+++ b/ui/pages/ZkSyncL2TxnBatch.tsx
@@ -0,0 +1,102 @@
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import type { RoutedTab } from 'ui/shared/Tabs/types';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import { useAppContext } from 'lib/contexts/app';
+import throwOnAbsentParamError from 'lib/errors/throwOnAbsentParamError';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import useIsMobile from 'lib/hooks/useIsMobile';
+import getQueryParamString from 'lib/router/getQueryParamString';
+import { TX } from 'stubs/tx';
+import { generateListStub } from 'stubs/utils';
+import { ZKSYNC_L2_TXN_BATCH } from 'stubs/zkSyncL2';
+import TextAd from 'ui/shared/ad/TextAd';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import Pagination from 'ui/shared/pagination/Pagination';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import RoutedTabs from 'ui/shared/Tabs/RoutedTabs';
+import TabsSkeleton from 'ui/shared/Tabs/TabsSkeleton';
+import ZkSyncL2TxnBatchDetails from 'ui/txnBatches/zkSyncL2/ZkSyncL2TxnBatchDetails';
+import TxsWithFrontendSorting from 'ui/txs/TxsWithFrontendSorting';
+
+const TAB_LIST_PROPS = {
+  marginBottom: 0,
+  py: 5,
+  marginTop: -5,
+};
+
+const ZkSyncL2TxnBatch = () => {
+  const router = useRouter();
+  const appProps = useAppContext();
+  const number = getQueryParamString(router.query.number);
+  const tab = getQueryParamString(router.query.tab);
+  const isMobile = useIsMobile();
+
+  const batchQuery = useApiQuery('zksync_l2_txn_batch', {
+    pathParams: { number },
+    queryOptions: {
+      enabled: Boolean(number),
+      placeholderData: ZKSYNC_L2_TXN_BATCH,
+    },
+  });
+
+  const batchTxsQuery = useQueryWithPages({
+    resourceName: 'zksync_l2_txn_batch_txs',
+    pathParams: { number },
+    options: {
+      enabled: Boolean(!batchQuery.isPlaceholderData && batchQuery.data?.number && tab === 'txs'),
+      placeholderData: generateListStub<'zksync_l2_txn_batch_txs'>(TX, 50, { next_page_params: {
+        batch_number: '8122',
+        block_number: 1338932,
+        index: 0,
+        items_count: 50,
+      } }),
+    },
+  });
+
+  throwOnAbsentParamError(number);
+  throwOnResourceLoadError(batchQuery);
+
+  const tabs: Array<RoutedTab> = React.useMemo(() => ([
+    { id: 'index', title: 'Details', component: <ZkSyncL2TxnBatchDetails query={ batchQuery }/> },
+    { id: 'txs', title: 'Transactions', component: <TxsWithFrontendSorting query={ batchTxsQuery } showSocketInfo={ false }/> },
+  ].filter(Boolean)), [ batchQuery, batchTxsQuery ]);
+
+  const backLink = React.useMemo(() => {
+    const hasGoBackLink = appProps.referrer && appProps.referrer.endsWith('/batches');
+
+    if (!hasGoBackLink) {
+      return;
+    }
+
+    return {
+      label: 'Back to tx batches list',
+      url: appProps.referrer,
+    };
+  }, [ appProps.referrer ]);
+
+  const hasPagination = !isMobile && batchTxsQuery.pagination.isVisible && tab === 'txs';
+
+  return (
+    <>
+      <TextAd mb={ 6 }/>
+      <PageTitle
+        title={ `Tx batch #${ number }` }
+        backLink={ backLink }
+      />
+      { batchQuery.isPlaceholderData ?
+        <TabsSkeleton tabs={ tabs }/> : (
+          <RoutedTabs
+            tabs={ tabs }
+            tabListProps={ isMobile ? undefined : TAB_LIST_PROPS }
+            rightSlot={ hasPagination ? <Pagination { ...(batchTxsQuery.pagination) }/> : null }
+            stickyEnabled={ hasPagination }
+          />
+        ) }
+    </>
+  );
+};
+
+export default ZkSyncL2TxnBatch;
diff --git a/ui/pages/ZkSyncL2TxnBatches.pw.tsx b/ui/pages/ZkSyncL2TxnBatches.pw.tsx
new file mode 100644
index 0000000000..8b0bf139a0
--- /dev/null
+++ b/ui/pages/ZkSyncL2TxnBatches.pw.tsx
@@ -0,0 +1,44 @@
+import { test as base, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import * as zkSyncTxnBatchesMock from 'mocks/zkSync/zkSyncTxnBatches';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
+
+import ZkSyncL2TxnBatches from './ZkSyncL2TxnBatches';
+
+const test = base.extend({
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  context: contextWithEnvs(configs.featureEnvs.zkSyncRollup) as any,
+});
+
+const BATCHES_API_URL = buildApiUrl('zksync_l2_txn_batches');
+const BATCHES_COUNTERS_API_URL = buildApiUrl('zksync_l2_txn_batches_count');
+
+test('base view +@mobile', async({ mount, page }) => {
+  test.slow();
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: '',
+  }));
+
+  await page.route(BATCHES_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(zkSyncTxnBatchesMock.baseResponse),
+  }));
+
+  await page.route(BATCHES_COUNTERS_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: '9927',
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <ZkSyncL2TxnBatches/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/pages/ZkSyncL2TxnBatches.tsx b/ui/pages/ZkSyncL2TxnBatches.tsx
new file mode 100644
index 0000000000..d01bbef7de
--- /dev/null
+++ b/ui/pages/ZkSyncL2TxnBatches.tsx
@@ -0,0 +1,83 @@
+import { Hide, Show, Skeleton, Text } from '@chakra-ui/react';
+import React from 'react';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import { generateListStub } from 'stubs/utils';
+import { ZKSYNC_L2_TXN_BATCHES_ITEM } from 'stubs/zkSyncL2';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+import PageTitle from 'ui/shared/Page/PageTitle';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import StickyPaginationWithText from 'ui/shared/StickyPaginationWithText';
+import ZkSyncTxnBatchesListItem from 'ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesListItem';
+import ZkSyncTxnBatchesTable from 'ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesTable';
+
+const ZkSyncL2TxnBatches = () => {
+  const { data, isError, isPlaceholderData, pagination } = useQueryWithPages({
+    resourceName: 'zksync_l2_txn_batches',
+    options: {
+      placeholderData: generateListStub<'zksync_l2_txn_batches'>(
+        ZKSYNC_L2_TXN_BATCHES_ITEM,
+        50,
+        {
+          next_page_params: {
+            items_count: 50,
+            number: 9045200,
+          },
+        },
+      ),
+    },
+  });
+
+  const countersQuery = useApiQuery('zksync_l2_txn_batches_count', {
+    queryOptions: {
+      placeholderData: 5231746,
+    },
+  });
+
+  const content = data?.items ? (
+    <>
+      <Show below="lg" ssr={ false }>
+        { data.items.map(((item, index) => (
+          <ZkSyncTxnBatchesListItem
+            key={ item.number + (isPlaceholderData ? String(index) : '') }
+            item={ item }
+            isLoading={ isPlaceholderData }
+          />
+        ))) }
+      </Show>
+      <Hide below="lg" ssr={ false }><ZkSyncTxnBatchesTable items={ data.items } top={ pagination.isVisible ? 80 : 0 } isLoading={ isPlaceholderData }/></Hide>
+    </>
+  ) : null;
+
+  const text = (() => {
+    if (countersQuery.isError || isError || !data?.items.length) {
+      return null;
+    }
+
+    return (
+      <Skeleton isLoaded={ !countersQuery.isPlaceholderData && !isPlaceholderData } display="flex" flexWrap="wrap">
+        Tx batch
+        <Text fontWeight={ 600 } whiteSpace="pre"> #{ data.items[0].number } </Text>to
+        <Text fontWeight={ 600 } whiteSpace="pre"> #{ data.items[data.items.length - 1].number } </Text>
+        (total of { countersQuery.data?.toLocaleString() } batches)
+      </Skeleton>
+    );
+  })();
+
+  const actionBar = <StickyPaginationWithText text={ text } pagination={ pagination }/>;
+
+  return (
+    <>
+      <PageTitle title="Tx batches" withTextAd/>
+      <DataListDisplay
+        isError={ isError }
+        items={ data?.items }
+        emptyText="There are no tx batches."
+        content={ content }
+        actionBar={ actionBar }
+      />
+    </>
+  );
+};
+
+export default ZkSyncL2TxnBatches;
diff --git a/ui/pages/__screenshots__/Accounts.pw.tsx_mobile_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Accounts.pw.tsx_mobile_base-view-mobile-dark-mode-1.png
index 7248572c46..0f79cf36b9 100644
Binary files a/ui/pages/__screenshots__/Accounts.pw.tsx_mobile_base-view-mobile-dark-mode-1.png and b/ui/pages/__screenshots__/Accounts.pw.tsx_mobile_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/BeaconChainWithdrawals.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/BeaconChainWithdrawals.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..601ac6bbb7
Binary files /dev/null and b/ui/pages/__screenshots__/BeaconChainWithdrawals.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/BeaconChainWithdrawals.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/BeaconChainWithdrawals.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..add6a71f0d
Binary files /dev/null and b/ui/pages/__screenshots__/BeaconChainWithdrawals.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/Blob.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Blob.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..87527b5a93
Binary files /dev/null and b/ui/pages/__screenshots__/Blob.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Blob.pw.tsx_default_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Blob.pw.tsx_default_base-view-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..6ab988b309
Binary files /dev/null and b/ui/pages/__screenshots__/Blob.pw.tsx_default_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Blob.pw.tsx_default_without-data-1.png b/ui/pages/__screenshots__/Blob.pw.tsx_default_without-data-1.png
new file mode 100644
index 0000000000..bde292e320
Binary files /dev/null and b/ui/pages/__screenshots__/Blob.pw.tsx_default_without-data-1.png differ
diff --git a/ui/pages/__screenshots__/Blob.pw.tsx_mobile_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Blob.pw.tsx_mobile_base-view-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..2fdc492595
Binary files /dev/null and b/ui/pages/__screenshots__/Blob.pw.tsx_mobile_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/CsvExport.pw.tsx_mobile_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/CsvExport.pw.tsx_mobile_base-view-mobile-dark-mode-1.png
index f3a9396fb8..d5640e74c9 100644
Binary files a/ui/pages/__screenshots__/CsvExport.pw.tsx_mobile_base-view-mobile-dark-mode-1.png and b/ui/pages/__screenshots__/CsvExport.pw.tsx_mobile_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/GasTracker.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png b/ui/pages/__screenshots__/GasTracker.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png
new file mode 100644
index 0000000000..f773687f4e
Binary files /dev/null and b/ui/pages/__screenshots__/GasTracker.pw.tsx_dark-color-mode_base-view-dark-mode-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/GasTracker.pw.tsx_default_base-view-dark-mode-mobile-1.png b/ui/pages/__screenshots__/GasTracker.pw.tsx_default_base-view-dark-mode-mobile-1.png
new file mode 100644
index 0000000000..f8330a6402
Binary files /dev/null and b/ui/pages/__screenshots__/GasTracker.pw.tsx_default_base-view-dark-mode-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/GasTracker.pw.tsx_mobile_base-view-dark-mode-mobile-1.png b/ui/pages/__screenshots__/GasTracker.pw.tsx_mobile_base-view-dark-mode-mobile-1.png
new file mode 100644
index 0000000000..3d0aba111a
Binary files /dev/null and b/ui/pages/__screenshots__/GasTracker.pw.tsx_mobile_base-view-dark-mode-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/Home.pw.tsx_dark-color-mode_default-view---default-dark-mode-1.png b/ui/pages/__screenshots__/Home.pw.tsx_dark-color-mode_default-view---default-dark-mode-1.png
index e10ae1d684..e2ed79ae58 100644
Binary files a/ui/pages/__screenshots__/Home.pw.tsx_dark-color-mode_default-view---default-dark-mode-1.png and b/ui/pages/__screenshots__/Home.pw.tsx_dark-color-mode_default-view---default-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Home.pw.tsx_default_custom-hero-plate-background-default-view-1.png b/ui/pages/__screenshots__/Home.pw.tsx_default_custom-hero-plate-background-default-view-1.png
index 1851dc3744..d600afbd5f 100644
Binary files a/ui/pages/__screenshots__/Home.pw.tsx_default_custom-hero-plate-background-default-view-1.png and b/ui/pages/__screenshots__/Home.pw.tsx_default_custom-hero-plate-background-default-view-1.png differ
diff --git a/ui/pages/__screenshots__/Home.pw.tsx_default_default-view-screen-xl-1.png b/ui/pages/__screenshots__/Home.pw.tsx_default_default-view-screen-xl-1.png
index 06cdd3d820..7fb3bdf096 100644
Binary files a/ui/pages/__screenshots__/Home.pw.tsx_default_default-view-screen-xl-1.png and b/ui/pages/__screenshots__/Home.pw.tsx_default_default-view-screen-xl-1.png differ
diff --git a/ui/pages/__screenshots__/Home.pw.tsx_default_mobile-base-view-1.png b/ui/pages/__screenshots__/Home.pw.tsx_default_mobile-base-view-1.png
index f5fd2e4c57..d5c4e1f321 100644
Binary files a/ui/pages/__screenshots__/Home.pw.tsx_default_mobile-base-view-1.png and b/ui/pages/__screenshots__/Home.pw.tsx_default_mobile-base-view-1.png differ
diff --git a/ui/pages/__screenshots__/L2Deposits.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/L2Deposits.pw.tsx_default_base-view-mobile-1.png
deleted file mode 100644
index 14dece9ea6..0000000000
Binary files a/ui/pages/__screenshots__/L2Deposits.pw.tsx_default_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/L2Deposits.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/L2Deposits.pw.tsx_mobile_base-view-mobile-1.png
deleted file mode 100644
index 57f48bfcc4..0000000000
Binary files a/ui/pages/__screenshots__/L2Deposits.pw.tsx_mobile_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/L2OutputRoots.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/L2OutputRoots.pw.tsx_default_base-view-mobile-1.png
deleted file mode 100644
index 25c3210032..0000000000
Binary files a/ui/pages/__screenshots__/L2OutputRoots.pw.tsx_default_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/L2OutputRoots.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/L2OutputRoots.pw.tsx_mobile_base-view-mobile-1.png
deleted file mode 100644
index 477bcaaca4..0000000000
Binary files a/ui/pages/__screenshots__/L2OutputRoots.pw.tsx_mobile_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/L2TxnBatches.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/L2TxnBatches.pw.tsx_default_base-view-mobile-1.png
deleted file mode 100644
index 8409b37609..0000000000
Binary files a/ui/pages/__screenshots__/L2TxnBatches.pw.tsx_default_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/L2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/L2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png
deleted file mode 100644
index e9b20c4699..0000000000
Binary files a/ui/pages/__screenshots__/L2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/L2Withdrawals.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/L2Withdrawals.pw.tsx_default_base-view-mobile-1.png
deleted file mode 100644
index 1d1532ab8c..0000000000
Binary files a/ui/pages/__screenshots__/L2Withdrawals.pw.tsx_default_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/L2Withdrawals.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/L2Withdrawals.pw.tsx_mobile_base-view-mobile-1.png
deleted file mode 100644
index 6e12fd8a6e..0000000000
Binary files a/ui/pages/__screenshots__/L2Withdrawals.pw.tsx_mobile_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/Marketplace.pw.tsx_dark-color-mode_base-view-dark-mode-1.png b/ui/pages/__screenshots__/Marketplace.pw.tsx_dark-color-mode_base-view-dark-mode-1.png
new file mode 100644
index 0000000000..442d62ab16
Binary files /dev/null and b/ui/pages/__screenshots__/Marketplace.pw.tsx_dark-color-mode_base-view-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Marketplace.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Marketplace.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..124c2b86d6
Binary files /dev/null and b/ui/pages/__screenshots__/Marketplace.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Marketplace.pw.tsx_dark-color-mode_with-scores-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Marketplace.pw.tsx_dark-color-mode_with-scores-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..21e51e79fd
Binary files /dev/null and b/ui/pages/__screenshots__/Marketplace.pw.tsx_dark-color-mode_with-scores-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Marketplace.pw.tsx_default_base-view-dark-mode-1.png b/ui/pages/__screenshots__/Marketplace.pw.tsx_default_base-view-dark-mode-1.png
new file mode 100644
index 0000000000..575ce38e53
Binary files /dev/null and b/ui/pages/__screenshots__/Marketplace.pw.tsx_default_base-view-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Marketplace.pw.tsx_default_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Marketplace.pw.tsx_default_base-view-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..ab79db5a10
Binary files /dev/null and b/ui/pages/__screenshots__/Marketplace.pw.tsx_default_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Marketplace.pw.tsx_default_with-scores-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Marketplace.pw.tsx_default_with-scores-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..85c7dea12e
Binary files /dev/null and b/ui/pages/__screenshots__/Marketplace.pw.tsx_default_with-scores-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Marketplace.pw.tsx_mobile_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Marketplace.pw.tsx_mobile_base-view-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..82585aee4f
Binary files /dev/null and b/ui/pages/__screenshots__/Marketplace.pw.tsx_mobile_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Marketplace.pw.tsx_mobile_with-scores-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Marketplace.pw.tsx_mobile_with-scores-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..5d8c323fe8
Binary files /dev/null and b/ui/pages/__screenshots__/Marketplace.pw.tsx_mobile_with-scores-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/MarketplaceApp.pw.tsx_dark-color-mode_base-view-dark-mode-1.png b/ui/pages/__screenshots__/MarketplaceApp.pw.tsx_dark-color-mode_base-view-dark-mode-1.png
new file mode 100644
index 0000000000..8f62ca6d83
Binary files /dev/null and b/ui/pages/__screenshots__/MarketplaceApp.pw.tsx_dark-color-mode_base-view-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/MarketplaceApp.pw.tsx_default_base-view-dark-mode-1.png b/ui/pages/__screenshots__/MarketplaceApp.pw.tsx_default_base-view-dark-mode-1.png
new file mode 100644
index 0000000000..ce2c911b14
Binary files /dev/null and b/ui/pages/__screenshots__/MarketplaceApp.pw.tsx_default_base-view-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/MarketplaceApp.pw.tsx_default_mobile-base-view-1.png b/ui/pages/__screenshots__/MarketplaceApp.pw.tsx_default_mobile-base-view-1.png
new file mode 100644
index 0000000000..f03dd57c1e
Binary files /dev/null and b/ui/pages/__screenshots__/MarketplaceApp.pw.tsx_default_mobile-base-view-1.png differ
diff --git a/ui/pages/__screenshots__/NameDomain.pw.tsx_default_details-tab-1.png b/ui/pages/__screenshots__/NameDomain.pw.tsx_default_details-tab-1.png
new file mode 100644
index 0000000000..65c323970c
Binary files /dev/null and b/ui/pages/__screenshots__/NameDomain.pw.tsx_default_details-tab-1.png differ
diff --git a/ui/pages/__screenshots__/NameDomain.pw.tsx_default_history-tab-mobile-1.png b/ui/pages/__screenshots__/NameDomain.pw.tsx_default_history-tab-mobile-1.png
new file mode 100644
index 0000000000..216d8daf6b
Binary files /dev/null and b/ui/pages/__screenshots__/NameDomain.pw.tsx_default_history-tab-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/NameDomain.pw.tsx_mobile_history-tab-mobile-1.png b/ui/pages/__screenshots__/NameDomain.pw.tsx_mobile_history-tab-mobile-1.png
new file mode 100644
index 0000000000..bfeb78ed07
Binary files /dev/null and b/ui/pages/__screenshots__/NameDomain.pw.tsx_mobile_history-tab-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/NameDomains.pw.tsx_default_default-view-mobile-1.png b/ui/pages/__screenshots__/NameDomains.pw.tsx_default_default-view-mobile-1.png
new file mode 100644
index 0000000000..81f0f7915c
Binary files /dev/null and b/ui/pages/__screenshots__/NameDomains.pw.tsx_default_default-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/NameDomains.pw.tsx_mobile_default-view-mobile-1.png b/ui/pages/__screenshots__/NameDomains.pw.tsx_mobile_default-view-mobile-1.png
new file mode 100644
index 0000000000..f3520334cc
Binary files /dev/null and b/ui/pages/__screenshots__/NameDomains.pw.tsx_mobile_default-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/OptimisticL2Deposits.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/OptimisticL2Deposits.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..cc84b3b632
Binary files /dev/null and b/ui/pages/__screenshots__/OptimisticL2Deposits.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/OptimisticL2Deposits.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/OptimisticL2Deposits.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..14787cec19
Binary files /dev/null and b/ui/pages/__screenshots__/OptimisticL2Deposits.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/OptimisticL2OutputRoots.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/OptimisticL2OutputRoots.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..3c0ddb505c
Binary files /dev/null and b/ui/pages/__screenshots__/OptimisticL2OutputRoots.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/OptimisticL2OutputRoots.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/OptimisticL2OutputRoots.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..8724dfff72
Binary files /dev/null and b/ui/pages/__screenshots__/OptimisticL2OutputRoots.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/OptimisticL2TxnBatches.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/OptimisticL2TxnBatches.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..10bed40ba0
Binary files /dev/null and b/ui/pages/__screenshots__/OptimisticL2TxnBatches.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/OptimisticL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/OptimisticL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..9175326615
Binary files /dev/null and b/ui/pages/__screenshots__/OptimisticL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/OptimisticL2Withdrawals.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/OptimisticL2Withdrawals.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..a9b858056c
Binary files /dev/null and b/ui/pages/__screenshots__/OptimisticL2Withdrawals.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/OptimisticL2Withdrawals.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/OptimisticL2Withdrawals.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..f29201642a
Binary files /dev/null and b/ui/pages/__screenshots__/OptimisticL2Withdrawals.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_dark-color-mode_search-by-name-mobile-dark-mode-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_dark-color-mode_search-by-name-mobile-dark-mode-1.png
index f218590790..febacb309f 100644
Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_dark-color-mode_search-by-name-mobile-dark-mode-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_dark-color-mode_search-by-name-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-blob-hash-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-blob-hash-mobile-1.png
new file mode 100644
index 0000000000..1237338964
Binary files /dev/null and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-blob-hash-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-number-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-number-mobile-1.png
index 5b1c2cc61b..aa030d6a62 100644
Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-number-mobile-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-number-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-name-mobile-dark-mode-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-name-mobile-dark-mode-1.png
index 0f70ac15c8..22a47915c5 100644
Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-name-mobile-dark-mode-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-name-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-user-op-hash-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-user-op-hash-mobile-1.png
new file mode 100644
index 0000000000..a23bc41866
Binary files /dev/null and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-user-op-hash-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_with-apps-default-view-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_with-apps-default-view-mobile-1.png
index 70e925a163..f6f6b4c8b3 100644
Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_with-apps-default-view-mobile-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_with-apps-default-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-blob-hash-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-blob-hash-mobile-1.png
new file mode 100644
index 0000000000..f9b181af04
Binary files /dev/null and b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-blob-hash-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-block-number-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-block-number-mobile-1.png
index 61706c1465..95c8ef3f0a 100644
Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-block-number-mobile-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-block-number-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-name-mobile-dark-mode-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-name-mobile-dark-mode-1.png
index 4a67cc56a9..d995bb1565 100644
Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-name-mobile-dark-mode-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-name-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-user-op-hash-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-user-op-hash-mobile-1.png
new file mode 100644
index 0000000000..bb081b0e6c
Binary files /dev/null and b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_search-by-user-op-hash-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_with-apps-default-view-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_with-apps-default-view-mobile-1.png
index eb326db091..67759dea9e 100644
Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_with-apps-default-view-mobile-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_mobile_with-apps-default-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/ShibariumDeposits.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/ShibariumDeposits.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..7cab3d682e
Binary files /dev/null and b/ui/pages/__screenshots__/ShibariumDeposits.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/ShibariumDeposits.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/ShibariumDeposits.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..0335fb3110
Binary files /dev/null and b/ui/pages/__screenshots__/ShibariumDeposits.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/ShibariumWithdrawals.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/ShibariumWithdrawals.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..47e093f593
Binary files /dev/null and b/ui/pages/__screenshots__/ShibariumWithdrawals.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/ShibariumWithdrawals.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/ShibariumWithdrawals.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..9f9063b226
Binary files /dev/null and b/ui/pages/__screenshots__/ShibariumWithdrawals.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/Token.pw.tsx_default_base-view-1.png b/ui/pages/__screenshots__/Token.pw.tsx_default_base-view-1.png
index 9b891a087c..e8e194d881 100644
Binary files a/ui/pages/__screenshots__/Token.pw.tsx_default_base-view-1.png and b/ui/pages/__screenshots__/Token.pw.tsx_default_base-view-1.png differ
diff --git a/ui/pages/__screenshots__/Token.pw.tsx_default_bridged-token-1.png b/ui/pages/__screenshots__/Token.pw.tsx_default_bridged-token-1.png
index 4de5603803..5873ca0484 100644
Binary files a/ui/pages/__screenshots__/Token.pw.tsx_default_bridged-token-1.png and b/ui/pages/__screenshots__/Token.pw.tsx_default_bridged-token-1.png differ
diff --git a/ui/pages/__screenshots__/Token.pw.tsx_default_mobile-base-view-1.png b/ui/pages/__screenshots__/Token.pw.tsx_default_mobile-base-view-1.png
index 7df7185254..bf6ba7e403 100644
Binary files a/ui/pages/__screenshots__/Token.pw.tsx_default_mobile-base-view-1.png and b/ui/pages/__screenshots__/Token.pw.tsx_default_mobile-base-view-1.png differ
diff --git a/ui/pages/__screenshots__/Token.pw.tsx_default_mobile-with-verified-info-1.png b/ui/pages/__screenshots__/Token.pw.tsx_default_mobile-with-verified-info-1.png
index 04c40fa49b..d27cd36fc0 100644
Binary files a/ui/pages/__screenshots__/Token.pw.tsx_default_mobile-with-verified-info-1.png and b/ui/pages/__screenshots__/Token.pw.tsx_default_mobile-with-verified-info-1.png differ
diff --git a/ui/pages/__screenshots__/Token.pw.tsx_default_with-verified-info-1.png b/ui/pages/__screenshots__/Token.pw.tsx_default_with-verified-info-1.png
index 918eb61308..ae0bda6c2a 100644
Binary files a/ui/pages/__screenshots__/Token.pw.tsx_default_with-verified-info-1.png and b/ui/pages/__screenshots__/Token.pw.tsx_default_with-verified-info-1.png differ
diff --git a/ui/pages/__screenshots__/Tokens.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Tokens.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png
index 285d04eb9d..9ca4d23064 100644
Binary files a/ui/pages/__screenshots__/Tokens.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png and b/ui/pages/__screenshots__/Tokens.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Tokens.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-2.png b/ui/pages/__screenshots__/Tokens.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-2.png
index 68fc0464e7..06a1553f0d 100644
Binary files a/ui/pages/__screenshots__/Tokens.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-2.png and b/ui/pages/__screenshots__/Tokens.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-2.png differ
diff --git a/ui/pages/__screenshots__/Tokens.pw.tsx_default_base-view-mobile-dark-mode-1.png b/ui/pages/__screenshots__/Tokens.pw.tsx_default_base-view-mobile-dark-mode-1.png
index b4594c098b..c7e5cb7e25 100644
Binary files a/ui/pages/__screenshots__/Tokens.pw.tsx_default_base-view-mobile-dark-mode-1.png and b/ui/pages/__screenshots__/Tokens.pw.tsx_default_base-view-mobile-dark-mode-1.png differ
diff --git a/ui/pages/__screenshots__/Tokens.pw.tsx_default_base-view-mobile-dark-mode-2.png b/ui/pages/__screenshots__/Tokens.pw.tsx_default_base-view-mobile-dark-mode-2.png
index db9057c17a..2624b74d24 100644
Binary files a/ui/pages/__screenshots__/Tokens.pw.tsx_default_base-view-mobile-dark-mode-2.png and b/ui/pages/__screenshots__/Tokens.pw.tsx_default_base-view-mobile-dark-mode-2.png differ
diff --git a/ui/pages/__screenshots__/Tokens.pw.tsx_default_bridged-tokens-base-view-1.png b/ui/pages/__screenshots__/Tokens.pw.tsx_default_bridged-tokens-base-view-1.png
index edf354b688..7f6f5f467c 100644
Binary files a/ui/pages/__screenshots__/Tokens.pw.tsx_default_bridged-tokens-base-view-1.png and b/ui/pages/__screenshots__/Tokens.pw.tsx_default_bridged-tokens-base-view-1.png differ
diff --git a/ui/pages/__screenshots__/Tokens.pw.tsx_default_bridged-tokens-base-view-2.png b/ui/pages/__screenshots__/Tokens.pw.tsx_default_bridged-tokens-base-view-2.png
index 630e5f8737..f2f79d6bcb 100644
Binary files a/ui/pages/__screenshots__/Tokens.pw.tsx_default_bridged-tokens-base-view-2.png and b/ui/pages/__screenshots__/Tokens.pw.tsx_default_bridged-tokens-base-view-2.png differ
diff --git a/ui/pages/__screenshots__/UserOp.pw.tsx_default_base-view-1.png b/ui/pages/__screenshots__/UserOp.pw.tsx_default_base-view-1.png
new file mode 100644
index 0000000000..eb4f533595
Binary files /dev/null and b/ui/pages/__screenshots__/UserOp.pw.tsx_default_base-view-1.png differ
diff --git a/ui/pages/__screenshots__/UserOp.pw.tsx_default_mobile-base-view-1.png b/ui/pages/__screenshots__/UserOp.pw.tsx_default_mobile-base-view-1.png
new file mode 100644
index 0000000000..fbe5973dc2
Binary files /dev/null and b/ui/pages/__screenshots__/UserOp.pw.tsx_default_mobile-base-view-1.png differ
diff --git a/ui/pages/__screenshots__/UserOps.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/UserOps.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..b17c113b1b
Binary files /dev/null and b/ui/pages/__screenshots__/UserOps.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/UserOps.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/UserOps.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..3f7ecc7900
Binary files /dev/null and b/ui/pages/__screenshots__/UserOps.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/Validators.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/Validators.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..23bfad3f62
Binary files /dev/null and b/ui/pages/__screenshots__/Validators.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/Validators.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/Validators.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..7b0bf0c8b9
Binary files /dev/null and b/ui/pages/__screenshots__/Validators.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/VerifiedAddresses.pw.tsx_default_user-without-email-1.png b/ui/pages/__screenshots__/VerifiedAddresses.pw.tsx_default_user-without-email-1.png
new file mode 100644
index 0000000000..216748289b
Binary files /dev/null and b/ui/pages/__screenshots__/VerifiedAddresses.pw.tsx_default_user-without-email-1.png differ
diff --git a/ui/pages/__screenshots__/VerifiedContracts.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/VerifiedContracts.pw.tsx_default_base-view-mobile-1.png
index b263c05a63..3a5eb8c821 100644
Binary files a/ui/pages/__screenshots__/VerifiedContracts.pw.tsx_default_base-view-mobile-1.png and b/ui/pages/__screenshots__/VerifiedContracts.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/VerifiedContracts.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/VerifiedContracts.pw.tsx_mobile_base-view-mobile-1.png
index cc307a2cae..1d34aeadae 100644
Binary files a/ui/pages/__screenshots__/VerifiedContracts.pw.tsx_mobile_base-view-mobile-1.png and b/ui/pages/__screenshots__/VerifiedContracts.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/Withdrawals.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/Withdrawals.pw.tsx_default_base-view-mobile-1.png
deleted file mode 100644
index 6d40ccf1aa..0000000000
Binary files a/ui/pages/__screenshots__/Withdrawals.pw.tsx_default_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/Withdrawals.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/Withdrawals.pw.tsx_mobile_base-view-mobile-1.png
deleted file mode 100644
index a74f498008..0000000000
Binary files a/ui/pages/__screenshots__/Withdrawals.pw.tsx_mobile_base-view-mobile-1.png and /dev/null differ
diff --git a/ui/pages/__screenshots__/ZkEvmL2TxnBatch.pw.tsx_default_base-view-1.png b/ui/pages/__screenshots__/ZkEvmL2TxnBatch.pw.tsx_default_base-view-1.png
index c59f29f714..342942ece0 100644
Binary files a/ui/pages/__screenshots__/ZkEvmL2TxnBatch.pw.tsx_default_base-view-1.png and b/ui/pages/__screenshots__/ZkEvmL2TxnBatch.pw.tsx_default_base-view-1.png differ
diff --git a/ui/pages/__screenshots__/ZkEvmL2TxnBatch.pw.tsx_default_mobile-base-view-1.png b/ui/pages/__screenshots__/ZkEvmL2TxnBatch.pw.tsx_default_mobile-base-view-1.png
index b0fd12db39..d978d60f7a 100644
Binary files a/ui/pages/__screenshots__/ZkEvmL2TxnBatch.pw.tsx_default_mobile-base-view-1.png and b/ui/pages/__screenshots__/ZkEvmL2TxnBatch.pw.tsx_default_mobile-base-view-1.png differ
diff --git a/ui/pages/__screenshots__/ZkEvmL2TxnBatches.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/ZkEvmL2TxnBatches.pw.tsx_default_base-view-mobile-1.png
index 99c8067c46..6d51e2adf0 100644
Binary files a/ui/pages/__screenshots__/ZkEvmL2TxnBatches.pw.tsx_default_base-view-mobile-1.png and b/ui/pages/__screenshots__/ZkEvmL2TxnBatches.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/ZkEvmL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/ZkEvmL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png
index 8052eb9ef9..1d1ba2a370 100644
Binary files a/ui/pages/__screenshots__/ZkEvmL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png and b/ui/pages/__screenshots__/ZkEvmL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/ZkSyncL2TxnBatch.pw.tsx_default_base-view-1.png b/ui/pages/__screenshots__/ZkSyncL2TxnBatch.pw.tsx_default_base-view-1.png
new file mode 100644
index 0000000000..48f02b27d4
Binary files /dev/null and b/ui/pages/__screenshots__/ZkSyncL2TxnBatch.pw.tsx_default_base-view-1.png differ
diff --git a/ui/pages/__screenshots__/ZkSyncL2TxnBatch.pw.tsx_default_mobile-base-view-1.png b/ui/pages/__screenshots__/ZkSyncL2TxnBatch.pw.tsx_default_mobile-base-view-1.png
new file mode 100644
index 0000000000..6bd9369d23
Binary files /dev/null and b/ui/pages/__screenshots__/ZkSyncL2TxnBatch.pw.tsx_default_mobile-base-view-1.png differ
diff --git a/ui/pages/__screenshots__/ZkSyncL2TxnBatches.pw.tsx_default_base-view-mobile-1.png b/ui/pages/__screenshots__/ZkSyncL2TxnBatches.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..c61872abb9
Binary files /dev/null and b/ui/pages/__screenshots__/ZkSyncL2TxnBatches.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/pages/__screenshots__/ZkSyncL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png b/ui/pages/__screenshots__/ZkSyncL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..a43ee77aaf
Binary files /dev/null and b/ui/pages/__screenshots__/ZkSyncL2TxnBatches.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/searchResults/SearchResultListItem.tsx b/ui/searchResults/SearchResultListItem.tsx
index b6d14f0a85..28b1dc0eac 100644
--- a/ui/searchResults/SearchResultListItem.tsx
+++ b/ui/searchResults/SearchResultListItem.tsx
@@ -1,4 +1,4 @@
-import { Flex, Grid, Image, Box, Text, Skeleton, useColorMode, Tag } from '@chakra-ui/react';
+import { chakra, Flex, Grid, Image, Box, Text, Skeleton, useColorMode, Tag } from '@chakra-ui/react';
 import React from 'react';
 import xss from 'xss';
 
@@ -10,10 +10,13 @@ import dayjs from 'lib/date/dayjs';
 import highlightText from 'lib/highlightText';
 import * as mixpanel from 'lib/mixpanel/index';
 import { saveToRecentKeywords } from 'lib/recentSearchKeywords';
+import { ADDRESS_REGEXP } from 'lib/validations/address';
 import * as AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import * as BlobEntity from 'ui/shared/entities/blob/BlobEntity';
 import * as BlockEntity from 'ui/shared/entities/block/BlockEntity';
 import * as TokenEntity from 'ui/shared/entities/token/TokenEntity';
 import * as TxEntity from 'ui/shared/entities/tx/TxEntity';
+import * as UserOpEntity from 'ui/shared/entities/userOp/UserOpEntity';
 import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
 import IconSvg from 'ui/shared/IconSvg';
 import LinkExternal from 'ui/shared/LinkExternal';
@@ -55,7 +58,6 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
               wordBreak="break-all"
               isLoading={ isLoading }
               onClick={ handleLinkClick }
-              flexGrow={ 1 }
               overflow="hidden"
             >
               <Skeleton
@@ -73,13 +75,14 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
 
       case 'contract':
       case 'address': {
-        const shouldHighlightHash = data.address.toLowerCase() === searchTerm.toLowerCase();
+        const shouldHighlightHash = ADDRESS_REGEXP.test(searchTerm);
         const address = {
           hash: data.address,
           is_contract: data.type === 'contract',
           is_verified: data.is_smart_contract_verified,
           name: null,
           implementation_name: null,
+          ens_domain_name: null,
         };
 
         return (
@@ -173,6 +176,7 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
               />
             </BlockEntity.Link>
             { data.block_type === 'reorg' && <Tag ml={ 2 }>Reorg</Tag> }
+            { data.block_type === 'uncle' && <Tag ml={ 2 }>Uncle</Tag> }
           </BlockEntity.Container>
         );
       }
@@ -197,6 +201,48 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
           </TxEntity.Container>
         );
       }
+
+      case 'blob': {
+        return (
+          <BlobEntity.Container>
+            <BlobEntity.Icon/>
+            <BlobEntity.Link
+              isLoading={ isLoading }
+              hash={ data.blob_hash }
+              onClick={ handleLinkClick }
+            >
+              <BlobEntity.Content
+                asProp="mark"
+                hash={ data.blob_hash }
+                fontSize="sm"
+                lineHeight={ 5 }
+                fontWeight={ 700 }
+              />
+            </BlobEntity.Link>
+          </BlobEntity.Container>
+        );
+      }
+
+      case 'user_operation': {
+        return (
+          <UserOpEntity.Container>
+            <UserOpEntity.Icon/>
+            <UserOpEntity.Link
+              isLoading={ isLoading }
+              hash={ data.user_operation_hash }
+              onClick={ handleLinkClick }
+            >
+              <UserOpEntity.Content
+                asProp="mark"
+                hash={ data.user_operation_hash }
+                fontSize="sm"
+                lineHeight={ 5 }
+                fontWeight={ 700 }
+              />
+            </UserOpEntity.Link>
+          </UserOpEntity.Container>
+        );
+      }
     }
   })();
 
@@ -237,6 +283,12 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
           <Text variant="secondary">{ dayjs(data.timestamp).format('llll') }</Text>
         );
       }
+      case 'user_operation': {
+
+        return (
+          <Text variant="secondary">{ dayjs(data.timestamp).format('llll') }</Text>
+        );
+      }
       case 'label': {
         return (
           <Flex alignItems="center">
@@ -264,8 +316,23 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
       }
       case 'contract':
       case 'address': {
-        const shouldHighlightHash = data.address.toLowerCase() === searchTerm.toLowerCase();
-        return data.name ? <span dangerouslySetInnerHTML={{ __html: shouldHighlightHash ? xss(data.name) : highlightText(data.name, searchTerm) }}/> : null;
+        const shouldHighlightHash = ADDRESS_REGEXP.test(searchTerm);
+        const addressName = data.name || data.ens_info?.name;
+        const expiresText = data.ens_info?.expiry_date ? ` (expires ${ dayjs(data.ens_info.expiry_date).fromNow() })` : '';
+
+        return addressName ? (
+          <>
+            <span dangerouslySetInnerHTML={{ __html: shouldHighlightHash ? xss(addressName) : highlightText(addressName, searchTerm) }}/>
+            { data.ens_info &&
+              (
+                data.ens_info.names_count > 1 ?
+                  <chakra.span color="text_secondary"> ({ data.ens_info.names_count > 39 ? '40+' : `+${ data.ens_info.names_count - 1 }` })</chakra.span> :
+                  <chakra.span color="text_secondary">{ expiresText }</chakra.span>
+              )
+            }
+          </>
+        ) :
+          null;
       }
 
       default:
@@ -277,12 +344,12 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
 
   return (
     <ListItemMobile py={ 3 } fontSize="sm" rowGap={ 2 }>
-      <Flex justifyContent="space-between" w="100%" overflow="hidden" lineHeight={ 6 }>
+      <Grid templateColumns="1fr auto" w="100%" overflow="hidden" lineHeight={ 6 }>
         { firstRow }
         <Skeleton isLoaded={ !isLoading } color="text_secondary" ml={ 8 } textTransform="capitalize">
           <span>{ category ? searchItemTitles[category].itemTitleShort : '' }</span>
         </Skeleton>
-      </Flex>
+      </Grid>
       { Boolean(secondRow) && (
         <Box w="100%" overflow="hidden" whiteSpace={ data.type !== 'app' ? 'nowrap' : undefined }>
           { secondRow }
diff --git a/ui/searchResults/SearchResultTableItem.tsx b/ui/searchResults/SearchResultTableItem.tsx
index b91e337df8..fde08af038 100644
--- a/ui/searchResults/SearchResultTableItem.tsx
+++ b/ui/searchResults/SearchResultTableItem.tsx
@@ -1,4 +1,4 @@
-import { Tr, Td, Text, Flex, Image, Box, Skeleton, useColorMode, Tag } from '@chakra-ui/react';
+import { chakra, Tr, Td, Text, Flex, Image, Box, Skeleton, useColorMode, Tag } from '@chakra-ui/react';
 import React from 'react';
 import xss from 'xss';
 
@@ -10,17 +10,19 @@ import dayjs from 'lib/date/dayjs';
 import highlightText from 'lib/highlightText';
 import * as mixpanel from 'lib/mixpanel/index';
 import { saveToRecentKeywords } from 'lib/recentSearchKeywords';
+import { ADDRESS_REGEXP } from 'lib/validations/address';
 import * as AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import * as BlobEntity from 'ui/shared/entities/blob/BlobEntity';
 import * as BlockEntity from 'ui/shared/entities/block/BlockEntity';
 import * as TokenEntity from 'ui/shared/entities/token/TokenEntity';
 import * as TxEntity from 'ui/shared/entities/tx/TxEntity';
+import * as UserOpEntity from 'ui/shared/entities/userOp/UserOpEntity';
 import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
 import IconSvg from 'ui/shared/IconSvg';
 import LinkExternal from 'ui/shared/LinkExternal';
 import LinkInternal from 'ui/shared/LinkInternal';
 import type { SearchResultAppItem } from 'ui/shared/search/utils';
 import { getItemCategory, searchItemTitles } from 'ui/shared/search/utils';
-
 interface Props {
   data: SearchResultItem | SearchResultAppItem;
   searchTerm: string;
@@ -91,70 +93,51 @@ const SearchResultTableItem = ({ data, searchTerm, isLoading }: Props) => {
 
       case 'contract':
       case 'address': {
-        if (data.name) {
-          const shouldHighlightHash = data.address.toLowerCase() === searchTerm.toLowerCase();
-          const address = {
-            hash: data.address,
-            is_contract: data.type === 'contract',
-            is_verified: data.is_smart_contract_verified,
-            name: null,
-            implementation_name: null,
-          };
-
-          return (
-            <>
-              <Td fontSize="sm">
-                <AddressEntity.Container>
-                  <AddressEntity.Icon address={ address }/>
-                  <AddressEntity.Link
-                    address={ address }
-                    onClick={ handleLinkClick }
-                  >
-                    <AddressEntity.Content
-                      asProp={ shouldHighlightHash ? 'mark' : 'span' }
-                      address={ address }
-                      fontSize="sm"
-                      lineHeight={ 5 }
-                      fontWeight={ 700 }
-                    />
-                  </AddressEntity.Link>
-                  <AddressEntity.Copy address={ address }/>
-                </AddressEntity.Container>
-              </Td>
-              <Td colSpan={ 2 } fontSize="sm" verticalAlign="middle">
-                <span dangerouslySetInnerHTML={{ __html: shouldHighlightHash ? xss(data.name) : highlightText(data.name, searchTerm) }}/>
-              </Td>
-            </>
-          );
-        }
-
+        const shouldHighlightHash = ADDRESS_REGEXP.test(searchTerm);
+        const addressName = data.name || data.ens_info?.name;
         const address = {
           hash: data.address,
           is_contract: data.type === 'contract',
           is_verified: data.is_smart_contract_verified,
           name: null,
           implementation_name: null,
+          ens_domain_name: null,
         };
+        const expiresText = data.ens_info?.expiry_date ? ` (expires ${ dayjs(data.ens_info.expiry_date).fromNow() })` : '';
 
         return (
-          <Td colSpan={ 3 } fontSize="sm">
-            <AddressEntity.Container>
-              <AddressEntity.Icon address={ address }/>
-              <AddressEntity.Link
-                address={ address }
-                onClick={ handleLinkClick }
-              >
-                <AddressEntity.Content
-                  asProp="mark"
+          <>
+            <Td fontSize="sm" colSpan={ addressName ? 1 : 3 }>
+              <AddressEntity.Container>
+                <AddressEntity.Icon address={ address }/>
+                <AddressEntity.Link
                   address={ address }
-                  fontSize="sm"
-                  lineHeight={ 5 }
-                  fontWeight={ 700 }
-                />
-              </AddressEntity.Link>
-              <AddressEntity.Copy address={ address }/>
-            </AddressEntity.Container>
-          </Td>
+                  onClick={ handleLinkClick }
+                >
+                  <AddressEntity.Content
+                    asProp={ shouldHighlightHash ? 'mark' : 'span' }
+                    address={ address }
+                    fontSize="sm"
+                    lineHeight={ 5 }
+                    fontWeight={ 700 }
+                  />
+                </AddressEntity.Link>
+                <AddressEntity.Copy address={ address }/>
+              </AddressEntity.Container>
+            </Td>
+            { addressName && (
+              <Td colSpan={ 2 } fontSize="sm" verticalAlign="middle">
+                <span dangerouslySetInnerHTML={{ __html: shouldHighlightHash ? xss(addressName) : highlightText(addressName, searchTerm) }}/>
+                { data.ens_info &&
+                  (
+                    data.ens_info.names_count > 1 ?
+                      <chakra.span color="text_secondary"> ({ data.ens_info.names_count > 39 ? '40+' : `+${ data.ens_info.names_count - 1 }` })</chakra.span> :
+                      <chakra.span color="text_secondary">{ expiresText }</chakra.span>
+                  )
+                }
+              </Td>
+            ) }
+          </>
         );
       }
 
@@ -263,6 +246,7 @@ const SearchResultTableItem = ({ data, searchTerm, isLoading }: Props) => {
             <Td fontSize="sm" verticalAlign="middle">
               <Flex columnGap={ 2 } alignItems="center">
                 { data.block_type === 'reorg' && <Tag flexShrink={ 0 }>Reorg</Tag> }
+                { data.block_type === 'uncle' && <Tag flexShrink={ 0 }>Uncle</Tag> }
                 <Box overflow="hidden" whiteSpace="nowrap" as={ shouldHighlightHash ? 'mark' : 'span' } display="block">
                   <HashStringShortenDynamic hash={ data.block_hash }/>
                 </Box>
@@ -302,6 +286,57 @@ const SearchResultTableItem = ({ data, searchTerm, isLoading }: Props) => {
           </>
         );
       }
+
+      case 'blob': {
+        return (
+          <Td colSpan={ 3 } fontSize="sm">
+            <BlobEntity.Container>
+              <BlobEntity.Icon/>
+              <BlobEntity.Link
+                isLoading={ isLoading }
+                hash={ data.blob_hash }
+                onClick={ handleLinkClick }
+              >
+                <BlobEntity.Content
+                  asProp="mark"
+                  hash={ data.blob_hash }
+                  fontSize="sm"
+                  lineHeight={ 5 }
+                  fontWeight={ 700 }
+                />
+              </BlobEntity.Link>
+            </BlobEntity.Container>
+          </Td>
+        );
+      }
+
+      case 'user_operation': {
+        return (
+          <>
+            <Td colSpan={ 2 } fontSize="sm">
+              <UserOpEntity.Container>
+                <UserOpEntity.Icon/>
+                <UserOpEntity.Link
+                  isLoading={ isLoading }
+                  hash={ data.user_operation_hash }
+                  onClick={ handleLinkClick }
+                >
+                  <UserOpEntity.Content
+                    asProp="mark"
+                    hash={ data.user_operation_hash }
+                    fontSize="sm"
+                    lineHeight={ 5 }
+                    fontWeight={ 700 }
+                  />
+                </UserOpEntity.Link>
+              </UserOpEntity.Container>
+            </Td>
+            <Td fontSize="sm" verticalAlign="middle" isNumeric>
+              <Text variant="secondary">{ dayjs(data.timestamp).format('llll') }</Text>
+            </Td>
+          </>
+        );
+      }
     }
   })();
 
diff --git a/ui/searchResults/SearchResultsInput.tsx b/ui/searchResults/SearchResultsInput.tsx
index a50b82b4e4..3559b1978d 100644
--- a/ui/searchResults/SearchResultsInput.tsx
+++ b/ui/searchResults/SearchResultsInput.tsx
@@ -5,6 +5,7 @@ import React from 'react';
 
 import useIsMobile from 'lib/hooks/useIsMobile';
 import { getRecentSearchKeywords } from 'lib/recentSearchKeywords';
+import SearchBarBackdrop from 'ui/snippets/searchBar/SearchBarBackdrop';
 import SearchBarInput from 'ui/snippets/searchBar/SearchBarInput';
 import SearchBarRecentKeywords from 'ui/snippets/searchBar/SearchBarRecentKeywords';
 
@@ -66,33 +67,39 @@ const SearchResultsInput = ({ searchTerm, handleSubmit, handleSearchTermChange }
     };
   }, [ calculateMenuWidth ]);
 
+  const isSuggestOpen = isOpen && recentSearchKeywords.length > 0 && searchTerm.trim().length === 0;
+
   return (
-    <Popover
-      isOpen={ isOpen && recentSearchKeywords.length > 0 && searchTerm.trim().length === 0 }
-      autoFocus={ false }
-      onClose={ onClose }
-      placement="bottom-start"
-      offset={ isMobile ? [ 16, -12 ] : undefined }
-      isLazy
-    >
-      <PopoverTrigger>
-        <SearchBarInput
-          ref={ inputRef }
-          onChange={ handleSearchTermChange }
-          onSubmit={ handleSubmit }
-          onFocus={ handleFocus }
-          onBlur={ handleBlur }
-          onHide={ handelHide }
-          onClear={ handleClear }
-          value={ searchTerm }
-        />
-      </PopoverTrigger>
-      <PopoverContent w={ `${ menuWidth.current }px` } maxH={{ base: '300px', lg: '500px' }} overflowY="scroll" ref={ menuRef }>
-        <PopoverBody py={ 6 }>
-          <SearchBarRecentKeywords onClick={ handleSearchTermChange } onClear={ onClose }/>
-        </PopoverBody>
-      </PopoverContent>
-    </Popover>
+    <>
+      <Popover
+        isOpen={ isSuggestOpen }
+        autoFocus={ false }
+        onClose={ onClose }
+        placement="bottom-start"
+        offset={ isMobile ? [ 16, -12 ] : undefined }
+        isLazy
+      >
+        <PopoverTrigger>
+          <SearchBarInput
+            ref={ inputRef }
+            onChange={ handleSearchTermChange }
+            onSubmit={ handleSubmit }
+            onFocus={ handleFocus }
+            onBlur={ handleBlur }
+            onHide={ handelHide }
+            onClear={ handleClear }
+            value={ searchTerm }
+            isSuggestOpen={ isSuggestOpen }
+          />
+        </PopoverTrigger>
+        <PopoverContent w={ `${ menuWidth.current }px` } maxH={{ base: '300px', lg: '500px' }} overflowY="scroll" ref={ menuRef }>
+          <PopoverBody py={ 6 }>
+            <SearchBarRecentKeywords onClick={ handleSearchTermChange } onClear={ onClose }/>
+          </PopoverBody>
+        </PopoverContent>
+      </Popover>
+      <SearchBarBackdrop isOpen={ isSuggestOpen }/>
+    </>
   );
 };
 
diff --git a/ui/shared/AccountActionsMenu/AccountActionsMenu.pw.tsx b/ui/shared/AccountActionsMenu/AccountActionsMenu.pw.tsx
new file mode 100644
index 0000000000..614764950c
--- /dev/null
+++ b/ui/shared/AccountActionsMenu/AccountActionsMenu.pw.tsx
@@ -0,0 +1,131 @@
+import { test as base, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import * as profileMock from 'mocks/user/profile';
+import authFixture from 'playwright/fixtures/auth';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+
+import AccountActionsMenu from './AccountActionsMenu';
+
+const USER_INFO_URL = buildApiUrl('user_info');
+
+const test = base.extend({
+  context: ({ context }, use) => {
+    authFixture(context);
+    use(context);
+  },
+});
+
+test.use({ viewport: { width: 200, height: 200 } });
+
+test.describe('with multiple items', async() => {
+  const hooksConfig = {
+    router: {
+      query: { hash: '<hash>' },
+      pathname: '/token/[hash]',
+      isReady: true,
+    },
+  };
+
+  test.beforeEach(async({ page }) => {
+    await page.route(USER_INFO_URL, (route) => route.fulfill({
+      body: JSON.stringify(profileMock.base),
+    }));
+  });
+
+  test('base view', async({ mount, page }) => {
+    const component = await mount(
+      <TestApp>
+        <AccountActionsMenu/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await component.getByRole('button').click();
+
+    await expect(page).toHaveScreenshot();
+  });
+
+  test('base view with styles', async({ mount, page }) => {
+    const component = await mount(
+      <TestApp>
+        <AccountActionsMenu m={ 2 } outline="1px solid lightpink"/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await component.getByRole('button').click();
+
+    await expect(page).toHaveScreenshot();
+  });
+
+  test('loading', async({ mount }) => {
+    const component = await mount(
+      <TestApp>
+        <AccountActionsMenu isLoading/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+
+  test('loading with styles', async({ mount }) => {
+    const component = await mount(
+      <TestApp>
+        <AccountActionsMenu isLoading m={ 2 } outline="1px solid lightpink"/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+});
+
+test.describe('with one item', async() => {
+  const hooksConfig = {
+    router: {
+      query: { hash: '<hash>' },
+      pathname: '/tx/[hash]',
+      isReady: true,
+    },
+  };
+
+  test('base view', async({ mount, page }) => {
+    const component = await mount(
+      <TestApp>
+        <AccountActionsMenu/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await component.getByRole('button').hover();
+
+    await expect(page).toHaveScreenshot();
+  });
+
+  test('base view with styles', async({ mount, page }) => {
+    const component = await mount(
+      <TestApp>
+        <AccountActionsMenu m={ 2 } outline="1px solid lightpink"/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await component.getByRole('button').hover();
+
+    await expect(page).toHaveScreenshot();
+  });
+
+  test('loading', async({ mount }) => {
+    const component = await mount(
+      <TestApp>
+        <AccountActionsMenu isLoading/>
+      </TestApp>,
+      { hooksConfig },
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+});
diff --git a/ui/shared/AccountActionsMenu/AccountActionsMenu.tsx b/ui/shared/AccountActionsMenu/AccountActionsMenu.tsx
index a74da37045..d443dc2691 100644
--- a/ui/shared/AccountActionsMenu/AccountActionsMenu.tsx
+++ b/ui/shared/AccountActionsMenu/AccountActionsMenu.tsx
@@ -1,8 +1,11 @@
-import { Button, Menu, MenuButton, MenuList, Flex, Skeleton, chakra } from '@chakra-ui/react';
+import { Box, IconButton, Menu, MenuButton, MenuList, Skeleton, chakra } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
+import type { ItemProps } from './types';
+
 import config from 'configs/app';
+import useFetchProfileInfo from 'lib/hooks/useFetchProfileInfo';
 import useIsAccountActionAllowed from 'lib/hooks/useIsAccountActionAllowed';
 import * as mixpanel from 'lib/mixpanel/index';
 import getQueryParamString from 'lib/router/getQueryParamString';
@@ -25,6 +28,8 @@ const AccountActionsMenu = ({ isLoading, className }: Props) => {
   const isTxPage = router.pathname === '/tx/[hash]';
   const isAccountActionAllowed = useIsAccountActionAllowed();
 
+  const userInfoQuery = useFetchProfileInfo();
+
   const handleButtonClick = React.useCallback(() => {
     mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Address actions (more button)' });
   }, []);
@@ -33,32 +38,57 @@ const AccountActionsMenu = ({ isLoading, className }: Props) => {
     return null;
   }
 
+  const userWithoutEmail = userInfoQuery.data && !userInfoQuery.data.email;
+
+  const items = [
+    {
+      render: (props: ItemProps) => <TokenInfoMenuItem { ...props }/>,
+      enabled: isTokenPage && config.features.addressVerification.isEnabled && !userWithoutEmail,
+    },
+    {
+      render: (props: ItemProps) => <PrivateTagMenuItem { ...props } entityType={ isTxPage ? 'tx' : 'address' }/>,
+      enabled: true,
+    },
+    {
+      render: (props: ItemProps) => <PublicTagMenuItem { ...props }/>,
+      enabled: !isTxPage,
+    },
+  ].filter(({ enabled }) => enabled);
+
+  if (items.length === 0) {
+    return null;
+  }
+
+  if (isLoading) {
+    return <Skeleton w="36px" h="32px" borderRadius="base" className={ className }/>;
+  }
+
+  if (items.length === 1) {
+    return (
+      <Box className={ className }>
+        { items[0].render({ type: 'button', hash, onBeforeClick: isAccountActionAllowed }) }
+      </Box>
+    );
+  }
+
   return (
     <Menu>
-      <Skeleton isLoaded={ !isLoading } borderRadius="base" className={ className }>
-        <MenuButton
-          as={ Button }
-          size="sm"
-          variant="outline"
-          onClick={ handleButtonClick }
-        >
-          <Flex alignItems="center">
-            <span>More</span>
-            <IconSvg name="arrows/east-mini" transform="rotate(-90deg)" boxSize={ 5 } ml={ 1 }/>
-          </Flex>
-        </MenuButton>
-      </Skeleton>
+      <MenuButton
+        as={ IconButton }
+        className={ className }
+        size="sm"
+        variant="outline"
+        colorScheme="gray"
+        px="7px"
+        onClick={ handleButtonClick }
+        icon={ <IconSvg name="dots" boxSize="18px"/> }
+      />
       <MenuList minWidth="180px" zIndex="popover">
-        { isTokenPage && config.features.addressVerification.isEnabled &&
-          <TokenInfoMenuItem py={ 2 } px={ 4 } hash={ hash } onBeforeClick={ isAccountActionAllowed }/> }
-        <PrivateTagMenuItem
-          py={ 2 }
-          px={ 4 }
-          hash={ hash }
-          onBeforeClick={ isAccountActionAllowed }
-          type={ isTxPage ? 'tx' : 'address' }
-        />
-        { !isTxPage && <PublicTagMenuItem py={ 2 } px={ 4 } hash={ hash } onBeforeClick={ isAccountActionAllowed }/> }
+        { items.map(({ render }, index) => (
+          <React.Fragment key={ index }>
+            { render({ type: 'menu_item', hash, onBeforeClick: isAccountActionAllowed }) }
+          </React.Fragment>
+        )) }
       </MenuList>
     </Menu>
   );
diff --git a/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-base-view-1.png b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-base-view-1.png
new file mode 100644
index 0000000000..710b9ed0ce
Binary files /dev/null and b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-base-view-1.png differ
diff --git a/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-base-view-with-styles-1.png b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-base-view-with-styles-1.png
new file mode 100644
index 0000000000..caf9dbf354
Binary files /dev/null and b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-base-view-with-styles-1.png differ
diff --git a/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-loading-1.png b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-loading-1.png
new file mode 100644
index 0000000000..949f51a159
Binary files /dev/null and b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-loading-1.png differ
diff --git a/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-loading-with-styles-1.png b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-loading-with-styles-1.png
new file mode 100644
index 0000000000..71ba1ff684
Binary files /dev/null and b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-multiple-items-loading-with-styles-1.png differ
diff --git a/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-one-item-base-view-1.png b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-one-item-base-view-1.png
new file mode 100644
index 0000000000..1f00ed5cfa
Binary files /dev/null and b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-one-item-base-view-1.png differ
diff --git a/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-one-item-base-view-with-styles-1.png b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-one-item-base-view-with-styles-1.png
new file mode 100644
index 0000000000..607e370492
Binary files /dev/null and b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-one-item-base-view-with-styles-1.png differ
diff --git a/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-one-item-loading-1.png b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-one-item-loading-1.png
new file mode 100644
index 0000000000..949f51a159
Binary files /dev/null and b/ui/shared/AccountActionsMenu/__screenshots__/AccountActionsMenu.pw.tsx_default_with-one-item-loading-1.png differ
diff --git a/ui/shared/AccountActionsMenu/items/PrivateTagMenuItem.tsx b/ui/shared/AccountActionsMenu/items/PrivateTagMenuItem.tsx
index 941434c390..098af5eafd 100644
--- a/ui/shared/AccountActionsMenu/items/PrivateTagMenuItem.tsx
+++ b/ui/shared/AccountActionsMenu/items/PrivateTagMenuItem.tsx
@@ -1,8 +1,9 @@
-import { MenuItem, chakra, useDisclosure } from '@chakra-ui/react';
+import { useDisclosure } from '@chakra-ui/react';
 import { useQueryClient } from '@tanstack/react-query';
 import { useRouter } from 'next/router';
 import React from 'react';
 
+import type { ItemType } from '../types';
 import type { Address } from 'types/api/address';
 import type { Transaction } from 'types/api/transaction';
 
@@ -12,19 +13,23 @@ import AddressModal from 'ui/privateTags/AddressModal/AddressModal';
 import TransactionModal from 'ui/privateTags/TransactionModal/TransactionModal';
 import IconSvg from 'ui/shared/IconSvg';
 
+import ButtonItem from '../parts/ButtonItem';
+import MenuItem from '../parts/MenuItem';
+
 interface Props {
   className?: string;
   hash: string;
   onBeforeClick: () => boolean;
-  type?: 'address' | 'tx';
+  entityType?: 'address' | 'tx';
+  type: ItemType;
 }
 
-const PrivateTagMenuItem = ({ className, hash, onBeforeClick, type = 'address' }: Props) => {
+const PrivateTagMenuItem = ({ className, hash, onBeforeClick, entityType = 'address', type }: Props) => {
   const modal = useDisclosure();
   const queryClient = useQueryClient();
   const router = useRouter();
 
-  const queryKey = getResourceKey(type === 'tx' ? 'tx' : 'address', { pathParams: { hash } });
+  const queryKey = getResourceKey(entityType === 'tx' ? 'tx' : 'address', { pathParams: { hash } });
   const queryData = queryClient.getQueryData<Address | Transaction>(queryKey);
 
   const handleClick = React.useCallback(() => {
@@ -58,13 +63,26 @@ const PrivateTagMenuItem = ({ className, hash, onBeforeClick, type = 'address' }
     pageType,
   };
 
+  const element = (() => {
+    switch (type) {
+      case 'button': {
+        return <ButtonItem label="Add private tag" icon="privattags" onClick={ handleClick } className={ className }/>;
+      }
+      case 'menu_item': {
+        return (
+          <MenuItem className={ className } onClick={ handleClick }>
+            <IconSvg name="privattags" boxSize={ 6 } mr={ 2 }/>
+            <span>Add private tag</span>
+          </MenuItem>
+        );
+      }
+    }
+  })();
+
   return (
     <>
-      <MenuItem className={ className } onClick={ handleClick }>
-        <IconSvg name="privattags" boxSize={ 6 } mr={ 2 }/>
-        <span>Add private tag</span>
-      </MenuItem>
-      { type === 'tx' ?
+      { element }
+      { entityType === 'tx' ?
         <TransactionModal { ...modalProps } data={{ transaction_hash: hash }}/> :
         <AddressModal { ...modalProps } data={{ address_hash: hash }}/>
       }
@@ -72,4 +90,4 @@ const PrivateTagMenuItem = ({ className, hash, onBeforeClick, type = 'address' }
   );
 };
 
-export default React.memo(chakra(PrivateTagMenuItem));
+export default React.memo(PrivateTagMenuItem);
diff --git a/ui/shared/AccountActionsMenu/items/PublicTagMenuItem.tsx b/ui/shared/AccountActionsMenu/items/PublicTagMenuItem.tsx
index 25de85da97..0de41a7698 100644
--- a/ui/shared/AccountActionsMenu/items/PublicTagMenuItem.tsx
+++ b/ui/shared/AccountActionsMenu/items/PublicTagMenuItem.tsx
@@ -1,16 +1,21 @@
-import { MenuItem, chakra } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
+import type { ItemType } from '../types';
+
 import IconSvg from 'ui/shared/IconSvg';
 
+import ButtonItem from '../parts/ButtonItem';
+import MenuItem from '../parts/MenuItem';
+
 interface Props {
   className?: string;
   hash: string;
   onBeforeClick: () => boolean;
+  type: ItemType;
 }
 
-const PublicTagMenuItem = ({ className, hash, onBeforeClick }: Props) => {
+const PublicTagMenuItem = ({ className, hash, onBeforeClick, type }: Props) => {
   const router = useRouter();
 
   const handleClick = React.useCallback(() => {
@@ -21,12 +26,23 @@ const PublicTagMenuItem = ({ className, hash, onBeforeClick }: Props) => {
     router.push({ pathname: '/account/public-tags-request', query: { address: hash } });
   }, [ hash, onBeforeClick, router ]);
 
-  return (
-    <MenuItem className={ className }onClick={ handleClick }>
-      <IconSvg name="publictags" boxSize={ 6 } mr={ 2 }/>
-      <span>Add public tag</span>
-    </MenuItem>
-  );
+  const element = (() => {
+    switch (type) {
+      case 'button': {
+        return <ButtonItem label="Add public tag" icon="publictags" onClick={ handleClick } className={ className }/>;
+      }
+      case 'menu_item': {
+        return (
+          <MenuItem className={ className } onClick={ handleClick }>
+            <IconSvg name="publictags" boxSize={ 6 } mr={ 2 }/>
+            <span>Add public tag</span>
+          </MenuItem>
+        );
+      }
+    }
+  })();
+
+  return element;
 };
 
-export default React.memo(chakra(PublicTagMenuItem));
+export default React.memo(PublicTagMenuItem);
diff --git a/ui/shared/AccountActionsMenu/items/TokenInfoMenuItem.tsx b/ui/shared/AccountActionsMenu/items/TokenInfoMenuItem.tsx
index b7e5f3d337..da1a875c79 100644
--- a/ui/shared/AccountActionsMenu/items/TokenInfoMenuItem.tsx
+++ b/ui/shared/AccountActionsMenu/items/TokenInfoMenuItem.tsx
@@ -1,7 +1,9 @@
-import { MenuItem, chakra, useDisclosure } from '@chakra-ui/react';
+import { chakra, useDisclosure } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
+import type { ItemType } from '../types';
+
 import type { Route } from 'nextjs-routes';
 
 import config from 'configs/app';
@@ -11,13 +13,17 @@ import { PAGE_TYPE_DICT } from 'lib/mixpanel/getPageType';
 import AddressVerificationModal from 'ui/addressVerification/AddressVerificationModal';
 import IconSvg from 'ui/shared/IconSvg';
 
+import ButtonItem from '../parts/ButtonItem';
+import MenuItem from '../parts/MenuItem';
+
 interface Props {
   className?: string;
   hash: string;
   onBeforeClick: (route: Route) => boolean;
+  type: ItemType;
 }
 
-const TokenInfoMenuItem = ({ className, hash, onBeforeClick }: Props) => {
+const TokenInfoMenuItem = ({ className, hash, onBeforeClick, type }: Props) => {
   const router = useRouter();
   const modal = useDisclosure();
   const isAuth = useHasAccount();
@@ -61,37 +67,40 @@ const TokenInfoMenuItem = ({ className, hash, onBeforeClick }: Props) => {
     router.push({ pathname: '/account/verified-addresses' });
   }, [ router ]);
 
-  const icon = <IconSvg name="edit" boxSize={ 6 } mr={ 2 } p={ 1 }/>;
-
-  const content = (() => {
-    if (!verifiedAddressesQuery.data?.verifiedAddresses.find(({ contractAddress }) => contractAddress.toLowerCase() === hash.toLowerCase())) {
-      return (
-        <MenuItem className={ className } onClick={ handleAddAddressClick }>
-          { icon }
-          <span>{ tokenInfoQuery.data?.tokenAddress ? 'Update token info' : 'Add token info' }</span>
-        </MenuItem>
-      );
-    }
-
+  const element = (() => {
+    const icon = <IconSvg name="edit" boxSize={ 6 } p={ 1 }/>;
+    const isVerifiedAddress = verifiedAddressesQuery.data?.verifiedAddresses
+      .find(({ contractAddress }) => contractAddress.toLowerCase() === hash.toLowerCase());
     const hasApplication = applicationsQuery.data?.submissions.some(({ tokenAddress }) => tokenAddress.toLowerCase() === hash.toLowerCase());
 
-    return (
-      <MenuItem className={ className } onClick={ handleAddApplicationClick }>
-        { icon }
-        <span>
-          {
-            hasApplication || tokenInfoQuery.data?.tokenAddress ?
-              'Update token info' :
-              'Add token info'
-          }
-        </span>
-      </MenuItem>
-    );
+    const label = (() => {
+      if (!isVerifiedAddress) {
+        return tokenInfoQuery.data?.tokenAddress ? 'Update token info' : 'Add token info';
+      }
+
+      return hasApplication || tokenInfoQuery.data?.tokenAddress ? 'Update token info' : 'Add token info';
+    })();
+
+    const onClick = isVerifiedAddress ? handleAddApplicationClick : handleAddAddressClick;
+
+    switch (type) {
+      case 'button': {
+        return <ButtonItem label={ label } icon={ icon } onClick={ onClick } className={ className }/>;
+      }
+      case 'menu_item': {
+        return (
+          <MenuItem className={ className } onClick={ onClick }>
+            { icon }
+            <chakra.span ml={ 2 }>{ label }</chakra.span>
+          </MenuItem>
+        );
+      }
+    }
   })();
 
   return (
     <>
-      { content }
+      { element }
       <AddressVerificationModal
         defaultAddress={ hash }
         pageType={ PAGE_TYPE_DICT['/token/[hash]'] }
@@ -105,4 +114,4 @@ const TokenInfoMenuItem = ({ className, hash, onBeforeClick }: Props) => {
   );
 };
 
-export default React.memo(chakra(TokenInfoMenuItem));
+export default React.memo(TokenInfoMenuItem);
diff --git a/ui/shared/AccountActionsMenu/parts/ButtonItem.tsx b/ui/shared/AccountActionsMenu/parts/ButtonItem.tsx
new file mode 100644
index 0000000000..6580b71086
--- /dev/null
+++ b/ui/shared/AccountActionsMenu/parts/ButtonItem.tsx
@@ -0,0 +1,30 @@
+import { IconButton, Tooltip } from '@chakra-ui/react';
+import React from 'react';
+
+import type { IconName } from 'ui/shared/IconSvg';
+import IconSvg from 'ui/shared/IconSvg';
+
+interface Props {
+  className?: string;
+  onClick: () => void;
+  label: string;
+  icon: IconName | React.ReactElement;
+}
+
+const ButtonItem = ({ className, label, onClick, icon }: Props) => {
+  return (
+    <Tooltip label={ label }>
+      <IconButton
+        aria-label={ label }
+        className={ className }
+        icon={ typeof icon === 'string' ? <IconSvg name={ icon } boxSize={ 6 }/> : icon }
+        onClick={ onClick }
+        size="sm"
+        variant="outline"
+        px="4px"
+      />
+    </Tooltip>
+  );
+};
+
+export default ButtonItem;
diff --git a/ui/shared/AccountActionsMenu/parts/MenuItem.tsx b/ui/shared/AccountActionsMenu/parts/MenuItem.tsx
new file mode 100644
index 0000000000..a55d38efde
--- /dev/null
+++ b/ui/shared/AccountActionsMenu/parts/MenuItem.tsx
@@ -0,0 +1,18 @@
+import { MenuItem as MenuItemChakra } from '@chakra-ui/react';
+import React from 'react';
+
+interface Props {
+  className?: string;
+  children: React.ReactNode;
+  onClick: () => void;
+}
+
+const MenuItem = ({ className, children, onClick }: Props) => {
+  return (
+    <MenuItemChakra className={ className } onClick={ onClick } py={ 2 } px={ 4 }>
+      { children }
+    </MenuItemChakra>
+  );
+};
+
+export default MenuItem;
diff --git a/ui/shared/AccountActionsMenu/types.ts b/ui/shared/AccountActionsMenu/types.ts
new file mode 100644
index 0000000000..663e65add8
--- /dev/null
+++ b/ui/shared/AccountActionsMenu/types.ts
@@ -0,0 +1,7 @@
+export type ItemType = 'button' | 'menu_item';
+
+export interface ItemProps {
+  type: ItemType;
+  hash: string;
+  onBeforeClick: () => boolean;
+}
diff --git a/ui/shared/AdditionalInfoButton.tsx b/ui/shared/AdditionalInfoButton.tsx
index 5b1002bfeb..de15304086 100644
--- a/ui/shared/AdditionalInfoButton.tsx
+++ b/ui/shared/AdditionalInfoButton.tsx
@@ -37,6 +37,7 @@ const AdditionalInfoButton = ({ isOpen, onClick, className, isLoading }: Props,
       onClick={ onClick }
       cursor="pointer"
       flexShrink={ 0 }
+      aria-label="Transaction info"
     >
       <IconSvg
         name="info"
diff --git a/ui/shared/AppError/AppError.pw.tsx b/ui/shared/AppError/AppError.pw.tsx
index f821a84b5a..36f23b03f3 100644
--- a/ui/shared/AppError/AppError.pw.tsx
+++ b/ui/shared/AppError/AppError.pw.tsx
@@ -36,8 +36,8 @@ test('status code 500', async({ mount }) => {
   await expect(component).toHaveScreenshot();
 });
 
-test('invalid tx hash', async({ mount }) => {
-  const error = { message: 'Invalid tx hash', cause: { status: 404 } } as Error;
+test('tx not found', async({ mount }) => {
+  const error = { message: 'Not found', cause: { status: 404, resource: 'tx' } } as Error;
   const component = await mount(
     <TestApp>
       <AppError error={ error }/>
diff --git a/ui/shared/AppError/AppError.tsx b/ui/shared/AppError/AppError.tsx
index 2cce4f2952..e3a0a16aff 100644
--- a/ui/shared/AppError/AppError.tsx
+++ b/ui/shared/AppError/AppError.tsx
@@ -3,6 +3,7 @@ import React from 'react';
 
 import { route } from 'nextjs-routes';
 
+import getErrorCause from 'lib/errors/getErrorCause';
 import getErrorCauseStatusCode from 'lib/errors/getErrorCauseStatusCode';
 import getErrorObjStatusCode from 'lib/errors/getErrorObjStatusCode';
 import getResourceErrorPayload from 'lib/errors/getResourceErrorPayload';
@@ -10,8 +11,8 @@ import getResourceErrorPayload from 'lib/errors/getResourceErrorPayload';
 import AppErrorIcon from './AppErrorIcon';
 import AppErrorTitle from './AppErrorTitle';
 import AppErrorBlockConsensus from './custom/AppErrorBlockConsensus';
-import AppErrorInvalidTxHash from './custom/AppErrorInvalidTxHash';
 import AppErrorTooManyRequests from './custom/AppErrorTooManyRequests';
+import AppErrorTxNotFound from './custom/AppErrorTxNotFound';
 
 interface Props {
   className?: string;
@@ -36,6 +37,7 @@ const ERROR_TEXTS: Record<string, { title: string; text: string }> = {
 const AppError = ({ error, className }: Props) => {
   const content = (() => {
     const resourceErrorPayload = getResourceErrorPayload(error);
+    const cause = getErrorCause(error);
     const messageInPayload =
           resourceErrorPayload &&
           typeof resourceErrorPayload === 'object' &&
@@ -43,12 +45,13 @@ const AppError = ({ error, className }: Props) => {
           typeof resourceErrorPayload.message === 'string' ?
             resourceErrorPayload.message :
             undefined;
+    const statusCode = getErrorCauseStatusCode(error) || getErrorObjStatusCode(error);
 
-    const isInvalidTxHash = error?.message?.includes('Invalid tx hash');
+    const isInvalidTxHash = cause && 'resource' in cause && cause.resource === 'tx' && statusCode === 404;
     const isBlockConsensus = messageInPayload?.includes('Block lost consensus');
 
     if (isInvalidTxHash) {
-      return <AppErrorInvalidTxHash/>;
+      return <AppErrorTxNotFound/>;
     }
 
     if (isBlockConsensus) {
@@ -62,8 +65,6 @@ const AppError = ({ error, className }: Props) => {
       return <AppErrorBlockConsensus hash={ hash }/>;
     }
 
-    const statusCode = getErrorCauseStatusCode(error) || getErrorObjStatusCode(error);
-
     switch (statusCode) {
       case 429: {
         return <AppErrorTooManyRequests/>;
diff --git a/ui/shared/AppError/__screenshots__/AppError.pw.tsx_default_invalid-tx-hash-1.png b/ui/shared/AppError/__screenshots__/AppError.pw.tsx_default_invalid-tx-hash-1.png
deleted file mode 100644
index b06fb92cb9..0000000000
Binary files a/ui/shared/AppError/__screenshots__/AppError.pw.tsx_default_invalid-tx-hash-1.png and /dev/null differ
diff --git a/ui/shared/AppError/__screenshots__/AppError.pw.tsx_default_tx-not-found-1.png b/ui/shared/AppError/__screenshots__/AppError.pw.tsx_default_tx-not-found-1.png
new file mode 100644
index 0000000000..bcb5755e61
Binary files /dev/null and b/ui/shared/AppError/__screenshots__/AppError.pw.tsx_default_tx-not-found-1.png differ
diff --git a/ui/shared/AppError/custom/AppErrorInvalidTxHash.tsx b/ui/shared/AppError/custom/AppErrorTxNotFound.tsx
similarity index 76%
rename from ui/shared/AppError/custom/AppErrorInvalidTxHash.tsx
rename to ui/shared/AppError/custom/AppErrorTxNotFound.tsx
index a6da98596f..ee8ee0b00f 100644
--- a/ui/shared/AppError/custom/AppErrorInvalidTxHash.tsx
+++ b/ui/shared/AppError/custom/AppErrorTxNotFound.tsx
@@ -1,13 +1,14 @@
 /* eslint-disable max-len */
-import { Box, OrderedList, ListItem, useColorModeValue, Flex } from '@chakra-ui/react';
+import { Box, OrderedList, ListItem, useColorModeValue, Flex, chakra, Button } from '@chakra-ui/react';
 import React from 'react';
 
+import { route } from 'nextjs-routes';
+
 import IconSvg from 'ui/shared/IconSvg';
 
 import AppErrorTitle from '../AppErrorTitle';
 
-const AppErrorInvalidTxHash = () => {
-  const textColor = useColorModeValue('gray.500', 'gray.400');
+const AppErrorTxNotFound = () => {
   const snippet = {
     borderColor: useColorModeValue('blackAlpha.300', 'whiteAlpha.300'),
     iconBg: useColorModeValue('blackAlpha.800', 'whiteAlpha.800'),
@@ -36,7 +37,7 @@ const AppErrorInvalidTxHash = () => {
         </Flex>
       </Box>
       <AppErrorTitle title="Sorry, we are unable to locate this transaction hash"/>
-      <OrderedList color={ textColor } mt={ 3 } spacing={ 3 }>
+      <OrderedList mt={ 3 } spacing={ 3 }>
         <ListItem>
             If you have just submitted this transaction please wait for at least 30 seconds before refreshing this page.
         </ListItem>
@@ -47,11 +48,22 @@ const AppErrorInvalidTxHash = () => {
             During times when the network is busy (i.e during ICOs) it can take a while for your transaction to propagate through the network and for us to index it.
         </ListItem>
         <ListItem>
-            If it still does not show up after 1 hour, please check with your sender/exchange/wallet/transaction provider for additional information.
+          <span>If it still does not show up after 1 hour, please check with your </span>
+          <chakra.span fontWeight={ 600 }>sender/exchange/wallet/transaction provider</chakra.span>
+          <span> for additional information.</span>
         </ListItem>
       </OrderedList>
+      <Button
+        mt={ 8 }
+        size="lg"
+        variant="outline"
+        as="a"
+        href={ route({ pathname: '/' }) }
+      >
+        Back to home
+      </Button>
     </>
   );
 };
 
-export default AppErrorInvalidTxHash;
+export default AppErrorTxNotFound;
diff --git a/ui/shared/AppError/isCustomAppError.ts b/ui/shared/AppError/isCustomAppError.ts
new file mode 100644
index 0000000000..328368e2ae
--- /dev/null
+++ b/ui/shared/AppError/isCustomAppError.ts
@@ -0,0 +1,8 @@
+import type { ResourceError } from 'lib/api/resources';
+
+// status codes when custom error screen should be shown
+const CUSTOM_STATUS_CODES = [ 404, 422, 429 ];
+
+export default function isCustomAppError(error: ResourceError<unknown>) {
+  return CUSTOM_STATUS_CODES.includes(error.status);
+}
diff --git a/ui/shared/ContainerWithScrollY.tsx b/ui/shared/ContainerWithScrollY.tsx
new file mode 100644
index 0000000000..f16682bbc0
--- /dev/null
+++ b/ui/shared/ContainerWithScrollY.tsx
@@ -0,0 +1,40 @@
+import { Flex, useColorModeValue, chakra } from '@chakra-ui/react';
+import React from 'react';
+
+type Props = {
+  children: React.ReactNode;
+  containerId?: string;
+  gradientHeight: number;
+  className?: string;
+  hasScroll: boolean;
+}
+
+const ContainerWithScrollY = ({ className, hasScroll, containerId, gradientHeight, children }: Props, ref: React.ForwardedRef<HTMLDivElement>) => {
+  const gradientStartColor = useColorModeValue('whiteAlpha.600', 'blackAlpha.600');
+  const gradientEndColor = useColorModeValue('whiteAlpha.900', 'blackAlpha.900');
+
+  return (
+    <Flex
+      id={ containerId }
+      flexDirection="column"
+      className={ className }
+      overflowY={ hasScroll ? 'scroll' : 'auto' }
+      ref={ ref }
+      _after={ hasScroll ? {
+        position: 'absolute',
+        content: '""',
+        bottom: 0,
+        left: 0,
+        right: '20px',
+        height: `${ gradientHeight }px`,
+        bgGradient: `linear(to-b, ${ gradientStartColor } 37.5%, ${ gradientEndColor } 77.5%)`,
+      } : undefined }
+      pr={ hasScroll ? 5 : 0 }
+      pb={ hasScroll ? `${ gradientHeight }px` : 0 }
+    >
+      { children }
+    </Flex>
+  );
+};
+
+export default chakra(React.forwardRef(ContainerWithScrollY));
diff --git a/ui/shared/CopyToClipboard.tsx b/ui/shared/CopyToClipboard.tsx
index be20647990..000678cd90 100644
--- a/ui/shared/CopyToClipboard.tsx
+++ b/ui/shared/CopyToClipboard.tsx
@@ -1,4 +1,4 @@
-import { IconButton, Tooltip, useClipboard, chakra, useDisclosure, Skeleton } from '@chakra-ui/react';
+import { IconButton, Tooltip, useClipboard, chakra, useDisclosure, Skeleton, useColorModeValue } from '@chakra-ui/react';
 import React, { useEffect, useState } from 'react';
 
 import IconSvg from 'ui/shared/IconSvg';
@@ -14,6 +14,7 @@ const CopyToClipboard = ({ text, className, isLoading }: Props) => {
   const [ copied, setCopied ] = useState(false);
   // have to implement controlled tooltip because of the issue - https://github.com/chakra-ui/chakra-ui/issues/7107
   const { isOpen, onOpen, onClose } = useDisclosure();
+  const iconColor = useColorModeValue('gray.400', 'gray.500');
 
   useEffect(() => {
     if (hasCopied) {
@@ -24,7 +25,7 @@ const CopyToClipboard = ({ text, className, isLoading }: Props) => {
   }, [ hasCopied ]);
 
   if (isLoading) {
-    return <Skeleton boxSize={ 5 } className={ className } borderRadius="sm" flexShrink={ 0 } ml={ 2 }/>;
+    return <Skeleton boxSize={ 5 } className={ className } borderRadius="sm" flexShrink={ 0 } ml={ 2 } display="inline-block"/>;
   }
 
   return (
@@ -34,7 +35,7 @@ const CopyToClipboard = ({ text, className, isLoading }: Props) => {
         icon={ <IconSvg name="copy" boxSize={ 5 }/> }
         w="20px"
         h="20px"
-        color="gray.400"
+        color={ iconColor }
         variant="simple"
         display="inline-block"
         flexShrink={ 0 }
diff --git a/ui/shared/DetailsActionsWrapper.tsx b/ui/shared/DetailsActionsWrapper.tsx
new file mode 100644
index 0000000000..a65932c4fa
--- /dev/null
+++ b/ui/shared/DetailsActionsWrapper.tsx
@@ -0,0 +1,51 @@
+import React from 'react';
+
+import ContainerWithScrollY from 'ui/shared/ContainerWithScrollY';
+import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
+
+export const TX_ACTIONS_BLOCK_ID = 'tx-actions';
+const SCROLL_GRADIENT_HEIGHT = 48;
+
+type Props = {
+  children: React.ReactNode;
+  isLoading?: boolean;
+  type: 'tx' | 'user_op';
+}
+
+const DetailsActionsWrapper = ({ children, isLoading, type }: Props) => {
+  const containerRef = React.useRef<HTMLDivElement>(null);
+  const [ hasScroll, setHasScroll ] = React.useState(false);
+
+  React.useEffect(() => {
+    if (!containerRef.current) {
+      return;
+    }
+
+    setHasScroll(containerRef.current.scrollHeight >= containerRef.current.clientHeight + SCROLL_GRADIENT_HEIGHT / 2);
+  }, []);
+
+  return (
+    <DetailsInfoItem
+      title={ `${ type === 'tx' ? 'Transaction' : 'User operation' } action` }
+      hint={ `Highlighted events of the ${ type === 'tx' ? 'transaction' : 'user operation' }` }
+      note={ hasScroll ? 'Scroll to see more' : undefined }
+      position="relative"
+      isLoading={ isLoading }
+    >
+      <ContainerWithScrollY
+        containerId={ TX_ACTIONS_BLOCK_ID }
+        gradientHeight={ SCROLL_GRADIENT_HEIGHT }
+        hasScroll={ hasScroll }
+        alignItems="stretch"
+        rowGap={ 5 }
+        w="100%"
+        maxH="200px"
+        ref={ containerRef }
+      >
+        { children }
+      </ContainerWithScrollY>
+    </DetailsInfoItem>
+  );
+};
+
+export default React.memo(DetailsActionsWrapper);
diff --git a/ui/shared/DetailsInfoItemDivider.tsx b/ui/shared/DetailsInfoItemDivider.tsx
index 22c5b456e0..227837fa74 100644
--- a/ui/shared/DetailsInfoItemDivider.tsx
+++ b/ui/shared/DetailsInfoItemDivider.tsx
@@ -1,9 +1,16 @@
-import { GridItem } from '@chakra-ui/react';
+import { GridItem, chakra } from '@chakra-ui/react';
 import React from 'react';
 
-const DetailsInfoItemDivider = () => {
+interface Props {
+  className?: string;
+  id?: string;
+}
+
+const DetailsInfoItemDivider = ({ className, id }: Props) => {
   return (
     <GridItem
+      id={ id }
+      className={ className }
       colSpan={{ base: undefined, lg: 2 }}
       mt={{ base: 2, lg: 3 }}
       mb={{ base: 0, lg: 3 }}
@@ -13,4 +20,4 @@ const DetailsInfoItemDivider = () => {
   );
 };
 
-export default DetailsInfoItemDivider;
+export default chakra(DetailsInfoItemDivider);
diff --git a/ui/shared/DetailsTimestamp.tsx b/ui/shared/DetailsTimestamp.tsx
new file mode 100644
index 0000000000..27e0217e4e
--- /dev/null
+++ b/ui/shared/DetailsTimestamp.tsx
@@ -0,0 +1,29 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import dayjs from 'lib/date/dayjs';
+import IconSvg from 'ui/shared/IconSvg';
+import TextSeparator from 'ui/shared/TextSeparator';
+
+type Props = {
+  // should be string, will be fixed on the back-end
+  timestamp: string | number;
+  isLoading?: boolean;
+}
+
+const DetailsTimestamp = ({ timestamp, isLoading }: Props) => {
+  return (
+    <>
+      <IconSvg name="clock" boxSize={ 5 } color="gray.500" isLoading={ isLoading }/>
+      <Skeleton isLoaded={ !isLoading } ml={ 2 }>
+        { dayjs(timestamp).fromNow() }
+      </Skeleton>
+      <TextSeparator color="gray.500"/>
+      <Skeleton isLoaded={ !isLoading } whiteSpace="normal">
+        { dayjs(timestamp).format('llll') }
+      </Skeleton>
+    </>
+  );
+};
+
+export default DetailsTimestamp;
diff --git a/ui/shared/EmptySearchResult.tsx b/ui/shared/EmptySearchResult.tsx
index 9c5b7b3720..92c27fbecc 100644
--- a/ui/shared/EmptySearchResult.tsx
+++ b/ui/shared/EmptySearchResult.tsx
@@ -1,10 +1,13 @@
-import { Box, Heading, Text } from '@chakra-ui/react';
+import { Box, Heading, Text, Icon } from '@chakra-ui/react';
 import React from 'react';
 
-import IconSvg from 'ui/shared/IconSvg';
+// This icon doesn't work properly when it is in the sprite
+// Probably because of radial gradient
+// eslint-disable-next-line no-restricted-imports
+import emptySearchResultIcon from 'icons/empty_search_result.svg';
 
 interface Props {
-  text: string;
+  text: string | JSX.Element;
 }
 
 const EmptySearchResult = ({ text }: Props) => {
@@ -14,11 +17,7 @@ const EmptySearchResult = ({ text }: Props) => {
       flexDirection="column"
       alignItems="center"
     >
-      <IconSvg
-        name="empty_search_result"
-        boxSize={ 60 }
-        display="block"
-      />
+      <Icon as={ emptySearchResultIcon } boxSize={ 60 }/>
 
       <Heading
         as="h3"
diff --git a/ui/shared/EntityTags.tsx b/ui/shared/EntityTags.tsx
index 72da69d3ff..40245f7984 100644
--- a/ui/shared/EntityTags.tsx
+++ b/ui/shared/EntityTags.tsx
@@ -1,9 +1,10 @@
 import type { ThemingProps } from '@chakra-ui/react';
-import { Flex, chakra, useDisclosure, Popover, PopoverTrigger, PopoverContent, PopoverBody } from '@chakra-ui/react';
+import { Flex, chakra, useDisclosure, Popover, PopoverTrigger, PopoverContent, PopoverBody, Box } from '@chakra-ui/react';
 import React from 'react';
 
 import type { UserTags } from 'types/api/addressParams';
 
+import config from 'configs/app';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import Tag from 'ui/shared/chakra/Tag';
 
@@ -36,8 +37,12 @@ const EntityTags = ({ className, data, tagsBefore = [], tagsAfter = [], isLoadin
   ]
     .filter(Boolean);
 
+  const metaSuitesPlaceholder = config.features.metasuites.isEnabled ?
+    <Box display="none" id="meta-suites__address-tag" data-ready={ !isLoading }/> :
+    null;
+
   if (tags.length === 0 && !contentAfter) {
-    return null;
+    return metaSuitesPlaceholder;
   }
 
   const content = (() => {
@@ -60,9 +65,10 @@ const EntityTags = ({ className, data, tagsBefore = [], tagsAfter = [], isLoadin
                 </Tag>
               ))
           }
+          { metaSuitesPlaceholder }
           <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy>
             <PopoverTrigger>
-              <Tag onClick={ onToggle }>+{ tags.length - 1 }</Tag>
+              <Tag isLoading={ isLoading }onClick={ onToggle }>+{ tags.length - 1 }</Tag>
             </PopoverTrigger>
             <PopoverContent w="240px">
               <PopoverBody >
@@ -88,18 +94,23 @@ const EntityTags = ({ className, data, tagsBefore = [], tagsAfter = [], isLoadin
       );
     }
 
-    return tags.map((tag) => (
-      <Tag
-        key={ tag.label }
-        isLoading={ isLoading }
-        isTruncated
-        maxW={{ base: '115px', lg: 'initial' }}
-        colorScheme={ 'colorScheme' in tag ? tag.colorScheme : 'gray' }
-        variant={ 'variant' in tag ? tag.variant : 'subtle' }
-      >
-        { tag.display_name }
-      </Tag>
-    ));
+    return (
+      <>
+        { tags.map((tag) => (
+          <Tag
+            key={ tag.label }
+            isLoading={ isLoading }
+            isTruncated
+            maxW={{ base: '115px', lg: 'initial' }}
+            colorScheme={ 'colorScheme' in tag ? tag.colorScheme : 'gray' }
+            variant={ 'variant' in tag ? tag.variant : 'subtle' }
+          >
+            { tag.display_name }
+          </Tag>
+        )) }
+        { metaSuitesPlaceholder }
+      </>
+    );
   })();
 
   return (
diff --git a/ui/shared/ErrorBoundary.tsx b/ui/shared/ErrorBoundary.tsx
index b6c7439594..22a6ba7ad8 100644
--- a/ui/shared/ErrorBoundary.tsx
+++ b/ui/shared/ErrorBoundary.tsx
@@ -1,3 +1,5 @@
+import type { NextRouter } from 'next/router';
+import { useRouter } from 'next/router';
 import React from 'react';
 
 interface Props {
@@ -6,21 +8,33 @@ interface Props {
   onError?: (error: Error) => void;
 }
 
+interface PropsWithRouter extends Props {
+  router: NextRouter;
+}
+
 interface State {
   hasError: boolean;
   error?: Error;
+  errorPathname?: string;
 }
 
-class ErrorBoundary extends React.PureComponent<Props, State> {
+class ErrorBoundary extends React.PureComponent<PropsWithRouter, State> {
   state: State = {
     hasError: false,
   };
 
-  static getDerivedStateFromError(error: Error) {
-    return { hasError: true, error };
+  static getDerivedStateFromProps(props: PropsWithRouter, state: State) {
+    if (state.hasError && state.errorPathname) {
+      if (props.router.pathname !== state.errorPathname) {
+        return { hasError: false, error: undefined, errorPathname: undefined };
+      }
+    }
+
+    return null;
   }
 
   componentDidCatch(error: Error) {
+    this.setState({ hasError: true, error, errorPathname: this.props.router.pathname });
     this.props.onError?.(error);
   }
 
@@ -33,4 +47,9 @@ class ErrorBoundary extends React.PureComponent<Props, State> {
   }
 }
 
-export default ErrorBoundary;
+const WrappedErrorBoundary = (props: Props) => {
+  const router = useRouter();
+  return <ErrorBoundary { ...props } router={ router }/>;
+};
+
+export default React.memo(WrappedErrorBoundary);
diff --git a/ui/shared/FormModal.tsx b/ui/shared/FormModal.tsx
index 8ec4131cfb..7f1b0b6012 100644
--- a/ui/shared/FormModal.tsx
+++ b/ui/shared/FormModal.tsx
@@ -18,10 +18,10 @@ interface Props<TData> {
   onClose: () => void;
   data?: TData;
   title: string;
-  text: string;
+  text?: string;
   renderForm: () => JSX.Element;
-  isAlertVisible: boolean;
-  setAlertVisible: (isAlertVisible: boolean) => void;
+  isAlertVisible?: boolean;
+  setAlertVisible?: (isAlertVisible: boolean) => void;
 }
 
 export default function FormModal<TData>({
@@ -35,7 +35,7 @@ export default function FormModal<TData>({
 }: Props<TData>) {
 
   const onModalClose = useCallback(() => {
-    setAlertVisible(false);
+    setAlertVisible && setAlertVisible(false);
     onClose();
   }, [ onClose, setAlertVisible ]);
 
diff --git a/ui/shared/GasInfoTooltipContent/GasInfoTooltipContent.tsx b/ui/shared/GasInfoTooltipContent/GasInfoTooltipContent.tsx
deleted file mode 100644
index 952d65438b..0000000000
--- a/ui/shared/GasInfoTooltipContent/GasInfoTooltipContent.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { Grid, GridItem, useColorModeValue } from '@chakra-ui/react';
-import React from 'react';
-
-import type { GasPrices } from 'types/api/stats';
-
-const GasInfoTooltipContent = ({ gasPrices }: {gasPrices: GasPrices}) => {
-  const nameStyleProps = {
-    color: useColorModeValue('blue.100', 'blue.600'),
-  };
-
-  return (
-    <Grid templateColumns="repeat(2, max-content)" rowGap={ 2 } columnGap={ 4 } padding={ 4 } fontSize="xs">
-      <GridItem { ...nameStyleProps }>Slow</GridItem>
-      <GridItem>{ gasPrices.slow !== null ? `${ gasPrices.slow } Gwei` : 'N/A' }</GridItem>
-      <GridItem { ...nameStyleProps }>Average</GridItem>
-      <GridItem>{ gasPrices.average !== null ? `${ gasPrices.average } Gwei` : 'N/A' }</GridItem>
-      <GridItem { ...nameStyleProps }>Fast</GridItem>
-      <GridItem>{ gasPrices.fast !== null ? `${ gasPrices.fast } Gwei` : 'N/A' }</GridItem>
-    </Grid>
-  );
-};
-
-export default React.memo(GasInfoTooltipContent);
diff --git a/ui/shared/HashStringShorten.tsx b/ui/shared/HashStringShorten.tsx
index b87631affb..a986fb617b 100644
--- a/ui/shared/HashStringShorten.tsx
+++ b/ui/shared/HashStringShorten.tsx
@@ -10,18 +10,20 @@ import shortenUniversalProfile from '../../lib/shortenUniversalProfile';
 interface Props {
   hash: string;
   isTooltipDisabled?: boolean;
+  type?: 'long' | 'short';
   as?: As;
 }
 
-const HashStringShorten = ({ hash, isTooltipDisabled, as = 'span' }: Props) => {
-  const [ shortenedString, setShortenedString ] = useState(shortenString(hash));
+const HashStringShorten = ({ hash, isTooltipDisabled, as = 'span', type }: Props) => {
+  const charNumber = type === 'long' ? 16 : 8;
+  const [ shortenedString, setShortenedString ] = useState(shortenString(hash, charNumber));
   useEffect(() => {
     if (isUniversalProfileEnabled() && hash.includes(' (')) {
       setShortenedString(shortenUniversalProfile(hash));
     }
   }, [ hash ]);
 
-  if (hash.length <= 8) {
+  if (hash.length <= charNumber) {
     return <chakra.span as={ as }>{ hash }</chakra.span>;
   }
 
diff --git a/ui/shared/IconSvg.tsx b/ui/shared/IconSvg.tsx
index fb30c5e8cd..3d5d6ef068 100644
--- a/ui/shared/IconSvg.tsx
+++ b/ui/shared/IconSvg.tsx
@@ -12,9 +12,9 @@ interface Props extends HTMLChakraProps<'div'> {
   isLoading?: boolean;
 }
 
-const IconSvg = ({ name, isLoading, ...props }: Props) => {
+const IconSvg = ({ name, isLoading, ...props }: Props, ref: React.ForwardedRef<HTMLDivElement>) => {
   return (
-    <Skeleton isLoaded={ !isLoading } display="inline-block" { ...props }>
+    <Skeleton isLoaded={ !isLoading } display="inline-block" { ...props } ref={ ref }>
       <chakra.svg w="100%" h="100%">
         <use href={ `${ href }#${ name }` }/>
       </chakra.svg>
@@ -22,4 +22,4 @@ const IconSvg = ({ name, isLoading, ...props }: Props) => {
   );
 };
 
-export default IconSvg;
+export default React.forwardRef(IconSvg);
diff --git a/ui/shared/InOutTag.tsx b/ui/shared/InOutTag.tsx
deleted file mode 100644
index bf7be50a85..0000000000
--- a/ui/shared/InOutTag.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import { chakra } from '@chakra-ui/react';
-import React from 'react';
-
-import Tag from 'ui/shared/chakra/Tag';
-
-interface Props {
-  isIn: boolean;
-  isOut: boolean;
-  className?: string;
-  isLoading?: boolean;
-}
-
-const InOutTag = ({ isIn, isOut, className, isLoading }: Props) => {
-  if (!isIn && !isOut) {
-    return null;
-  }
-
-  const colorScheme = isOut ? 'orange' : 'green';
-
-  return (
-    <Tag
-      className={ className }
-      colorScheme={ colorScheme }
-      display="flex"
-      justifyContent="center"
-      isLoading={ isLoading }
-    >
-      { isOut ? 'OUT' : 'IN' }
-    </Tag>
-  );
-};
-
-export default React.memo(chakra(InOutTag));
diff --git a/ui/shared/NetworkExplorers.pw.tsx b/ui/shared/NetworkExplorers.pw.tsx
new file mode 100644
index 0000000000..5a0e813ccb
--- /dev/null
+++ b/ui/shared/NetworkExplorers.pw.tsx
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import TestApp from 'playwright/TestApp';
+
+import NetworkExplorers from './NetworkExplorers';
+
+test('base view', async({ mount, page }) => {
+  const component = await mount(
+    <TestApp>
+      <NetworkExplorers type="tx" pathParam="0x123"/>
+    </TestApp>,
+  );
+
+  await component.getByText('2').click();
+
+  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 300, height: 150 } });
+});
diff --git a/ui/shared/NetworkExplorers.tsx b/ui/shared/NetworkExplorers.tsx
index d0cefc98d0..6671a07274 100644
--- a/ui/shared/NetworkExplorers.tsx
+++ b/ui/shared/NetworkExplorers.tsx
@@ -1,4 +1,17 @@
-import { Flex, Button, chakra, Popover, PopoverTrigger, PopoverBody, PopoverContent, useDisclosure } from '@chakra-ui/react';
+import {
+  Image,
+  Button,
+  Popover,
+  PopoverTrigger,
+  PopoverBody,
+  PopoverContent,
+  Show,
+  Hide,
+  useColorModeValue,
+  chakra,
+  useDisclosure,
+  Grid,
+} from '@chakra-ui/react';
 import React from 'react';
 
 import type { NetworkExplorer as TNetworkExplorer } from 'types/networks';
@@ -16,15 +29,24 @@ interface Props {
 
 const NetworkExplorers = ({ className, type, pathParam }: Props) => {
   const { isOpen, onToggle, onClose } = useDisclosure();
+  const defaultIconColor = useColorModeValue('gray.400', 'gray.500');
 
   const explorersLinks = React.useMemo(() => {
     return config.UI.explorers.items
       .filter((explorer) => typeof explorer.paths[type] === 'string')
       .map((explorer) => {
         const url = new URL(stripTrailingSlash(explorer.paths[type] || '') + '/' + pathParam, explorer.baseUrl);
-        return <LinkExternal key={ explorer.baseUrl } href={ url.toString() }>{ explorer.title }</LinkExternal>;
+        return (
+          <LinkExternal h="34px" key={ explorer.baseUrl } href={ url.toString() } alignItems="center" display="inline-flex" minW="120px">
+            { explorer.logo ?
+              <Image boxSize={ 5 } mr={ 2 } src={ explorer.logo } alt={ `${ explorer.title } icon` }/> :
+              <IconSvg name="explorer" boxSize={ 5 } color={ defaultIconColor } mr={ 2 }/>
+            }
+            { explorer.title }
+          </LinkExternal>
+        );
       });
-  }, [ pathParam, type ]);
+  }, [ pathParam, type, defaultIconColor ]);
 
   if (explorersLinks.length === 0) {
     return null;
@@ -46,21 +68,26 @@ const NetworkExplorers = ({ className, type, pathParam }: Props) => {
           flexShrink={ 0 }
         >
           <IconSvg name="explorer" boxSize={ 5 }/>
-          <IconSvg name="arrows/east-mini" transform={ isOpen ? 'rotate(90deg)' : 'rotate(-90deg)' } transitionDuration="faster" boxSize={ 5 }/>
+          <Show above="xl">
+            <chakra.span ml={ 1 }>{ explorersLinks.length } Explorer{ explorersLinks.length > 1 ? 's' : '' }</chakra.span>
+          </Show>
+          <Hide above="xl">
+            <chakra.span ml={ 1 }>{ explorersLinks.length }</chakra.span>
+          </Hide>
         </Button>
       </PopoverTrigger>
-      <PopoverContent w="240px">
+      <PopoverContent w="auto">
         <PopoverBody >
           <chakra.span color="text_secondary" fontSize="xs">Verify with other explorers</chakra.span>
-          <Flex
+          <Grid
             alignItems="center"
-            flexWrap="wrap"
-            columnGap={ 6 }
-            rowGap={ 3 }
+            templateColumns={ explorersLinks.length > 1 ? 'auto auto' : '1fr' }
+            columnGap={ 4 }
+            rowGap={ 2 }
             mt={ 3 }
           >
             { explorersLinks }
-          </Flex>
+          </Grid>
         </PopoverBody>
       </PopoverContent>
     </Popover>
diff --git a/ui/shared/Noves/NovesFromTo.tsx b/ui/shared/Noves/NovesFromTo.tsx
new file mode 100644
index 0000000000..db1ea47205
--- /dev/null
+++ b/ui/shared/Noves/NovesFromTo.tsx
@@ -0,0 +1,62 @@
+import { Box, Skeleton } from '@chakra-ui/react';
+import type { FC } from 'react';
+import React from 'react';
+
+import type { NovesResponseData } from 'types/api/noves';
+
+import type { NovesFlowViewItem } from 'ui/tx/assetFlows/utils/generateFlowViewData';
+
+import Tag from '../chakra/Tag';
+import AddressEntity from '../entities/address/AddressEntity';
+import { getActionFromTo, getFromTo } from './utils';
+
+interface Props {
+  isLoaded: boolean;
+  txData?: NovesResponseData;
+  currentAddress?: string;
+  item?: NovesFlowViewItem;
+}
+
+const NovesFromTo: FC<Props> = ({ isLoaded, txData, currentAddress = '', item }) => {
+  const data = React.useMemo(() => {
+    if (txData) {
+      return getFromTo(txData, currentAddress);
+    }
+    if (item) {
+      return getActionFromTo(item);
+    }
+
+    return { text: 'Sent to', address: '' };
+  }, [ currentAddress, item, txData ]);
+
+  const isSent = data.text.startsWith('Sent');
+
+  const address = { hash: data.address || '', name: data.name || '' };
+
+  return (
+    <Skeleton borderRadius="sm" isLoaded={ isLoaded }>
+      <Box display="flex">
+        <Tag
+          colorScheme={ isSent ? 'yellow' : 'green' }
+          px={ 0 }
+          w="113px"
+          textAlign="center"
+        >
+          { data.text }
+        </Tag>
+
+        <AddressEntity
+          address={ address }
+          fontWeight="500"
+          noCopy={ !data.address }
+          noLink={ !data.address }
+          noIcon={ address.name === 'Validators' }
+          ml={ 2 }
+          truncation="dynamic"
+        />
+      </Box>
+    </Skeleton>
+  );
+};
+
+export default NovesFromTo;
diff --git a/ui/shared/Noves/utils.test.ts b/ui/shared/Noves/utils.test.ts
new file mode 100644
index 0000000000..52bdc97a9c
--- /dev/null
+++ b/ui/shared/Noves/utils.test.ts
@@ -0,0 +1,49 @@
+import * as transactionMock from 'mocks/noves/transaction';
+import type { NovesFlowViewItem } from 'ui/tx/assetFlows/utils/generateFlowViewData';
+
+import { getActionFromTo, getFromTo, getFromToValue } from './utils';
+
+it('get data for FromTo component from transaction', async() => {
+  const result = getFromTo(transactionMock.transaction, transactionMock.transaction.accountAddress);
+
+  expect(result).toEqual({
+    text: 'Sent to',
+    address: '0xef6595A423c99f3f2821190A4d96fcE4DcD89a80',
+  });
+});
+
+it('get what type of FromTo component will be', async() => {
+  const result = getFromToValue(transactionMock.transaction, transactionMock.transaction.accountAddress);
+
+  expect(result).toEqual('sent');
+});
+
+it('get data for FromTo component from flow item', async() => {
+  const item: NovesFlowViewItem = {
+    action: {
+      label: 'Sent',
+      amount: '3000',
+      flowDirection: 'toRight',
+      nft: undefined,
+      token: {
+        address: '0x1bfe4298796198f8664b18a98640cec7c89b5baa',
+        decimals: 18,
+        name: 'PQR-Test',
+        symbol: 'PQR',
+      },
+    },
+    rightActor: {
+      address: '0xdD15D2650387Fb6FEDE27ae7392C402a393F8A37',
+      name: null,
+    },
+    accountAddress: '0xef6595a423c99f3f2821190a4d96fce4dcd89a80',
+  };
+
+  const result = getActionFromTo(item);
+
+  expect(result).toEqual({
+    text: 'Sent to',
+    address: '0xdD15D2650387Fb6FEDE27ae7392C402a393F8A37',
+    name: null,
+  });
+});
diff --git a/ui/shared/Noves/utils.ts b/ui/shared/Noves/utils.ts
new file mode 100644
index 0000000000..9e0bf88677
--- /dev/null
+++ b/ui/shared/Noves/utils.ts
@@ -0,0 +1,89 @@
+import type { NovesResponseData, NovesSentReceived } from 'types/api/noves';
+
+import type { NovesFlowViewItem } from 'ui/tx/assetFlows/utils/generateFlowViewData';
+
+export interface FromToData {
+  text: string;
+  address: string;
+  name?: string | null;
+}
+
+export const getFromTo = (txData: NovesResponseData, currentAddress: string): FromToData => {
+  const raw = txData.rawTransactionData;
+  const sent = txData.classificationData.sent;
+  let sentFound: Array<NovesSentReceived> = [];
+  if (sent && sent[0]) {
+    sentFound = sent
+      .filter((sent) => sent.from.address.toLocaleLowerCase() === currentAddress)
+      .filter((sent) => sent.to.address);
+  }
+
+  const received = txData.classificationData.received;
+  let receivedFound: Array<NovesSentReceived> = [];
+  if (received && received[0]) {
+    receivedFound = received
+      .filter((received) => received.to.address?.toLocaleLowerCase() === currentAddress)
+      .filter((received) => received.from.address);
+  }
+
+  if (sentFound[0] && receivedFound[0]) {
+    if (sentFound.length === receivedFound.length) {
+      if (raw.toAddress.toLocaleLowerCase() === currentAddress) {
+        return { text: 'Received from', address: raw.fromAddress };
+      }
+
+      if (raw.fromAddress.toLocaleLowerCase() === currentAddress) {
+        return { text: 'Sent to', address: raw.toAddress };
+      }
+    }
+    if (sentFound.length > receivedFound.length) {
+      // already filtered if null
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      return { text: 'Sent to', address: sentFound[0].to.address! } ;
+    } else {
+      return { text: 'Received from', address: receivedFound[0].from.address } ;
+    }
+  }
+
+  if (sent && sentFound[0]) {
+    // already filtered if null
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    return { text: 'Sent to', address: sentFound[0].to.address! } ;
+  }
+
+  if (received && receivedFound[0]) {
+    return { text: 'Received from', address: receivedFound[0].from.address };
+  }
+
+  if (raw.toAddress && raw.toAddress.toLocaleLowerCase() === currentAddress) {
+    return { text: 'Received from', address: raw.fromAddress };
+  }
+
+  if (raw.fromAddress && raw.fromAddress.toLocaleLowerCase() === currentAddress) {
+    return { text: 'Sent to', address: raw.toAddress };
+  }
+
+  if (!raw.toAddress && raw.fromAddress) {
+    return { text: 'Received from', address: raw.fromAddress };
+  }
+
+  if (!raw.fromAddress && raw.toAddress) {
+    return { text: 'Sent to', address: raw.toAddress };
+  }
+
+  return { text: 'Sent to', address: currentAddress };
+};
+
+export const getFromToValue = (txData: NovesResponseData, currentAddress: string) => {
+  const fromTo = getFromTo(txData, currentAddress);
+
+  return fromTo.text.split(' ').shift()?.toLowerCase();
+};
+
+export const getActionFromTo = (item: NovesFlowViewItem): FromToData => {
+  return {
+    text: item.action.flowDirection === 'toRight' ? 'Sent to' : 'Received from',
+    address: item.rightActor.address,
+    name: item.rightActor.name,
+  };
+};
diff --git a/ui/shared/Page/PageTitle.tsx b/ui/shared/Page/PageTitle.tsx
index d531921cc4..8c6e2f5d53 100644
--- a/ui/shared/Page/PageTitle.tsx
+++ b/ui/shared/Page/PageTitle.tsx
@@ -143,7 +143,7 @@ const PageTitle = ({ title, contentAfter, withTextAd, backLink, className, isLoa
         { withTextAd && <TextAd order={{ base: -1, lg: 100 }} mb={{ base: 6, lg: 0 }} ml="auto" w={{ base: '100%', lg: 'auto' }}/> }
       </Flex>
       { secondRow && (
-        <Flex alignItems="center" minH={ 10 } overflow="hidden">
+        <Flex alignItems="center" minH={ 10 } overflow="hidden" _empty={{ display: 'none' }}>
           { secondRow }
         </Flex>
       ) }
diff --git a/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_default_default-view-mobile-1.png b/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_default_default-view-mobile-1.png
index 8e5096497b..d633cbb80a 100644
Binary files a/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_default_default-view-mobile-1.png and b/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_default_default-view-mobile-1.png differ
diff --git a/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_default_with-long-name-and-many-tags-mobile-1.png b/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_default_with-long-name-and-many-tags-mobile-1.png
index d8878240f6..8d02d7da7c 100644
Binary files a/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_default_with-long-name-and-many-tags-mobile-1.png and b/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_default_with-long-name-and-many-tags-mobile-1.png differ
diff --git a/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_mobile_default-view-mobile-1.png b/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_mobile_default-view-mobile-1.png
index 04be035dd4..efabd99eed 100644
Binary files a/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_mobile_default-view-mobile-1.png and b/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_mobile_default-view-mobile-1.png differ
diff --git a/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_mobile_with-long-name-and-many-tags-mobile-1.png b/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_mobile_with-long-name-and-many-tags-mobile-1.png
index 11886cf45b..f2b21cc103 100644
Binary files a/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_mobile_with-long-name-and-many-tags-mobile-1.png and b/ui/shared/Page/__screenshots__/PageTitle.pw.tsx_mobile_with-long-name-and-many-tags-mobile-1.png differ
diff --git a/ui/shared/RawDataSnippet.tsx b/ui/shared/RawDataSnippet.tsx
index d7a6789bda..b18a6009f8 100644
--- a/ui/shared/RawDataSnippet.tsx
+++ b/ui/shared/RawDataSnippet.tsx
@@ -1,3 +1,4 @@
+import type { ChakraProps } from '@chakra-ui/react';
 import { Box, Flex, chakra, useColorModeValue, Skeleton } from '@chakra-ui/react';
 import React from 'react';
 
@@ -12,9 +13,10 @@ interface Props {
   textareaMaxHeight?: string;
   showCopy?: boolean;
   isLoading?: boolean;
+  contentProps?: ChakraProps;
 }
 
-const RawDataSnippet = ({ data, className, title, rightSlot, beforeSlot, textareaMaxHeight, showCopy = true, isLoading }: Props) => {
+const RawDataSnippet = ({ data, className, title, rightSlot, beforeSlot, textareaMaxHeight, showCopy = true, isLoading, contentProps }: Props) => {
   // see issue in theme/components/Textarea.ts
   const bgColor = useColorModeValue('#f5f5f6', '#1a1b1b');
   return (
@@ -36,8 +38,10 @@ const RawDataSnippet = ({ data, className, title, rightSlot, beforeSlot, textare
         borderRadius="md"
         wordBreak="break-all"
         whiteSpace="pre-wrap"
+        overflowX="hidden"
         overflowY="auto"
         isLoaded={ !isLoading }
+        { ...contentProps }
       >
         { data }
       </Skeleton>
diff --git a/ui/shared/Tabs/TabsWithScroll.tsx b/ui/shared/Tabs/TabsWithScroll.tsx
index a4a5fc4bb1..f09644b675 100644
--- a/ui/shared/Tabs/TabsWithScroll.tsx
+++ b/ui/shared/Tabs/TabsWithScroll.tsx
@@ -11,6 +11,8 @@ import React, { useEffect, useRef, useState } from 'react';
 
 import type { TabItem } from './types';
 
+import isBrowser from 'lib/isBrowser';
+
 import AdaptiveTabsList from './AdaptiveTabsList';
 import { menuButton } from './utils';
 
@@ -39,7 +41,7 @@ const TabsWithScroll = ({
   ...themeProps
 }: Props) => {
   const [ activeTabIndex, setActiveTabIndex ] = useState<number>(defaultTabIndex || 0);
-  const [ screenWidth, setScreenWidth ] = React.useState(0);
+  const [ screenWidth, setScreenWidth ] = React.useState(isBrowser() ? window.innerWidth : 0);
 
   const tabsRef = useRef<HTMLDivElement>(null);
 
diff --git a/ui/shared/TextSeparator.tsx b/ui/shared/TextSeparator.tsx
index bc386c0ddb..ed929fafdb 100644
--- a/ui/shared/TextSeparator.tsx
+++ b/ui/shared/TextSeparator.tsx
@@ -2,8 +2,8 @@ import { chakra } from '@chakra-ui/react';
 import type { StyleProps } from '@chakra-ui/styled-system';
 import React from 'react';
 
-const TextSeparator = (props: StyleProps) => {
-  return <chakra.span mx={ 3 } { ...props }>|</chakra.span>;
+const TextSeparator = ({ id, ...props }: StyleProps & { id?: string }) => {
+  return <chakra.span mx={ 3 } id={ id } { ...props }>|</chakra.span>;
 };
 
 export default React.memo(TextSeparator);
diff --git a/ui/shared/TokenTransfer/TokenTransferFilter.tsx b/ui/shared/TokenTransfer/TokenTransferFilter.tsx
index 137c545b34..cef403a741 100644
--- a/ui/shared/TokenTransfer/TokenTransferFilter.tsx
+++ b/ui/shared/TokenTransfer/TokenTransferFilter.tsx
@@ -35,7 +35,7 @@ const TokenTransferFilter = ({
   const isInitialLoading = useIsInitialLoading(isLoading);
 
   return (
-    <PopoverFilter appliedFiltersNum={ appliedFiltersNum } contentProps={{ w: '200px' }} isLoading={ isInitialLoading }>
+    <PopoverFilter appliedFiltersNum={ appliedFiltersNum } contentProps={{ w: '220px' }} isLoading={ isInitialLoading }>
       { withAddressFilter && (
         <>
           <Text variant="secondary" fontWeight={ 600 }>Address</Text>
@@ -49,13 +49,12 @@ const TokenTransferFilter = ({
           >
             <Stack spacing={ 4 }>
               <Radio value="all"><Text fontSize="md">All</Text></Radio>
-              <Radio value="from"><Text fontSize="md">From</Text></Radio>
-              <Radio value="to"><Text fontSize="md">To</Text></Radio>
+              <Radio value="from"><Text fontSize="md">Outgoing transfers</Text></Radio>
+              <Radio value="to"><Text fontSize="md">Incoming transfers</Text></Radio>
             </Stack>
           </RadioGroup>
         </>
       ) }
-      <Text variant="secondary" fontWeight={ 600 }>Type</Text>
       <TokenTypeFilter<TokenType> onChange={ onTypeFilterChange } defaultValue={ defaultTypeFilters } nftOnly={ false }/>
     </PopoverFilter>
   );
diff --git a/ui/shared/TokenTransfer/TokenTransferListItem.tsx b/ui/shared/TokenTransfer/TokenTransferListItem.tsx
index 0d63e07b51..4707f9d917 100644
--- a/ui/shared/TokenTransfer/TokenTransferListItem.tsx
+++ b/ui/shared/TokenTransfer/TokenTransferListItem.tsx
@@ -5,13 +5,11 @@ import type { TokenTransfer } from 'types/api/tokenTransfer';
 
 import getCurrencyValue from 'lib/getCurrencyValue';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import Tag from 'ui/shared/chakra/Tag';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import NftEntity from 'ui/shared/entities/nft/NftEntity';
 import TokenEntity from 'ui/shared/entities/token/TokenEntity';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import IconSvg from 'ui/shared/IconSvg';
-import InOutTag from 'ui/shared/InOutTag';
 import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
 import { getTokenTransferTypeText } from 'ui/shared/TokenTransfer/helpers';
 import TxAdditionalInfo from 'ui/txs/TxAdditionalInfo';
@@ -37,7 +35,7 @@ const TokenTransferListItem = ({
   isLoading,
 }: Props) => {
   const timeAgo = useTimeAgoIncrement(timestamp, enableTimeIncrement);
-  const { usd, valueStr } = 'value' in total ? getCurrencyValue({
+  const { usd, valueStr } = 'value' in total && total.value !== null ? getCurrencyValue({
     value: total.value,
     exchangeRate: token.exchange_rate,
     accuracy: 8,
@@ -45,7 +43,6 @@ const TokenTransferListItem = ({
     decimals: total.decimals || '0',
   }) : { usd: null, valueStr: null };
 
-  const addressWidth = `calc((100% - ${ baseAddress ? '50px - 24px' : '24px - 24px' }) / 2)`;
   return (
     <ListItemMobile rowGap={ 3 } isAnimated>
       <Flex w="100%" justifyContent="space-between">
@@ -64,13 +61,13 @@ const TokenTransferListItem = ({
           <TxAdditionalInfo hash={ txHash } isMobile isLoading={ isLoading }/>
         ) }
       </Flex>
-      { 'token_id' in total && <NftEntity hash={ token.address } id={ total.token_id } isLoading={ isLoading }/> }
+      { 'token_id' in total && total.token_id !== null && <NftEntity hash={ token.address } id={ total.token_id } isLoading={ isLoading }/> }
       { showTxInfo && txHash && (
         <Flex justifyContent="space-between" alignItems="center" lineHeight="24px" width="100%">
           <TxEntity
             isLoading={ isLoading }
             hash={ txHash }
-            truncation="constant"
+            truncation="constant_long"
             fontWeight="700"
           />
           { timestamp && (
@@ -80,36 +77,13 @@ const TokenTransferListItem = ({
           ) }
         </Flex>
       ) }
-      <Flex w="100%" columnGap={ 3 }>
-        <AddressEntity
-          address={ from }
-          isLoading={ isLoading }
-          noLink={ baseAddress === from.hash }
-          noCopy={ baseAddress === from.hash }
-          flexShrink={ 0 }
-          width={ addressWidth }
-        />
-        { baseAddress ? (
-          <InOutTag
-            isIn={ baseAddress === to.hash }
-            isOut={ baseAddress === from.hash }
-            w="50px"
-            textAlign="center"
-            isLoading={ isLoading }
-            flexShrink={ 0 }
-          />
-        ) :
-          <IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" isLoading={ isLoading } flexShrink={ 0 }/>
-        }
-        <AddressEntity
-          address={ to }
-          isLoading={ isLoading }
-          noLink={ baseAddress === to.hash }
-          noCopy={ baseAddress === to.hash }
-          flexShrink={ 0 }
-          width={ addressWidth }
-        />
-      </Flex>
+      <AddressFromTo
+        from={ from }
+        to={ to }
+        current={ baseAddress }
+        isLoading={ isLoading }
+        w="100%"
+      />
       { valueStr && (
         <Flex columnGap={ 2 } w="100%">
           <Skeleton isLoaded={ !isLoading } fontWeight={ 500 } flexShrink={ 0 }>Value</Skeleton>
diff --git a/ui/shared/TokenTransfer/TokenTransferTable.tsx b/ui/shared/TokenTransfer/TokenTransferTable.tsx
index e9fda5f46c..b707ccbdc0 100644
--- a/ui/shared/TokenTransfer/TokenTransferTable.tsx
+++ b/ui/shared/TokenTransfer/TokenTransferTable.tsx
@@ -3,6 +3,7 @@ import React from 'react';
 
 import type { TokenTransfer } from 'types/api/tokenTransfer';
 
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import * as SocketNewItemsNotice from 'ui/shared/SocketNewItemsNotice';
 import { default as Thead } from 'ui/shared/TheadSticky';
 import TokenTransferTableItem from 'ui/shared/TokenTransfer/TokenTransferTableItem';
@@ -32,41 +33,41 @@ const TokenTransferTable = ({
 }: Props) => {
 
   return (
-    <Table variant="simple" size="sm" minW="950px">
-      <Thead top={ top }>
-        <Tr>
-          { showTxInfo && <Th width="44px"></Th> }
-          <Th width="185px">Token</Th>
-          <Th width="160px">Token ID</Th>
-          { showTxInfo && <Th width="25%">Txn hash</Th> }
-          <Th width="25%">From</Th>
-          { baseAddress && <Th width="50px" px={ 0 }/> }
-          <Th width="25%">To</Th>
-          <Th width="25%" isNumeric>Value</Th>
-        </Tr>
-      </Thead>
-      <Tbody>
-        { showSocketInfo && (
-          <SocketNewItemsNotice.Desktop
-            url={ window.location.href }
-            alert={ socketInfoAlert }
-            num={ socketInfoNum }
-            type="token_transfer"
-            isLoading={ isLoading }
-          />
-        ) }
-        { data.map((item, index) => (
-          <TokenTransferTableItem
-            key={ item.tx_hash + item.block_hash + item.log_index + (isLoading ? index : '') }
-            { ...item }
-            baseAddress={ baseAddress }
-            showTxInfo={ showTxInfo }
-            enableTimeIncrement={ enableTimeIncrement }
-            isLoading={ isLoading }
-          />
-        )) }
-      </Tbody>
-    </Table>
+    <AddressHighlightProvider>
+      <Table variant="simple" size="sm" minW="950px">
+        <Thead top={ top }>
+          <Tr>
+            { showTxInfo && <Th width="44px"></Th> }
+            <Th width="200px">Token</Th>
+            <Th width="160px">Token ID</Th>
+            { showTxInfo && <Th width="200px">Txn hash</Th> }
+            <Th width="60%">From/To</Th>
+            <Th width="40%" isNumeric>Value</Th>
+          </Tr>
+        </Thead>
+        <Tbody>
+          { showSocketInfo && (
+            <SocketNewItemsNotice.Desktop
+              url={ window.location.href }
+              alert={ socketInfoAlert }
+              num={ socketInfoNum }
+              type="token_transfer"
+              isLoading={ isLoading }
+            />
+          ) }
+          { data.map((item, index) => (
+            <TokenTransferTableItem
+              key={ item.tx_hash + item.block_hash + item.log_index + (isLoading ? index : '') }
+              { ...item }
+              baseAddress={ baseAddress }
+              showTxInfo={ showTxInfo }
+              enableTimeIncrement={ enableTimeIncrement }
+              isLoading={ isLoading }
+            />
+          )) }
+        </Tbody>
+      </Table>
+    </AddressHighlightProvider>
   );
 };
 
diff --git a/ui/shared/TokenTransfer/TokenTransferTableItem.tsx b/ui/shared/TokenTransfer/TokenTransferTableItem.tsx
index aa057f1a95..339b6baf00 100644
--- a/ui/shared/TokenTransfer/TokenTransferTableItem.tsx
+++ b/ui/shared/TokenTransfer/TokenTransferTableItem.tsx
@@ -5,12 +5,11 @@ import type { TokenTransfer } from 'types/api/tokenTransfer';
 
 import getCurrencyValue from 'lib/getCurrencyValue';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import Tag from 'ui/shared/chakra/Tag';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import NftEntity from 'ui/shared/entities/nft/NftEntity';
 import TokenEntity from 'ui/shared/entities/token/TokenEntity';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import InOutTag from 'ui/shared/InOutTag';
 import { getTokenTransferTypeText } from 'ui/shared/TokenTransfer/helpers';
 import TxAdditionalInfo from 'ui/txs/TxAdditionalInfo';
 
@@ -35,7 +34,7 @@ const TokenTransferTableItem = ({
   isLoading,
 }: Props) => {
   const timeAgo = useTimeAgoIncrement(timestamp, enableTimeIncrement);
-  const { usd, valueStr } = 'value' in total ? getCurrencyValue({
+  const { usd, valueStr } = 'value' in total && total.value !== null ? getCurrencyValue({
     value: total.value,
     exchangeRate: token.exchange_rate,
     accuracy: 8,
@@ -66,7 +65,7 @@ const TokenTransferTableItem = ({
         </Flex>
       </Td>
       <Td>
-        { 'token_id' in total && <NftEntity hash={ token.address } id={ total.token_id } isLoading={ isLoading }/> }
+        { 'token_id' in total && total.token_id !== null && <NftEntity hash={ token.address } id={ total.token_id } isLoading={ isLoading }/> }
       </Td>
       { showTxInfo && txHash && (
         <Td>
@@ -76,6 +75,7 @@ const TokenTransferTableItem = ({
             fontWeight={ 600 }
             noIcon
             mt="7px"
+            truncation="constant_long"
           />
           { timestamp && (
             <Skeleton isLoaded={ !isLoading } color="text_secondary" fontWeight="400" mt="10px" display="inline-block">
@@ -85,36 +85,13 @@ const TokenTransferTableItem = ({
         </Td>
       ) }
       <Td>
-        <AddressEntity
-          address={ from }
+        <AddressFromTo
+          from={ from }
+          to={ to }
+          current={ baseAddress }
           isLoading={ isLoading }
-          my="5px"
-          noLink={ baseAddress === from.hash }
-          noCopy={ baseAddress === from.hash }
-          flexGrow={ 1 }
-        />
-      </Td>
-      { baseAddress && (
-        <Td px={ 0 }>
-          <Box mt="3px">
-            <InOutTag
-              isIn={ baseAddress === to.hash }
-              isOut={ baseAddress === from.hash }
-              w="50px"
-              textAlign="center"
-              isLoading={ isLoading }
-            />
-          </Box>
-        </Td>
-      ) }
-      <Td>
-        <AddressEntity
-          address={ to }
-          isLoading={ isLoading }
-          my="5px"
-          noLink={ baseAddress === to.hash }
-          noCopy={ baseAddress === to.hash }
-          flexGrow={ 1 }
+          mt={ 1 }
+          mode={{ lg: 'compact', xl: 'long' }}
         />
       </Td>
       <Td isNumeric verticalAlign="top">
diff --git a/ui/shared/TokenTransfer/__screenshots__/TokenTransferList.pw.tsx_default_with-tx-info-1.png b/ui/shared/TokenTransfer/__screenshots__/TokenTransferList.pw.tsx_default_with-tx-info-1.png
index cb52e15b4d..523dbce1e9 100644
Binary files a/ui/shared/TokenTransfer/__screenshots__/TokenTransferList.pw.tsx_default_with-tx-info-1.png and b/ui/shared/TokenTransfer/__screenshots__/TokenTransferList.pw.tsx_default_with-tx-info-1.png differ
diff --git a/ui/shared/TokenTransfer/__screenshots__/TokenTransferList.pw.tsx_default_without-tx-info-1.png b/ui/shared/TokenTransfer/__screenshots__/TokenTransferList.pw.tsx_default_without-tx-info-1.png
index 76300132d9..ccd697846d 100644
Binary files a/ui/shared/TokenTransfer/__screenshots__/TokenTransferList.pw.tsx_default_without-tx-info-1.png and b/ui/shared/TokenTransfer/__screenshots__/TokenTransferList.pw.tsx_default_without-tx-info-1.png differ
diff --git a/ui/shared/TokenTransfer/__screenshots__/TokenTransferTable.pw.tsx_default_with-tx-info-1.png b/ui/shared/TokenTransfer/__screenshots__/TokenTransferTable.pw.tsx_default_with-tx-info-1.png
index 3848d01acb..22f446a075 100644
Binary files a/ui/shared/TokenTransfer/__screenshots__/TokenTransferTable.pw.tsx_default_with-tx-info-1.png and b/ui/shared/TokenTransfer/__screenshots__/TokenTransferTable.pw.tsx_default_with-tx-info-1.png differ
diff --git a/ui/shared/TokenTransfer/__screenshots__/TokenTransferTable.pw.tsx_default_without-tx-info-1.png b/ui/shared/TokenTransfer/__screenshots__/TokenTransferTable.pw.tsx_default_without-tx-info-1.png
index f4549dc16c..69cf81b1b4 100644
Binary files a/ui/shared/TokenTransfer/__screenshots__/TokenTransferTable.pw.tsx_default_without-tx-info-1.png and b/ui/shared/TokenTransfer/__screenshots__/TokenTransferTable.pw.tsx_default_without-tx-info-1.png differ
diff --git a/ui/shared/Web3ModalProvider.tsx b/ui/shared/Web3ModalProvider.tsx
index 24db96e0f0..9e2af276e0 100644
--- a/ui/shared/Web3ModalProvider.tsx
+++ b/ui/shared/Web3ModalProvider.tsx
@@ -1,83 +1,37 @@
 import { useColorMode } from '@chakra-ui/react';
-import { jsonRpcProvider } from '@wagmi/core/providers/jsonRpc';
-import { createWeb3Modal, useWeb3ModalTheme, defaultWagmiConfig } from '@web3modal/wagmi/react';
+import { createWeb3Modal, useWeb3ModalTheme } from '@web3modal/wagmi/react';
 import React from 'react';
-import type { Chain } from 'wagmi';
-import { configureChains, WagmiConfig } from 'wagmi';
+import { WagmiProvider } from 'wagmi';
 
 import config from 'configs/app';
+import wagmiConfig from 'lib/web3/wagmiConfig';
 import colors from 'theme/foundations/colors';
 import { BODY_TYPEFACE } from 'theme/foundations/typography';
 import zIndices from 'theme/foundations/zIndices';
 
 const feature = config.features.blockchainInteraction;
 
-const getConfig = () => {
+const init = () => {
   try {
-    if (!feature.isEnabled) {
-      throw new Error();
+    if (!wagmiConfig || !feature.isEnabled) {
+      return;
     }
 
-    const currentChain: Chain = {
-      id: Number(config.chain.id),
-      name: config.chain.name || '',
-      network: config.chain.name || '',
-      nativeCurrency: {
-        decimals: config.chain.currency.decimals,
-        name: config.chain.currency.name || '',
-        symbol: config.chain.currency.symbol || '',
-      },
-      rpcUrls: {
-        'public': {
-          http: [ config.chain.rpcUrl || '' ],
-        },
-        'default': {
-          http: [ config.chain.rpcUrl || '' ],
-        },
-      },
-      blockExplorers: {
-        'default': {
-          name: 'Blockscout',
-          url: config.app.baseUrl,
-        },
-      },
-    };
-
-    const { chains } = configureChains(
-      [ currentChain ],
-      [
-        jsonRpcProvider({
-          rpc: () => ({
-            http: config.chain.rpcUrl || '',
-          }),
-        }),
-      ],
-    );
-
-    const wagmiConfig = defaultWagmiConfig({
-      chains,
-      projectId: feature.walletConnect.projectId,
-    });
-
     createWeb3Modal({
       wagmiConfig,
       projectId: feature.walletConnect.projectId,
-      chains,
       themeVariables: {
         '--w3m-font-family': `${ BODY_TYPEFACE }, sans-serif`,
         '--w3m-accent': colors.blue[600],
         '--w3m-border-radius-master': '2px',
         '--w3m-z-index': zIndices.modal,
       },
+      featuredWalletIds: [],
     });
-
-    return { wagmiConfig };
-  } catch (error) {
-    return { };
-  }
+  } catch (error) {}
 };
 
-const { wagmiConfig } = getConfig();
+init();
 
 interface Props {
   children: React.ReactNode;
@@ -102,9 +56,9 @@ const Provider = ({ children, fallback }: Props) => {
   }
 
   return (
-    <WagmiConfig config={ wagmiConfig }>
+    <WagmiProvider config={ wagmiConfig }>
       { children }
-    </WagmiConfig>
+    </WagmiProvider>
   );
 };
 
diff --git a/ui/shared/__screenshots__/NetworkExplorers.pw.tsx_default_base-view-1.png b/ui/shared/__screenshots__/NetworkExplorers.pw.tsx_default_base-view-1.png
new file mode 100644
index 0000000000..fc1e449de6
Binary files /dev/null and b/ui/shared/__screenshots__/NetworkExplorers.pw.tsx_default_base-view-1.png differ
diff --git a/ui/shared/ad/AdBanner.tsx b/ui/shared/ad/AdBanner.tsx
index dd948cdb77..fcad0eedbc 100644
--- a/ui/shared/ad/AdBanner.tsx
+++ b/ui/shared/ad/AdBanner.tsx
@@ -7,23 +7,31 @@ import * as cookies from 'lib/cookies';
 
 import AdbutlerBanner from './AdbutlerBanner';
 import CoinzillaBanner from './CoinzillaBanner';
+import GetitBanner from './GetitBanner';
+import HypeBanner from './HypeBanner';
 import SliseBanner from './SliseBanner';
 
 const feature = config.features.adsBanner;
 
 const AdBanner = ({ className, isLoading }: { className?: string; isLoading?: boolean }) => {
+  const provider = useAppContext().adBannerProvider;
+
   const hasAdblockCookie = cookies.get(cookies.NAMES.ADBLOCK_DETECTED, useAppContext().cookies);
 
-  if (!feature.isEnabled || hasAdblockCookie) {
+  if (!feature.isEnabled || hasAdblockCookie || !provider) {
     return null;
   }
 
   const content = (() => {
-    switch (feature.provider) {
+    switch (provider) {
       case 'adbutler':
         return <AdbutlerBanner/>;
       case 'coinzilla':
         return <CoinzillaBanner/>;
+      case 'getit':
+        return <GetitBanner/>;
+      case 'hype':
+        return <HypeBanner/>;
       case 'slise':
         return <SliseBanner/>;
     }
@@ -34,7 +42,7 @@ const AdBanner = ({ className, isLoading }: { className?: string; isLoading?: bo
       className={ className }
       isLoaded={ !isLoading }
       borderRadius="none"
-      maxW={ feature.provider === 'adbutler' ? feature.adButler.config.desktop.width : '728px' }
+      maxW={ ('adButler' in feature && feature.adButler) ? feature.adButler.config.desktop.width : '728px' }
       w="100%"
     >
       { content }
diff --git a/ui/shared/ad/AdbutlerBanner.tsx b/ui/shared/ad/AdbutlerBanner.tsx
index b6f5f6e6bd..aa6db55ea4 100644
--- a/ui/shared/ad/AdbutlerBanner.tsx
+++ b/ui/shared/ad/AdbutlerBanner.tsx
@@ -13,8 +13,9 @@ const feature = config.features.adsBanner;
 const AdbutlerBanner = ({ className }: { className?: string }) => {
   const router = useRouter();
   const isMobile = useIsMobile();
+
   React.useEffect(() => {
-    if (!feature.isEnabled || feature.provider !== 'adbutler') {
+    if (!('adButler' in feature)) {
       return;
     }
 
diff --git a/ui/shared/ad/GetitBanner.tsx b/ui/shared/ad/GetitBanner.tsx
new file mode 100644
index 0000000000..140a720b3b
--- /dev/null
+++ b/ui/shared/ad/GetitBanner.tsx
@@ -0,0 +1,48 @@
+import { Flex, chakra } from '@chakra-ui/react';
+import dynamic from 'next/dynamic';
+import React from 'react';
+import { useAccount } from 'wagmi';
+
+import useIsMobile from 'lib/hooks/useIsMobile';
+
+import Web3ModalProvider from '../Web3ModalProvider';
+
+const GetitAdPlugin = dynamic(() => import('getit-sdk').then(module => module.GetitAdPlugin), { ssr: false });
+
+const GETIT_API_KEY = 'ZmGXVvwYUAW4yXL8RzWQHNKmpSyQmt3TDXsXUxqFqXPdoaiSSFyca3BOyunDcWdyOwTkX3UVVQel28qbjoOoWPxYVpPdNzbUNkAHyFyJX7Lk9TVcPDZKTQmwHlSMzO3a';
+
+const GetitBannerContent = ({ address, className }: { address?: string; className?: string }) => {
+  const isMobile = Boolean(useIsMobile());
+
+  return (
+    <Flex className={ className } h="90px">
+      <GetitAdPlugin
+        key={ isMobile.toString() }
+        apiKey={ GETIT_API_KEY }
+        walletConnected={ address ? address : '' }
+        isMobile={ isMobile }
+        slotId="0"
+      />
+    </Flex>
+  );
+};
+
+const GetitBannerWithWalletAddress = ({ className }: { className?: string }) => {
+  const { address } = useAccount();
+
+  return <GetitBannerContent address={ address } className={ className }/>;
+};
+
+const GetitBanner = ({ className }: { className?: string }) => {
+  const fallback = React.useCallback(() => {
+    return <GetitBannerContent className={ className }/>;
+  }, [ className ]);
+
+  return (
+    <Web3ModalProvider fallback={ fallback }>
+      <GetitBannerWithWalletAddress className={ className }/>
+    </Web3ModalProvider>
+  );
+};
+
+export default chakra(GetitBanner);
diff --git a/ui/shared/ad/HypeBanner.tsx b/ui/shared/ad/HypeBanner.tsx
new file mode 100644
index 0000000000..7934ddc867
--- /dev/null
+++ b/ui/shared/ad/HypeBanner.tsx
@@ -0,0 +1,55 @@
+import { Flex, chakra } from '@chakra-ui/react';
+import { Banner, setWalletAddresses } from '@hypelab/sdk-react';
+import Script from 'next/script';
+import React from 'react';
+import { useAccount } from 'wagmi';
+
+import Web3ModalProvider from '../Web3ModalProvider';
+import { hypeInit } from './hypeBannerScript';
+
+const DESKTOP_BANNER_SLUG = 'b1559fc3e7';
+const MOBILE_BANNER_SLUG = '668ed80a9e';
+
+const HypeBannerContent = ({ className }: { className?: string }) => {
+
+  return (
+    <>
+      <Script
+        id="hypelab"
+        strategy="afterInteractive"
+      >{ hypeInit }</Script>
+      <Flex className={ className } h="90px" display={{ base: 'none', lg: 'flex' }}>
+        <Banner placement={ DESKTOP_BANNER_SLUG }/>
+      </Flex>
+      <Flex className={ className } h="50px" display={{ base: 'flex', lg: 'none' }}>
+        <Banner placement={ MOBILE_BANNER_SLUG }/>
+      </Flex>
+    </>
+  );
+};
+
+const HypeBannerWithWalletAddress = ({ className }: { className?: string }) => {
+  const { address } = useAccount();
+  React.useEffect(() => {
+    if (address) {
+      setWalletAddresses([ address ]);
+    }
+  }, [ address ]);
+
+  return <HypeBannerContent className={ className }/>;
+};
+
+const HypeBanner = ({ className }: { className?: string }) => {
+
+  const fallback = React.useCallback(() => {
+    return <HypeBannerContent className={ className }/>;
+  }, [ className ]);
+
+  return (
+    <Web3ModalProvider fallback={ fallback }>
+      <HypeBannerWithWalletAddress className={ className }/>
+    </Web3ModalProvider>
+  );
+};
+
+export default chakra(HypeBanner);
diff --git a/ui/shared/ad/adbutlerScript.ts b/ui/shared/ad/adbutlerScript.ts
index 6228a231bf..81b057e679 100644
--- a/ui/shared/ad/adbutlerScript.ts
+++ b/ui/shared/ad/adbutlerScript.ts
@@ -8,7 +8,7 @@ export const connectAdbutler = `if (!window.AdButler){(function(){var s = docume
 export const placeAd = (() => {
   const feature = config.features.adsBanner;
 
-  if (!feature.isEnabled || feature.provider !== 'adbutler') {
+  if (!('adButler' in feature)) {
     return;
   }
 
diff --git a/ui/shared/ad/hypeBannerScript.ts b/ui/shared/ad/hypeBannerScript.ts
new file mode 100644
index 0000000000..bfe0cb10d8
--- /dev/null
+++ b/ui/shared/ad/hypeBannerScript.ts
@@ -0,0 +1,21 @@
+import config from 'configs/app';
+
+const PRODUCTION_PROPERTY_SLUG = '127fddd522';
+const HYPE_API_URL = 'https://api.hypelab.com';
+
+export const hypeInit = (() => {
+  const feature = config.features.adsBanner;
+
+  if (!feature.isEnabled || feature.provider !== 'hype') {
+    return;
+  }
+
+  return `!(function (h, y, p, e, l, a, b) {
+    ((l = document.createElement(h)).async = !0),
+      (l.src = y),
+      (l.onload = function () {
+        (a = { URL: p, propertySlug: e, environment: 'production' }), HypeLab.initialize(a);
+      }),
+      (b = document.getElementsByTagName(h)[0]).parentNode.insertBefore(l, b);
+  })('script', 'https://api.hypelab.com/v1/scripts/hp-sdk.js?v=0', '${ HYPE_API_URL }', '${ PRODUCTION_PROPERTY_SLUG }');`;
+})();
diff --git a/ui/shared/address/AddressAddToWallet.tsx b/ui/shared/address/AddressAddToWallet.tsx
index 144e21101f..7d0274c0e5 100644
--- a/ui/shared/address/AddressAddToWallet.tsx
+++ b/ui/shared/address/AddressAddToWallet.tsx
@@ -96,7 +96,7 @@ const AddressAddToWallet = ({ className, token, isLoading, variant = 'icon', ico
           aria-label="Add token to wallet"
           variant="outline"
           size="sm"
-          px="6px"
+          px={ 1 }
           onClick={ handleClick }
           icon={ <IconSvg name={ WALLETS_INFO[wallet].icon } boxSize={ 6 }/> }
           flexShrink={ 0 }
diff --git a/ui/shared/address/AddressFromTo.pw.tsx b/ui/shared/address/AddressFromTo.pw.tsx
new file mode 100644
index 0000000000..78124f3cd1
--- /dev/null
+++ b/ui/shared/address/AddressFromTo.pw.tsx
@@ -0,0 +1,62 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import * as addressMock from 'mocks/address/address';
+import TestApp from 'playwright/TestApp';
+import * as configs from 'playwright/utils/configs';
+
+import AddressFromTo from './AddressFromTo';
+
+test.use({ viewport: configs.viewport.mobile });
+
+test('outgoing txn', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <AddressFromTo
+        from={ addressMock.withoutName }
+        to={{ ...addressMock.withName, hash: '0xa8FCe579a11E551635b9c9CB915BEcd873C51254' }}
+        current={ addressMock.withoutName.hash }
+      />
+    </TestApp>,
+  );
+  await expect(component).toHaveScreenshot();
+});
+
+test('incoming txn', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <AddressFromTo
+        from={{ ...addressMock.withName, hash: '0xa8FCe579a11E551635b9c9CB915BEcd873C51254' }}
+        to={ addressMock.withoutName }
+        current={ addressMock.withoutName.hash }
+      />
+    </TestApp>,
+  );
+  await expect(component).toHaveScreenshot();
+});
+
+test('compact mode', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <AddressFromTo
+        from={ addressMock.withoutName }
+        to={{ ...addressMock.withName, hash: '0xa8FCe579a11E551635b9c9CB915BEcd873C51254' }}
+        mode="compact"
+      />
+    </TestApp>,
+  );
+  await expect(component).toHaveScreenshot();
+});
+
+test('loading state', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <AddressFromTo
+        from={ addressMock.withoutName }
+        to={{ ...addressMock.withName, hash: '0xa8FCe579a11E551635b9c9CB915BEcd873C51254' }}
+        isLoading
+      />
+    </TestApp>,
+  );
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/shared/address/AddressFromTo.tsx b/ui/shared/address/AddressFromTo.tsx
new file mode 100644
index 0000000000..5024c657da
--- /dev/null
+++ b/ui/shared/address/AddressFromTo.tsx
@@ -0,0 +1,114 @@
+import type { ThemeTypings } from '@chakra-ui/react';
+import { Flex, Grid, chakra, useBreakpointValue } from '@chakra-ui/react';
+import React from 'react';
+
+import type { AddressParam } from 'types/api/addressParams';
+
+import type { EntityProps } from 'ui/shared/entities/address/AddressEntity';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import AddressEntityWithTokenFilter from 'ui/shared/entities/address/AddressEntityWithTokenFilter';
+
+import AddressFromToIcon from './AddressFromToIcon';
+import { getTxCourseType } from './utils';
+
+type Mode = 'compact' | 'long';
+
+interface Props {
+  from: AddressParam;
+  to: AddressParam | null;
+  current?: string;
+  mode?: Mode | Partial<Record<ThemeTypings['breakpoints'], Mode>>;
+  className?: string;
+  isLoading?: boolean;
+  tokenHash?: string;
+  truncation?: EntityProps['truncation'];
+  noIcon?: boolean;
+}
+
+const AddressFromTo = ({ from, to, current, mode: modeProp, className, isLoading, tokenHash = '', noIcon }: Props) => {
+  const mode = useBreakpointValue(
+    {
+      base: (typeof modeProp === 'object' ? modeProp.base : modeProp),
+      lg: (typeof modeProp === 'object' ? modeProp.lg : modeProp),
+      xl: (typeof modeProp === 'object' ? modeProp.xl : modeProp),
+    },
+  ) ?? 'long';
+
+  const Entity = tokenHash ? AddressEntityWithTokenFilter : AddressEntity;
+
+  if (mode === 'compact') {
+    return (
+      <Flex className={ className } flexDir="column" rowGap={ 3 }>
+        <Flex alignItems="center" columnGap={ 2 }>
+          <AddressFromToIcon
+            isLoading={ isLoading }
+            type={ getTxCourseType(from.hash, to?.hash, current) }
+            transform="rotate(90deg)"
+          />
+          <Entity
+            address={ from }
+            isLoading={ isLoading }
+            noLink={ current === from.hash }
+            noCopy={ current === from.hash }
+            noIcon={ noIcon }
+            tokenHash={ tokenHash }
+            truncation="constant"
+            maxW="calc(100% - 28px)"
+            w="min-content"
+
+          />
+        </Flex>
+        { to && (
+          <Entity
+            address={ to }
+            isLoading={ isLoading }
+            noLink={ current === to.hash }
+            noCopy={ current === to.hash }
+            noIcon={ noIcon }
+            tokenHash={ tokenHash }
+            truncation="constant"
+            maxW="calc(100% - 28px)"
+            w="min-content"
+            ml="28px"
+          />
+        ) }
+      </Flex>
+    );
+  }
+
+  const isOutgoing = current === from.hash;
+  const iconSize = 20;
+
+  return (
+    <Grid className={ className } alignItems="center" gridTemplateColumns={ `fit-content(100%) ${ iconSize }px fit-content(100%)` }>
+      <Entity
+        address={ from }
+        isLoading={ isLoading }
+        noLink={ isOutgoing }
+        noCopy={ isOutgoing }
+        noIcon={ noIcon }
+        tokenHash={ tokenHash }
+        truncation="constant"
+        mr={ isOutgoing ? 4 : 2 }
+      />
+      <AddressFromToIcon
+        isLoading={ isLoading }
+        type={ getTxCourseType(from.hash, to?.hash, current) }
+      />
+      { to && (
+        <Entity
+          address={ to }
+          isLoading={ isLoading }
+          noLink={ current === to.hash }
+          noCopy={ current === to.hash }
+          noIcon={ noIcon }
+          tokenHash={ tokenHash }
+          truncation="constant"
+          ml={ 3 }
+        />
+      ) }
+    </Grid>
+  );
+};
+
+export default chakra(AddressFromTo);
diff --git a/ui/shared/address/AddressFromToIcon.pw.tsx b/ui/shared/address/AddressFromToIcon.pw.tsx
new file mode 100644
index 0000000000..e65b55479e
--- /dev/null
+++ b/ui/shared/address/AddressFromToIcon.pw.tsx
@@ -0,0 +1,22 @@
+import { Box } from '@chakra-ui/react';
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import TestApp from 'playwright/TestApp';
+
+import AddressFromToIcon from './AddressFromToIcon';
+
+test.use({ viewport: { width: 36, height: 36 } });
+
+[ 'in', 'out', 'self', 'unspecified' ].forEach((type) => {
+  test(`${ type } txn type +@dark-mode`, async({ mount }) => {
+    const component = await mount(
+      <TestApp>
+        <Box p={ 2 }>
+          <AddressFromToIcon type={ type }/>
+        </Box>
+      </TestApp>,
+    );
+    await expect(component).toHaveScreenshot();
+  });
+});
diff --git a/ui/shared/address/AddressFromToIcon.tsx b/ui/shared/address/AddressFromToIcon.tsx
new file mode 100644
index 0000000000..de7059696f
--- /dev/null
+++ b/ui/shared/address/AddressFromToIcon.tsx
@@ -0,0 +1,62 @@
+import { Tooltip, chakra, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import IconSvg from 'ui/shared/IconSvg';
+
+import type { TxCourseType } from './utils';
+
+interface Props {
+  isLoading?: boolean;
+  type: TxCourseType;
+  className?: string;
+}
+
+const AddressFromToIcon = ({ isLoading, type, className }: Props) => {
+  const styles = {
+    'in': {
+      color: useColorModeValue('green.500', 'green.200'),
+      bgColor: useColorModeValue('green.50', 'green.800'),
+    },
+    out: {
+      color: useColorModeValue('yellow.600', 'yellow.500'),
+      bgColor: useColorModeValue('orange.50', 'yellow.900'),
+    },
+    self: {
+      color: useColorModeValue('blackAlpha.400', 'whiteAlpha.400'),
+      bgColor: useColorModeValue('blackAlpha.50', 'whiteAlpha.50'),
+    },
+    unspecified: {
+      color: useColorModeValue('gray.500', 'gray.300'),
+      bgColor: 'transparent',
+    },
+  };
+  const labels = {
+    'in': 'Incoming txn',
+    out: 'Outgoing txn',
+    self: 'Txn to the same address',
+  };
+
+  const icon = (
+    <IconSvg
+      name="arrows/east"
+      { ...(styles[type]) }
+      className={ className }
+      isLoading={ isLoading }
+      boxSize={ 5 }
+      flexShrink={ 0 }
+      borderRadius="sm"
+    />
+  );
+
+  if (type === 'unspecified') {
+    return icon;
+  }
+
+  return (
+    <Tooltip label={ labels[type] }>
+      { icon }
+    </Tooltip>
+  );
+};
+
+export default React.memo(chakra(AddressFromToIcon));
diff --git a/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_compact-mode-1.png b/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_compact-mode-1.png
new file mode 100644
index 0000000000..0477a4c429
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_compact-mode-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_incoming-txn-1.png b/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_incoming-txn-1.png
new file mode 100644
index 0000000000..acf83e4934
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_incoming-txn-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_loading-state-1.png b/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_loading-state-1.png
new file mode 100644
index 0000000000..5f560ebcbf
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_loading-state-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_outgoing-txn-1.png b/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_outgoing-txn-1.png
new file mode 100644
index 0000000000..34617540c2
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromTo.pw.tsx_default_outgoing-txn-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_in-txn-type-dark-mode-1.png b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_in-txn-type-dark-mode-1.png
new file mode 100644
index 0000000000..68968da31c
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_in-txn-type-dark-mode-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_out-txn-type-dark-mode-1.png b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_out-txn-type-dark-mode-1.png
new file mode 100644
index 0000000000..b711beedce
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_out-txn-type-dark-mode-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_self-txn-type-dark-mode-1.png b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_self-txn-type-dark-mode-1.png
new file mode 100644
index 0000000000..c5936f647f
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_self-txn-type-dark-mode-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_unspecified-txn-type-dark-mode-1.png b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_unspecified-txn-type-dark-mode-1.png
new file mode 100644
index 0000000000..78bfd3a44c
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_dark-color-mode_unspecified-txn-type-dark-mode-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_in-txn-type-dark-mode-1.png b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_in-txn-type-dark-mode-1.png
new file mode 100644
index 0000000000..c5b874fc96
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_in-txn-type-dark-mode-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_out-txn-type-dark-mode-1.png b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_out-txn-type-dark-mode-1.png
new file mode 100644
index 0000000000..a871127c88
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_out-txn-type-dark-mode-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_self-txn-type-dark-mode-1.png b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_self-txn-type-dark-mode-1.png
new file mode 100644
index 0000000000..dcc281e8b5
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_self-txn-type-dark-mode-1.png differ
diff --git a/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_unspecified-txn-type-dark-mode-1.png b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_unspecified-txn-type-dark-mode-1.png
new file mode 100644
index 0000000000..1498f7dec8
Binary files /dev/null and b/ui/shared/address/__screenshots__/AddressFromToIcon.pw.tsx_default_unspecified-txn-type-dark-mode-1.png differ
diff --git a/ui/shared/address/utils.ts b/ui/shared/address/utils.ts
new file mode 100644
index 0000000000..0e760aa9ed
--- /dev/null
+++ b/ui/shared/address/utils.ts
@@ -0,0 +1,34 @@
+import type { AddressParam } from 'types/api/addressParams';
+
+export type TxCourseType = 'in' | 'out' | 'self' | 'unspecified';
+
+export function getTxCourseType(from: string, to: string | undefined, current?: string): TxCourseType {
+  if (current === undefined) {
+    return 'unspecified';
+  }
+
+  if (to && from === to && from === current) {
+    return 'self';
+  }
+
+  if (from === current) {
+    return 'out';
+  }
+
+  if (to && to === current) {
+    return 'in';
+  }
+
+  return 'unspecified';
+}
+
+export const unknownAddress: Omit<AddressParam, 'hash'> = {
+  is_contract: false,
+  is_verified: false,
+  implementation_name: '',
+  name: '',
+  private_tags: [],
+  public_tags: [],
+  watchlist_names: [],
+  ens_domain_name: null,
+};
diff --git a/ui/shared/alerts/ServiceDegradationWarning.tsx b/ui/shared/alerts/ServiceDegradationWarning.tsx
new file mode 100644
index 0000000000..2e9911b8c4
--- /dev/null
+++ b/ui/shared/alerts/ServiceDegradationWarning.tsx
@@ -0,0 +1,20 @@
+import { Alert, Skeleton, Spinner, chakra } from '@chakra-ui/react';
+import React from 'react';
+
+interface Props {
+  isLoading?: boolean;
+  className?: string;
+}
+
+const ServiceDegradationWarning = ({ isLoading, className }: Props) => {
+  return (
+    <Skeleton className={ className } isLoaded={ !isLoading }>
+      <Alert status="warning" colorScheme="gray" alignItems={{ base: 'flex-start', lg: 'center' }}>
+        <Spinner size="sm" mr={ 2 } my={{ base: '3px', lg: 0 }} flexShrink={ 0 }/>
+        Data sync in progress... page will refresh automatically once transaction data is available
+      </Alert>
+    </Skeleton>
+  );
+};
+
+export default React.memo(chakra(ServiceDegradationWarning));
diff --git a/ui/shared/alerts/TestnetWarning.tsx b/ui/shared/alerts/TestnetWarning.tsx
new file mode 100644
index 0000000000..efec49a218
--- /dev/null
+++ b/ui/shared/alerts/TestnetWarning.tsx
@@ -0,0 +1,23 @@
+import { Alert, Skeleton, chakra } from '@chakra-ui/react';
+import React from 'react';
+
+import config from 'configs/app';
+
+interface Props {
+  isLoading?: boolean;
+  className?: string;
+}
+
+const TestnetWarning = ({ isLoading, className }: Props) => {
+  if (!config.chain.isTestnet) {
+    return null;
+  }
+
+  return (
+    <Skeleton className={ className } isLoaded={ !isLoading }>
+      <Alert status="warning">This is a testnet transaction only</Alert>
+    </Skeleton>
+  );
+};
+
+export default React.memo(chakra(TestnetWarning));
diff --git a/ui/shared/blob/BlobDataType.pw.tsx b/ui/shared/blob/BlobDataType.pw.tsx
new file mode 100644
index 0000000000..a5e5e18018
--- /dev/null
+++ b/ui/shared/blob/BlobDataType.pw.tsx
@@ -0,0 +1,35 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import TestApp from 'playwright/TestApp';
+
+import BlobDataType from './BlobDataType';
+
+test.use({ viewport: { width: 100, height: 50 } });
+
+test('image data', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <BlobDataType data="0x89504E470D0A1A0A0000000D494844520000003C0000003C0403"/>
+    </TestApp>,
+  );
+  await expect(component).toHaveScreenshot();
+});
+
+test('raw data', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <BlobDataType data="0x010203040506"/>
+    </TestApp>,
+  );
+  await expect(component).toHaveScreenshot();
+});
+
+test('text data', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <BlobDataType data="0x7b226e616d65223a22706963732f"/>
+    </TestApp>,
+  );
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/shared/blob/BlobDataType.tsx b/ui/shared/blob/BlobDataType.tsx
new file mode 100644
index 0000000000..7da87113f6
--- /dev/null
+++ b/ui/shared/blob/BlobDataType.tsx
@@ -0,0 +1,56 @@
+import { Flex, Skeleton, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import * as blobUtils from 'lib/blob';
+import type { IconName } from 'ui/shared/IconSvg';
+import IconSvg from 'ui/shared/IconSvg';
+
+interface Props {
+  data: string;
+  isLoading?: boolean;
+}
+
+const TYPES: Record<string, { iconName: IconName; label: string}> = {
+  image: { iconName: 'blobs/image', label: 'Image' },
+  text: { iconName: 'blobs/text', label: 'Text' },
+  raw: { iconName: 'blobs/raw', label: 'Raw' },
+};
+
+const BlobDataType = ({ data, isLoading }: Props) => {
+  const iconColor = useColorModeValue('gray.500', 'gray.400');
+
+  const guessedType = React.useMemo(() => {
+    if (isLoading) {
+      return;
+    }
+    return blobUtils.guessDataType(data);
+  }, [ data, isLoading ]);
+
+  const { iconName, label } = (() => {
+    if (guessedType?.mime?.startsWith('image/')) {
+      return TYPES.image;
+    }
+
+    if (
+      guessedType?.mime?.startsWith('text/') ||
+      [
+        'application/json',
+        'application/xml',
+        'application/javascript',
+      ].includes(guessedType?.mime || '')
+    ) {
+      return TYPES.text;
+    }
+
+    return TYPES.raw;
+  })();
+
+  return (
+    <Flex alignItems="center" columnGap={ 2 }>
+      <IconSvg name={ iconName } boxSize={ 5 } color={ iconColor } isLoading={ isLoading }/>
+      <Skeleton isLoaded={ !isLoading }>{ label }</Skeleton>
+    </Flex>
+  );
+};
+
+export default React.memo(BlobDataType);
diff --git a/ui/shared/blob/__screenshots__/BlobDataType.pw.tsx_default_image-data-1.png b/ui/shared/blob/__screenshots__/BlobDataType.pw.tsx_default_image-data-1.png
new file mode 100644
index 0000000000..cd00441544
Binary files /dev/null and b/ui/shared/blob/__screenshots__/BlobDataType.pw.tsx_default_image-data-1.png differ
diff --git a/ui/shared/blob/__screenshots__/BlobDataType.pw.tsx_default_raw-data-1.png b/ui/shared/blob/__screenshots__/BlobDataType.pw.tsx_default_raw-data-1.png
new file mode 100644
index 0000000000..9f2de76f10
Binary files /dev/null and b/ui/shared/blob/__screenshots__/BlobDataType.pw.tsx_default_raw-data-1.png differ
diff --git a/ui/shared/blob/__screenshots__/BlobDataType.pw.tsx_default_text-data-1.png b/ui/shared/blob/__screenshots__/BlobDataType.pw.tsx_default_text-data-1.png
new file mode 100644
index 0000000000..fef618ba13
Binary files /dev/null and b/ui/shared/blob/__screenshots__/BlobDataType.pw.tsx_default_text-data-1.png differ
diff --git a/ui/shared/chart/ChartTooltip.tsx b/ui/shared/chart/ChartTooltip.tsx
index 88fcafa68a..e257b5a519 100644
--- a/ui/shared/chart/ChartTooltip.tsx
+++ b/ui/shared/chart/ChartTooltip.tsx
@@ -82,7 +82,7 @@ const ChartTooltip = ({ xScale, yScale, width, tooltipWidth = 200, height, data,
       .selectAll<Element, TimeChartData>('.ChartTooltip__value')
       .filter((td, tIndex) => tIndex === i)
       .text(
-        (data[i].valueFormatter?.(d.value) || d.value.toLocaleString()) +
+        (data[i].valueFormatter?.(d.value) || d.value.toLocaleString(undefined, { minimumSignificantDigits: 1 })) +
         (data[i].units ? ` ${ data[i].units }` : ''),
       )
       .nodes();
diff --git a/ui/shared/chart/ChartWidget.pw.tsx b/ui/shared/chart/ChartWidget.pw.tsx
index 4e337a6fd3..4100c69801 100644
--- a/ui/shared/chart/ChartWidget.pw.tsx
+++ b/ui/shared/chart/ChartWidget.pw.tsx
@@ -73,3 +73,61 @@ test('error', async({ mount }) => {
 
   await expect(component).toHaveScreenshot();
 });
+
+test('small values', async({ mount, page }) => {
+  const modifiedProps = {
+    ...props,
+    items: [
+      { date: new Date('2023-02-13'), value: 0.000005041012112611958 },
+      { date: new Date('2023-02-14'), value: 0.000004781545670577531 },
+      { date: new Date('2023-02-15'), value: 0.00000520510604212437 },
+      { date: new Date('2023-02-16'), value: 0.000005274901030625893 },
+      { date: new Date('2023-02-17'), value: 0.00000534325322320271 },
+      { date: new Date('2023-02-18'), value: 0.00000579140116207668 },
+      { date: new Date('2023-02-19'), value: 0.000004878307079043056 },
+      { date: new Date('2023-02-20'), value: 0.0000053454186920910215 },
+      { date: new Date('2023-02-21'), value: 0.000005770588532081243 },
+      { date: new Date('2023-02-22'), value: 0.00000589334810122426 },
+      { date: new Date('2023-02-23'), value: 0.00000547040196358741 },
+    ],
+  };
+
+  const component = await mount(
+    <TestApp>
+      <ChartWidget { ...modifiedProps }/>
+    </TestApp>,
+  );
+  await page.waitForFunction(() => {
+    return document.querySelector('path[data-name="chart-Nativecoincirculatingsupply-small"]')?.getAttribute('opacity') === '1';
+  });
+  await expect(component).toHaveScreenshot();
+});
+
+test('small variations in big values', async({ mount, page }) => {
+  const modifiedProps = {
+    ...props,
+    items: [
+      { date: new Date('2023-02-13'), value: 8886203 },
+      { date: new Date('2023-02-14'), value: 8890184 },
+      { date: new Date('2023-02-15'), value: 8893483 },
+      { date: new Date('2023-02-16'), value: 8897924 },
+      { date: new Date('2023-02-17'), value: 8902268 },
+      { date: new Date('2023-02-18'), value: 8906320 },
+      { date: new Date('2023-02-19'), value: 8910264 },
+      { date: new Date('2023-02-20'), value: 8914827 },
+      { date: new Date('2023-02-21'), value: 8918592 },
+      { date: new Date('2023-02-22'), value: 8921988 },
+      { date: new Date('2023-02-23'), value: 8922206 },
+    ],
+  };
+
+  const component = await mount(
+    <TestApp>
+      <ChartWidget { ...modifiedProps }/>
+    </TestApp>,
+  );
+  await page.waitForFunction(() => {
+    return document.querySelector('path[data-name="chart-Nativecoincirculatingsupply-small"]')?.getAttribute('opacity') === '1';
+  });
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/shared/chart/ChartWidget.tsx b/ui/shared/chart/ChartWidget.tsx
index b613b8f7a4..86cc601221 100644
--- a/ui/shared/chart/ChartWidget.tsx
+++ b/ui/shared/chart/ChartWidget.tsx
@@ -207,7 +207,7 @@ const ChartWidget = ({ items, title, description, isLoading, className, isError,
                   <MenuButton
                     w="36px"
                     h="32px"
-                    icon={ <IconSvg name="vertical_dots" w={ 4 } h={ 4 }/> }
+                    icon={ <IconSvg name="dots" boxSize={ 4 } transform="rotate(-90deg)"/> }
                     colorScheme="gray"
                     variant="ghost"
                     as={ IconButton }
diff --git a/ui/shared/chart/ChartWidgetGraph.tsx b/ui/shared/chart/ChartWidgetGraph.tsx
index 92e1a04f26..7dbce5bb55 100644
--- a/ui/shared/chart/ChartWidgetGraph.tsx
+++ b/ui/shared/chart/ChartWidgetGraph.tsx
@@ -2,7 +2,7 @@ import { useToken } from '@chakra-ui/react';
 import * as d3 from 'd3';
 import React from 'react';
 
-import type { ChartMargin, TimeChartItem } from 'ui/shared/chart/types';
+import type { ChartMargin, TimeChartData, TimeChartItem } from 'ui/shared/chart/types';
 
 import dayjs from 'lib/date/dayjs';
 import useIsMobile from 'lib/hooks/useIsMobile';
@@ -27,7 +27,7 @@ interface Props {
 
 // temporarily turn off the data aggregation, we need a better algorithm for that
 const MAX_SHOW_ITEMS = 100_000_000_000;
-const DEFAULT_CHART_MARGIN = { bottom: 20, left: 40, right: 20, top: 10 };
+const DEFAULT_CHART_MARGIN = { bottom: 20, left: 10, right: 20, top: 10 };
 
 const ChartWidgetGraph = ({ isEnlarged, items, onZoom, isZoomResetInitial, title, margin: marginProps, units }: Props) => {
   const isMobile = useIsMobile();
@@ -51,7 +51,7 @@ const ChartWidgetGraph = ({ isEnlarged, items, onZoom, isZoomResetInitial, title
     }
   }, [ isGroupedValues, rangedItems ]);
 
-  const chartData = React.useMemo(() => ([ { items: displayedData, name: 'Value', color, units } ]), [ color, displayedData, units ]);
+  const chartData: TimeChartData = React.useMemo(() => ([ { items: displayedData, name: 'Value', color, units } ]), [ color, displayedData, units ]);
 
   const margin: ChartMargin = React.useMemo(() => ({ ...DEFAULT_CHART_MARGIN, ...marginProps }), [ marginProps ]);
   const axesConfig = React.useMemo(() => {
@@ -72,7 +72,7 @@ const ChartWidgetGraph = ({ isEnlarged, items, onZoom, isZoomResetInitial, title
     innerWidth,
     innerHeight,
     chartMargin,
-    axis,
+    axes,
   } = useTimeChartController({
     data: chartData,
     margin,
@@ -96,7 +96,7 @@ const ChartWidgetGraph = ({ isEnlarged, items, onZoom, isZoomResetInitial, title
       <g transform={ `translate(${ chartMargin?.left || 0 },${ chartMargin?.top || 0 })` }>
         <ChartGridLine
           type="horizontal"
-          scale={ axis.y.scale }
+          scale={ axes.y.scale }
           ticks={ axesConfig.y.ticks }
           size={ innerWidth }
           disableAnimation
@@ -106,14 +106,14 @@ const ChartWidgetGraph = ({ isEnlarged, items, onZoom, isZoomResetInitial, title
           id={ chartId }
           data={ displayedData }
           color={ color }
-          xScale={ axis.x.scale }
-          yScale={ axis.y.scale }
+          xScale={ axes.x.scale }
+          yScale={ axes.y.scale }
         />
 
         <ChartLine
           data={ displayedData }
-          xScale={ axis.x.scale }
-          yScale={ axis.y.scale }
+          xScale={ axes.x.scale }
+          yScale={ axes.y.scale }
           stroke={ color }
           animation="none"
           strokeWidth={ isMobile ? 1 : 2 }
@@ -121,19 +121,19 @@ const ChartWidgetGraph = ({ isEnlarged, items, onZoom, isZoomResetInitial, title
 
         <ChartAxis
           type="left"
-          scale={ axis.y.scale }
+          scale={ axes.y.scale }
           ticks={ axesConfig.y.ticks }
-          tickFormatGenerator={ axis.y.tickFormatter }
+          tickFormatGenerator={ axes.y.tickFormatter }
           disableAnimation
         />
 
         <ChartAxis
           type="bottom"
-          scale={ axis.x.scale }
+          scale={ axes.x.scale }
           transform={ `translate(0, ${ innerHeight })` }
           ticks={ axesConfig.x.ticks }
           anchorEl={ overlayRef.current }
-          tickFormatGenerator={ axis.x.tickFormatter }
+          tickFormatGenerator={ axes.x.tickFormatter }
           disableAnimation
         />
 
@@ -143,15 +143,15 @@ const ChartWidgetGraph = ({ isEnlarged, items, onZoom, isZoomResetInitial, title
             width={ innerWidth }
             tooltipWidth={ isGroupedValues ? 280 : 200 }
             height={ innerHeight }
-            xScale={ axis.x.scale }
-            yScale={ axis.y.scale }
+            xScale={ axes.x.scale }
+            yScale={ axes.y.scale }
             data={ chartData }
           />
 
           <ChartSelectionX
             anchorEl={ overlayRef.current }
             height={ innerHeight }
-            scale={ axis.x.scale }
+            scale={ axes.x.scale }
             data={ chartData }
             onSelect={ handleRangeSelect }
           />
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-1.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-1.png
index 72eb0eca07..013a49d77f 100644
Binary files a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-1.png and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-1.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-2.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-2.png
index e57274b035..352f445cd7 100644
Binary files a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-2.png and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-2.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-3.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-3.png
index 00e777d37d..9213849dad 100644
Binary files a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-3.png and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-3.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-4.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-4.png
index 3ce1a88ad4..f393e68904 100644
Binary files a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-4.png and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_dark-color-mode_base-view-dark-mode-4.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-1.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-1.png
index 808d2a135f..ecc5aaa91a 100644
Binary files a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-1.png and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-1.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-2.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-2.png
index 79846d3704..83d2fa2285 100644
Binary files a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-2.png and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-2.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-3.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-3.png
index 513d3ffa65..70301aa83e 100644
Binary files a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-3.png and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-3.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-4.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-4.png
index 2efba0462f..df1055b271 100644
Binary files a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-4.png and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_base-view-dark-mode-4.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_error-1.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_error-1.png
index 5591930eb1..e054536499 100644
Binary files a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_error-1.png and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_error-1.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_small-values-1.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_small-values-1.png
new file mode 100644
index 0000000000..90244d1fdf
Binary files /dev/null and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_small-values-1.png differ
diff --git a/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_small-variations-in-big-values-1.png b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_small-variations-in-big-values-1.png
new file mode 100644
index 0000000000..a522c08ed7
Binary files /dev/null and b/ui/shared/chart/__screenshots__/ChartWidget.pw.tsx_default_small-variations-in-big-values-1.png differ
diff --git a/ui/shared/chart/types.tsx b/ui/shared/chart/types.tsx
index 80a023aa51..5810fe2fb5 100644
--- a/ui/shared/chart/types.tsx
+++ b/ui/shared/chart/types.tsx
@@ -1,3 +1,9 @@
+export interface TimeChartItemRaw {
+  date: Date;
+  dateLabel?: string;
+  value: number | string | null;
+}
+
 export interface TimeChartItem {
   date: Date;
   dateLabel?: string;
@@ -29,6 +35,7 @@ export type TimeChartData = Array<TimeChartDataItem>;
 export interface AxisConfig {
   ticks?: number;
   nice?: boolean;
+  noLabel?: boolean;
 }
 
 export interface AxesConfig {
diff --git a/ui/shared/chart/useTimeChartController.tsx b/ui/shared/chart/useTimeChartController.tsx
index a180f96831..763fa6559c 100644
--- a/ui/shared/chart/useTimeChartController.tsx
+++ b/ui/shared/chart/useTimeChartController.tsx
@@ -5,7 +5,7 @@ import type { AxesConfig, ChartMargin, TimeChartData } from 'ui/shared/chart/typ
 import useClientRect from 'lib/hooks/useClientRect';
 
 import calculateInnerSize from './utils/calculateInnerSize';
-import { getAxisParams, DEFAULT_MAXIMUM_SIGNIFICANT_DIGITS } from './utils/timeChartAxis';
+import { getAxesParams } from './utils/timeChartAxis';
 
 interface Props {
   data: TimeChartData;
@@ -19,29 +19,27 @@ export default function useTimeChartController({ data, margin, axesConfig }: Pro
 
   // we need to recalculate the axis scale whenever the rect width changes
   // eslint-disable-next-line react-hooks/exhaustive-deps
-  const axisParams = React.useMemo(() => getAxisParams(data, axesConfig), [ data, axesConfig, rect?.width ]);
+  const axesParams = React.useMemo(() => getAxesParams(data, axesConfig), [ data, axesConfig, rect?.width ]);
 
   const chartMargin = React.useMemo(() => {
-    const exceedingDigits = (axisParams.y.labelFormatParams.maximumSignificantDigits ?? DEFAULT_MAXIMUM_SIGNIFICANT_DIGITS) -
-       DEFAULT_MAXIMUM_SIGNIFICANT_DIGITS;
-    const PIXELS_PER_DIGIT = 7;
-    const leftShift = PIXELS_PER_DIGIT * exceedingDigits;
+    const PIXELS_PER_DIGIT = 8;
+    const leftShift = axesConfig?.y?.noLabel ? 0 : PIXELS_PER_DIGIT * axesParams.y.labelFormatParams.maxLabelLength;
 
     return {
       ...margin,
       left: (margin?.left ?? 0) + leftShift,
     };
-  }, [ axisParams.y.labelFormatParams.maximumSignificantDigits, margin ]);
+  }, [ axesParams.y.labelFormatParams.maxLabelLength, margin, axesConfig?.y?.noLabel ]);
 
   const { innerWidth, innerHeight } = calculateInnerSize(rect, chartMargin);
 
   const xScale = React.useMemo(() => {
-    return axisParams.x.scale.range([ 0, innerWidth ]);
-  }, [ axisParams.x.scale, innerWidth ]);
+    return axesParams.x.scale.range([ 0, innerWidth ]);
+  }, [ axesParams.x.scale, innerWidth ]);
 
   const yScale = React.useMemo(() => {
-    return axisParams.y.scale.range([ innerHeight, 0 ]);
-  }, [ axisParams.y.scale, innerHeight ]);
+    return axesParams.y.scale.range([ innerHeight, 0 ]);
+  }, [ axesParams.y.scale, innerHeight ]);
 
   return React.useMemo(() => {
     return {
@@ -50,16 +48,16 @@ export default function useTimeChartController({ data, margin, axesConfig }: Pro
       chartMargin,
       innerWidth,
       innerHeight,
-      axis: {
+      axes: {
         x: {
-          tickFormatter: axisParams.x.tickFormatter,
+          tickFormatter: axesParams.x.tickFormatter,
           scale: xScale,
         },
         y: {
-          tickFormatter: axisParams.y.tickFormatter,
+          tickFormatter: axesParams.y.tickFormatter,
           scale: yScale,
         },
       },
     };
-  }, [ axisParams.x.tickFormatter, axisParams.y.tickFormatter, chartMargin, innerHeight, innerWidth, rect, ref, xScale, yScale ]);
+  }, [ axesParams.x.tickFormatter, axesParams.y.tickFormatter, chartMargin, innerHeight, innerWidth, rect, ref, xScale, yScale ]);
 }
diff --git a/ui/shared/chart/utils/sorts.tsx b/ui/shared/chart/utils/sorts.tsx
index 521825398b..da290c0ce2 100644
--- a/ui/shared/chart/utils/sorts.tsx
+++ b/ui/shared/chart/utils/sorts.tsx
@@ -1,5 +1,5 @@
 import type { TimeChartItem } from '../types';
 
-export const sortByDateDesc = (a: TimeChartItem, b: TimeChartItem) => {
+export const sortByDateDesc = (a: Pick<TimeChartItem, 'date'>, b: Pick<TimeChartItem, 'date'>) => {
   return a.date.getTime() - b.date.getTime();
 };
diff --git a/ui/shared/chart/utils/timeChartAxis.ts b/ui/shared/chart/utils/timeChartAxis.ts
index c9053fa18d..faeea97378 100644
--- a/ui/shared/chart/utils/timeChartAxis.ts
+++ b/ui/shared/chart/utils/timeChartAxis.ts
@@ -1,4 +1,5 @@
 import * as d3 from 'd3';
+import _maxBy from 'lodash/maxBy';
 import _unique from 'lodash/uniq';
 
 import type { AxesConfig, AxisConfig, TimeChartData } from '../types';
@@ -8,8 +9,15 @@ import { WEEK, MONTH, YEAR } from 'lib/consts';
 export const DEFAULT_MAXIMUM_SIGNIFICANT_DIGITS = 2;
 export const DEFAULT_MAXIMUM_FRACTION_DIGITS = 3;
 export const MAXIMUM_SIGNIFICANT_DIGITS_LIMIT = 8;
+export const DEFAULT_LABEL_LENGTH = 5;
 
-export function getAxisParams(data: TimeChartData, axesConfig?: AxesConfig) {
+export interface LabelFormatParams extends Intl.NumberFormatOptions {
+  maxLabelLength: number;
+}
+
+type Data = TimeChartData;
+
+export function getAxesParams(data: Data, axesConfig?: AxesConfig) {
   const { labelFormatParams: labelFormatParamsY, scale: yScale } = getAxisParamsY(data, axesConfig?.y);
 
   return {
@@ -25,7 +33,7 @@ export function getAxisParams(data: TimeChartData, axesConfig?: AxesConfig) {
   };
 }
 
-function getAxisParamsX(data: TimeChartData) {
+function getAxisParamsX(data: Data) {
   const min = d3.min(data, ({ items }) => d3.min(items, ({ date }) => date)) ?? new Date();
   const max = d3.max(data, ({ items }) => d3.max(items, ({ date }) => date)) ?? new Date();
   const scale = d3.scaleTime().domain([ min, max ]);
@@ -53,7 +61,7 @@ const tickFormatterX = (axis: d3.Axis<d3.NumberValue>) => (d: d3.AxisDomain) =>
   return format(d as Date);
 };
 
-function getAxisParamsY(data: TimeChartData, config?: AxisConfig) {
+function getAxisParamsY(data: Data, config?: AxisConfig) {
   const DEFAULT_TICKS_NUM = 3;
   const min = d3.min(data, ({ items }) => d3.min(items, ({ value }) => value)) ?? 0;
   const max = d3.max(data, ({ items }) => d3.max(items, ({ value }) => value)) ?? 0;
@@ -72,27 +80,21 @@ function getAxisParamsY(data: TimeChartData, config?: AxisConfig) {
 
 const getTickFormatterY = (params: Intl.NumberFormatOptions) => () => (d: d3.AxisDomain) => {
   const num = Number(d);
-
-  if (num < 1) {
-    // for small number there are no algorithm to format label right now
-    // so we set it to 3 digits after dot maximum
-    return num.toLocaleString(undefined, { maximumFractionDigits: 3 });
-  }
-
   return num.toLocaleString(undefined, params);
 };
 
-function getYLabelFormatParams(ticks: Array<number>, maximumSignificantDigits = DEFAULT_MAXIMUM_SIGNIFICANT_DIGITS): Intl.NumberFormatOptions {
+function getYLabelFormatParams(ticks: Array<number>, maximumSignificantDigits = DEFAULT_MAXIMUM_SIGNIFICANT_DIGITS): LabelFormatParams {
   const params = {
-    maximumFractionDigits: 3,
+    maximumFractionDigits: DEFAULT_MAXIMUM_FRACTION_DIGITS,
     maximumSignificantDigits,
     notation: 'compact' as const,
   };
 
   const uniqTicksStr = _unique(ticks.map((tick) => tick.toLocaleString(undefined, params)));
+  const maxLabelLength = _maxBy(uniqTicksStr, (items) => items.length)?.length ?? DEFAULT_LABEL_LENGTH;
 
   if (uniqTicksStr.length === ticks.length || maximumSignificantDigits === MAXIMUM_SIGNIFICANT_DIGITS_LIMIT) {
-    return params;
+    return { ...params, maxLabelLength };
   }
 
   return getYLabelFormatParams(ticks, maximumSignificantDigits + 1);
diff --git a/ui/shared/entities/address/AddressEntity.pw.tsx b/ui/shared/entities/address/AddressEntity.pw.tsx
index 8d7b16e570..91ffb6d093 100644
--- a/ui/shared/entities/address/AddressEntity.pw.tsx
+++ b/ui/shared/entities/address/AddressEntity.pw.tsx
@@ -1,6 +1,8 @@
+import { Box } from '@chakra-ui/react';
 import { test, expect } from '@playwright/experimental-ct-react';
 import React from 'react';
 
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import * as addressMock from 'mocks/address/address';
 import TestApp from 'playwright/TestApp';
 
@@ -80,6 +82,19 @@ test.describe('loading', () => {
 
     await expect(component).toHaveScreenshot();
   });
+
+});
+
+test('with ENS', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <AddressEntity
+        address={ addressMock.withEns }
+      />
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
 });
 
 test('external link', async({ mount }) => {
@@ -127,9 +142,13 @@ test('customization', async({ mount }) => {
 test('hover', async({ page, mount }) => {
   const component = await mount(
     <TestApp>
-      <AddressEntity
-        address={ addressMock.withoutName }
-      />
+      <AddressHighlightProvider>
+        <Box p={ 3 }>
+          <AddressEntity
+            address={ addressMock.withoutName }
+          />
+        </Box>
+      </AddressHighlightProvider>
     </TestApp>,
   );
 
diff --git a/ui/shared/entities/address/AddressEntity.tsx b/ui/shared/entities/address/AddressEntity.tsx
index 6533caf71a..1c5889ec86 100644
--- a/ui/shared/entities/address/AddressEntity.tsx
+++ b/ui/shared/entities/address/AddressEntity.tsx
@@ -7,6 +7,7 @@ import type { AddressParam } from 'types/api/addressParams';
 
 import { route } from 'nextjs-routes';
 
+import { useAddressHighlightContext } from 'lib/contexts/addressHighlight';
 import * as EntityBase from 'ui/shared/entities/base/components';
 
 import { getIconProps } from '../base/utils';
@@ -31,7 +32,7 @@ const Link = chakra((props: LinkProps) => {
   );
 });
 
-type IconProps = Pick<EntityProps, 'address' | 'isLoading' | 'iconSize' | 'noIcon' | 'isSafeAddress'> & {
+type IconProps = Pick<EntityProps, 'address' | 'isLoading' | 'iconSize' | 'noIcon' | 'isSafeAddress' | 'iconColor'> & {
   asProp?: As;
 };
 
@@ -104,18 +105,19 @@ const Icon = (props: IconProps) => {
 type ContentProps = Omit<EntityBase.ContentBaseProps, 'text'> & Pick<EntityProps, 'address'>;
 
 const Content = chakra((props: ContentProps) => {
-  if (props.address.name) {
+  if (props.address.name || props.address.ens_domain_name) {
+    const text = props.address.ens_domain_name || props.address.name;
     const label = (
       <VStack gap={ 0 } py={ 1 } color="inherit">
-        <Box fontWeight={ 600 } whiteSpace="pre-wrap" wordBreak="break-word">{ props.address.name }</Box>
+        <Box fontWeight={ 600 } whiteSpace="pre-wrap" wordBreak="break-word">{ text }</Box>
         <Box whiteSpace="pre-wrap" wordBreak="break-word">{ props.address.hash }</Box>
       </VStack>
     );
 
     return (
-      <Tooltip label={ label } maxW="100vw">
+      <Tooltip label={ label } maxW={{ base: '100vw', lg: '400px' }}>
         <Skeleton isLoaded={ !props.isLoading } overflow="hidden" textOverflow="ellipsis" whiteSpace="nowrap" as="span">
-          { props.address.name }
+          { text }
         </Skeleton>
       </Tooltip>
     );
@@ -146,7 +148,7 @@ const Copy = (props: CopyProps) => {
 const Container = EntityBase.Container;
 
 export interface EntityProps extends EntityBase.EntityBaseProps {
-  address: Pick<AddressParam, 'hash' | 'name' | 'is_contract' | 'is_verified' | 'implementation_name'>;
+  address: Pick<AddressParam, 'hash' | 'name' | 'is_contract' | 'is_verified' | 'implementation_name' | 'ens_domain_name'>;
   isSafeAddress?: boolean;
 }
 
@@ -154,8 +156,18 @@ const AddressEntry = (props: EntityProps) => {
   const linkProps = _omit(props, [ 'className' ]);
   const partsProps = _omit(props, [ 'className', 'onClick' ]);
 
+  const context = useAddressHighlightContext();
+
   return (
-    <Container className={ props.className }>
+    <Container
+      // we have to use the global classnames here, see theme/global.ts
+      // otherwise, if we use sx prop, Chakra will generate the same styles for each instance of the component on the page
+      className={ `${ props.className } address-entity ${ props.noCopy ? 'address-entity_no-copy' : '' }` }
+      data-hash={ context && !props.isLoading ? props.address.hash : undefined }
+      onMouseEnter={ context?.onMouseEnter }
+      onMouseLeave={ context?.onMouseLeave }
+      position="relative"
+    >
       <Icon { ...partsProps }/>
       <Link { ...linkProps }>
         <Content { ...partsProps }/>
diff --git a/ui/shared/entities/address/AddressEntityL1.tsx b/ui/shared/entities/address/AddressEntityL1.tsx
index 5df57f35d7..4732061644 100644
--- a/ui/shared/entities/address/AddressEntityL1.tsx
+++ b/ui/shared/entities/address/AddressEntityL1.tsx
@@ -7,14 +7,14 @@ import config from 'configs/app';
 
 import * as AddressEntity from './AddressEntity';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
 const AddressEntityL1 = (props: AddressEntity.EntityProps) => {
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled) {
     return null;
   }
 
-  const defaultHref = feature.L1BaseUrl + route({
+  const defaultHref = rollupFeature.L1BaseUrl + route({
     pathname: '/address/[hash]',
     query: {
       ...props.query,
diff --git a/ui/shared/entities/address/AddressIdenticon.tsx b/ui/shared/entities/address/AddressIdenticon.tsx
index bdefbf66d2..a08fa5a4a9 100644
--- a/ui/shared/entities/address/AddressIdenticon.tsx
+++ b/ui/shared/entities/address/AddressIdenticon.tsx
@@ -3,6 +3,7 @@ import dynamic from 'next/dynamic';
 import React from 'react';
 
 import config from 'configs/app';
+import * as cookies from 'lib/cookies';
 import IdenticonGithub from 'ui/shared/IdenticonGithub';
 
 interface IconProps {
@@ -12,7 +13,8 @@ interface IconProps {
 
 const Icon = dynamic(
   async() => {
-    switch (config.UI.views.address.identiconType) {
+    const type = cookies.get(cookies.NAMES.ADDRESS_IDENTICON_TYPE) || config.UI.views.address.identiconType;
+    switch (type) {
       case 'github': {
         // eslint-disable-next-line react/display-name
         return (props: IconProps) => <IdenticonGithub size={ props.size } seed={ props.hash }/>;
diff --git a/ui/shared/entities/address/AddressStringOrParam.tsx b/ui/shared/entities/address/AddressStringOrParam.tsx
new file mode 100644
index 0000000000..a2edd5f890
--- /dev/null
+++ b/ui/shared/entities/address/AddressStringOrParam.tsx
@@ -0,0 +1,23 @@
+import React from 'react';
+
+import type { AddressParamBasic } from 'types/api/addressParams';
+
+import AddressEntity from './AddressEntity';
+import type { EntityProps } from './AddressEntity';
+
+type Props = Omit<EntityProps, 'address'> & {
+  address: string | AddressParamBasic;
+}
+
+const AddressStringOrParam = ({ address, ...props }: Props) => {
+  let addressParam;
+  if (typeof address === 'string') {
+    addressParam = { hash: address };
+  } else {
+    addressParam = address;
+  }
+
+  return <AddressEntity address={ addressParam } { ...props }/>;
+};
+
+export default AddressStringOrParam;
diff --git a/ui/shared/entities/address/__screenshots__/AddressEntity.pw.tsx_default_hover-1.png b/ui/shared/entities/address/__screenshots__/AddressEntity.pw.tsx_default_hover-1.png
index f33616575f..0d77e3eb86 100644
Binary files a/ui/shared/entities/address/__screenshots__/AddressEntity.pw.tsx_default_hover-1.png and b/ui/shared/entities/address/__screenshots__/AddressEntity.pw.tsx_default_hover-1.png differ
diff --git a/ui/shared/entities/address/__screenshots__/AddressEntity.pw.tsx_default_with-ENS-1.png b/ui/shared/entities/address/__screenshots__/AddressEntity.pw.tsx_default_with-ENS-1.png
new file mode 100644
index 0000000000..102632e226
Binary files /dev/null and b/ui/shared/entities/address/__screenshots__/AddressEntity.pw.tsx_default_with-ENS-1.png differ
diff --git a/ui/shared/entities/base/components.tsx b/ui/shared/entities/base/components.tsx
index 86f38f2078..d10907b5f6 100644
--- a/ui/shared/entities/base/components.tsx
+++ b/ui/shared/entities/base/components.tsx
@@ -13,12 +13,13 @@ import LinkInternal from 'ui/shared/LinkInternal';
 
 import { getIconProps, type IconSize } from './utils';
 
-export type Truncation = 'constant' | 'dynamic' | 'tail' | 'none';
+export type Truncation = 'constant' | 'constant_long' | 'dynamic' | 'tail' | 'none';
 
 export interface EntityBaseProps {
   className?: string;
   href?: string;
   iconSize?: IconSize;
+  iconColor?: IconProps['color'];
   isExternal?: boolean;
   isLoading?: boolean;
   noCopy?: boolean;
@@ -33,14 +34,17 @@ export interface EntityBaseProps {
 
 export interface ContainerBaseProps extends Pick<EntityBaseProps, 'className'> {
   children: React.ReactNode;
+  onMouseEnter?: (event: React.MouseEvent) => void;
+  onMouseLeave?: (event: React.MouseEvent) => void;
 }
 
-const Container = chakra(({ className, children }: ContainerBaseProps) => {
+const Container = chakra(({ className, children, ...props }: ContainerBaseProps) => {
   return (
     <Flex
       className={ className }
       alignItems="center"
       minWidth={ 0 } // for content truncation - https://css-tricks.com/flexbox-truncated-text/
+      { ...props }
     >
       { children }
     </Flex>
@@ -76,13 +80,13 @@ const Link = chakra(({ isLoading, children, isExternal, onClick, href, noLink }:
   );
 });
 
-export interface IconBaseProps extends Pick<EntityBaseProps, 'isLoading' | 'iconSize' | 'noIcon'> {
+export interface IconBaseProps extends Pick<EntityBaseProps, 'isLoading' | 'iconSize' | 'noIcon' | 'iconColor'> {
   name: IconName;
   color?: IconProps['color'];
   borderRadius?: IconProps['borderRadius'];
 }
 
-const Icon = ({ isLoading, iconSize, noIcon, name, color, borderRadius }: IconBaseProps) => {
+const Icon = ({ isLoading, iconSize, noIcon, name, iconColor, color, borderRadius }: IconBaseProps) => {
   const defaultColor = useColorModeValue('gray.500', 'gray.400');
 
   if (noIcon) {
@@ -98,7 +102,7 @@ const Icon = ({ isLoading, iconSize, noIcon, name, color, borderRadius }: IconBa
       borderRadius={ borderRadius ?? 'base' }
       display="block"
       mr={ 2 }
-      color={ color ?? defaultColor }
+      color={ iconColor ?? color ?? defaultColor }
       minW={ 0 }
       flexShrink={ 0 }
     />
@@ -114,6 +118,14 @@ const Content = chakra(({ className, isLoading, asProp, text, truncation = 'dyna
 
   const children = (() => {
     switch (truncation) {
+      case 'constant_long':
+        return (
+          <HashStringShorten
+            hash={ text }
+            as={ asProp }
+            type="long"
+          />
+        );
       case 'constant':
         return (
           <HashStringShorten
diff --git a/ui/shared/entities/blob/BlobEntity.tsx b/ui/shared/entities/blob/BlobEntity.tsx
new file mode 100644
index 0000000000..13953eb86f
--- /dev/null
+++ b/ui/shared/entities/blob/BlobEntity.tsx
@@ -0,0 +1,90 @@
+import { chakra } from '@chakra-ui/react';
+import _omit from 'lodash/omit';
+import React from 'react';
+
+import { route } from 'nextjs-routes';
+
+import * as EntityBase from 'ui/shared/entities/base/components';
+
+type LinkProps = EntityBase.LinkBaseProps & Pick<EntityProps, 'hash'>;
+
+const Link = chakra((props: LinkProps) => {
+  const defaultHref = route({ pathname: '/blobs/[hash]', query: { hash: props.hash } });
+
+  return (
+    <EntityBase.Link
+      { ...props }
+      href={ props.href ?? defaultHref }
+    >
+      { props.children }
+    </EntityBase.Link>
+  );
+});
+
+type IconProps = Omit<EntityBase.IconBaseProps, 'name'> & {
+  name?: EntityBase.IconBaseProps['name'];
+};
+
+const Icon = (props: IconProps) => {
+  return (
+    <EntityBase.Icon
+      { ...props }
+      name={ props.name ?? 'blob' }
+    />
+  );
+};
+
+type ContentProps = Omit<EntityBase.ContentBaseProps, 'text'> & Pick<EntityProps, 'hash' | 'text'>;
+
+const Content = chakra((props: ContentProps) => {
+  return (
+    <EntityBase.Content
+      { ...props }
+      text={ props.text ?? props.hash }
+    />
+  );
+});
+
+type CopyProps = Omit<EntityBase.CopyBaseProps, 'text'> & Pick<EntityProps, 'hash'>;
+
+const Copy = (props: CopyProps) => {
+  return (
+    <EntityBase.Copy
+      { ...props }
+      text={ props.hash }
+      noCopy={ props.noCopy }
+    />
+  );
+};
+
+const Container = EntityBase.Container;
+
+export interface EntityProps extends EntityBase.EntityBaseProps {
+  hash: string;
+  text?: string;
+}
+
+const BlobEntity = (props: EntityProps) => {
+  const linkProps = _omit(props, [ 'className' ]);
+  const partsProps = _omit(props, [ 'className', 'onClick' ]);
+
+  return (
+    <Container className={ props.className }>
+      <Icon { ...partsProps }/>
+      <Link { ...linkProps }>
+        <Content { ...partsProps }/>
+      </Link>
+      <Copy { ...partsProps }/>
+    </Container>
+  );
+};
+
+export default React.memo(chakra(BlobEntity));
+
+export {
+  Container,
+  Link,
+  Icon,
+  Content,
+  Copy,
+};
diff --git a/ui/shared/entities/block/ZkEvmBatchEntityL2.tsx b/ui/shared/entities/block/BatchEntityL2.tsx
similarity index 69%
rename from ui/shared/entities/block/ZkEvmBatchEntityL2.tsx
rename to ui/shared/entities/block/BatchEntityL2.tsx
index b9edddaeba..a0572b3b7d 100644
--- a/ui/shared/entities/block/ZkEvmBatchEntityL2.tsx
+++ b/ui/shared/entities/block/BatchEntityL2.tsx
@@ -8,13 +8,13 @@ import config from 'configs/app';
 
 import * as BlockEntity from './BlockEntity';
 
-const feature = config.features.zkEvmRollup;
+const rollupFeature = config.features.rollup;
 
-const ZkEvmBatchEntityL2 = (props: BlockEntity.EntityProps) => {
+const BatchEntityL2 = (props: BlockEntity.EntityProps) => {
   const linkProps = _omit(props, [ 'className' ]);
   const partsProps = _omit(props, [ 'className', 'onClick' ]);
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled) {
     return null;
   }
 
@@ -23,7 +23,7 @@ const ZkEvmBatchEntityL2 = (props: BlockEntity.EntityProps) => {
       <BlockEntity.Icon { ...partsProps } name="txn_batches_slim"/>
       <BlockEntity.Link
         { ...linkProps }
-        href={ route({ pathname: '/zkevm-l2-txn-batch/[number]', query: { number: props.number.toString() } }) }
+        href={ route({ pathname: '/batches/[number]', query: { number: props.number.toString() } }) }
       >
         <BlockEntity.Content { ...partsProps }/>
       </BlockEntity.Link>
@@ -31,4 +31,4 @@ const ZkEvmBatchEntityL2 = (props: BlockEntity.EntityProps) => {
   );
 };
 
-export default chakra(ZkEvmBatchEntityL2);
+export default chakra(BatchEntityL2);
diff --git a/ui/shared/entities/block/BlockEntityL1.tsx b/ui/shared/entities/block/BlockEntityL1.tsx
index 6816ac8e8a..a364685b29 100644
--- a/ui/shared/entities/block/BlockEntityL1.tsx
+++ b/ui/shared/entities/block/BlockEntityL1.tsx
@@ -8,13 +8,13 @@ import config from 'configs/app';
 
 import * as BlockEntity from './BlockEntity';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
 const BlockEntityL1 = (props: BlockEntity.EntityProps) => {
   const linkProps = _omit(props, [ 'className' ]);
   const partsProps = _omit(props, [ 'className', 'onClick' ]);
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled) {
     return null;
   }
 
@@ -24,7 +24,7 @@ const BlockEntityL1 = (props: BlockEntity.EntityProps) => {
       <BlockEntity.Link
         { ...linkProps }
         isExternal
-        href={ feature.L1BaseUrl + route({ pathname: '/block/[height_or_hash]', query: { height_or_hash: props.hash ?? String(props.number) } }) }
+        href={ rollupFeature.L1BaseUrl + route({ pathname: '/block/[height_or_hash]', query: { height_or_hash: props.hash ?? String(props.number) } }) }
       >
         <BlockEntity.Content { ...partsProps }/>
       </BlockEntity.Link>
diff --git a/ui/shared/entities/block/BlockEntityL2.tsx b/ui/shared/entities/block/BlockEntityL2.tsx
index b1722d53fa..1a0c3e06a8 100644
--- a/ui/shared/entities/block/BlockEntityL2.tsx
+++ b/ui/shared/entities/block/BlockEntityL2.tsx
@@ -6,13 +6,13 @@ import config from 'configs/app';
 
 import * as BlockEntity from './BlockEntity';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
 const BlockEntityL2 = (props: BlockEntity.EntityProps) => {
   const linkProps = _omit(props, [ 'className' ]);
   const partsProps = _omit(props, [ 'className', 'onClick' ]);
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled) {
     return null;
   }
 
diff --git a/ui/shared/entities/ens/EnsEntity.pw.tsx b/ui/shared/entities/ens/EnsEntity.pw.tsx
new file mode 100644
index 0000000000..fc6d5c01c7
--- /dev/null
+++ b/ui/shared/entities/ens/EnsEntity.pw.tsx
@@ -0,0 +1,70 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import TestApp from 'playwright/TestApp';
+
+import EnsEntity from './EnsEntity';
+
+const name = 'cat.eth';
+const iconSizes = [ 'md', 'lg' ];
+
+test.use({ viewport: { width: 180, height: 30 } });
+
+test.describe('icon size', () => {
+  iconSizes.forEach((size) => {
+    test(size, async({ mount }) => {
+      const component = await mount(
+        <TestApp>
+          <EnsEntity
+            name={ name }
+            iconSize={ size }
+          />
+        </TestApp>,
+      );
+
+      await expect(component).toHaveScreenshot();
+    });
+  });
+});
+
+test('loading', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <EnsEntity
+        name={ name }
+        isLoading
+      />
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
+
+test('with long name', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <EnsEntity
+        name="kitty.kitty.kitty.cat.eth"
+      />
+    </TestApp>,
+  );
+
+  await component.getByText(name.slice(0, 4)).hover();
+
+  await expect(component).toHaveScreenshot();
+});
+
+test('customization', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <EnsEntity
+        name={ name }
+        p={ 3 }
+        borderWidth="1px"
+        borderColor="blue.700"
+      />
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/shared/entities/ens/EnsEntity.tsx b/ui/shared/entities/ens/EnsEntity.tsx
new file mode 100644
index 0000000000..c0623426c1
--- /dev/null
+++ b/ui/shared/entities/ens/EnsEntity.tsx
@@ -0,0 +1,89 @@
+import { chakra } from '@chakra-ui/react';
+import _omit from 'lodash/omit';
+import React from 'react';
+
+import { route } from 'nextjs-routes';
+
+import * as EntityBase from 'ui/shared/entities/base/components';
+import TruncatedValue from 'ui/shared/TruncatedValue';
+
+type LinkProps = EntityBase.LinkBaseProps & Pick<EntityProps, 'name'>;
+
+const Link = chakra((props: LinkProps) => {
+  const defaultHref = route({ pathname: '/name-domains/[name]', query: { name: props.name } });
+
+  return (
+    <EntityBase.Link
+      { ...props }
+      href={ props.href ?? defaultHref }
+    >
+      { props.children }
+    </EntityBase.Link>
+  );
+});
+
+type IconProps = Omit<EntityBase.IconBaseProps, 'name'> & {
+  iconName?: EntityBase.IconBaseProps['name'];
+};
+
+const Icon = (props: IconProps) => {
+  return (
+    <EntityBase.Icon
+      { ...props }
+      name={ props.iconName ?? 'ENS_slim' }
+    />
+  );
+};
+
+type ContentProps = Omit<EntityBase.ContentBaseProps, 'text'> & Pick<EntityProps, 'name'>;
+
+const Content = chakra((props: ContentProps) => {
+  return (
+    <TruncatedValue
+      isLoading={ props.isLoading }
+      value={ props.name }
+    />
+  );
+});
+
+type CopyProps = Omit<EntityBase.CopyBaseProps, 'text'> & Pick<EntityProps, 'name'>;
+
+const Copy = (props: CopyProps) => {
+  return (
+    <EntityBase.Copy
+      { ...props }
+      text={ props.name }
+    />
+  );
+};
+
+const Container = EntityBase.Container;
+
+export interface EntityProps extends EntityBase.EntityBaseProps {
+  name: string;
+}
+
+const EnsEntity = (props: EntityProps) => {
+  const linkProps = _omit(props, [ 'className' ]);
+  const partsProps = _omit(props, [ 'className', 'onClick' ]);
+
+  return (
+    <Container className={ props.className }>
+      <Icon { ...partsProps }/>
+      <Link { ...linkProps }>
+        <Content { ...partsProps }/>
+      </Link>
+      <Copy { ...partsProps }/>
+    </Container>
+  );
+};
+
+export default React.memo(chakra(EnsEntity));
+
+export {
+  Container,
+  Link,
+  Icon,
+  Content,
+  Copy,
+};
diff --git a/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_customization-1.png b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_customization-1.png
new file mode 100644
index 0000000000..30c522addf
Binary files /dev/null and b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_customization-1.png differ
diff --git a/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_icon-size-lg-1.png b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_icon-size-lg-1.png
new file mode 100644
index 0000000000..cd32a435a1
Binary files /dev/null and b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_icon-size-lg-1.png differ
diff --git a/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_icon-size-md-1.png b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_icon-size-md-1.png
new file mode 100644
index 0000000000..aba449d9c1
Binary files /dev/null and b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_icon-size-md-1.png differ
diff --git a/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_loading-1.png b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_loading-1.png
new file mode 100644
index 0000000000..b50a444966
Binary files /dev/null and b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_loading-1.png differ
diff --git a/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_with-long-name-1.png b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_with-long-name-1.png
new file mode 100644
index 0000000000..273fbf9cb9
Binary files /dev/null and b/ui/shared/entities/ens/__screenshots__/EnsEntity.pw.tsx_default_with-long-name-1.png differ
diff --git a/ui/shared/entities/token/TokenEntity.tsx b/ui/shared/entities/token/TokenEntity.tsx
index 99f6abb514..d7cd9f7500 100644
--- a/ui/shared/entities/token/TokenEntity.tsx
+++ b/ui/shared/entities/token/TokenEntity.tsx
@@ -57,6 +57,7 @@ const Icon = (props: IconProps) => {
       src={ props.token.icon_url ?? undefined }
       alt={ `${ props.token.name || 'token' } logo` }
       fallback={ <TokenLogoPlaceholder { ...styles }/> }
+      fallbackStrategy={ props.token.icon_url ? 'onError' : 'beforeLoadOrError' }
     />
   );
 };
@@ -66,7 +67,7 @@ type ContentProps = Omit<EntityBase.ContentBaseProps, 'text'> & Pick<EntityProps
 const Content = chakra((props: ContentProps) => {
   const nameString = [
     !props.onlySymbol && (props.token.name ?? 'Unnamed token'),
-    props.onlySymbol && (props.token.symbol ?? ''),
+    props.onlySymbol && (props.token.symbol ?? props.token.name ?? 'Unnamed token'),
     props.token.symbol && props.jointSymbol && !props.onlySymbol && `(${ props.token.symbol })`,
   ].filter(Boolean).join(' ');
 
diff --git a/ui/shared/entities/tx/TxEntityL1.tsx b/ui/shared/entities/tx/TxEntityL1.tsx
index 3b72f1894c..635116dd0a 100644
--- a/ui/shared/entities/tx/TxEntityL1.tsx
+++ b/ui/shared/entities/tx/TxEntityL1.tsx
@@ -8,13 +8,13 @@ import config from 'configs/app';
 
 import * as TxEntity from './TxEntity';
 
-const feature = config.features.optimisticRollup.isEnabled ? config.features.optimisticRollup : config.features.zkEvmRollup;
+const rollupFeature = config.features.rollup;
 
 const TxEntityL1 = (props: TxEntity.EntityProps) => {
   const partsProps = _omit(props, [ 'className', 'onClick' ]);
   const linkProps = _omit(props, [ 'className' ]);
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled) {
     return null;
   }
 
@@ -24,7 +24,7 @@ const TxEntityL1 = (props: TxEntity.EntityProps) => {
       <TxEntity.Link
         { ...linkProps }
         isExternal
-        href={ feature.L1BaseUrl + route({ pathname: '/tx/[hash]', query: { hash: props.hash } }) }
+        href={ rollupFeature.L1BaseUrl + route({ pathname: '/tx/[hash]', query: { hash: props.hash } }) }
       >
         <TxEntity.Content { ...partsProps }/>
       </TxEntity.Link>
diff --git a/ui/shared/entities/userOp/UserOpEntity.pw.tsx b/ui/shared/entities/userOp/UserOpEntity.pw.tsx
new file mode 100644
index 0000000000..c4a8faa3f0
--- /dev/null
+++ b/ui/shared/entities/userOp/UserOpEntity.pw.tsx
@@ -0,0 +1,72 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import TestApp from 'playwright/TestApp';
+
+import UserOpEntity from './UserOpEntity';
+
+const hash = '0x376db52955d5bce114d0ccea2dcf22289b4eae1b86bcae5a59bb5fdbfef48899';
+const iconSizes = [ 'md', 'lg' ];
+
+test.use({ viewport: { width: 180, height: 30 } });
+
+test.describe('icon size', () => {
+  iconSizes.forEach((size) => {
+    test(size, async({ mount }) => {
+      const component = await mount(
+        <TestApp>
+          <UserOpEntity
+            hash={ hash }
+            iconSize={ size }
+          />
+        </TestApp>,
+      );
+
+      await expect(component).toHaveScreenshot();
+    });
+  });
+});
+
+test('loading', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <UserOpEntity
+        hash={ hash }
+        isLoading
+      />
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
+
+test('with copy +@dark-mode', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <UserOpEntity
+        hash={ hash }
+        noCopy={ false }
+      />
+    </TestApp>,
+  );
+
+  await component.getByText(hash.slice(0, 4)).hover();
+
+  await expect(component).toHaveScreenshot();
+});
+
+test('customization', async({ mount }) => {
+  const component = await mount(
+    <TestApp>
+      <UserOpEntity
+        hash={ hash }
+        truncation="constant"
+        p={ 3 }
+        borderWidth="1px"
+        borderColor="blue.700"
+      />
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/shared/entities/userOp/UserOpEntity.tsx b/ui/shared/entities/userOp/UserOpEntity.tsx
new file mode 100644
index 0000000000..c4a9022d31
--- /dev/null
+++ b/ui/shared/entities/userOp/UserOpEntity.tsx
@@ -0,0 +1,90 @@
+import { chakra } from '@chakra-ui/react';
+import _omit from 'lodash/omit';
+import React from 'react';
+
+import { route } from 'nextjs-routes';
+
+import * as EntityBase from 'ui/shared/entities/base/components';
+
+type LinkProps = EntityBase.LinkBaseProps & Pick<EntityProps, 'hash'>;
+
+const Link = chakra((props: LinkProps) => {
+  const defaultHref = route({ pathname: '/op/[hash]', query: { hash: props.hash } });
+
+  return (
+    <EntityBase.Link
+      { ...props }
+      href={ props.href ?? defaultHref }
+    >
+      { props.children }
+    </EntityBase.Link>
+  );
+});
+
+type IconProps = Omit<EntityBase.IconBaseProps, 'name'> & {
+  name?: EntityBase.IconBaseProps['name'];
+};
+
+const Icon = (props: IconProps) => {
+  return (
+    <EntityBase.Icon
+      { ...props }
+      name={ props.name ?? 'user_op_slim' }
+    />
+  );
+};
+
+type ContentProps = Omit<EntityBase.ContentBaseProps, 'text'> & Pick<EntityProps, 'hash'>;
+
+const Content = chakra((props: ContentProps) => {
+  return (
+    <EntityBase.Content
+      { ...props }
+      text={ props.hash }
+    />
+  );
+});
+
+type CopyProps = Omit<EntityBase.CopyBaseProps, 'text'> & Pick<EntityProps, 'hash'>;
+
+const Copy = (props: CopyProps) => {
+  return (
+    <EntityBase.Copy
+      { ...props }
+      text={ props.hash }
+      // by default we don't show copy icon, maybe this should be revised
+      noCopy={ props.noCopy ?? true }
+    />
+  );
+};
+
+const Container = EntityBase.Container;
+
+export interface EntityProps extends EntityBase.EntityBaseProps {
+  hash: string;
+}
+
+const UserOpEntity = (props: EntityProps) => {
+  const linkProps = _omit(props, [ 'className' ]);
+  const partsProps = _omit(props, [ 'className', 'onClick' ]);
+
+  return (
+    <Container className={ props.className }>
+      <Icon { ...partsProps }/>
+      <Link { ...linkProps }>
+        <Content { ...partsProps }/>
+      </Link>
+      <Copy { ...partsProps }/>
+    </Container>
+  );
+};
+
+export default React.memo(chakra(UserOpEntity));
+
+export {
+  Container,
+  Link,
+  Icon,
+  Content,
+  Copy,
+};
diff --git a/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_dark-color-mode_with-copy-dark-mode-1.png b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_dark-color-mode_with-copy-dark-mode-1.png
new file mode 100644
index 0000000000..062b6aff57
Binary files /dev/null and b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_dark-color-mode_with-copy-dark-mode-1.png differ
diff --git a/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_customization-1.png b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_customization-1.png
new file mode 100644
index 0000000000..fec63db3dc
Binary files /dev/null and b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_customization-1.png differ
diff --git a/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_icon-size-lg-1.png b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_icon-size-lg-1.png
new file mode 100644
index 0000000000..dfe8149bbf
Binary files /dev/null and b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_icon-size-lg-1.png differ
diff --git a/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_icon-size-md-1.png b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_icon-size-md-1.png
new file mode 100644
index 0000000000..4f855b2ff2
Binary files /dev/null and b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_icon-size-md-1.png differ
diff --git a/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_loading-1.png b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_loading-1.png
new file mode 100644
index 0000000000..67273105f8
Binary files /dev/null and b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_loading-1.png differ
diff --git a/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_with-copy-dark-mode-1.png b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_with-copy-dark-mode-1.png
new file mode 100644
index 0000000000..ae8e9976e1
Binary files /dev/null and b/ui/shared/entities/userOp/__screenshots__/UserOpEntity.pw.tsx_default_with-copy-dark-mode-1.png differ
diff --git a/ui/shared/filters/FilterButton.tsx b/ui/shared/filters/FilterButton.tsx
index b75eeb21ed..a61246587c 100644
--- a/ui/shared/filters/FilterButton.tsx
+++ b/ui/shared/filters/FilterButton.tsx
@@ -19,7 +19,7 @@ const FilterButton = ({ isActive, isLoading, appliedFiltersNum, onClick, as }: P
   const badgeBgColor = useColorModeValue('blue.700', 'gray.50');
 
   if (isLoading) {
-    return <Skeleton w={{ base: 9, lg: '78px' }} h={ 8 } borderRadius="base"/>;
+    return <Skeleton w={{ base: 9, lg: '78px' }} h={ 8 } borderRadius="base" flexShrink={ 0 }/>;
   }
 
   return (
diff --git a/ui/shared/filters/FilterInput.tsx b/ui/shared/filters/FilterInput.tsx
index 5cfaae212f..5c16f65ce6 100644
--- a/ui/shared/filters/FilterInput.tsx
+++ b/ui/shared/filters/FilterInput.tsx
@@ -37,6 +37,7 @@ const FilterInput = ({ onChange, className, size = 'sm', placeholder, initialVal
       isLoaded={ !isLoading }
       className={ className }
       minW="250px"
+      borderRadius="base"
     >
       <InputGroup
         size={ size }
diff --git a/ui/shared/gas/GasInfoTooltip.pw.tsx b/ui/shared/gas/GasInfoTooltip.pw.tsx
new file mode 100644
index 0000000000..b59a026f56
--- /dev/null
+++ b/ui/shared/gas/GasInfoTooltip.pw.tsx
@@ -0,0 +1,107 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import { SECOND } from 'lib/consts';
+import * as statsMock from 'mocks/stats/index';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import TestApp from 'playwright/TestApp';
+
+import GasInfoTooltip from './GasInfoTooltip';
+import GasPrice from './GasPrice';
+
+const dataUpdatedAt = Date.now() - 30 * SECOND;
+
+test.use({ viewport: { width: 300, height: 300 } });
+
+test('all data', async({ mount, page }) => {
+  await mount(
+    <TestApp>
+      <GasInfoTooltip data={ statsMock.base } dataUpdatedAt={ dataUpdatedAt } isOpen>
+        <span>Gas <GasPrice data={ statsMock.base.gas_prices.average }/></span>
+      </GasInfoTooltip>
+    </TestApp>,
+  );
+
+  // await page.getByText(/gas/i).hover();
+  await page.getByText(/last update/i).isVisible();
+  await expect(page).toHaveScreenshot();
+});
+
+test('without primary unit price', async({ mount, page }) => {
+  await mount(
+    <TestApp>
+      <GasInfoTooltip data={ statsMock.withoutFiatPrices } dataUpdatedAt={ dataUpdatedAt } isOpen>
+        <span>Gas: <GasPrice data={ statsMock.withoutFiatPrices.gas_prices.average }/></span>
+      </GasInfoTooltip>
+    </TestApp>,
+  );
+
+  // await page.getByText(/gas/i).hover();
+  await page.getByText(/last update/i).isVisible();
+  await expect(page).toHaveScreenshot();
+});
+
+test('without secondary unit price', async({ mount, page }) => {
+  await mount(
+    <TestApp>
+      <GasInfoTooltip data={ statsMock.withoutGweiPrices } dataUpdatedAt={ dataUpdatedAt } isOpen>
+        <span>Gas: <GasPrice data={ statsMock.withoutGweiPrices.gas_prices.average }/></span>
+      </GasInfoTooltip>
+    </TestApp>,
+  );
+
+  // await page.getByText(/gas/i).hover();
+  await page.getByText(/last update/i).isVisible();
+  await expect(page).toHaveScreenshot();
+});
+
+test('no data', async({ mount, page }) => {
+  await mount(
+    <TestApp>
+      <GasInfoTooltip data={ statsMock.withoutBothPrices } dataUpdatedAt={ dataUpdatedAt } isOpen>
+        <span>Gas: <GasPrice data={ statsMock.withoutBothPrices.gas_prices.average }/></span>
+      </GasInfoTooltip>
+    </TestApp>,
+  );
+
+  // await page.getByText(/gas/i).hover();
+  await page.getByText(/last update/i).isVisible();
+  await expect(page).toHaveScreenshot();
+});
+
+const oneUnitTest = test.extend({
+  context: contextWithEnvs([
+    { name: 'NEXT_PUBLIC_GAS_TRACKER_UNITS', value: '["gwei"]' },
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  ]) as any,
+});
+
+oneUnitTest.describe('one unit', () => {
+  oneUnitTest('with data', async({ mount, page }) => {
+    await mount(
+      <TestApp>
+        <GasInfoTooltip data={ statsMock.withoutFiatPrices } dataUpdatedAt={ dataUpdatedAt } isOpen>
+          <span>Gas: <GasPrice data={ statsMock.withoutFiatPrices.gas_prices.average }/></span>
+        </GasInfoTooltip>
+      </TestApp>,
+    );
+
+    // await page.getByText(/gas/i).hover();
+    await page.getByText(/last update/i).isVisible();
+    await expect(page).toHaveScreenshot();
+  });
+
+  oneUnitTest('without data', async({ mount, page }) => {
+    await mount(
+      <TestApp>
+        <GasInfoTooltip data={ statsMock.withoutGweiPrices } dataUpdatedAt={ dataUpdatedAt } isOpen>
+          <span>Gas: <GasPrice data={ statsMock.withoutGweiPrices.gas_prices.average }/></span>
+        </GasInfoTooltip>
+      </TestApp>,
+    );
+
+    // await page.getByText(/gas/i).hover();
+    await page.getByText(/last update/i).isVisible();
+    await expect(page).toHaveScreenshot();
+  });
+});
diff --git a/ui/shared/gas/GasInfoTooltip.tsx b/ui/shared/gas/GasInfoTooltip.tsx
new file mode 100644
index 0000000000..de1edcecaa
--- /dev/null
+++ b/ui/shared/gas/GasInfoTooltip.tsx
@@ -0,0 +1,75 @@
+import { Box, DarkMode, Flex, Grid, Popover, PopoverBody, PopoverContent, PopoverTrigger, Portal, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import type { HomeStats } from 'types/api/stats';
+
+import { route } from 'nextjs-routes';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import LinkInternal from 'ui/shared/LinkInternal';
+
+import GasInfoTooltipRow from './GasInfoTooltipRow';
+import GasInfoUpdateTimer from './GasInfoUpdateTimer';
+
+interface Props {
+  children: React.ReactNode;
+  data: HomeStats;
+  dataUpdatedAt: number;
+  isOpen?: boolean; // for testing purposes only; the tests were flaky, i couldn't find a better way
+}
+
+const POPOVER_OFFSET: [ number, number ] = [ 0, 10 ];
+const feature = config.features.gasTracker;
+
+const GasInfoTooltip = ({ children, data, dataUpdatedAt, isOpen }: Props) => {
+  const tooltipBg = useColorModeValue('gray.700', 'gray.900');
+
+  if (!data.gas_prices) {
+    return null;
+  }
+
+  const columnNum =
+    Object.values(data.gas_prices).some((price) => price?.fiat_price) &&
+    Object.values(data.gas_prices).some((price) => price?.price) &&
+    feature.isEnabled && feature.units.length === 2 ?
+      3 : 2;
+
+  return (
+    <Popover trigger="hover" isLazy offset={ POPOVER_OFFSET } isOpen={ isOpen }>
+      <PopoverTrigger>
+        { children }
+      </PopoverTrigger>
+      <Portal>
+        <PopoverContent bgColor={ tooltipBg } w="auto">
+          <PopoverBody color="white">
+            <DarkMode>
+              <Flex flexDir="column" fontSize="xs" lineHeight={ 4 } rowGap={ 3 }>
+                { data.gas_price_updated_at && (
+                  <Flex justifyContent="space-between">
+                    <Box color="text_secondary">Last update</Box>
+                    <Flex color="text_secondary" justifyContent="flex-end" columnGap={ 2 } ml={ 3 }>
+                      { dayjs(data.gas_price_updated_at).format('MMM DD, HH:mm:ss') }
+                      { data.gas_prices_update_in !== 0 &&
+                            <GasInfoUpdateTimer key={ dataUpdatedAt } startTime={ dataUpdatedAt } duration={ data.gas_prices_update_in }/> }
+                    </Flex>
+                  </Flex>
+                ) }
+                <Grid rowGap={ 2 } columnGap="10px" gridTemplateColumns={ `repeat(${ columnNum }, minmax(min-content, auto))` }>
+                  <GasInfoTooltipRow name="Fast" info={ data.gas_prices.fast }/>
+                  <GasInfoTooltipRow name="Normal" info={ data.gas_prices.average }/>
+                  <GasInfoTooltipRow name="Slow" info={ data.gas_prices.slow }/>
+                </Grid>
+                <LinkInternal href={ route({ pathname: '/gas-tracker' }) }>
+                    Gas tracker overview
+                </LinkInternal>
+              </Flex>
+            </DarkMode>
+          </PopoverBody>
+        </PopoverContent>
+      </Portal>
+    </Popover>
+  );
+};
+
+export default React.memo(GasInfoTooltip);
diff --git a/ui/shared/gas/GasInfoTooltipRow.tsx b/ui/shared/gas/GasInfoTooltipRow.tsx
new file mode 100644
index 0000000000..4df03189ac
--- /dev/null
+++ b/ui/shared/gas/GasInfoTooltipRow.tsx
@@ -0,0 +1,31 @@
+import { Box, chakra } from '@chakra-ui/react';
+import React from 'react';
+
+import type { GasPriceInfo } from 'types/api/stats';
+
+import { space } from 'lib/html-entities';
+import GasPrice from 'ui/shared/gas/GasPrice';
+
+interface Props {
+  name: string;
+  info: GasPriceInfo | null;
+}
+
+const GasInfoTooltipRow = ({ name, info }: Props) => {
+  return (
+    <>
+      <Box>
+        <chakra.span>{ name }</chakra.span>
+        { info && info.time && (
+          <chakra.span color="text_secondary">
+            { space }{ (info.time / 1000).toLocaleString(undefined, { maximumFractionDigits: 1 }) }s
+          </chakra.span>
+        ) }
+      </Box>
+      <GasPrice data={ info } textAlign="right"/>
+      <GasPrice data={ info } unitMode="secondary" color="text_secondary" textAlign="right"/>
+    </>
+  );
+};
+
+export default React.memo(GasInfoTooltipRow);
diff --git a/ui/shared/gas/GasInfoUpdateTimer.tsx b/ui/shared/gas/GasInfoUpdateTimer.tsx
new file mode 100644
index 0000000000..6357f9c0b8
--- /dev/null
+++ b/ui/shared/gas/GasInfoUpdateTimer.tsx
@@ -0,0 +1,48 @@
+import { CircularProgress, chakra, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import dayjs from 'lib/date/dayjs';
+
+interface Props {
+  startTime: number;
+  duration: number;
+  className?: string;
+  size?: number;
+}
+
+const getValue = (startDate: dayjs.Dayjs, duration: number) => {
+  const now = dayjs();
+  const diff = now.diff(startDate, 'ms');
+  const value = diff / duration * 100;
+
+  if (value >= 99) {
+    return 99;
+  }
+
+  return value;
+};
+
+const GasInfoUpdateTimer = ({ startTime, duration, className, size = 4 }: Props) => {
+  const [ value, setValue ] = React.useState(getValue(dayjs(startTime), duration));
+  const trackColor = useColorModeValue('blackAlpha.50', 'whiteAlpha.100');
+
+  React.useEffect(() => {
+    const startDate = dayjs(startTime);
+
+    const intervalId = window.setInterval(() => {
+      const nextValue = getValue(startDate, duration);
+      setValue(nextValue);
+      if (nextValue === 99) {
+        window.clearInterval(intervalId);
+      }
+    }, 100);
+
+    return () => {
+      window.clearInterval(intervalId);
+    };
+  }, [ startTime, duration ]);
+
+  return <CircularProgress className={ className } value={ value } trackColor={ trackColor } size={ size }/>;
+};
+
+export default React.memo(chakra(GasInfoUpdateTimer));
diff --git a/ui/shared/gas/GasPrice.tsx b/ui/shared/gas/GasPrice.tsx
new file mode 100644
index 0000000000..a42553eb98
--- /dev/null
+++ b/ui/shared/gas/GasPrice.tsx
@@ -0,0 +1,82 @@
+import { chakra } from '@chakra-ui/react';
+import React from 'react';
+
+import type { GasPriceInfo } from 'types/api/stats';
+import type { GasUnit } from 'types/client/gasTracker';
+
+import config from 'configs/app';
+
+import formatGasValue from './formatGasValue';
+
+const feature = config.features.gasTracker;
+
+const UNITS_TO_API_FIELD_MAP: Record<GasUnit, 'price' | 'fiat_price'> = {
+  gwei: 'price',
+  usd: 'fiat_price',
+};
+
+interface Props {
+  data: GasPriceInfo | null;
+  className?: string;
+  unitMode?: 'primary' | 'secondary';
+  prefix?: string;
+}
+
+const GasPrice = ({ data, prefix, className, unitMode = 'primary' }: Props) => {
+  if (!data || !feature.isEnabled) {
+    return null;
+  }
+
+  switch (unitMode) {
+    case 'secondary': {
+      const primaryUnits = feature.units[0];
+      const secondaryUnits = feature.units[1];
+
+      if (!secondaryUnits) {
+        return null;
+      }
+
+      const primaryUnitsValue = data[UNITS_TO_API_FIELD_MAP[primaryUnits]];
+      if (!primaryUnitsValue) {
+        // in this case we display values in secondary untis in primary mode as fallback
+        return null;
+      }
+
+      const secondaryUnitsValue = data[UNITS_TO_API_FIELD_MAP[secondaryUnits]];
+      if (!secondaryUnitsValue) {
+        return null;
+      }
+
+      const formattedValue = formatGasValue(data, secondaryUnits);
+      return <span className={ className }>{ prefix }{ formattedValue }</span>;
+    }
+    case 'primary': {
+      const primaryUnits = feature.units[0];
+      const secondaryUnits = feature.units[1];
+
+      if (!primaryUnits) {
+        // this should never happen since feature will be disabled if there are no units at all
+        return null;
+      }
+
+      const value = data[UNITS_TO_API_FIELD_MAP[primaryUnits]];
+      if (!value) {
+        // in primary mode we want to fallback to secondary units if value in primary units are not available
+        // unless there are no secondary units
+        const valueInSecondaryUnits = data[UNITS_TO_API_FIELD_MAP[secondaryUnits]];
+
+        if (!secondaryUnits || !valueInSecondaryUnits) {
+          // in primary mode we always want to show something
+          // this will return "N/A <units>"
+          return <span className={ className }>{ formatGasValue(data, primaryUnits) }</span>;
+        } else {
+          return <span className={ className }>{ prefix }{ formatGasValue(data, secondaryUnits) }</span>;
+        }
+      }
+
+      return <span className={ className }>{ prefix }{ formatGasValue(data, primaryUnits) }</span>;
+    }
+  }
+};
+
+export default chakra(GasPrice);
diff --git a/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_all-data-1.png b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_all-data-1.png
new file mode 100644
index 0000000000..c4de80cfcd
Binary files /dev/null and b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_all-data-1.png differ
diff --git a/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_no-data-1.png b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_no-data-1.png
new file mode 100644
index 0000000000..d782d3d9a8
Binary files /dev/null and b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_no-data-1.png differ
diff --git a/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_one-unit-with-data-1.png b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_one-unit-with-data-1.png
new file mode 100644
index 0000000000..7b03e0210b
Binary files /dev/null and b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_one-unit-with-data-1.png differ
diff --git a/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_one-unit-without-data-1.png b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_one-unit-without-data-1.png
new file mode 100644
index 0000000000..9e4361ded1
Binary files /dev/null and b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_one-unit-without-data-1.png differ
diff --git a/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_without-primary-unit-price-1.png b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_without-primary-unit-price-1.png
new file mode 100644
index 0000000000..7b03e0210b
Binary files /dev/null and b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_without-primary-unit-price-1.png differ
diff --git a/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_without-secondary-unit-price-1.png b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_without-secondary-unit-price-1.png
new file mode 100644
index 0000000000..82d8085a76
Binary files /dev/null and b/ui/shared/gas/__screenshots__/GasInfoTooltip.pw.tsx_default_without-secondary-unit-price-1.png differ
diff --git a/ui/shared/gas/formatGasValue.ts b/ui/shared/gas/formatGasValue.ts
new file mode 100644
index 0000000000..c55d75cd23
--- /dev/null
+++ b/ui/shared/gas/formatGasValue.ts
@@ -0,0 +1,27 @@
+import type { GasPriceInfo } from 'types/api/stats';
+import type { GasUnit } from 'types/client/gasTracker';
+
+import { currencyUnits } from 'lib/units';
+
+export default function formatGasValue(data: GasPriceInfo, unit: GasUnit) {
+  switch (unit) {
+    case 'gwei': {
+      if (!data.price) {
+        return `N/A ${ currencyUnits.gwei }`;
+      }
+      return `${ Number(data.price).toLocaleString(undefined, { maximumFractionDigits: 1 }) } ${ currencyUnits.gwei }`;
+    }
+
+    case 'usd': {
+      if (!data.fiat_price) {
+        return `$N/A`;
+      }
+
+      if (Number(data.fiat_price) < 0.01) {
+        return `< $0.01`;
+      }
+
+      return `$${ Number(data.fiat_price).toLocaleString(undefined, { maximumFractionDigits: 2 }) }`;
+    }
+  }
+}
diff --git a/ui/shared/layout/LayoutApp.tsx b/ui/shared/layout/LayoutApp.tsx
index e2a169de9e..8eaebf342a 100644
--- a/ui/shared/layout/LayoutApp.tsx
+++ b/ui/shared/layout/LayoutApp.tsx
@@ -3,7 +3,6 @@ import React from 'react';
 import type { Props } from './types';
 
 import AppErrorBoundary from 'ui/shared/AppError/AppErrorBoundary';
-import HeaderAlert from 'ui/snippets/header/HeaderAlert';
 import HeaderDesktop from 'ui/snippets/header/HeaderDesktop';
 import HeaderMobile from 'ui/snippets/header/HeaderMobile';
 
@@ -19,10 +18,9 @@ const LayoutDefault = ({ children }: Props) => {
           paddingTop={{ base: 16, lg: 6 }}
           paddingX={{ base: 4, lg: 6 }}
         >
-          <HeaderAlert/>
           <HeaderDesktop isMarketplaceAppPage/>
           <AppErrorBoundary>
-            <Layout.Content pt={{ base: 0, lg: 6 }}>
+            <Layout.Content pt={{ base: 0, lg: 4 }}>
               { children }
             </Layout.Content>
           </AppErrorBoundary>
diff --git a/ui/shared/layout/LayoutHome.tsx b/ui/shared/layout/LayoutHome.tsx
index 44562b3dbd..6274afeeea 100644
--- a/ui/shared/layout/LayoutHome.tsx
+++ b/ui/shared/layout/LayoutHome.tsx
@@ -16,7 +16,7 @@ const LayoutHome = ({ children }: Props) => {
       <Layout.MainArea>
         <Layout.SideBar/>
         <Layout.MainColumn
-          paddingTop={{ base: 6, lg: 9 }}
+          paddingTop={{ base: 3, lg: 6 }}
         >
           <HeaderAlert/>
           <AppErrorBoundary>
diff --git a/ui/shared/layout/__screenshots__/Layout.pw.tsx_default_base-view-mobile-1.png b/ui/shared/layout/__screenshots__/Layout.pw.tsx_default_base-view-mobile-1.png
index bdf253f4a1..138e095088 100644
Binary files a/ui/shared/layout/__screenshots__/Layout.pw.tsx_default_base-view-mobile-1.png and b/ui/shared/layout/__screenshots__/Layout.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/shared/layout/__screenshots__/Layout.pw.tsx_mobile_base-view-mobile-1.png b/ui/shared/layout/__screenshots__/Layout.pw.tsx_mobile_base-view-mobile-1.png
index f98ebbef6b..02ed0743a8 100644
Binary files a/ui/shared/layout/__screenshots__/Layout.pw.tsx_mobile_base-view-mobile-1.png and b/ui/shared/layout/__screenshots__/Layout.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/shared/layout/__screenshots__/LayoutError.pw.tsx_default_base-view-mobile-1.png b/ui/shared/layout/__screenshots__/LayoutError.pw.tsx_default_base-view-mobile-1.png
index 95fe78e247..4ae76c6dfc 100644
Binary files a/ui/shared/layout/__screenshots__/LayoutError.pw.tsx_default_base-view-mobile-1.png and b/ui/shared/layout/__screenshots__/LayoutError.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/shared/layout/__screenshots__/LayoutError.pw.tsx_mobile_base-view-mobile-1.png b/ui/shared/layout/__screenshots__/LayoutError.pw.tsx_mobile_base-view-mobile-1.png
index 67165f334b..68611fdd85 100644
Binary files a/ui/shared/layout/__screenshots__/LayoutError.pw.tsx_mobile_base-view-mobile-1.png and b/ui/shared/layout/__screenshots__/LayoutError.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/shared/layout/__screenshots__/LayoutHome.pw.tsx_default_base-view-mobile-1.png b/ui/shared/layout/__screenshots__/LayoutHome.pw.tsx_default_base-view-mobile-1.png
index 2e66c9b2f2..35dd6e4b4f 100644
Binary files a/ui/shared/layout/__screenshots__/LayoutHome.pw.tsx_default_base-view-mobile-1.png and b/ui/shared/layout/__screenshots__/LayoutHome.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/shared/layout/__screenshots__/LayoutHome.pw.tsx_mobile_base-view-mobile-1.png b/ui/shared/layout/__screenshots__/LayoutHome.pw.tsx_mobile_base-view-mobile-1.png
index c2757cbc13..38e5734c8c 100644
Binary files a/ui/shared/layout/__screenshots__/LayoutHome.pw.tsx_mobile_base-view-mobile-1.png and b/ui/shared/layout/__screenshots__/LayoutHome.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/shared/layout/components/MainArea.tsx b/ui/shared/layout/components/MainArea.tsx
index b43f9e522f..804577425f 100644
--- a/ui/shared/layout/components/MainArea.tsx
+++ b/ui/shared/layout/components/MainArea.tsx
@@ -7,7 +7,7 @@ interface Props {
 
 const MainArea = ({ children }: Props) => {
   return (
-    <Flex w="100%" minH="100vh" alignItems="stretch">
+    <Flex w="100%" minH="calc(100vh - 36px)" alignItems="stretch">
       { children }
     </Flex>
   );
diff --git a/ui/shared/layout/components/MainColumn.tsx b/ui/shared/layout/components/MainColumn.tsx
index 4129cd16e9..57e9caeeec 100644
--- a/ui/shared/layout/components/MainColumn.tsx
+++ b/ui/shared/layout/components/MainColumn.tsx
@@ -14,7 +14,7 @@ const MainColumn = ({ children, className }: Props) => {
       flexGrow={ 1 }
       w={{ base: '100%', lg: 'auto' }}
       paddingX={{ base: 4, lg: 12 }}
-      paddingTop={{ base: `${ 32 + 60 }px`, lg: 9 }} // 32px is top padding of content area, 60px is search bar height
+      paddingTop={{ base: `${ 12 + 52 }px`, lg: 6 }} // 12px is top padding of content area, 52px is search bar height
       paddingBottom={ 10 }
     >
       { children }
diff --git a/ui/shared/monaco/CodeEditor.tsx b/ui/shared/monaco/CodeEditor.tsx
index 31182c8a9a..7a39734c95 100644
--- a/ui/shared/monaco/CodeEditor.tsx
+++ b/ui/shared/monaco/CodeEditor.tsx
@@ -19,6 +19,7 @@ import CodeEditorSideBar, { CONTAINER_WIDTH as SIDE_BAR_WIDTH } from './CodeEdit
 import CodeEditorTabs from './CodeEditorTabs';
 import addExternalLibraryWarningDecoration from './utils/addExternalLibraryWarningDecoration';
 import addFileImportDecorations from './utils/addFileImportDecorations';
+import addMainContractCodeDecoration from './utils/addMainContractCodeDecoration';
 import getFullPathOfImportedFile from './utils/getFullPathOfImportedFile';
 import * as themes from './utils/themes';
 import useThemeColors from './utils/useThemeColors';
@@ -42,9 +43,10 @@ interface Props {
   libraries?: Array<SmartContractExternalLibrary>;
   language?: string;
   mainFile?: string;
+  contractName?: string;
 }
 
-const CodeEditor = ({ data, remappings, libraries, language, mainFile }: Props) => {
+const CodeEditor = ({ data, remappings, libraries, language, mainFile, contractName }: Props) => {
   const [ instance, setInstance ] = React.useState<Monaco | undefined>();
   const [ editor, setEditor ] = React.useState<monaco.editor.IStandaloneCodeEditor | undefined>();
   const [ index, setIndex ] = React.useState(0);
@@ -82,9 +84,10 @@ const CodeEditor = ({ data, remappings, libraries, language, mainFile }: Props)
 
     if (language === 'solidity') {
       loadedModels.concat(newModels)
-        .forEach((models) => {
-          addFileImportDecorations(models);
-          libraries?.length && addExternalLibraryWarningDecoration(models, libraries);
+        .forEach((model) => {
+          contractName && mainFile === model.uri.path && addMainContractCodeDecoration(model, contractName, editor);
+          addFileImportDecorations(model);
+          libraries?.length && addExternalLibraryWarningDecoration(model, libraries);
         });
     }
 
@@ -192,6 +195,13 @@ const CodeEditor = ({ data, remappings, libraries, language, mainFile }: Props)
     '.monaco-editor .overflow-guard': {
       'border-bottom-left-radius': borderRadius,
     },
+    '.monaco-editor .core-guide': {
+      zIndex: 1,
+    },
+    // '.monaco-editor .currentFindMatch': // TODO: find a better way to style this
+    '.monaco-editor .findMatch': {
+      backgroundColor: themeColors['custom.findMatchHighlightBackground'],
+    },
     '.highlight': {
       backgroundColor: themeColors['custom.findMatchHighlightBackground'],
     },
@@ -206,6 +216,18 @@ const CodeEditor = ({ data, remappings, libraries, language, mainFile }: Props)
     '.risk-warning': {
       backgroundColor: themeColors['custom.riskWarning.background'],
     },
+    '.main-contract-header': {
+      backgroundColor: themeColors['custom.mainContract.header'],
+    },
+    '.main-contract-body': {
+      backgroundColor: themeColors['custom.mainContract.body'],
+    },
+    '.main-contract-glyph': {
+      zIndex: 1,
+      background: 'url(/static/contract_star.png) no-repeat center center',
+      backgroundSize: '12px',
+      cursor: 'pointer',
+    },
   }), [ editorWidth, themeColors, borderRadius ]);
 
   const renderErrorScreen = React.useCallback(() => {
diff --git a/ui/shared/monaco/utils/addExternalLibraryWarningDecoration.ts b/ui/shared/monaco/utils/addExternalLibraryWarningDecoration.ts
index 81a490fa5f..9d77966303 100644
--- a/ui/shared/monaco/utils/addExternalLibraryWarningDecoration.ts
+++ b/ui/shared/monaco/utils/addExternalLibraryWarningDecoration.ts
@@ -2,6 +2,8 @@ import type * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
 
 import type { SmartContractExternalLibrary } from 'types/api/contract';
 
+import sortByEndLineNumberAsc from './sortByEndLineNumberAsc';
+
 export default function addExternalLibraryWarningDecoration(model: monaco.editor.ITextModel, libraries: Array<SmartContractExternalLibrary>) {
   const options: monaco.editor.IModelDecorationOptions = {
     isWholeLine: true,
@@ -81,15 +83,3 @@ const getLibraryName = (model: monaco.editor.ITextModel) => (library: SmartContr
 
   return libraryName;
 };
-
-const sortByEndLineNumberAsc = (a: monaco.editor.FindMatch, b: monaco.editor.FindMatch) => {
-  if (a.range.endLineNumber < b.range.endLineNumber) {
-    return -1;
-  }
-
-  if (a.range.endLineNumber > b.range.endLineNumber) {
-    return 1;
-  }
-
-  return 0;
-};
diff --git a/ui/shared/monaco/utils/addMainContractCodeDecoration.ts b/ui/shared/monaco/utils/addMainContractCodeDecoration.ts
new file mode 100644
index 0000000000..1c2e3c5e0c
--- /dev/null
+++ b/ui/shared/monaco/utils/addMainContractCodeDecoration.ts
@@ -0,0 +1,66 @@
+import type * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
+
+import sortByEndLineNumberAsc from './sortByEndLineNumberAsc';
+
+export default function addMainContractCodeDecoration(model: monaco.editor.ITextModel, contractName: string, editor: monaco.editor.IStandaloneCodeEditor) {
+  const options: monaco.editor.IModelDecorationOptions = {
+    isWholeLine: true,
+  };
+
+  const contractBlockMatches = model.findMatches(`^contract\\s`, false, true, false, null, true);
+
+  if (contractBlockMatches.length < 2) {
+    return;
+  }
+
+  const [ firstLineMatch ] = model.findMatches(`(^contract ${ contractName })( is .+)?\\s?\\{`, false, true, false, null, true);
+
+  if (!firstLineMatch) {
+    return;
+  }
+
+  const firstLineDecoration: monaco.editor.IModelDeltaDecoration = {
+    range: {
+      startColumn: 1,
+      endColumn: 10, // doesn't really matter since isWholeLine is true
+      startLineNumber: firstLineMatch.range.startLineNumber,
+      endLineNumber: firstLineMatch.range.startLineNumber,
+    },
+    options: {
+      ...options,
+      className: '.main-contract-header',
+      marginClassName: '.main-contract-header',
+      glyphMarginClassName: '.main-contract-glyph',
+      glyphMarginHoverMessage: [
+        { value: 'Main contract' },
+      ],
+    },
+  };
+
+  const lastLineRange: monaco.IRange = {
+    startLineNumber: firstLineMatch.range.startLineNumber,
+    startColumn: 1,
+    endColumn: 10,
+    endLineNumber: model.getLineCount(),
+  };
+  const [ lastLineMatch ] = model
+    .findMatches(`^\\}`, lastLineRange, true, false, null, true)
+    .sort(sortByEndLineNumberAsc);
+
+  const restDecoration: monaco.editor.IModelDeltaDecoration = {
+    range: {
+      startLineNumber: firstLineMatch.range.startLineNumber + 1,
+      endLineNumber: lastLineMatch.range.startLineNumber,
+      startColumn: 1,
+      endColumn: 10, // doesn't really matter since isWholeLine is true
+    },
+    options: {
+      ...options,
+      className: '.main-contract-body',
+      marginClassName: '.main-contract-body',
+    },
+  };
+
+  editor.updateOptions({ glyphMargin: true });
+  model.deltaDecorations([], [ firstLineDecoration, restDecoration ]);
+}
diff --git a/ui/shared/monaco/utils/sortByEndLineNumberAsc.ts b/ui/shared/monaco/utils/sortByEndLineNumberAsc.ts
new file mode 100644
index 0000000000..08fc4536e6
--- /dev/null
+++ b/ui/shared/monaco/utils/sortByEndLineNumberAsc.ts
@@ -0,0 +1,13 @@
+import type * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
+
+export default function sortByEndLineNumberAsc(a: monaco.editor.FindMatch, b: monaco.editor.FindMatch) {
+  if (a.range.endLineNumber < b.range.endLineNumber) {
+    return -1;
+  }
+
+  if (a.range.endLineNumber > b.range.endLineNumber) {
+    return 1;
+  }
+
+  return 0;
+}
diff --git a/ui/shared/monaco/utils/themes.ts b/ui/shared/monaco/utils/themes.ts
index 238504c4eb..14a861a3df 100644
--- a/ui/shared/monaco/utils/themes.ts
+++ b/ui/shared/monaco/utils/themes.ts
@@ -37,6 +37,8 @@ export const light = {
     'custom.fileLink.hoverForeground': '#4299E1', // blue.400
     'custom.riskWarning.primaryBackground': '#FEEBCB', // orange.100
     'custom.riskWarning.background': '#FFFAF0', // orange.50
+    'custom.mainContract.header': 'rgba(233, 216, 253, 1)', // purple.100
+    'custom.mainContract.body': 'rgba(250, 245, 255, 1)', // purple.50
   } as const,
 };
 
@@ -79,5 +81,7 @@ export const dark = {
     'custom.fileLink.hoverForeground': '#4299E1', // blue.400
     'custom.riskWarning.primaryBackground': 'rgba(246, 173, 85, 0.3)', // orange.300
     'custom.riskWarning.background': 'rgba(246, 173, 85, 0.1)', // orange.300
+    'custom.mainContract.header': 'rgba(183, 148, 244, 0.3)', // purple.300
+    'custom.mainContract.body': 'rgba(214, 188, 250, 0.1)', // purple.200
   } as const,
 };
diff --git a/ui/shared/nft/NftHtmlFullscreen.tsx b/ui/shared/nft/NftHtmlFullscreen.tsx
index 0e28fab523..80f9bcddfe 100644
--- a/ui/shared/nft/NftHtmlFullscreen.tsx
+++ b/ui/shared/nft/NftHtmlFullscreen.tsx
@@ -9,7 +9,7 @@ interface Props {
   onClose: () => void;
 }
 
-const NftHtmlWithFullscreen = ({ src, isOpen, onClose }: Props) => {
+const NftHtmlFullscreen = ({ src, isOpen, onClose }: Props) => {
   return (
     <NftMediaFullscreenModal isOpen={ isOpen } onClose={ onClose }>
       <chakra.iframe
@@ -22,4 +22,4 @@ const NftHtmlWithFullscreen = ({ src, isOpen, onClose }: Props) => {
   );
 };
 
-export default NftHtmlWithFullscreen;
+export default NftHtmlFullscreen;
diff --git a/ui/shared/nft/NftHtmlWithFullscreen.tsx b/ui/shared/nft/NftHtmlWithFullscreen.tsx
deleted file mode 100644
index eca068fae0..0000000000
--- a/ui/shared/nft/NftHtmlWithFullscreen.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import { chakra, useDisclosure } from '@chakra-ui/react';
-import React from 'react';
-
-import NftHtml from './NftHtml';
-import NftMediaFullscreenModal from './NftMediaFullscreenModal';
-
-interface Props {
-  src: string;
-  onLoad: () => void;
-  onError: () => void;
-}
-
-const NftHtmlWithFullscreen = ({ src, onLoad, onError }: Props) => {
-  const { isOpen, onOpen, onClose } = useDisclosure();
-
-  return (
-    <>
-      <NftHtml src={ src } onLoad={ onLoad } onError={ onError } onClick={ onOpen }/>
-      <NftMediaFullscreenModal isOpen={ isOpen } onClose={ onClose }>
-        <chakra.iframe
-          w="90vw"
-          h="90vh"
-          src={ src }
-          sandbox="allow-scripts"
-          onLoad={ onLoad }
-          onError={ onError }
-        />
-      </NftMediaFullscreenModal>
-    </>
-  );
-};
-
-export default NftHtmlWithFullscreen;
diff --git a/ui/shared/nft/NftImageFullscreen.tsx b/ui/shared/nft/NftImageFullscreen.tsx
index 04fad72270..9d35c313d4 100644
--- a/ui/shared/nft/NftImageFullscreen.tsx
+++ b/ui/shared/nft/NftImageFullscreen.tsx
@@ -11,12 +11,29 @@ interface Props {
   onClose: () => void;
 }
 
-const NftImageWithFullscreen = ({ src, isOpen, onClose }: Props) => {
+const NftImageFullscreen = ({ src, isOpen, onClose }: Props) => {
+  const imgRef = React.useRef<HTMLImageElement>(null);
+  const [ hasDimentions, setHasDimentions ] = React.useState<boolean>(true);
+
+  const checkWidth = React.useCallback(() => {
+    if (imgRef.current?.getBoundingClientRect().width === 0) {
+      setHasDimentions(false);
+    }
+  }, [ ]);
+
   return (
     <NftMediaFullscreenModal isOpen={ isOpen } onClose={ onClose }>
-      <Image src={ src } alt="Token instance image" maxH="90vh" maxW="90vw"/>
+      <Image
+        src={ src }
+        alt="Token instance image"
+        maxH="90vh"
+        maxW="90vw"
+        ref={ imgRef }
+        onLoad={ checkWidth }
+        sx={ hasDimentions ? {} : { width: '90vw', height: '90vh' } }
+      />
     </NftMediaFullscreenModal>
   );
 };
 
-export default NftImageWithFullscreen;
+export default NftImageFullscreen;
diff --git a/ui/shared/nft/NftImageWithFullscreen.tsx b/ui/shared/nft/NftImageWithFullscreen.tsx
deleted file mode 100644
index 374ffbda92..0000000000
--- a/ui/shared/nft/NftImageWithFullscreen.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import {
-  Image,
-  useDisclosure,
-} from '@chakra-ui/react';
-import React from 'react';
-
-import NftImage from './NftImage';
-import NftMediaFullscreenModal from './NftMediaFullscreenModal';
-
-interface Props {
-  src: string;
-  onLoad: () => void;
-  onError: () => void;
-}
-
-const NftImageWithFullscreen = ({ src, onLoad, onError }: Props) => {
-  const { isOpen, onOpen, onClose } = useDisclosure();
-
-  return (
-    <>
-      <NftImage src={ src } onLoad={ onLoad } onError={ onError } onClick={ onOpen }/>
-      <NftMediaFullscreenModal isOpen={ isOpen } onClose={ onClose }>
-        <Image src={ src } alt="Token instance image" maxH="90vh" maxW="90vw"/>
-      </NftMediaFullscreenModal>
-    </>
-  );
-};
-
-export default NftImageWithFullscreen;
diff --git a/ui/shared/nft/NftMedia.pw.tsx b/ui/shared/nft/NftMedia.pw.tsx
index 71d09de045..4b91def420 100644
--- a/ui/shared/nft/NftMedia.pw.tsx
+++ b/ui/shared/nft/NftMedia.pw.tsx
@@ -10,7 +10,54 @@ test.describe('no url', () => {
   test('preview +@dark-mode', async({ mount }) => {
     const component = await mount(
       <TestApp>
-        <NftMedia url={ null }/>
+        <NftMedia animationUrl={ null } imageUrl={ null }/>
+      </TestApp>,
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+
+  test('with fallback', async({ mount, page }) => {
+    const IMAGE_URL = 'https://localhost:3000/my-image.jpg';
+
+    await page.route(IMAGE_URL, (route) => {
+      return route.fulfill({
+        status: 200,
+        path: './playwright/mocks/image_long.jpg',
+      });
+    });
+
+    const component = await mount(
+      <TestApp>
+        <NftMedia animationUrl={ null } imageUrl={ IMAGE_URL }/>
+      </TestApp>,
+    );
+
+    await expect(component).toHaveScreenshot();
+  });
+
+  test('non-media url and fallback', async({ mount, page }) => {
+    const ANIMATION_URL = 'https://localhost:3000/my-animation.m3u8';
+    const ANIMATION_MEDIA_TYPE_API_URL = `/node-api/media-type?url=${ encodeURIComponent(ANIMATION_URL) }`;
+    const IMAGE_URL = 'https://localhost:3000/my-image.jpg';
+
+    await page.route(ANIMATION_MEDIA_TYPE_API_URL, (route) => {
+      return route.fulfill({
+        status: 200,
+        body: JSON.stringify({ type: undefined }),
+      });
+    });
+
+    await page.route(IMAGE_URL, (route) => {
+      return route.fulfill({
+        status: 200,
+        path: './playwright/mocks/image_long.jpg',
+      });
+    });
+
+    const component = await mount(
+      <TestApp>
+        <NftMedia animationUrl={ ANIMATION_URL } imageUrl={ IMAGE_URL }/>
       </TestApp>,
     );
 
@@ -35,7 +82,7 @@ test.describe('image', () => {
   test('preview +@dark-mode', async({ mount }) => {
     const component = await mount(
       <TestApp>
-        <NftMedia url={ MEDIA_URL }/>
+        <NftMedia animationUrl={ MEDIA_URL } imageUrl={ null }/>
       </TestApp>,
     );
 
@@ -55,7 +102,7 @@ test('image preview hover', async({ mount, page }) => {
 
   const component = await mount(
     <TestApp>
-      <NftMedia url={ MEDIA_URL } w="250px"/>
+      <NftMedia animationUrl={ MEDIA_URL } imageUrl={ null } w="250px"/>
     </TestApp>,
   );
 
@@ -75,7 +122,7 @@ test('image fullscreen +@dark-mode +@mobile', async({ mount, page }) => {
   });
   const component = await mount(
     <TestApp>
-      <NftMedia url={ MEDIA_URL } withFullscreen w="250px"/>
+      <NftMedia animationUrl={ MEDIA_URL } imageUrl={ null } withFullscreen w="250px"/>
     </TestApp>,
   );
 
@@ -107,7 +154,7 @@ test.describe('page', () => {
   test('preview +@dark-mode', async({ mount }) => {
     const component = await mount(
       <TestApp>
-        <NftMedia url={ MEDIA_URL }/>
+        <NftMedia animationUrl={ MEDIA_URL } imageUrl={ null }/>
       </TestApp>,
     );
 
diff --git a/ui/shared/nft/NftMedia.tsx b/ui/shared/nft/NftMedia.tsx
index 9427791f5f..51dd03b6e5 100644
--- a/ui/shared/nft/NftMedia.tsx
+++ b/ui/shared/nft/NftMedia.tsx
@@ -9,23 +9,31 @@ import NftImage from './NftImage';
 import NftImageFullscreen from './NftImageFullscreen';
 import NftVideo from './NftVideo';
 import NftVideoFullscreen from './NftVideoFullscreen';
-import useNftMediaType from './useNftMediaType';
+import useNftMediaInfo from './useNftMediaInfo';
 import { mediaStyleProps } from './utils';
 
 interface Props {
-  url: string | null;
+  imageUrl: string | null;
+  animationUrl: string | null;
   className?: string;
   isLoading?: boolean;
   withFullscreen?: boolean;
 }
 
-const NftMedia = ({ url, className, isLoading, withFullscreen }: Props) => {
-  const [ isMediaLoading, setIsMediaLoading ] = React.useState(Boolean(url));
+const NftMedia = ({ imageUrl, animationUrl, className, isLoading, withFullscreen }: Props) => {
+  const [ isMediaLoading, setIsMediaLoading ] = React.useState(true);
   const [ isLoadingError, setIsLoadingError ] = React.useState(false);
 
   const { ref, inView } = useInView({ triggerOnce: true });
 
-  const type = useNftMediaType(url, !isLoading && inView);
+  const mediaInfo = useNftMediaInfo({ imageUrl, animationUrl, isEnabled: !isLoading && inView });
+
+  React.useEffect(() => {
+    if (!isLoading && !mediaInfo) {
+      setIsMediaLoading(false);
+      setIsLoadingError(true);
+    }
+  }, [ isLoading, mediaInfo ]);
 
   const handleMediaLoaded = React.useCallback(() => {
     setIsMediaLoading(false);
@@ -39,11 +47,21 @@ const NftMedia = ({ url, className, isLoading, withFullscreen }: Props) => {
   const { isOpen, onOpen, onClose } = useDisclosure();
 
   const content = (() => {
-    if (!url || isLoadingError) {
+    if (isLoading) {
+      return null;
+    }
+
+    if (!mediaInfo || isLoadingError) {
       const styleProps = withFullscreen ? {} : mediaStyleProps;
       return <NftFallback { ...styleProps }/>;
     }
 
+    const { type, url } = mediaInfo;
+
+    if (!url) {
+      return null;
+    }
+
     const props = {
       src: url,
       onLoad: handleMediaLoaded,
@@ -64,7 +82,13 @@ const NftMedia = ({ url, className, isLoading, withFullscreen }: Props) => {
   })();
 
   const modal = (() => {
-    if (!url || !withFullscreen) {
+    if (!mediaInfo || !withFullscreen || isLoading) {
+      return null;
+    }
+
+    const { type, url } = mediaInfo;
+
+    if (!url) {
       return null;
     }
 
diff --git a/ui/shared/nft/NftVideoFullscreen.tsx b/ui/shared/nft/NftVideoFullscreen.tsx
index dc1685c26b..07fa250b1e 100644
--- a/ui/shared/nft/NftVideoFullscreen.tsx
+++ b/ui/shared/nft/NftVideoFullscreen.tsx
@@ -10,7 +10,7 @@ interface Props {
   onClose: () => void;
 }
 
-const NftVideoWithFullscreen = ({ src, isOpen, onClose }: Props) => {
+const NftVideoFullscreen = ({ src, isOpen, onClose }: Props) => {
   return (
     <NftMediaFullscreenModal isOpen={ isOpen } onClose={ onClose }>
       <chakra.video
@@ -23,4 +23,4 @@ const NftVideoWithFullscreen = ({ src, isOpen, onClose }: Props) => {
   );
 };
 
-export default NftVideoWithFullscreen;
+export default NftVideoFullscreen;
diff --git a/ui/shared/nft/NftVideoWithFullscreen.tsx b/ui/shared/nft/NftVideoWithFullscreen.tsx
deleted file mode 100644
index ed676379e7..0000000000
--- a/ui/shared/nft/NftVideoWithFullscreen.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import {
-  chakra,
-  useDisclosure,
-} from '@chakra-ui/react';
-import React from 'react';
-
-import NftMediaFullscreenModal from './NftMediaFullscreenModal';
-import NftVideo from './NftVideo';
-import { videoPlayProps } from './utils';
-
-interface Props {
-  src: string;
-  onLoad: () => void;
-  onError: () => void;
-}
-
-const NftVideoWithFullscreen = ({ src, onLoad, onError }: Props) => {
-  const { isOpen, onOpen, onClose } = useDisclosure();
-
-  return (
-    <>
-      <NftVideo src={ src } onLoad={ onLoad } onError={ onError } onClick={ onOpen }/>
-      <NftMediaFullscreenModal isOpen={ isOpen } onClose={ onClose }>
-        <chakra.video
-          { ...videoPlayProps }
-          src={ src }
-          onCanPlayThrough={ onLoad }
-          onError={ onError }
-          maxH="90vh"
-          maxW="90vw"
-        />
-      </NftMediaFullscreenModal>
-    </>
-  );
-};
-
-export default NftVideoWithFullscreen;
diff --git a/ui/shared/nft/__screenshots__/NftMedia.pw.tsx_default_no-url-non-media-url-and-fallback-1.png b/ui/shared/nft/__screenshots__/NftMedia.pw.tsx_default_no-url-non-media-url-and-fallback-1.png
new file mode 100644
index 0000000000..4273139faf
Binary files /dev/null and b/ui/shared/nft/__screenshots__/NftMedia.pw.tsx_default_no-url-non-media-url-and-fallback-1.png differ
diff --git a/ui/shared/nft/__screenshots__/NftMedia.pw.tsx_default_no-url-with-fallback-1.png b/ui/shared/nft/__screenshots__/NftMedia.pw.tsx_default_no-url-with-fallback-1.png
new file mode 100644
index 0000000000..4273139faf
Binary files /dev/null and b/ui/shared/nft/__screenshots__/NftMedia.pw.tsx_default_no-url-with-fallback-1.png differ
diff --git a/ui/shared/nft/useNftMediaInfo.tsx b/ui/shared/nft/useNftMediaInfo.tsx
new file mode 100644
index 0000000000..7c36f828e9
--- /dev/null
+++ b/ui/shared/nft/useNftMediaInfo.tsx
@@ -0,0 +1,98 @@
+import { useQuery } from '@tanstack/react-query';
+import React from 'react';
+
+import type { StaticRoute } from 'nextjs-routes';
+import { route } from 'nextjs-routes';
+
+import type { ResourceError } from 'lib/api/resources';
+import useFetch from 'lib/hooks/useFetch';
+
+import type { MediaType } from './utils';
+import { getPreliminaryMediaType } from './utils';
+
+interface Params {
+  imageUrl: string | null;
+  animationUrl: string | null;
+  isEnabled: boolean;
+}
+
+interface ReturnType {
+  type: MediaType | undefined;
+  url: string | null;
+}
+
+export default function useNftMediaInfo({ imageUrl, animationUrl, isEnabled }: Params): ReturnType | null {
+
+  const primaryQuery = useNftMediaTypeQuery(animationUrl, isEnabled);
+  const secondaryQuery = useNftMediaTypeQuery(imageUrl, !primaryQuery.isPending && !primaryQuery.data);
+
+  return React.useMemo(() => {
+    if (primaryQuery.isPending) {
+      return {
+        type: undefined,
+        url: animationUrl,
+      };
+    }
+
+    if (primaryQuery.data) {
+      return primaryQuery.data;
+    }
+
+    if (secondaryQuery.isPending) {
+      return {
+        type: undefined,
+        url: imageUrl,
+      };
+    }
+
+    if (secondaryQuery.data) {
+      return secondaryQuery.data;
+    }
+
+    return null;
+  }, [ animationUrl, imageUrl, primaryQuery.data, primaryQuery.isPending, secondaryQuery.data, secondaryQuery.isPending ]);
+}
+
+function useNftMediaTypeQuery(url: string | null, enabled: boolean) {
+  const fetch = useFetch();
+
+  return useQuery<unknown, ResourceError<unknown>, ReturnType | null>({
+    queryKey: [ 'nft-media-type', url ],
+    queryFn: async() => {
+      if (!url) {
+        return null;
+      }
+
+      // media could be either image, gif, video or html-page
+      // so we pre-fetch the resources in order to get its content type
+      // have to do it via Node.js due to strict CSP for connect-src
+      // but in order not to abuse our server firstly we check file url extension
+      // and if it is valid we will trust it and display corresponding media component
+
+      const preliminaryType = getPreliminaryMediaType(url);
+
+      if (preliminaryType) {
+        return { type: preliminaryType, url };
+      }
+
+      const type = await (async() => {
+        try {
+          const mediaTypeResourceUrl = route({ pathname: '/node-api/media-type' as StaticRoute<'/api/media-type'>['pathname'], query: { url } });
+          const response = await fetch<{ type: MediaType | undefined }, ResourceError>(mediaTypeResourceUrl, undefined, { resource: 'media-type' });
+
+          return 'type' in response ? response.type : undefined;
+        } catch (error) {
+          return;
+        }
+      })();
+
+      if (!type) {
+        return null;
+      }
+
+      return { type, url };
+    },
+    enabled,
+    staleTime: Infinity,
+  });
+}
diff --git a/ui/shared/nft/useNftMediaType.tsx b/ui/shared/nft/useNftMediaType.tsx
deleted file mode 100644
index 4444b122e3..0000000000
--- a/ui/shared/nft/useNftMediaType.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import { useQuery } from '@tanstack/react-query';
-
-import type { StaticRoute } from 'nextjs-routes';
-import { route } from 'nextjs-routes';
-
-import type { ResourceError } from 'lib/api/resources';
-import useFetch from 'lib/hooks/useFetch';
-
-import type { MediaType } from './utils';
-import { getPreliminaryMediaType } from './utils';
-
-export default function useNftMediaType(url: string | null, isEnabled: boolean) {
-
-  const fetch = useFetch();
-
-  const { data } = useQuery<unknown, ResourceError<unknown>, MediaType>({
-    queryKey: [ 'nft-media-type', url ],
-    queryFn: async() => {
-      if (!url) {
-        return 'image';
-      }
-
-      // media could be either image, gif, video or html-page
-      // so we pre-fetch the resources in order to get its content type
-      // have to do it via Node.js due to strict CSP for connect-src
-      // but in order not to abuse our server firstly we check file url extension
-      // and if it is valid we will trust it and display corresponding media component
-
-      const preliminaryType = getPreliminaryMediaType(url);
-
-      if (preliminaryType) {
-        return preliminaryType;
-      }
-
-      try {
-        const mediaTypeResourceUrl = route({ pathname: '/node-api/media-type' as StaticRoute<'/api/media-type'>['pathname'], query: { url } });
-        const response = await fetch<{ type: MediaType | undefined }, ResourceError>(mediaTypeResourceUrl, undefined, { resource: 'media-type' });
-
-        return 'type' in response ? response.type ?? 'image' : 'image';
-      } catch (error) {
-        return 'image';
-      }
-    },
-    enabled: isEnabled && Boolean(url),
-    staleTime: Infinity,
-  });
-
-  return data;
-}
diff --git a/ui/shared/pagination/useQueryWithPages.ts b/ui/shared/pagination/useQueryWithPages.ts
index 8f6edc7a89..b95782153e 100644
--- a/ui/shared/pagination/useQueryWithPages.ts
+++ b/ui/shared/pagination/useQueryWithPages.ts
@@ -24,6 +24,8 @@ export interface Params<Resource extends PaginatedResources> {
 
 type NextPageParams = Record<string, unknown>;
 
+const INITIAL_PAGE_PARAMS = { '1': {} };
+
 function getPaginationParamsFromQuery(queryString: string | Array<string> | undefined) {
   if (queryString) {
     try {
@@ -34,10 +36,18 @@ function getPaginationParamsFromQuery(queryString: string | Array<string> | unde
   return {};
 }
 
+function getNextPageParams<R extends PaginatedResources>(data: ResourcePayload<R> | undefined) {
+  if (!data || typeof data !== 'object' || !('next_page_params' in data)) {
+    return;
+  }
+
+  return data.next_page_params;
+}
+
 export type QueryWithPagesResult<Resource extends PaginatedResources> =
 UseQueryResult<ResourcePayload<Resource>, ResourceError<unknown>> &
 {
-  onFilterChange: (filters: PaginationFilters<Resource>) => void;
+  onFilterChange: <R extends PaginatedResources = Resource>(filters: PaginationFilters<R>) => void;
   onSortingChange: (sorting?: PaginationSorting<Resource>) => void;
   pagination: PaginationParams;
 }
@@ -76,29 +86,30 @@ export default function useQueryWithPages<Resource extends PaginatedResources>({
     },
   });
   const { data } = queryResult;
+  const nextPageParams = getNextPageParams(data);
 
   const onNextPageClick = useCallback(() => {
-    if (!data?.next_page_params) {
+    if (!nextPageParams) {
       // we hide next page button if no next_page_params
       return;
     }
 
     setPageParams((prev) => ({
       ...prev,
-      [page + 1]: data.next_page_params as NextPageParams,
+      [page + 1]: nextPageParams as NextPageParams,
     }));
     setPage(prev => prev + 1);
 
     const nextPageQuery = {
       ...router.query,
       page: String(page + 1),
-      next_page_params: encodeURIComponent(JSON.stringify(data.next_page_params)),
+      next_page_params: encodeURIComponent(JSON.stringify(nextPageParams)),
     };
 
     setHasPages(true);
     scrollToTop();
     router.push({ pathname: router.pathname, query: nextPageQuery }, undefined, { shallow: true });
-  }, [ data?.next_page_params, page, router, scrollToTop ]);
+  }, [ nextPageParams, page, router, scrollToTop ]);
 
   const onPrevPageClick = useCallback(() => {
     // returning to the first page
@@ -127,7 +138,7 @@ export default function useQueryWithPages<Resource extends PaginatedResources>({
     router.push({ pathname: router.pathname, query: nextRouterQuery }, undefined, { shallow: true }).then(() => {
       queryClient.removeQueries({ queryKey: [ resourceName ] });
       setPage(1);
-      setPageParams({});
+      setPageParams(INITIAL_PAGE_PARAMS);
       window.setTimeout(() => {
         // FIXME after router is updated we still have inactive queries for previously visited page (e.g third), where we came from
         // so have to remove it but with some delay :)
@@ -136,12 +147,13 @@ export default function useQueryWithPages<Resource extends PaginatedResources>({
     });
   }, [ queryClient, resourceName, router, scrollToTop ]);
 
-  const onFilterChange = useCallback((newFilters: PaginationFilters<Resource> | undefined) => {
-    const newQuery = omit<typeof router.query>(router.query, 'next_page_params', 'page', resource.filterFields);
+  const onFilterChange = useCallback(<R extends PaginatedResources = Resource>(newFilters: PaginationFilters<R> | undefined) => {
+    const newQuery = omit<typeof router.query>(router.query, 'next_page_params', 'page', 'filterFields' in resource ? resource.filterFields : []);
     if (newFilters) {
       Object.entries(newFilters).forEach(([ key, value ]) => {
-        if (value && value.length) {
-          newQuery[key] = Array.isArray(value) ? value.join(',') : (value || '');
+        const isValidValue = typeof value === 'boolean' || (value && value.length);
+        if (isValidValue) {
+          newQuery[key] = Array.isArray(value) ? value.join(',') : (String(value) || '');
         }
       });
     }
@@ -156,9 +168,9 @@ export default function useQueryWithPages<Resource extends PaginatedResources>({
     ).then(() => {
       setHasPages(false);
       setPage(1);
-      setPageParams({});
+      setPageParams(INITIAL_PAGE_PARAMS);
     });
-  }, [ router, resource.filterFields, scrollToTop ]);
+  }, [ router, resource, scrollToTop ]);
 
   const onSortingChange = useCallback((newSorting: PaginationSorting<Resource> | undefined) => {
     const newQuery = {
@@ -176,11 +188,10 @@ export default function useQueryWithPages<Resource extends PaginatedResources>({
     ).then(() => {
       setHasPages(false);
       setPage(1);
-      setPageParams({});
+      setPageParams(INITIAL_PAGE_PARAMS);
     });
   }, [ router, scrollToTop ]);
 
-  const nextPageParams = data?.next_page_params;
   const hasNextPage = nextPageParams ? Object.keys(nextPageParams).length > 0 : false;
 
   const pagination = {
diff --git a/ui/shared/pagination/utils.ts b/ui/shared/pagination/utils.ts
new file mode 100644
index 0000000000..fc0e3cfdb7
--- /dev/null
+++ b/ui/shared/pagination/utils.ts
@@ -0,0 +1,13 @@
+import type { PaginationParams } from './types';
+
+export const emptyPagination: PaginationParams = {
+  page: 1,
+  onNextPageClick: () => {},
+  onPrevPageClick: () => {},
+  resetPage: () => {},
+  hasPages: false,
+  hasNextPage: false,
+  canGoBackwards: false,
+  isLoading: false,
+  isVisible: false,
+};
diff --git a/ui/shared/radioButtonGroup/RadioButtonGroup.tsx b/ui/shared/radioButtonGroup/RadioButtonGroup.tsx
index e4eb0b2358..f110ef542f 100644
--- a/ui/shared/radioButtonGroup/RadioButtonGroup.tsx
+++ b/ui/shared/radioButtonGroup/RadioButtonGroup.tsx
@@ -9,6 +9,7 @@ type RadioItemProps = {
   title: string;
   icon?: IconName;
   onlyIcon: false | undefined;
+  contentAfter?: React.ReactNode;
 } | {
   title: string;
   icon: IconName;
@@ -67,9 +68,11 @@ const RadioButton = (props: RadioButtonProps) => {
     >
       <input { ...input }/>
       <Flex
+        alignItems="center"
         { ...checkbox }
       >
         { props.title }
+        { props.contentAfter }
       </Flex>
     </Button>
   );
@@ -80,15 +83,22 @@ type RadioButtonGroupProps<T extends string> = {
   name: string;
   defaultValue: string;
   options: Array<{ value: T } & RadioItemProps>;
+  autoWidth?: boolean;
 }
 
-const RadioButtonGroup = <T extends string>({ onChange, name, defaultValue, options }: RadioButtonGroupProps<T>) => {
+const RadioButtonGroup = <T extends string>({ onChange, name, defaultValue, options, autoWidth = false }: RadioButtonGroupProps<T>) => {
   const { getRootProps, getRadioProps } = useRadioGroup({ name, defaultValue, onChange });
 
   const group = getRootProps();
 
   return (
-    <ButtonGroup { ...group } isAttached size="sm" display="grid" gridTemplateColumns={ `repeat(${ options.length }, 1fr)` }>
+    <ButtonGroup
+      { ...group }
+      isAttached
+      size="sm"
+      display="grid"
+      gridTemplateColumns={ `repeat(${ options.length }, ${ autoWidth ? 'auto' : '1fr' })` }
+    >
       { options.map((option) => {
         const props = getRadioProps({ value: option.value });
         return <RadioButton { ...props } key={ option.value } { ...option }/>;
diff --git a/ui/shared/search/utils.ts b/ui/shared/search/utils.ts
index 9d83e4cb03..aa8a8cac09 100644
--- a/ui/shared/search/utils.ts
+++ b/ui/shared/search/utils.ts
@@ -1,7 +1,9 @@
 import type { SearchResultItem } from 'types/api/search';
 import type { MarketplaceAppOverview } from 'types/client/marketplace';
 
-export type ApiCategory = 'token' | 'nft' | 'address' | 'public_tag' | 'transaction' | 'block' | 'universal_profile';
+import config from 'configs/app';
+
+export type ApiCategory = 'token' | 'nft' | 'address' | 'public_tag' | 'transaction' | 'block' | 'universal_profile'| 'user_operation' | 'blob';
 export type Category = ApiCategory | 'app';
 
 export type ItemsCategoriesMap =
@@ -14,7 +16,7 @@ export type SearchResultAppItem = {
 }
 
 export const searchCategories: Array<{id: Category; title: string }> = [
-  { id: 'app', title: 'Apps' },
+  { id: 'app', title: 'DApps' },
   { id: 'token', title: 'Tokens (ERC-20)' },
   { id: 'nft', title: 'NFTs (ERC-721 & 1155)' },
   { id: 'address', title: 'Addresses' },
@@ -22,10 +24,15 @@ export const searchCategories: Array<{id: Category; title: string }> = [
   { id: 'transaction', title: 'Transactions' },
   { id: 'block', title: 'Blocks' },
   { id: 'universal_profile', title: 'Universal Profiles' },
+  { id: 'blob', title: 'Blobs' },
 ];
 
+if (config.features.userOps.isEnabled) {
+  searchCategories.push({ id: 'user_operation', title: 'User operations' });
+}
+
 export const searchItemTitles: Record<Category, { itemTitle: string; itemTitleShort: string }> = {
-  app: { itemTitle: 'App', itemTitleShort: 'App' },
+  app: { itemTitle: 'DApp', itemTitleShort: 'App' },
   token: { itemTitle: 'Token', itemTitleShort: 'Token' },
   nft: { itemTitle: 'NFT', itemTitleShort: 'NFT' },
   address: { itemTitle: 'Address', itemTitleShort: 'Address' },
@@ -33,6 +40,8 @@ export const searchItemTitles: Record<Category, { itemTitle: string; itemTitleSh
   transaction: { itemTitle: 'Transaction', itemTitleShort: 'Txn' },
   block: { itemTitle: 'Block', itemTitleShort: 'Block' },
   universal_profile: { itemTitle: 'Universal Profile', itemTitleShort: 'UP' },
+  user_operation: { itemTitle: 'User operation', itemTitleShort: 'User op' },
+  blob: { itemTitle: 'Blob', itemTitleShort: 'Blob' },
 };
 
 export function getItemCategory(item: SearchResultItem | SearchResultAppItem): Category | undefined {
@@ -62,5 +71,11 @@ export function getItemCategory(item: SearchResultItem | SearchResultAppItem): C
     case 'universal_profile': {
       return 'universal_profile';
     }
+    case 'user_operation': {
+      return 'user_operation';
+    }
+    case 'blob': {
+      return 'blob';
+    }
   }
 }
diff --git a/ui/shared/solidityscanReport/SolidityscanReportButton.tsx b/ui/shared/solidityscanReport/SolidityscanReportButton.tsx
new file mode 100644
index 0000000000..d5c43f107f
--- /dev/null
+++ b/ui/shared/solidityscanReport/SolidityscanReportButton.tsx
@@ -0,0 +1,46 @@
+import { Button, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import IconSvg from 'ui/shared/IconSvg';
+
+import useScoreLevelAndColor from './useScoreLevelAndColor';
+
+interface Props {
+  className?: string;
+  score: number;
+  isLoading?: boolean;
+  height?: string;
+  onlyIcon?: boolean;
+  onClick?: () => void;
+}
+
+const SolidityscanReportButton = (
+  { className, score, isLoading, height = '32px', onlyIcon, onClick }: Props,
+  ref: React.ForwardedRef<HTMLButtonElement>,
+) => {
+  const { scoreColor } = useScoreLevelAndColor(score);
+
+  return (
+    <Skeleton isLoaded={ !isLoading } borderRadius="base">
+      <Button
+        ref={ ref }
+        className={ className }
+        color={ scoreColor }
+        size="sm"
+        variant="outline"
+        colorScheme="gray"
+        onClick={ onClick }
+        aria-label="SolidityScan score"
+        fontWeight={ 500 }
+        px="6px"
+        h={ height }
+        flexShrink={ 0 }
+      >
+        <IconSvg name={ score < 80 ? 'score/score-not-ok' : 'score/score-ok' } boxSize={ 5 } mr={ onlyIcon ? 0 : 1 }/>
+        { onlyIcon ? null : score }
+      </Button>
+    </Skeleton>
+  );
+};
+
+export default React.forwardRef(SolidityscanReportButton);
diff --git a/ui/shared/solidityscanReport/SolidityscanReportDetails.tsx b/ui/shared/solidityscanReport/SolidityscanReportDetails.tsx
new file mode 100644
index 0000000000..2d2a5cf140
--- /dev/null
+++ b/ui/shared/solidityscanReport/SolidityscanReportDetails.tsx
@@ -0,0 +1,60 @@
+import { Box, Flex, Text, Grid, useColorModeValue, chakra } from '@chakra-ui/react';
+import React from 'react';
+
+import type { SolidityscanReport } from 'types/api/contract';
+
+type DistributionItem = {
+  id: keyof SolidityscanReport['scan_report']['scan_summary']['issue_severity_distribution'];
+  name: string;
+  color: string;
+}
+
+const DISTRIBUTION_ITEMS: Array<DistributionItem> = [
+  { id: 'critical', name: 'Critical', color: '#891F11' },
+  { id: 'high', name: 'High', color: '#EC672C' },
+  { id: 'medium', name: 'Medium', color: '#FBE74D' },
+  { id: 'low', name: 'Low', color: '#68C88E' },
+  { id: 'informational', name: 'Informational', color: '#A3AEBE' },
+  { id: 'gas', name: 'Gas', color: '#A47585' },
+];
+
+interface Props {
+  vulnerabilities: SolidityscanReport['scan_report']['scan_summary']['issue_severity_distribution'];
+  vulnerabilitiesCount: number;
+}
+
+type ItemProps = {
+  item: DistributionItem;
+  vulnerabilities: SolidityscanReport['scan_report']['scan_summary']['issue_severity_distribution'];
+  vulnerabilitiesCount: number;
+}
+
+const SolidityScanReportItem = ({ item, vulnerabilities, vulnerabilitiesCount }: ItemProps) => {
+  const bgBar = useColorModeValue('blackAlpha.50', 'whiteAlpha.50');
+  const yetAnotherGrayColor = useColorModeValue('gray.400', 'gray.500');
+
+  return (
+    <>
+      <Box w={ 3 } h={ 3 } bg={ item.color } borderRadius="6px" mr={ 2 }></Box>
+      <Flex justifyContent="space-between" mr={ 3 }>
+        <Text>{ item.name }</Text>
+        <Text color={ vulnerabilities[item.id] > 0 ? 'text' : yetAnotherGrayColor }>{ vulnerabilities[item.id] }</Text>
+      </Flex>
+      <Box bg={ bgBar } h="10px" borderRadius="8px">
+        <Box bg={ item.color } w={ vulnerabilities[item.id] / vulnerabilitiesCount } h="10px" borderRadius="8px"/>
+      </Box>
+    </>
+  );
+};
+
+const SolidityscanReportDetails = ({ vulnerabilities, vulnerabilitiesCount }: Props) => {
+  return (
+    <Grid templateColumns="20px 1fr 100px" alignItems="center" rowGap={ 2 }>
+      { DISTRIBUTION_ITEMS.map(item => (
+        <SolidityScanReportItem item={ item } key={ item.id } vulnerabilities={ vulnerabilities } vulnerabilitiesCount={ vulnerabilitiesCount }/>
+      )) }
+    </Grid>
+  );
+};
+
+export default chakra(SolidityscanReportDetails);
diff --git a/ui/shared/solidityscanReport/SolidityscanReportScore.tsx b/ui/shared/solidityscanReport/SolidityscanReportScore.tsx
new file mode 100644
index 0000000000..56bd296630
--- /dev/null
+++ b/ui/shared/solidityscanReport/SolidityscanReportScore.tsx
@@ -0,0 +1,45 @@
+import { Box, Flex, Text, chakra, Center, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import IconSvg from 'ui/shared/IconSvg';
+
+import useScoreLevelAndColor from './useScoreLevelAndColor';
+
+interface Props {
+  className?: string;
+  score: number;
+}
+
+const SolidityscanReportScore = ({ className, score }: Props) => {
+  const { scoreLevel, scoreColor } = useScoreLevelAndColor(score);
+
+  const chartGrayColor = useColorModeValue('gray.100', 'gray.700');
+  const yetAnotherGrayColor = useColorModeValue('gray.400', 'gray.500');
+  const popoverBgColor = useColorModeValue('white', 'gray.900');
+
+  return (
+    <Flex className={ className } alignItems="center">
+      <Box
+        w={ 12 }
+        h={ 12 }
+        bgGradient={ `conic-gradient(${ scoreColor } 0, ${ scoreColor } ${ score }%, ${ chartGrayColor } 0, ${ chartGrayColor } 100%)` }
+        borderRadius="24px"
+        position="relative"
+        mr={ 3 }
+      >
+        <Center position="absolute" w="38px" h="38px" top="5px" right="5px" bg={ popoverBgColor } borderRadius="20px">
+          <IconSvg name={ score < 80 ? 'score/score-not-ok' : 'score/score-ok' } boxSize={ 5 } color={ scoreColor }/>
+        </Center>
+      </Box>
+      <Box>
+        <Flex>
+          <Text color={ scoreColor } fontSize="lg" fontWeight={ 500 }>{ score }</Text>
+          <Text color={ yetAnotherGrayColor } fontSize="lg" fontWeight={ 500 } whiteSpace="pre"> / 100</Text>
+        </Flex>
+        <Text color={ scoreColor } fontWeight={ 500 }>Security score is { scoreLevel }</Text>
+      </Box>
+    </Flex>
+  );
+};
+
+export default chakra(SolidityscanReportScore);
diff --git a/ui/shared/solidityscanReport/useScoreLevelAndColor.ts b/ui/shared/solidityscanReport/useScoreLevelAndColor.ts
new file mode 100644
index 0000000000..b61d2a9109
--- /dev/null
+++ b/ui/shared/solidityscanReport/useScoreLevelAndColor.ts
@@ -0,0 +1,21 @@
+import { useColorModeValue } from '@chakra-ui/react';
+
+export default function useScoreLevelAndColor(score: number) {
+  const greatScoreColor = useColorModeValue('green.600', 'green.400');
+  const averageScoreColor = useColorModeValue('purple.600', 'purple.400');
+  const lowScoreColor = useColorModeValue('red.600', 'red.400');
+
+  let scoreColor;
+  let scoreLevel;
+  if (score >= 80) {
+    scoreColor = greatScoreColor;
+    scoreLevel = 'GREAT';
+  } else if (score >= 30) {
+    scoreColor = averageScoreColor;
+    scoreLevel = 'AVERAGE';
+  } else {
+    scoreColor = lowScoreColor;
+    scoreLevel = 'LOW';
+  }
+  return { scoreColor, scoreLevel };
+}
diff --git a/ui/shared/stats/StatsWidget.tsx b/ui/shared/stats/StatsWidget.tsx
new file mode 100644
index 0000000000..f95220bac9
--- /dev/null
+++ b/ui/shared/stats/StatsWidget.tsx
@@ -0,0 +1,67 @@
+import { Box, Flex, Text, Skeleton, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+import Hint from 'ui/shared/Hint';
+
+type Props = {
+  label: string;
+  value: string;
+  hint?: string;
+  isLoading?: boolean;
+  diff?: string | number;
+  diffFormatted?: string;
+  diffPeriod?: '24h';
+}
+
+const StatsWidget = ({ label, value, isLoading, hint, diff, diffPeriod = '24h', diffFormatted }: Props) => {
+  const bgColor = useColorModeValue('blue.50', 'blue.800');
+  const skeletonBgColor = useColorModeValue('blackAlpha.50', 'whiteAlpha.50');
+  const hintColor = useColorModeValue('gray.600', 'gray.400');
+
+  return (
+    <Flex
+      alignItems="flex-start"
+      bgColor={ isLoading ? skeletonBgColor : bgColor }
+      px={ 3 }
+      py={{ base: 2, lg: 3 }}
+      borderRadius="md"
+      justifyContent="space-between"
+      columnGap={ 3 }
+    >
+      <Box>
+        <Skeleton
+          isLoaded={ !isLoading }
+          color="text_secondary"
+          fontSize="xs"
+          w="fit-content"
+        >
+          <span>{ label }</span>
+        </Skeleton>
+        <Skeleton
+          isLoaded={ !isLoading }
+          w="fit-content"
+          display="flex"
+          alignItems="baseline"
+          mt={ 1 }
+        >
+          <Text fontWeight={ 500 } fontSize="lg" lineHeight={ 6 }>{ value }</Text>
+          { diff && Number(diff) > 0 && (
+            <>
+              <Text fontWeight={ 500 } ml={ 2 } mr={ 1 } fontSize="lg" lineHeight={ 6 } color="green.500">
+                +{ diffFormatted || Number(diff).toLocaleString() }
+              </Text>
+              <Text variant="secondary" fontSize="sm">({ diffPeriod })</Text>
+            </>
+          ) }
+        </Skeleton>
+      </Box>
+      { hint && (
+        <Skeleton isLoaded={ !isLoading } alignSelf="center" borderRadius="base">
+          <Hint label={ hint } boxSize={ 6 } color={ hintColor }/>
+        </Skeleton>
+      ) }
+    </Flex>
+  );
+};
+
+export default StatsWidget;
diff --git a/ui/shared/statusTag/StatusTag.tsx b/ui/shared/statusTag/StatusTag.tsx
index 8a9d8a3519..fb9d59a97d 100644
--- a/ui/shared/statusTag/StatusTag.tsx
+++ b/ui/shared/statusTag/StatusTag.tsx
@@ -37,9 +37,9 @@ const StatusTag = ({ type, text, errorText, isLoading }: Props) => {
 
   return (
     <Tooltip label={ errorText }>
-      <Tag colorScheme={ colorScheme } display="inline-flex" isLoading={ isLoading }>
-        <IconSvg boxSize={ 2.5 } name={ icon } mr={ 2 }/>
-        <TagLabel>{ text }</TagLabel>
+      <Tag colorScheme={ colorScheme } display="flex" isLoading={ isLoading } >
+        <IconSvg boxSize={ 2.5 } name={ icon } mr={ 2 } flexShrink={ 0 }/>
+        <TagLabel display="block">{ text }</TagLabel>
       </Tag>
     </Tooltip>
   );
diff --git a/ui/shared/statusTag/TxStatus.tsx b/ui/shared/statusTag/TxStatus.tsx
index 9fcfec58d4..2288ac46c0 100644
--- a/ui/shared/statusTag/TxStatus.tsx
+++ b/ui/shared/statusTag/TxStatus.tsx
@@ -12,6 +12,10 @@ export interface Props {
 }
 
 const TxStatus = ({ status, errorText, isLoading }: Props) => {
+  if (status === undefined) {
+    return null;
+  }
+
   let text;
   let type: StatusTagType;
 
diff --git a/ui/shared/statusTag/ValidatorStatus.tsx b/ui/shared/statusTag/ValidatorStatus.tsx
new file mode 100644
index 0000000000..4386b55af5
--- /dev/null
+++ b/ui/shared/statusTag/ValidatorStatus.tsx
@@ -0,0 +1,23 @@
+import React from 'react';
+
+import type { Validator } from 'types/api/validators';
+
+import StatusTag from './StatusTag';
+
+interface Props {
+  state: Validator['state'];
+  isLoading?: boolean;
+}
+
+const ValidatorStatus = ({ state, isLoading }: Props) => {
+  switch (state) {
+    case 'active':
+      return <StatusTag type="ok" text="Active" isLoading={ isLoading }/>;
+    case 'probation':
+      return <StatusTag type="pending" text="Probation" isLoading={ isLoading }/>;
+    case 'inactive':
+      return <StatusTag type="error" text="Inactive" isLoading={ isLoading }/>;
+  }
+};
+
+export default React.memo(ValidatorStatus);
diff --git a/ui/shared/statusTag/ZkEvmL2TxnBatchStatus.tsx b/ui/shared/statusTag/ZkEvmL2TxnBatchStatus.tsx
index f7601bde46..55d98dd7db 100644
--- a/ui/shared/statusTag/ZkEvmL2TxnBatchStatus.tsx
+++ b/ui/shared/statusTag/ZkEvmL2TxnBatchStatus.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2';
 
 import type { StatusTagType } from './StatusTag';
 import StatusTag from './StatusTag';
diff --git a/ui/shared/statusTag/ZkSyncL2TxnBatchStatus.tsx b/ui/shared/statusTag/ZkSyncL2TxnBatchStatus.tsx
new file mode 100644
index 0000000000..7e0536eff4
--- /dev/null
+++ b/ui/shared/statusTag/ZkSyncL2TxnBatchStatus.tsx
@@ -0,0 +1,28 @@
+import React from 'react';
+
+import type { ZkSyncBatchStatus } from 'types/api/zkSyncL2';
+
+import type { StatusTagType } from './StatusTag';
+import StatusTag from './StatusTag';
+
+export interface Props {
+  status: ZkSyncBatchStatus;
+  isLoading?: boolean;
+}
+
+const ZkSyncL2TxnBatchStatus = ({ status, isLoading }: Props) => {
+  let type: StatusTagType;
+
+  switch (status) {
+    case 'Executed on L1':
+      type = 'ok';
+      break;
+    default:
+      type = 'pending';
+      break;
+  }
+
+  return <StatusTag type={ type } text={ status } isLoading={ isLoading }/>;
+};
+
+export default ZkSyncL2TxnBatchStatus;
diff --git a/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_error-status-1.png b/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_error-status-1.png
index 456a05197e..a5ab415a85 100644
Binary files a/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_error-status-1.png and b/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_error-status-1.png differ
diff --git a/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_ok-status-1.png b/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_ok-status-1.png
index 1f91068cef..3224ee3df2 100644
Binary files a/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_ok-status-1.png and b/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_ok-status-1.png differ
diff --git a/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_pending-status-1.png b/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_pending-status-1.png
index d5d9f0cec1..1e4454c4ea 100644
Binary files a/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_pending-status-1.png and b/ui/shared/statusTag/__screenshots__/StatusTag.pw.tsx_default_pending-status-1.png differ
diff --git a/ui/shared/tx/interpretation/TxInterpretation.tsx b/ui/shared/tx/interpretation/TxInterpretation.tsx
new file mode 100644
index 0000000000..3f71f9f3e5
--- /dev/null
+++ b/ui/shared/tx/interpretation/TxInterpretation.tsx
@@ -0,0 +1,163 @@
+import { Skeleton, Tooltip, chakra } from '@chakra-ui/react';
+import BigNumber from 'bignumber.js';
+import React from 'react';
+
+import type {
+  TxInterpretationSummary,
+  TxInterpretationVariable,
+  TxInterpretationVariableString,
+} from 'types/api/txInterpretation';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import * as mixpanel from 'lib/mixpanel/index';
+import { currencyUnits } from 'lib/units';
+import Tag from 'ui/shared/chakra/Tag';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import EnsEntity from 'ui/shared/entities/ens/EnsEntity';
+import TokenEntity from 'ui/shared/entities/token/TokenEntity';
+import IconSvg from 'ui/shared/IconSvg';
+
+import { extractVariables, getStringChunks, fillStringVariables, checkSummary, NATIVE_COIN_SYMBOL_VAR_NAME } from './utils';
+
+type Props = {
+  summary?: TxInterpretationSummary;
+  isLoading?: boolean;
+  className?: string;
+}
+
+type NonStringTxInterpretationVariable = Exclude<TxInterpretationVariable, TxInterpretationVariableString>
+
+const TxInterpretationElementByType = ({ variable }: { variable?: NonStringTxInterpretationVariable }) => {
+  const onAddressClick = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.TX_INTERPRETATION_INTERACTION, { Type: 'Address click' });
+  }, []);
+
+  const onTokenClick = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.TX_INTERPRETATION_INTERACTION, { Type: 'Token click' });
+  }, []);
+
+  const onDomainClick = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.TX_INTERPRETATION_INTERACTION, { Type: 'Domain click' });
+  }, []);
+
+  if (!variable) {
+    return null;
+  }
+
+  const { type, value } = variable;
+  switch (type) {
+    case 'address': {
+      return (
+        <chakra.span display="inline-block" verticalAlign="top" _notFirst={{ marginLeft: 1 }}>
+          <AddressEntity
+            address={ value }
+            truncation="constant"
+            onClick={ onAddressClick }
+            whiteSpace="initial"
+          />
+        </chakra.span>
+      );
+    }
+    case 'token':
+      return (
+        <chakra.span display="inline-block" verticalAlign="top" _notFirst={{ marginLeft: 1 }}>
+          <TokenEntity
+            token={ value }
+            onlySymbol
+            noCopy
+            width="fit-content"
+            _notFirst={{ marginLeft: 1 }}
+            mr={ 2 }
+            whiteSpace="initial"
+            onClick={ onTokenClick }
+          />
+        </chakra.span>
+      );
+    case 'domain': {
+      if (config.features.nameService.isEnabled) {
+        return (
+          <chakra.span display="inline-block" verticalAlign="top" _notFirst={{ marginLeft: 1 }}>
+            <EnsEntity
+              name={ value }
+              width="fit-content"
+              _notFirst={{ marginLeft: 1 }}
+              whiteSpace="initial"
+              onClick={ onDomainClick }
+            />
+          </chakra.span>
+        );
+      }
+      return <chakra.span color="text_secondary" whiteSpace="pre">{ value + ' ' }</chakra.span>;
+    }
+    case 'currency': {
+      let numberString = '';
+      if (BigNumber(value).isLessThan(0.1)) {
+        numberString = BigNumber(value).toPrecision(2);
+      } else if (BigNumber(value).isLessThan(10000)) {
+        numberString = BigNumber(value).dp(2).toFormat();
+      } else if (BigNumber(value).isLessThan(1000000)) {
+        numberString = BigNumber(value).dividedBy(1000).toFormat(2) + 'K';
+      } else {
+        numberString = BigNumber(value).dividedBy(1000000).toFormat(2) + 'M';
+      }
+      return <chakra.span>{ numberString + ' ' }</chakra.span>;
+    }
+    case 'timestamp': {
+      return <chakra.span color="text_secondary" whiteSpace="pre">{ dayjs(Number(value) * 1000).format('MMM DD YYYY') }</chakra.span>;
+    }
+    case 'method': {
+      return (
+        <Tag
+          colorScheme={ value === 'Multicall' ? 'teal' : 'gray' }
+          isTruncated
+          ml={ 1 }
+          mr={ 2 }
+          verticalAlign="text-top"
+        >
+          { value }
+        </Tag>
+      );
+    }
+  }
+};
+
+const TxInterpretation = ({ summary, isLoading, className }: Props) => {
+  if (!summary) {
+    return null;
+  }
+
+  const template = summary.summary_template;
+  const variables = summary.summary_template_variables;
+
+  if (!checkSummary(template, variables)) {
+    return null;
+  }
+
+  const intermediateResult = fillStringVariables(template, variables);
+
+  const variablesNames = extractVariables(intermediateResult);
+  const chunks = getStringChunks(intermediateResult);
+
+  return (
+    <Skeleton isLoaded={ !isLoading } className={ className } fontWeight={ 500 } whiteSpace="pre-wrap" >
+      <Tooltip label="Transaction summary">
+        <IconSvg name="lightning" boxSize={ 5 } color="text_secondary" mr={ 2 } verticalAlign="text-top"/>
+      </Tooltip>
+      { chunks.map((chunk, index) => {
+        return (
+          <chakra.span key={ chunk + index }>
+            <chakra.span color="text_secondary">{ chunk.trim() + (chunk.trim() && variablesNames[index] ? ' ' : '') }</chakra.span>
+            { index < variablesNames.length && (
+              variablesNames[index] === NATIVE_COIN_SYMBOL_VAR_NAME ?
+                <chakra.span>{ currencyUnits.ether + ' ' }</chakra.span> :
+                <TxInterpretationElementByType variable={ variables[variablesNames[index]] as NonStringTxInterpretationVariable }/>
+            ) }
+          </chakra.span>
+        );
+      }) }
+    </Skeleton>
+  );
+};
+
+export default chakra(TxInterpretation);
diff --git a/ui/shared/tx/interpretation/utils.test.ts b/ui/shared/tx/interpretation/utils.test.ts
new file mode 100644
index 0000000000..f60532cb12
--- /dev/null
+++ b/ui/shared/tx/interpretation/utils.test.ts
@@ -0,0 +1,25 @@
+import { extractVariables, getStringChunks, checkSummary } from './utils';
+
+const template = '{action_type} {source_amount} {native} into {destination_amount} {destination_token}';
+
+it('extracts variables names', () => {
+  const result = extractVariables(template);
+  expect(result).toEqual([ 'action_type', 'source_amount', 'native', 'destination_amount', 'destination_token' ]);
+});
+
+it('split string without capturing variables', () => {
+  const result = getStringChunks(template);
+  expect(result).toEqual([ '', ' ', ' ', ' into ', ' ', '' ]);
+});
+
+it('checks that summary is valid', () => {
+  const result = checkSummary('{foo} {native} {bar}', { foo: { type: 'string', value: 'foo' }, bar: { type: 'string', value: 'bar' } });
+  expect(result).toBe(true);
+});
+
+it('checks that summary is invalid', () => {
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore:
+  const result = checkSummary('{foo} {native} {bar}', { foo: { type: 'string', value: null }, bar: { type: 'string', value: 'bar' } });
+  expect(result).toBe(false);
+});
diff --git a/ui/shared/tx/interpretation/utils.ts b/ui/shared/tx/interpretation/utils.ts
new file mode 100644
index 0000000000..bf480f3f8b
--- /dev/null
+++ b/ui/shared/tx/interpretation/utils.ts
@@ -0,0 +1,50 @@
+// we use that regex as a separator when splitting template and dont want to capture variables
+
+import type { TxInterpretationVariable } from 'types/api/txInterpretation';
+
+// eslint-disable-next-line regexp/no-useless-non-capturing-group
+export const VAR_REGEXP = /\{(?:[^}]+)\}/g;
+
+export const NATIVE_COIN_SYMBOL_VAR_NAME = 'native';
+
+export function extractVariables(templateString: string) {
+
+  const matches = templateString.match(VAR_REGEXP);
+
+  const variablesNames = matches ? matches.map(match => match.slice(1, -1)) : [];
+
+  return variablesNames;
+}
+
+export function getStringChunks(template: string) {
+  return template.split(VAR_REGEXP);
+}
+
+export function checkSummary(template: string, variables: Record<string, TxInterpretationVariable>) {
+  const variablesNames = extractVariables(template);
+  let result = true;
+  for (const name of variablesNames) {
+    if (name === NATIVE_COIN_SYMBOL_VAR_NAME) {
+      continue;
+    }
+    if (!variables[name] || variables[name].value === undefined || variables[name].value === null) {
+      result = false;
+      break;
+    }
+  }
+
+  return result;
+}
+
+export function fillStringVariables(template: string, variables: Record<string, TxInterpretationVariable>) {
+  const variablesNames = extractVariables(template);
+
+  let result = template;
+  variablesNames.forEach(name => {
+    if (variables[name] && variables[name].type === 'string') {
+      result = result.replace(`{${ name }}`, variables[name].value as string);
+    }
+  });
+
+  return result;
+}
diff --git a/ui/shared/userOps/UserOpSponsorType.tsx b/ui/shared/userOps/UserOpSponsorType.tsx
new file mode 100644
index 0000000000..cc006ffdef
--- /dev/null
+++ b/ui/shared/userOps/UserOpSponsorType.tsx
@@ -0,0 +1,28 @@
+import { Tag } from '@chakra-ui/react';
+import React from 'react';
+
+import type { UserOpSponsorType as TUserOpSponsorType } from 'types/api/userOps';
+
+type Props = {
+  sponsorType: TUserOpSponsorType;
+}
+
+const UserOpSponsorType = ({ sponsorType }: Props) => {
+  let text: string = sponsorType;
+  switch (sponsorType) {
+    case 'paymaster_hybrid':
+      text = 'Paymaster hybrid';
+      break;
+    case 'paymaster_sponsor':
+      text = 'Paymaster sponsor';
+      break;
+    case 'wallet_balance':
+      text = 'Wallet balance';
+      break;
+    case 'wallet_deposit':
+      text = 'Wallet deposit';
+  }
+  return <Tag>{ text }</Tag>;
+};
+
+export default UserOpSponsorType;
diff --git a/ui/shared/userOps/UserOpStatus.tsx b/ui/shared/userOps/UserOpStatus.tsx
new file mode 100644
index 0000000000..6c3a00d40b
--- /dev/null
+++ b/ui/shared/userOps/UserOpStatus.tsx
@@ -0,0 +1,23 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import StatusTag from 'ui/shared/statusTag/StatusTag';
+
+type Props = {
+  status?: boolean;
+  isLoading?: boolean;
+}
+
+const UserOpStatus = ({ status, isLoading }: Props) => {
+  if (status === undefined) {
+    return null;
+  }
+
+  return (
+    <Skeleton isLoaded={ !isLoading } display="inline-block">
+      <StatusTag type={ status === true ? 'ok' : 'error' } text={ status === true ? 'Success' : 'Failed' }/>
+    </Skeleton>
+  );
+};
+
+export default UserOpStatus;
diff --git a/ui/shared/verificationSteps/VerificationStep.tsx b/ui/shared/verificationSteps/VerificationStep.tsx
index 38d78462fb..17a7c98632 100644
--- a/ui/shared/verificationSteps/VerificationStep.tsx
+++ b/ui/shared/verificationSteps/VerificationStep.tsx
@@ -1,4 +1,4 @@
-import { Text, HStack } from '@chakra-ui/react';
+import { HStack, Box } from '@chakra-ui/react';
 import React from 'react';
 
 import type { Step } from './types';
@@ -17,7 +17,7 @@ const VerificationStep = ({ step, isLast, isPassed }: Props) => {
   return (
     <HStack gap={ 2 } color={ stepColor }>
       <IconSvg name={ isPassed ? 'finalized' : 'unfinalized' } boxSize={ 5 }/>
-      <Text color={ stepColor }>{ typeof step === 'string' ? step : step.content }</Text>
+      <Box color={ stepColor }>{ typeof step === 'string' ? step : step.content }</Box>
       { !isLast && <IconSvg name="arrows/east" boxSize={ 5 }/> }
     </HStack>
   );
diff --git a/ui/shared/verificationSteps/VerificationSteps.tsx b/ui/shared/verificationSteps/VerificationSteps.tsx
index 0c55e8fb06..a7a6c506d8 100644
--- a/ui/shared/verificationSteps/VerificationSteps.tsx
+++ b/ui/shared/verificationSteps/VerificationSteps.tsx
@@ -30,7 +30,7 @@ const VerificationSteps = ({ currentStep, steps, isLoading, rightSlot, className
     >
       { steps.map((step, index) => (
         <VerificationStep
-          key={ currentStep }
+          key={ index }
           step={ step }
           isLast={ index === steps.length - 1 && !rightSlot }
           isPassed={ index <= currentStepIndex }
diff --git a/ui/snippets/footer/Footer.pw.tsx b/ui/snippets/footer/Footer.pw.tsx
index 5749ebf485..a3dc45f5c4 100644
--- a/ui/snippets/footer/Footer.pw.tsx
+++ b/ui/snippets/footer/Footer.pw.tsx
@@ -1,6 +1,7 @@
 import { test as base, expect } from '@playwright/experimental-ct-react';
 import React from 'react';
-import type { WindowProvider } from 'wagmi';
+
+import type { WalletProvider } from 'types/web3';
 
 import { buildExternalAssetFilePath } from 'configs/app/utils';
 import { FOOTER_LINKS } from 'mocks/config/footerLinks';
@@ -36,7 +37,7 @@ base.describe('with custom links, max cols', () => {
       window.ethereum = {
         isMetaMask: true,
         _events: {},
-      } as WindowProvider;
+      } as WalletProvider;
     });
 
     await page.route(INDEXING_ALERT_API_URL, (route) => route.fulfill({
@@ -95,7 +96,7 @@ base.describe('without custom links', () => {
       window.ethereum = {
         isMetaMask: true,
         _events: {},
-      } as WindowProvider;
+      } as WalletProvider;
     });
     await page.route(BACKEND_VERSION_API_URL, (route) => {
       return route.fulfill({
@@ -118,7 +119,7 @@ base.describe('without custom links', () => {
     await page.evaluate(() => {
       window.ethereum = {
         providers: [ { isMetaMask: true, _events: {} } ],
-      } as WindowProvider;
+      } as WalletProvider;
     });
 
     await page.route(INDEXING_ALERT_API_URL, (route) => route.fulfill({
diff --git a/ui/snippets/header/Burger.pw.tsx b/ui/snippets/header/Burger.pw.tsx
index 4fc912b6de..9f64412b9b 100644
--- a/ui/snippets/header/Burger.pw.tsx
+++ b/ui/snippets/header/Burger.pw.tsx
@@ -4,7 +4,8 @@ import React from 'react';
 import { buildExternalAssetFilePath } from 'configs/app/utils';
 import { FEATURED_NETWORKS_MOCK } from 'mocks/config/network';
 import authFixture from 'playwright/fixtures/auth';
-import contextWithEnvs, { createContextWithEnvs } from 'playwright/fixtures/contextWithEnvs';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import createContextWithStorage from 'playwright/fixtures/createContextWithStorage';
 import TestApp from 'playwright/TestApp';
 import * as app from 'playwright/utils/app';
 
@@ -104,7 +105,7 @@ test('submenu', async({ mount, page }) => {
 test.describe('auth', () => {
   const extendedTest = base.extend({
     context: async({ browser }, use) => {
-      const context = await createContextWithEnvs(browser, [
+      const context = await createContextWithStorage(browser, [
         { name: 'NEXT_PUBLIC_FEATURED_NETWORKS', value: FEATURED_NETWORKS_URL },
       ]);
       authFixture(context);
diff --git a/ui/snippets/header/HeaderMobile.tsx b/ui/snippets/header/HeaderMobile.tsx
index 9901d8b9f9..570e0d157c 100644
--- a/ui/snippets/header/HeaderMobile.tsx
+++ b/ui/snippets/header/HeaderMobile.tsx
@@ -11,6 +11,10 @@ import WalletMenuMobile from 'ui/snippets/walletMenu/WalletMenuMobile';
 
 import Burger from './Burger';
 
+const LOGO_IMAGE_PROPS = {
+  margin: '0 auto',
+};
+
 type Props = {
   isHomePage?: boolean;
   renderSearchBar?: () => React.ReactNode;
@@ -47,7 +51,7 @@ const HeaderMobile = ({ isHomePage, renderSearchBar }: Props) => {
         boxShadow={ !inView && scrollDirection === 'down' ? 'md' : 'none' }
       >
         <Burger/>
-        <NetworkLogo/>
+        <NetworkLogo imageProps={ LOGO_IMAGE_PROPS }/>
         <Flex columnGap={ 2 }>
           { config.features.account.isEnabled ? <ProfileMenuMobile/> : <Box boxSize={ 10 }/> }
           { config.features.blockchainInteraction.isEnabled && <WalletMenuMobile/> }
diff --git a/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_auth-base-view-1.png b/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_auth-base-view-1.png
index f31e4faf10..d70aadef4f 100644
Binary files a/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_auth-base-view-1.png and b/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_auth-base-view-1.png differ
diff --git a/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_base-view-1.png b/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_base-view-1.png
index e180358c91..a620590168 100644
Binary files a/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_base-view-1.png and b/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_base-view-1.png differ
diff --git a/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_dark-mode-base-view-1.png b/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_dark-mode-base-view-1.png
index ed951f37b4..ebfb947f04 100644
Binary files a/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_dark-mode-base-view-1.png and b/ui/snippets/header/__screenshots__/Burger.pw.tsx_default_dark-mode-base-view-1.png differ
diff --git a/ui/snippets/header/__screenshots__/HeaderDesktop.pw.tsx_dark-color-mode_default-view-dark-mode-1.png b/ui/snippets/header/__screenshots__/HeaderDesktop.pw.tsx_dark-color-mode_default-view-dark-mode-1.png
index 20aa839385..bf29251fe5 100644
Binary files a/ui/snippets/header/__screenshots__/HeaderDesktop.pw.tsx_dark-color-mode_default-view-dark-mode-1.png and b/ui/snippets/header/__screenshots__/HeaderDesktop.pw.tsx_dark-color-mode_default-view-dark-mode-1.png differ
diff --git a/ui/snippets/header/__screenshots__/HeaderDesktop.pw.tsx_default_default-view-dark-mode-1.png b/ui/snippets/header/__screenshots__/HeaderDesktop.pw.tsx_default_default-view-dark-mode-1.png
index d143733147..66b62ef072 100644
Binary files a/ui/snippets/header/__screenshots__/HeaderDesktop.pw.tsx_default_default-view-dark-mode-1.png and b/ui/snippets/header/__screenshots__/HeaderDesktop.pw.tsx_default_default-view-dark-mode-1.png differ
diff --git a/ui/snippets/header/__screenshots__/HeaderMobile.pw.tsx_dark-color-mode_default-view-dark-mode-1.png b/ui/snippets/header/__screenshots__/HeaderMobile.pw.tsx_dark-color-mode_default-view-dark-mode-1.png
index 01dba03498..f3d92fa5d8 100644
Binary files a/ui/snippets/header/__screenshots__/HeaderMobile.pw.tsx_dark-color-mode_default-view-dark-mode-1.png and b/ui/snippets/header/__screenshots__/HeaderMobile.pw.tsx_dark-color-mode_default-view-dark-mode-1.png differ
diff --git a/ui/snippets/header/__screenshots__/HeaderMobile.pw.tsx_default_default-view-dark-mode-1.png b/ui/snippets/header/__screenshots__/HeaderMobile.pw.tsx_default_default-view-dark-mode-1.png
index 803a3f79ec..526388a465 100644
Binary files a/ui/snippets/header/__screenshots__/HeaderMobile.pw.tsx_default_default-view-dark-mode-1.png and b/ui/snippets/header/__screenshots__/HeaderMobile.pw.tsx_default_default-view-dark-mode-1.png differ
diff --git a/ui/snippets/navigation/NavigationDesktop.pw.tsx b/ui/snippets/navigation/NavigationDesktop.pw.tsx
index b47d6b59cb..9ba7520405 100644
--- a/ui/snippets/navigation/NavigationDesktop.pw.tsx
+++ b/ui/snippets/navigation/NavigationDesktop.pw.tsx
@@ -6,7 +6,8 @@ import React from 'react';
 import { buildExternalAssetFilePath } from 'configs/app/utils';
 import * as cookies from 'lib/cookies';
 import authFixture from 'playwright/fixtures/auth';
-import contextWithEnvs, { createContextWithEnvs } from 'playwright/fixtures/contextWithEnvs';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
+import createContextWithStorage from 'playwright/fixtures/createContextWithStorage';
 import TestApp from 'playwright/TestApp';
 import * as app from 'playwright/utils/app';
 import * as configs from 'playwright/utils/configs';
@@ -61,7 +62,7 @@ test.describe('no auth', () => {
 base.describe('auth', () => {
   const test = base.extend({
     context: async({ browser }, use) => {
-      const context = await createContextWithEnvs(browser, [
+      const context = await createContextWithStorage(browser, [
         { name: 'NEXT_PUBLIC_FEATURED_NETWORKS', value: FEATURED_NETWORKS_URL },
       ]);
       authFixture(context);
@@ -150,7 +151,7 @@ test.describe('with submenu', () => {
 base.describe('cookie set to false', () => {
   const test = base.extend({
     context: async({ browser }, use) => {
-      const context = await createContextWithEnvs(browser, [
+      const context = await createContextWithStorage(browser, [
         { name: 'NEXT_PUBLIC_FEATURED_NETWORKS', value: FEATURED_NETWORKS_URL },
       ]);
       context.addCookies([ { name: cookies.NAMES.NAV_BAR_COLLAPSED, value: 'false', domain: app.domain, path: '/' } ]);
@@ -190,7 +191,7 @@ base.describe('cookie set to false', () => {
 base.describe('cookie set to true', () => {
   const test = base.extend({
     context: async({ browser }, use) => {
-      const context = await createContextWithEnvs(browser, [
+      const context = await createContextWithStorage(browser, [
         { name: 'NEXT_PUBLIC_FEATURED_NETWORKS', value: FEATURED_NETWORKS_URL },
       ]);
       context.addCookies([ { name: cookies.NAMES.NAV_BAR_COLLAPSED, value: 'true', domain: 'localhost', path: '/' } ]);
diff --git a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_auth-xl-screen-dark-mode-1.png b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_auth-xl-screen-dark-mode-1.png
index 383bfd6258..942baa9b52 100644
Binary files a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_auth-xl-screen-dark-mode-1.png and b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_auth-xl-screen-dark-mode-1.png differ
diff --git a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_hover-xl-screen-dark-mode-1.png b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_hover-xl-screen-dark-mode-1.png
index e20824bea5..3242ac2f0a 100644
Binary files a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_hover-xl-screen-dark-mode-1.png and b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_hover-xl-screen-dark-mode-1.png differ
diff --git a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_no-auth-xl-screen-dark-mode-1.png b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_no-auth-xl-screen-dark-mode-1.png
index 3695536739..f728ad8c47 100644
Binary files a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_no-auth-xl-screen-dark-mode-1.png and b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_dark-color-mode_no-auth-xl-screen-dark-mode-1.png differ
diff --git a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_auth-xl-screen-dark-mode-1.png b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_auth-xl-screen-dark-mode-1.png
index 386efd593b..2c0a99e4fa 100644
Binary files a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_auth-xl-screen-dark-mode-1.png and b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_auth-xl-screen-dark-mode-1.png differ
diff --git a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_hover-xl-screen-dark-mode-1.png b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_hover-xl-screen-dark-mode-1.png
index 9c50682159..21c4f6017e 100644
Binary files a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_hover-xl-screen-dark-mode-1.png and b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_hover-xl-screen-dark-mode-1.png differ
diff --git a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_no-auth-xl-screen-dark-mode-1.png b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_no-auth-xl-screen-dark-mode-1.png
index e02942f1c8..65518475eb 100644
Binary files a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_no-auth-xl-screen-dark-mode-1.png and b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_no-auth-xl-screen-dark-mode-1.png differ
diff --git a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_with-submenu-xl-screen-1.png b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_with-submenu-xl-screen-1.png
index e5a02b29ce..969abd4c90 100644
Binary files a/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_with-submenu-xl-screen-1.png and b/ui/snippets/navigation/__screenshots__/NavigationDesktop.pw.tsx_default_with-submenu-xl-screen-1.png differ
diff --git a/ui/snippets/networkMenu/NetworkLogo.tsx b/ui/snippets/networkMenu/NetworkLogo.tsx
index d2157651d4..c89029e58a 100644
--- a/ui/snippets/networkMenu/NetworkLogo.tsx
+++ b/ui/snippets/networkMenu/NetworkLogo.tsx
@@ -1,3 +1,4 @@
+import type { StyleProps } from '@chakra-ui/react';
 import { Box, Image, useColorModeValue, Skeleton } from '@chakra-ui/react';
 import React from 'react';
 
@@ -9,9 +10,10 @@ import IconSvg from 'ui/shared/IconSvg';
 interface Props {
   isCollapsed?: boolean;
   onClick?: (event: React.SyntheticEvent) => void;
+  imageProps?: StyleProps;
 }
 
-const LogoFallback = ({ isCollapsed, isSmall }: { isCollapsed?: boolean; isSmall?: boolean }) => {
+const LogoFallback = ({ isCollapsed, isSmall, imageProps }: { isCollapsed?: boolean; isSmall?: boolean; imageProps?: StyleProps }) => {
   const field = isSmall ? 'icon' : 'logo';
   const logoColor = useColorModeValue('blue.600', 'white');
 
@@ -36,11 +38,12 @@ const LogoFallback = ({ isCollapsed, isSmall }: { isCollapsed?: boolean; isSmall
       height="100%"
       color={ logoColor }
       display={ display }
+      { ...imageProps }
     />
   );
 };
 
-const NetworkLogo = ({ isCollapsed, onClick }: Props) => {
+const NetworkLogo = ({ isCollapsed, onClick, imageProps }: Props) => {
 
   const logoSrc = useColorModeValue(config.UI.sidebar.logo.default, config.UI.sidebar.logo.dark || config.UI.sidebar.logo.default);
   const iconSrc = useColorModeValue(config.UI.sidebar.icon.default, config.UI.sidebar.icon.dark || config.UI.sidebar.icon.default);
@@ -66,9 +69,10 @@ const NetworkLogo = ({ isCollapsed, onClick }: Props) => {
         h="100%"
         src={ logoSrc }
         alt={ `${ config.chain.name } network logo` }
-        fallback={ <LogoFallback isCollapsed={ isCollapsed }/> }
+        fallback={ <LogoFallback isCollapsed={ isCollapsed } imageProps={ imageProps }/> }
         display={{ base: 'block', lg: isCollapsed === false ? 'block' : 'none', xl: isCollapsed ? 'none' : 'block' }}
         style={ logoStyle }
+        { ...imageProps }
       />
       { /* small logo */ }
       <Image
@@ -76,9 +80,10 @@ const NetworkLogo = ({ isCollapsed, onClick }: Props) => {
         h="100%"
         src={ iconSrc }
         alt={ `${ config.chain.name } network logo` }
-        fallback={ <LogoFallback isCollapsed={ isCollapsed } isSmall/> }
+        fallback={ <LogoFallback isCollapsed={ isCollapsed } imageProps={ imageProps } isSmall/> }
         display={{ base: 'none', lg: isCollapsed === false ? 'none' : 'block', xl: isCollapsed ? 'block' : 'none' }}
         style={ iconStyle }
+        { ...imageProps }
       />
     </Box>
   );
diff --git a/ui/snippets/networkMenu/useNetworkMenu.tsx b/ui/snippets/networkMenu/useNetworkMenu.tsx
index 1bd9accf0b..c6a75b7554 100644
--- a/ui/snippets/networkMenu/useNetworkMenu.tsx
+++ b/ui/snippets/networkMenu/useNetworkMenu.tsx
@@ -7,15 +7,15 @@ import { NETWORK_GROUPS } from 'types/networks';
 
 import config from 'configs/app';
 import type { ResourceError } from 'lib/api/resources';
-import useApiFetch from 'lib/hooks/useFetch';
+import useFetch from 'lib/hooks/useFetch';
 
 export default function useNetworkMenu() {
   const { isOpen, onClose, onOpen, onToggle } = useDisclosure();
 
-  const apiFetch = useApiFetch();
+  const fetch = useFetch();
   const { isPending, data } = useQuery<unknown, ResourceError<unknown>, Array<FeaturedNetwork>>({
     queryKey: [ 'featured-network' ],
-    queryFn: async() => apiFetch(config.UI.sidebar.featuredNetworks || '', undefined, { resource: 'featured-network' }),
+    queryFn: async() => fetch(config.UI.sidebar.featuredNetworks || '', undefined, { resource: 'featured-network' }),
     enabled: Boolean(config.UI.sidebar.featuredNetworks) && isOpen,
     staleTime: Infinity,
   });
diff --git a/ui/snippets/profileMenu/ProfileMenuDesktop.pw.tsx b/ui/snippets/profileMenu/ProfileMenuDesktop.pw.tsx
index 858c26f729..381777ecb2 100644
--- a/ui/snippets/profileMenu/ProfileMenuDesktop.pw.tsx
+++ b/ui/snippets/profileMenu/ProfileMenuDesktop.pw.tsx
@@ -1,59 +1,37 @@
-import { test, expect } from '@playwright/experimental-ct-react';
 import React from 'react';
 
 import * as profileMock from 'mocks/user/profile';
 import authFixture from 'playwright/fixtures/auth';
-import TestApp from 'playwright/TestApp';
+import { test, expect } from 'playwright/lib';
 import * as app from 'playwright/utils/app';
-import buildApiUrl from 'playwright/utils/buildApiUrl';
 
 import ProfileMenuDesktop from './ProfileMenuDesktop';
 
-test('no auth', async({ mount, page }) => {
+test('no auth', async({ render, page }) => {
   const hooksConfig = {
     router: {
       asPath: '/',
       pathname: '/',
     },
   };
-  const component = await mount(
-    <TestApp>
-      <ProfileMenuDesktop/>
-    </TestApp>,
-    { hooksConfig },
-  );
-
+  const component = await render(<ProfileMenuDesktop/>, { hooksConfig });
   await component.locator('a').click();
+
   expect(page.url()).toBe(`${ app.url }/auth/auth0?path=%2F`);
 });
 
-test.describe('auth', () => {
-  const extendedTest = test.extend({
-    context: ({ context }, use) => {
-      authFixture(context);
-      use(context);
-    },
-  });
-
-  extendedTest('+@dark-mode', async({ mount, page }) => {
-    await page.route(buildApiUrl('user_info'), (route) => route.fulfill({
-      status: 200,
-      body: JSON.stringify(profileMock.base),
-    }));
-    await page.route(profileMock.base.avatar, (route) => {
-      return route.fulfill({
-        status: 200,
-        path: './playwright/mocks/image_s.jpg',
-      });
-    });
+const authTest = test.extend({
+  context: ({ context }, use) => {
+    authFixture(context);
+    use(context);
+  },
+});
+authTest('auth +@dark-mode', async({ render, page, mockApiResponse, mockAssetResponse }) => {
+  await mockApiResponse('user_info', profileMock.base);
+  await mockAssetResponse(profileMock.base.avatar, './playwright/mocks/image_s.jpg');
 
-    const component = await mount(
-      <TestApp>
-        <ProfileMenuDesktop/>
-      </TestApp>,
-    );
+  const component = await render(<ProfileMenuDesktop/>);
+  await component.getByAltText(/Profile picture/i).click();
 
-    await component.getByAltText(/Profile picture/i).click();
-    await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 250, height: 600 } });
-  });
+  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 250, height: 600 } });
 });
diff --git a/ui/snippets/searchBar/SearchBar.pw.tsx b/ui/snippets/searchBar/SearchBar.pw.tsx
index ca7e6b32f0..9aef377007 100644
--- a/ui/snippets/searchBar/SearchBar.pw.tsx
+++ b/ui/snippets/searchBar/SearchBar.pw.tsx
@@ -9,6 +9,7 @@ import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
 import TestApp from 'playwright/TestApp';
 import * as app from 'playwright/utils/app';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
+import * as configs from 'playwright/utils/configs';
 
 import SearchBar from './SearchBar';
 
@@ -53,7 +54,7 @@ test('search by token name  +@mobile +@dark-mode', async({ mount, page }) => {
       <SearchBar/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type('o');
+  await page.getByPlaceholder(/search/i).fill('o');
   await page.waitForResponse(API_URL);
 
   await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 500 } });
@@ -65,6 +66,7 @@ test('search by contract name  +@mobile +@dark-mode', async({ mount, page }) =>
     status: 200,
     body: JSON.stringify([
       searchMock.contract1,
+      searchMock.address2,
     ]),
   }));
 
@@ -73,7 +75,7 @@ test('search by contract name  +@mobile +@dark-mode', async({ mount, page }) =>
       <SearchBar/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type('o');
+  await page.getByPlaceholder(/search/i).fill('o');
   await page.waitForResponse(API_URL);
 
   await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 500 } });
@@ -95,7 +97,7 @@ test('search by name homepage +@dark-mode', async({ mount, page }) => {
       <SearchBar isHomepage/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type('o');
+  await page.getByPlaceholder(/search/i).fill('o');
   await page.waitForResponse(API_URL);
 
   await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 500 } });
@@ -115,7 +117,7 @@ test('search by tag  +@mobile +@dark-mode', async({ mount, page }) => {
       <SearchBar/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type('o');
+  await page.getByPlaceholder(/search/i).fill('o');
   await page.waitForResponse(API_URL);
 
   await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 500 } });
@@ -135,7 +137,7 @@ test('search by address hash +@mobile', async({ mount, page }) => {
       <SearchBar/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type(searchMock.address1.address);
+  await page.getByPlaceholder(/search/i).fill(searchMock.address1.address);
   await page.waitForResponse(API_URL);
 
   await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 300 } });
@@ -148,6 +150,7 @@ test('search by block number +@mobile', async({ mount, page }) => {
     body: JSON.stringify([
       searchMock.block1,
       searchMock.block2,
+      searchMock.block3,
     ]),
   }));
 
@@ -156,7 +159,7 @@ test('search by block number +@mobile', async({ mount, page }) => {
       <SearchBar/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type(String(searchMock.block1.block_number));
+  await page.getByPlaceholder(/search/i).fill(String(searchMock.block1.block_number));
   await page.waitForResponse(API_URL);
 
   await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 600 } });
@@ -176,7 +179,7 @@ test('search by block hash +@mobile', async({ mount, page }) => {
       <SearchBar/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type(searchMock.block1.block_hash);
+  await page.getByPlaceholder(/search/i).fill(searchMock.block1.block_hash);
   await page.waitForResponse(API_URL);
 
   await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 300 } });
@@ -196,7 +199,56 @@ test('search by tx hash +@mobile', async({ mount, page }) => {
       <SearchBar/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type(searchMock.tx1.tx_hash);
+  await page.getByPlaceholder(/search/i).fill(searchMock.tx1.tx_hash);
+  await page.waitForResponse(API_URL);
+
+  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 300 } });
+});
+
+test('search by blob hash +@mobile', async({ mount, page }) => {
+  const API_URL = buildApiUrl('quick_search') + `?q=${ searchMock.blob1.blob_hash }`;
+  await page.route(API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify([
+      searchMock.blob1,
+    ]),
+  }));
+
+  await mount(
+    <TestApp>
+      <SearchBar/>
+    </TestApp>,
+  );
+  await page.getByPlaceholder(/search/i).fill(searchMock.blob1.blob_hash);
+  await page.waitForResponse(API_URL);
+
+  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 300 } });
+});
+
+const testWithUserOps = base.extend({
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  context: contextWithEnvs(configs.featureEnvs.userOps) as any,
+});
+
+testWithUserOps('search by user op hash +@mobile', async({ mount, page }) => {
+  await page.route('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(textAdMock.duck),
+  }));
+  const API_URL = buildApiUrl('quick_search') + `?q=${ searchMock.tx1.tx_hash }`;
+  await page.route(API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify([
+      searchMock.userOp1,
+    ]),
+  }));
+
+  await mount(
+    <TestApp>
+      <SearchBar/>
+    </TestApp>,
+  );
+  await page.getByPlaceholder(/search/i).fill(searchMock.tx1.tx_hash);
   await page.waitForResponse(API_URL);
 
   await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1200, height: 300 } });
@@ -219,7 +271,7 @@ test('search with view all link', async({ mount, page }) => {
       <SearchBar/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type('o');
+  await page.getByPlaceholder(/search/i).fill('o');
 
   await page.waitForResponse(API_URL);
 
@@ -251,7 +303,7 @@ test('scroll suggest to category', async({ mount, page }) => {
       <SearchBar/>
     </TestApp>,
   );
-  await page.getByPlaceholder(/search/i).type('o');
+  await page.getByPlaceholder(/search/i).fill('o');
   await page.waitForResponse(API_URL);
 
   await page.getByRole('tab', { name: 'Addresses' }).click();
@@ -313,7 +365,7 @@ base.describe('with apps', () => {
         <SearchBar/>
       </TestApp>,
     );
-    await page.getByPlaceholder(/search/i).type('o');
+    await page.getByPlaceholder(/search/i).fill('o');
 
     await page.waitForResponse(API_URL);
 
diff --git a/ui/snippets/searchBar/SearchBar.tsx b/ui/snippets/searchBar/SearchBar.tsx
index f8b07afe1e..9ceee88101 100644
--- a/ui/snippets/searchBar/SearchBar.tsx
+++ b/ui/snippets/searchBar/SearchBar.tsx
@@ -1,4 +1,14 @@
-import { Box, Portal, Popover, PopoverTrigger, PopoverContent, PopoverBody, useDisclosure, PopoverFooter, useOutsideClick } from '@chakra-ui/react';
+import {
+  Box,
+  Portal,
+  Popover,
+  PopoverTrigger,
+  PopoverContent,
+  PopoverBody,
+  PopoverFooter,
+  useDisclosure,
+  useOutsideClick,
+} from '@chakra-ui/react';
 import _debounce from 'lodash/debounce';
 import { useRouter } from 'next/router';
 import type { FormEvent } from 'react';
@@ -12,6 +22,7 @@ import * as mixpanel from 'lib/mixpanel/index';
 import { getRecentSearchKeywords, saveToRecentKeywords } from 'lib/recentSearchKeywords';
 import LinkInternal from 'ui/shared/LinkInternal';
 
+import SearchBarBackdrop from './SearchBarBackdrop';
 import SearchBarInput from './SearchBarInput';
 import SearchBarRecentKeywords from './SearchBarRecentKeywords';
 import SearchBarSuggest from './SearchBarSuggest/SearchBarSuggest';
@@ -106,69 +117,73 @@ const SearchBar = ({ isHomepage }: Props) => {
   }, [ calculateMenuWidth ]);
 
   return (
-    <Popover
-      isOpen={ isOpen && (searchTerm.trim().length > 0 || recentSearchKeywords.length > 0) }
-      autoFocus={ false }
-      onClose={ onClose }
-      placement="bottom-start"
-      offset={ isMobile && !isHomepage ? [ 16, -12 ] : undefined }
-      isLazy
-    >
-      <PopoverTrigger>
-        <SearchBarInput
-          ref={ inputRef }
-          onChange={ handleSearchTermChange }
-          onSubmit={ handleSubmit }
-          onFocus={ handleFocus }
-          onHide={ handelHide }
-          onClear={ handleClear }
-          isHomepage={ isHomepage }
-          value={ searchTerm }
-        />
-      </PopoverTrigger>
-      <Portal>
-        <PopoverContent
-          w={ `${ menuWidth.current }px` }
-          ref={ menuRef }
-        >
-          <PopoverBody
-            p={ 0 }
-            color="chakra-body-text"
+    <>
+      <Popover
+        isOpen={ isOpen && (searchTerm.trim().length > 0 || recentSearchKeywords.length > 0) }
+        autoFocus={ false }
+        onClose={ onClose }
+        placement="bottom-start"
+        offset={ isMobile && !isHomepage ? [ 16, -4 ] : undefined }
+        isLazy
+      >
+        <PopoverTrigger>
+          <SearchBarInput
+            ref={ inputRef }
+            onChange={ handleSearchTermChange }
+            onSubmit={ handleSubmit }
+            onFocus={ handleFocus }
+            onHide={ handelHide }
+            onClear={ handleClear }
+            isHomepage={ isHomepage }
+            value={ searchTerm }
+            isSuggestOpen={ isOpen }
+          />
+        </PopoverTrigger>
+        <Portal>
+          <PopoverContent
+            w={ `${ menuWidth.current }px` }
+            ref={ menuRef }
           >
-            <Box
-              maxH="50vh"
-              overflowY="auto"
-              id={ SCROLL_CONTAINER_ID }
-              ref={ scrollRef }
-              as={ Element }
-              px={ 4 }
+            <PopoverBody
+              p={ 0 }
+              color="chakra-body-text"
             >
-              { searchTerm.trim().length === 0 && recentSearchKeywords.length > 0 && (
-                <SearchBarRecentKeywords onClick={ handleSearchTermChange } onClear={ onClose }/>
-              ) }
-              { searchTerm.trim().length > 0 && (
-                <SearchBarSuggest
-                  query={ query }
-                  searchTerm={ debouncedSearchTerm }
-                  onItemClick={ handleItemClick }
-                  containerId={ SCROLL_CONTAINER_ID }
-                />
-              ) }
-            </Box>
-          </PopoverBody>
-          { searchTerm.trim().length > 0 && query.data && query.data.length >= 50 && (
-            <PopoverFooter>
-              <LinkInternal
-                href={ route({ pathname: '/search-results', query: { q: searchTerm } }) }
-                fontSize="sm"
+              <Box
+                maxH="50vh"
+                overflowY="auto"
+                id={ SCROLL_CONTAINER_ID }
+                ref={ scrollRef }
+                as={ Element }
+                px={ 4 }
               >
-              View all results
-              </LinkInternal>
-            </PopoverFooter>
-          ) }
-        </PopoverContent>
-      </Portal>
-    </Popover>
+                { searchTerm.trim().length === 0 && recentSearchKeywords.length > 0 && (
+                  <SearchBarRecentKeywords onClick={ handleSearchTermChange } onClear={ onClose }/>
+                ) }
+                { searchTerm.trim().length > 0 && (
+                  <SearchBarSuggest
+                    query={ query }
+                    searchTerm={ debouncedSearchTerm }
+                    onItemClick={ handleItemClick }
+                    containerId={ SCROLL_CONTAINER_ID }
+                  />
+                ) }
+              </Box>
+            </PopoverBody>
+            { searchTerm.trim().length > 0 && query.data && query.data.length >= 50 && (
+              <PopoverFooter>
+                <LinkInternal
+                  href={ route({ pathname: '/search-results', query: { q: searchTerm } }) }
+                  fontSize="sm"
+                >
+                View all results
+                </LinkInternal>
+              </PopoverFooter>
+            ) }
+          </PopoverContent>
+        </Portal>
+      </Popover>
+      <SearchBarBackdrop isOpen={ isOpen }/>
+    </>
   );
 };
 
diff --git a/ui/snippets/searchBar/SearchBarBackdrop.tsx b/ui/snippets/searchBar/SearchBarBackdrop.tsx
new file mode 100644
index 0000000000..05d2702fe8
--- /dev/null
+++ b/ui/snippets/searchBar/SearchBarBackdrop.tsx
@@ -0,0 +1,25 @@
+import { Box, useColorModeValue } from '@chakra-ui/react';
+import React from 'react';
+
+interface Props {
+  isOpen: boolean;
+}
+
+const SearchBarBackdrop = ({ isOpen }: Props) => {
+  const backdropBgColor = useColorModeValue('blackAlpha.400', 'blackAlpha.600');
+
+  return (
+    <Box
+      position="fixed"
+      top={ 0 }
+      left={ 0 }
+      w="100vw"
+      h="100vh"
+      bgColor={ backdropBgColor }
+      zIndex="overlay"
+      display={{ base: 'none', lg: isOpen ? 'block' : 'none' }}
+    />
+  );
+};
+
+export default React.memo(SearchBarBackdrop);
diff --git a/ui/snippets/searchBar/SearchBarInput.tsx b/ui/snippets/searchBar/SearchBarInput.tsx
index c8c9d30265..d4088e06a8 100644
--- a/ui/snippets/searchBar/SearchBarInput.tsx
+++ b/ui/snippets/searchBar/SearchBarInput.tsx
@@ -16,10 +16,14 @@ interface Props {
   onHide?: () => void;
   onClear: () => void;
   isHomepage?: boolean;
+  isSuggestOpen?: boolean;
   value: string;
 }
 
-const SearchBarInput = ({ onChange, onSubmit, isHomepage, onFocus, onBlur, onHide, onClear, value }: Props, ref: React.ForwardedRef<HTMLFormElement>) => {
+const SearchBarInput = (
+  { onChange, onSubmit, isHomepage, isSuggestOpen, onFocus, onBlur, onHide, onClear, value }: Props,
+  ref: React.ForwardedRef<HTMLFormElement>,
+) => {
   const innerRef = React.useRef<HTMLFormElement>(null);
   React.useImperativeHandle(ref, () => innerRef.current as HTMLFormElement, []);
   const [ isSticky, setIsSticky ] = React.useState(false);
@@ -71,13 +75,13 @@ const SearchBarInput = ({ onChange, onSubmit, isHomepage, onFocus, onBlur, onHid
       w="100%"
       backgroundColor={ bgColor }
       borderRadius={{ base: isHomepage ? 'base' : 'none', lg: 'base' }}
-      position={{ base: isHomepage ? 'static' : 'absolute', lg: 'static' }}
+      position={{ base: isHomepage ? 'static' : 'absolute', lg: 'relative' }}
       top={{ base: isHomepage ? 0 : 55, lg: 0 }}
       left="0"
-      zIndex={{ base: isHomepage ? 'auto' : '-1', lg: 'auto' }}
+      zIndex={{ base: isHomepage ? 'auto' : '-1', lg: isSuggestOpen ? 'popover' : 'auto' }}
       paddingX={{ base: isHomepage ? 0 : 4, lg: 0 }}
       paddingTop={{ base: isHomepage ? 0 : 1, lg: 0 }}
-      paddingBottom={{ base: isHomepage ? 0 : 4, lg: 0 }}
+      paddingBottom={{ base: isHomepage ? 0 : 2, lg: 0 }}
       boxShadow={ scrollDirection !== 'down' && isSticky ? 'md' : 'none' }
       transform={{ base: isHomepage ? 'none' : transformMobile, lg: 'none' }}
       transitionProperty="transform,box-shadow,background-color,color,border-color"
diff --git a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggest.tsx b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggest.tsx
index 5de8491f25..b8a8e6a5e7 100644
--- a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggest.tsx
+++ b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggest.tsx
@@ -110,12 +110,12 @@ const SearchBarSuggest = ({ query, searchTerm, onItemClick, containerId }: Props
       return <Text>Something went wrong. Try refreshing the page or come back later.</Text>;
     }
 
-    if (!query.data || query.data.length === 0) {
+    const resultCategories = searchCategories.filter(cat => itemsGroups[cat.id]);
+
+    if (resultCategories.length === 0) {
       return <Text>No results found.</Text>;
     }
 
-    const resultCategories = searchCategories.filter(cat => itemsGroups[cat.id]);
-
     return (
       <>
         { resultCategories.length > 1 && (
diff --git a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestAddress.tsx b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestAddress.tsx
index 36627d12a6..ff2471cb04 100644
--- a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestAddress.tsx
+++ b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestAddress.tsx
@@ -1,13 +1,14 @@
-import { Box, Text, Flex } from '@chakra-ui/react';
+import { Box, chakra, Flex, Text } from '@chakra-ui/react';
 import React from 'react';
 
 import type { SearchResultAddressOrContractOrUniversalProfile } from 'types/api/search';
 
-import highlightText from 'lib/highlightText';
-import * as AddressEntity from 'ui/shared/entities/address/AddressEntity';
-import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
-
+import dayjs from '../../../../lib/date/dayjs';
+import highlightText from '../../../../lib/highlightText';
+import { ADDRESS_REGEXP } from '../../../../lib/validations/address';
+import * as AddressEntity from '../../../shared/entities/address/AddressEntity';
 import { formattedLuksoName } from '../../../shared/entities/address/IdenticonUniversalProfileQuery';
+import HashStringShortenDynamic from '../../../shared/HashStringShortenDynamic';
 
 interface Props {
   data: SearchResultAddressOrContractOrUniversalProfile;
@@ -16,6 +17,7 @@ interface Props {
 }
 
 const SearchBarSuggestAddress = ({ data, isMobile, searchTerm }: Props) => {
+  const shouldHighlightHash = ADDRESS_REGEXP.test(searchTerm);
   const icon = (
     <AddressEntity.Icon
       address={{
@@ -24,22 +26,39 @@ const SearchBarSuggestAddress = ({ data, isMobile, searchTerm }: Props) => {
         name: '',
         is_verified: data.is_smart_contract_verified,
         implementation_name: null,
+        ens_domain_name: null,
       }}
     />
   );
-  const name = data.name && (
+  const addressName = data.name || data.ens_info?.name;
+  const expiresText = data.ens_info?.expiry_date ? ` (expires ${ dayjs(data.ens_info.expiry_date).fromNow() })` : '';
+
+  if (data.name === null) {
+    data.name = '';
+  }
+
+  const highlightedText = data.type === 'universal_profile' ? data.address : data.name;
+
+  const nameEl = addressName && (
     <Text
       variant="secondary"
       overflow="hidden"
       whiteSpace="nowrap"
       textOverflow="ellipsis"
     >
-      <span dangerouslySetInnerHTML={{ __html: highlightText(data.type === 'universal_profile' ? data.address : data.name, searchTerm) }}/>
+      <chakra.span fontWeight={ 500 } dangerouslySetInnerHTML={{ __html: highlightText(highlightedText, searchTerm) }}/>
+      { data.ens_info &&
+                (
+                  data.ens_info.names_count > 1 ?
+                    <span> ({ data.ens_info.names_count > 39 ? '40+' : `+${ data.ens_info.names_count - 1 }` })</span> :
+                    <span>{ expiresText }</span>
+                )
+      }
     </Text>
   );
 
   const dynamicTitle = data.type === 'universal_profile' ? formattedLuksoName(data.address, data.name) : data.address;
-  const address = <HashStringShortenDynamic hash={ dynamicTitle } isTooltipDisabled/>;
+  const addressEl = <HashStringShortenDynamic hash={ dynamicTitle } isTooltipDisabled/>;
 
   if (isMobile) {
     return (
@@ -47,16 +66,16 @@ const SearchBarSuggestAddress = ({ data, isMobile, searchTerm }: Props) => {
         <Flex alignItems="center">
           { icon }
           <Box
-            as="span"
+            as={ shouldHighlightHash ? 'mark' : 'span' }
             display="block"
             overflow="hidden"
             whiteSpace="nowrap"
             fontWeight={ 700 }
           >
-            { address }
+            { addressEl }
           </Box>
         </Flex>
-        { name }
+        { nameEl }
       </>
     );
   }
@@ -66,16 +85,16 @@ const SearchBarSuggestAddress = ({ data, isMobile, searchTerm }: Props) => {
       <Flex alignItems="center" w="450px" mr={ 2 }>
         { icon }
         <Box
-          as="span"
+          as={ shouldHighlightHash ? 'mark' : 'span' }
           display="block"
           overflow="hidden"
           whiteSpace="nowrap"
           fontWeight={ 700 }
         >
-          { address }
+          { addressEl }
         </Box>
       </Flex>
-      { name }
+      { nameEl }
     </Flex>
   );
 };
diff --git a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestBlob.tsx b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestBlob.tsx
new file mode 100644
index 0000000000..6c852d9b7c
--- /dev/null
+++ b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestBlob.tsx
@@ -0,0 +1,25 @@
+import { chakra, Flex } from '@chakra-ui/react';
+import React from 'react';
+
+import type { SearchResultBlob } from 'types/api/search';
+
+import * as BlobEntity from 'ui/shared/entities/blob/BlobEntity';
+import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
+
+interface Props {
+  data: SearchResultBlob;
+  searchTerm: string;
+}
+
+const SearchBarSuggestBlob = ({ data }: Props) => {
+  return (
+    <Flex alignItems="center" minW={ 0 }>
+      <BlobEntity.Icon/>
+      <chakra.mark overflow="hidden" whiteSpace="nowrap" fontWeight={ 700 }>
+        <HashStringShortenDynamic hash={ data.blob_hash } isTooltipDisabled/>
+      </chakra.mark>
+    </Flex>
+  );
+};
+
+export default React.memo(SearchBarSuggestBlob);
diff --git a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestBlock.tsx b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestBlock.tsx
index c2c05c4377..8bdc7239ac 100644
--- a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestBlock.tsx
+++ b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestBlock.tsx
@@ -47,6 +47,7 @@ const SearchBarSuggestBlock = ({ data, isMobile, searchTerm }: Props) => {
           { icon }
           { blockNumber }
           { data.block_type === 'reorg' && <Tag ml="auto">Reorg</Tag> }
+          { data.block_type === 'uncle' && <Tag ml="auto">Uncle</Tag> }
         </Flex>
         { hash }
         <Text variant="secondary">{ date }</Text>
@@ -62,6 +63,7 @@ const SearchBarSuggestBlock = ({ data, isMobile, searchTerm }: Props) => {
       </Flex>
       <Flex columnGap={ 3 } minW={ 0 } alignItems="center">
         { data.block_type === 'reorg' && <Tag flexShrink={ 0 }>Reorg</Tag> }
+        { data.block_type === 'uncle' && <Tag flexShrink={ 0 }>Uncle</Tag> }
         { hash }
       </Flex>
       <Text variant="secondary" textAlign="end">{ date }</Text>
diff --git a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestItem.tsx b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestItem.tsx
index 107d63a416..c4b702b559 100644
--- a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestItem.tsx
+++ b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestItem.tsx
@@ -7,11 +7,13 @@ import type { SearchResultItem } from 'types/api/search';
 import { route } from 'nextjs-routes';
 
 import SearchBarSuggestAddress from './SearchBarSuggestAddress';
+import SearchBarSuggestBlob from './SearchBarSuggestBlob';
 import SearchBarSuggestBlock from './SearchBarSuggestBlock';
 import SearchBarSuggestItemLink from './SearchBarSuggestItemLink';
 import SearchBarSuggestLabel from './SearchBarSuggestLabel';
 import SearchBarSuggestToken from './SearchBarSuggestToken';
 import SearchBarSuggestTx from './SearchBarSuggestTx';
+import SearchBarSuggestUserOp from './SearchBarSuggestUserOp';
 
 interface Props {
   data: SearchResultItem;
@@ -39,6 +41,12 @@ const SearchBarSuggestItem = ({ data, isMobile, searchTerm, onClick }: Props) =>
       case 'block': {
         return route({ pathname: '/block/[height_or_hash]', query: { height_or_hash: String(data.block_hash) } });
       }
+      case 'user_operation': {
+        return route({ pathname: '/op/[hash]', query: { hash: data.user_operation_hash } });
+      }
+      case 'blob': {
+        return route({ pathname: '/blobs/[hash]', query: { hash: data.blob_hash } });
+      }
     }
   })();
 
@@ -62,6 +70,12 @@ const SearchBarSuggestItem = ({ data, isMobile, searchTerm, onClick }: Props) =>
       case 'transaction': {
         return <SearchBarSuggestTx data={ data } searchTerm={ searchTerm } isMobile={ isMobile }/>;
       }
+      case 'user_operation': {
+        return <SearchBarSuggestUserOp data={ data } searchTerm={ searchTerm } isMobile={ isMobile }/>;
+      }
+      case 'blob': {
+        return <SearchBarSuggestBlob data={ data } searchTerm={ searchTerm }/>;
+      }
     }
   })();
 
diff --git a/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestUserOp.tsx b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestUserOp.tsx
new file mode 100644
index 0000000000..21e0701822
--- /dev/null
+++ b/ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestUserOp.tsx
@@ -0,0 +1,48 @@
+import { chakra, Text, Flex } from '@chakra-ui/react';
+import React from 'react';
+
+import type { SearchResultUserOp } from 'types/api/search';
+
+import dayjs from 'lib/date/dayjs';
+import * as UserOpEntity from 'ui/shared/entities/userOp/UserOpEntity';
+import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
+
+interface Props {
+  data: SearchResultUserOp;
+  isMobile: boolean | undefined;
+  searchTerm: string;
+}
+
+const SearchBarSuggestTx = ({ data, isMobile }: Props) => {
+  const icon = <UserOpEntity.Icon/>;
+  const hash = (
+    <chakra.mark overflow="hidden" whiteSpace="nowrap" fontWeight={ 700 }>
+      <HashStringShortenDynamic hash={ data.user_operation_hash } isTooltipDisabled/>
+    </chakra.mark>
+  );
+  const date = dayjs(data.timestamp).format('llll');
+
+  if (isMobile) {
+    return (
+      <>
+        <Flex alignItems="center">
+          { icon }
+          { hash }
+        </Flex>
+        <Text variant="secondary">{ date }</Text>
+      </>
+    );
+  }
+
+  return (
+    <Flex columnGap={ 2 }>
+      <Flex alignItems="center" minW={ 0 }>
+        { icon }
+        { hash }
+      </Flex>
+      <Text variant="secondary" textAlign="end" flexShrink={ 0 } ml="auto">{ date }</Text>
+    </Flex>
+  );
+};
+
+export default React.memo(SearchBarSuggestTx);
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_dark-color-mode_search-by-contract-name-mobile-dark-mode-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_dark-color-mode_search-by-contract-name-mobile-dark-mode-1.png
index 72ed4ec998..6b1c79a62f 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_dark-color-mode_search-by-contract-name-mobile-dark-mode-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_dark-color-mode_search-by-contract-name-mobile-dark-mode-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_recent-keywords-suggest-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_recent-keywords-suggest-mobile-1.png
index 9cfc914b85..4bf76fee17 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_recent-keywords-suggest-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_recent-keywords-suggest-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_scroll-suggest-to-category-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_scroll-suggest-to-category-1.png
index 6a08ad4fb7..97875b4515 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_scroll-suggest-to-category-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_scroll-suggest-to-category-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-address-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-address-hash-mobile-1.png
index 5943a7308a..cb71b52d02 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-address-hash-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-address-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-blob-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-blob-hash-mobile-1.png
new file mode 100644
index 0000000000..db793662ce
Binary files /dev/null and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-blob-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-block-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-block-hash-mobile-1.png
index 4814677c87..64ff86056f 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-block-hash-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-block-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-block-number-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-block-number-mobile-1.png
index 73be226e46..b40ca14719 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-block-number-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-block-number-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-contract-name-mobile-dark-mode-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-contract-name-mobile-dark-mode-1.png
index 10858ccfc6..eea4e39708 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-contract-name-mobile-dark-mode-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-contract-name-mobile-dark-mode-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-name-homepage-dark-mode-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-name-homepage-dark-mode-1.png
index 548c9271b4..809aa9e90a 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-name-homepage-dark-mode-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-name-homepage-dark-mode-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-tag-mobile-dark-mode-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-tag-mobile-dark-mode-1.png
index 486edadb4f..530ed3685f 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-tag-mobile-dark-mode-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-tag-mobile-dark-mode-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-token-name-mobile-dark-mode-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-token-name-mobile-dark-mode-1.png
index 2bc3b994c7..4584baf91f 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-token-name-mobile-dark-mode-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-token-name-mobile-dark-mode-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-tx-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-tx-hash-mobile-1.png
index b14c0278b9..02c42937f1 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-tx-hash-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-tx-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-user-op-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-user-op-hash-mobile-1.png
new file mode 100644
index 0000000000..0a2c600ebc
Binary files /dev/null and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-by-user-op-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-with-view-all-link-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-with-view-all-link-1.png
index bcee42809f..c58de52f87 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-with-view-all-link-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_search-with-view-all-link-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_with-apps-default-view-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_with-apps-default-view-mobile-1.png
index c35b3abb2d..dd8fbb7f3a 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_with-apps-default-view-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_default_with-apps-default-view-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-address-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-address-hash-mobile-1.png
index 708f222e24..6a3942e179 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-address-hash-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-address-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-blob-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-blob-hash-mobile-1.png
new file mode 100644
index 0000000000..045ddf43d8
Binary files /dev/null and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-blob-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-block-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-block-hash-mobile-1.png
index 40bcacf30b..c8e7e789fb 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-block-hash-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-block-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-block-number-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-block-number-mobile-1.png
index 853801284a..e0fbd6a953 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-block-number-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-block-number-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-contract-name-mobile-dark-mode-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-contract-name-mobile-dark-mode-1.png
index a72f116610..4b21e36376 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-contract-name-mobile-dark-mode-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-contract-name-mobile-dark-mode-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-token-name-mobile-dark-mode-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-token-name-mobile-dark-mode-1.png
index 8fe800b4e2..c49ce5f4bb 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-token-name-mobile-dark-mode-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-token-name-mobile-dark-mode-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-tx-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-tx-hash-mobile-1.png
index 583e0ca7dd..24a3225cb2 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-tx-hash-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-tx-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-user-op-hash-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-user-op-hash-mobile-1.png
new file mode 100644
index 0000000000..9abfcecc7c
Binary files /dev/null and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_search-by-user-op-hash-mobile-1.png differ
diff --git a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_with-apps-default-view-mobile-1.png b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_with-apps-default-view-mobile-1.png
index 8aa04689dc..bb2ebd04a8 100644
Binary files a/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_with-apps-default-view-mobile-1.png and b/ui/snippets/searchBar/__screenshots__/SearchBar.pw.tsx_mobile_with-apps-default-view-mobile-1.png differ
diff --git a/ui/snippets/topBar/ColorModeSwitch.tsx b/ui/snippets/topBar/ColorModeSwitch.tsx
deleted file mode 100644
index aa7156a1e1..0000000000
--- a/ui/snippets/topBar/ColorModeSwitch.tsx
+++ /dev/null
@@ -1,98 +0,0 @@
-import {
-  IconButton,
-  Popover,
-  PopoverTrigger,
-  PopoverContent,
-  PopoverBody,
-  useColorMode,
-  useDisclosure,
-  Skeleton,
-} from '@chakra-ui/react';
-import React from 'react';
-
-import * as cookies from 'lib/cookies';
-import IconSvg from 'ui/shared/IconSvg';
-
-import ColorModeSwitchTheme from './ColorModeSwitchTheme';
-import { COLOR_THEMES } from './utils';
-
-const ColorModeSwitch = () => {
-  const { isOpen, onToggle, onClose } = useDisclosure();
-  const { setColorMode, colorMode } = useColorMode();
-
-  const [ activeHex, setActiveHex ] = React.useState<string>();
-
-  const setTheme = React.useCallback((hex: string) => {
-    const nextTheme = COLOR_THEMES.find((theme) => theme.colors.some((color) => color.hex === hex));
-
-    if (!nextTheme) {
-      return;
-    }
-
-    setColorMode(nextTheme.colorMode);
-
-    const varName = nextTheme.colorMode === 'light' ? '--chakra-colors-white' : '--chakra-colors-black';
-    window.document.documentElement.style.setProperty(varName, hex);
-
-    cookies.set(cookies.NAMES.COLOR_MODE_HEX, hex);
-    window.localStorage.setItem(cookies.NAMES.COLOR_MODE, nextTheme.colorMode);
-  }, [ setColorMode ]);
-
-  React.useEffect(() => {
-    const cookieColorMode = cookies.get(cookies.NAMES.COLOR_MODE);
-
-    const nextColorMode = (() => {
-      if (!cookieColorMode) {
-        return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
-      }
-
-      return colorMode;
-    })();
-
-    const fallbackHex = (COLOR_THEMES.find(theme => theme.colorMode === nextColorMode && theme.colors.length === 1) ?? COLOR_THEMES[0]).colors[0].hex;
-    const cookieHex = cookies.get(cookies.NAMES.COLOR_MODE_HEX) ?? fallbackHex;
-    setTheme(cookieHex);
-    setActiveHex(cookieHex);
-  // should run only on mount
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [ ]);
-
-  const handleSelect = React.useCallback((event: React.MouseEvent<HTMLDivElement>) => {
-    event.stopPropagation();
-
-    const hex = event.currentTarget.getAttribute('data-hex');
-
-    if (!hex) {
-      return;
-    }
-
-    setTheme(hex);
-    setActiveHex(hex);
-  }, [ setTheme ]);
-
-  const activeTheme = COLOR_THEMES.find((theme) => theme.colors.some((color) => color.hex === activeHex));
-
-  return (
-    <Popover placement="bottom-start" isLazy trigger="click" isOpen={ isOpen } onClose={ onClose }>
-      <PopoverTrigger>
-        { activeTheme ? (
-          <IconButton
-            variant="simple"
-            colorScheme="blue"
-            aria-label="color mode switch"
-            icon={ <IconSvg name={ activeTheme.icon } boxSize={ 5 }/> }
-            boxSize={ 5 }
-            onClick={ onToggle }
-          />
-        ) : <Skeleton boxSize={ 5 } borderRadius="sm"/> }
-      </PopoverTrigger>
-      <PopoverContent overflowY="hidden" w="164px" fontSize="sm">
-        <PopoverBody boxShadow="2xl" p={ 3 }>
-          { COLOR_THEMES.map((theme) => <ColorModeSwitchTheme key={ theme.name } { ...theme } onClick={ handleSelect } activeHex={ activeHex }/>) }
-        </PopoverBody>
-      </PopoverContent>
-    </Popover>
-  );
-};
-
-export default ColorModeSwitch;
diff --git a/ui/snippets/topBar/ColorModeSwitchSample.tsx b/ui/snippets/topBar/ColorModeSwitchSample.tsx
deleted file mode 100644
index a1a8a5b4e4..0000000000
--- a/ui/snippets/topBar/ColorModeSwitchSample.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import {
-  Box,
-  useColorModeValue,
-  useToken,
-} from '@chakra-ui/react';
-import React from 'react';
-
-import type { ColorThemeColor } from './utils';
-
-interface Props extends ColorThemeColor {
-  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
-  isActive: boolean;
-}
-
-const ColorModeSwitchSample = ({ hex, sampleBg, onClick, isActive }: Props) => {
-  const bgColor = useColorModeValue('white', 'gray.900');
-  const activeBgColor = useColorModeValue('blue.50', 'blackAlpha.800');
-
-  const activeBorderColor = useToken('colors', useColorModeValue('blackAlpha.800', 'gray.50'));
-  const hoverBorderColor = useToken('colors', 'link_hovered');
-
-  return (
-    <Box
-      bg={ sampleBg }
-      boxSize={ 5 }
-      borderRadius="full"
-      borderWidth="1px"
-      borderColor={ isActive ? activeBgColor : bgColor }
-      position="relative"
-      _before={{
-        position: 'absolute',
-        display: 'block',
-        content: '""',
-        top: '-3px',
-        left: '-3px',
-        width: 'calc(100% + 2px)',
-        height: 'calc(100% + 2px)',
-        borderStyle: 'solid',
-        borderRadius: 'full',
-        borderWidth: '2px',
-        borderColor: isActive ? activeBorderColor : 'transparent',
-      }}
-      _hover={{
-        _before: {
-          borderColor: isActive ? activeBorderColor : hoverBorderColor,
-        },
-      }}
-      data-hex={ hex }
-      onClick={ onClick }
-    />
-  );
-};
-
-export default ColorModeSwitchSample;
diff --git a/ui/snippets/topBar/ColorModeSwitchTheme.tsx b/ui/snippets/topBar/ColorModeSwitchTheme.tsx
deleted file mode 100644
index d69608ed79..0000000000
--- a/ui/snippets/topBar/ColorModeSwitchTheme.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import {
-  Flex,
-  useColorModeValue,
-  useToken,
-} from '@chakra-ui/react';
-import React from 'react';
-
-import IconSvg from 'ui/shared/IconSvg';
-
-import ColorModeSwitchSample from './ColorModeSwitchSample';
-import type { ColorTheme } from './utils';
-
-interface Props extends ColorTheme {
-  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
-  activeHex: string | undefined;
-}
-
-const ColorModeSwitchTheme = ({ icon, name, colors, onClick, activeHex }: Props) => {
-  const isActive = colors.some((sample) => sample.hex === activeHex);
-  const activeColor = useColorModeValue('blackAlpha.800', 'gray.50');
-  const activeBgColor = useColorModeValue('blue.50', 'blackAlpha.800');
-  const inactiveColor = useColorModeValue('blue.700', 'gray.400');
-  const hoverBorderColor = useToken('colors', 'link_hovered');
-  const hasOneColor = colors.length === 1;
-
-  return (
-    <Flex
-      alignItems="center"
-      py="10px"
-      px="6px"
-      cursor="pointer"
-      color={ isActive ? activeColor : inactiveColor }
-      bgColor={ isActive ? activeBgColor : undefined }
-      _hover={{
-        color: isActive ? undefined : 'link_hovered',
-        '& [data-hex]': !isActive && hasOneColor ? {
-          _before: {
-            borderColor: hoverBorderColor,
-          },
-        } : undefined,
-      }}
-      onClick={ onClick }
-      data-hex={ colors[0].hex }
-      fontWeight={ 500 }
-      borderRadius="base"
-    >
-      <IconSvg name={ icon } boxSize={ 5 } mr={ 2 }/>
-      <span>{ name }</span>
-      <Flex columnGap={ 2 } ml="auto" alignItems="center">
-        { colors.map((sample) => <ColorModeSwitchSample key={ sample.hex } { ...sample } onClick={ onClick } isActive={ activeHex === sample.hex }/>) }
-      </Flex>
-    </Flex>
-  );
-};
-
-export default ColorModeSwitchTheme;
diff --git a/ui/snippets/topBar/SwapButton.tsx b/ui/snippets/topBar/SwapButton.tsx
new file mode 100644
index 0000000000..b446455f9a
--- /dev/null
+++ b/ui/snippets/topBar/SwapButton.tsx
@@ -0,0 +1,50 @@
+import { Button, Box } from '@chakra-ui/react';
+import { useRouter } from 'next/router';
+import React from 'react';
+
+import { route } from 'nextjs-routes';
+
+import config from 'configs/app';
+import getPageType from 'lib/mixpanel/getPageType';
+import * as mixpanel from 'lib/mixpanel/index';
+import IconSvg from 'ui/shared/IconSvg';
+
+const feature = config.features.swapButton;
+
+const SwapButton = () => {
+  const router = useRouter();
+  const source = getPageType(router.pathname);
+
+  const handleClick = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.BUTTON_CLICK, { Content: 'Swap button', Source: source });
+  }, [ source ]);
+
+  if (!feature.isEnabled) {
+    return null;
+  }
+
+  const href = 'url' in feature ?
+    feature.url :
+    route({ pathname: '/apps/[id]', query: { id: feature.dappId, action: 'connect' } });
+
+  return (
+    <Button
+      as="a"
+      href={ href }
+      target={ 'url' in feature ? '_blank' : '_self' }
+      variant="solid"
+      size="xs"
+      borderRadius="sm"
+      height={ 5 }
+      px={ 1.5 }
+      onClick={ handleClick }
+    >
+      <IconSvg name="swap" boxSize={ 3 } mr={{ base: 0, sm: 1 }}/>
+      <Box display={{ base: 'none', sm: 'inline' }}>
+        Swap
+      </Box>
+    </Button>
+  );
+};
+
+export default React.memo(SwapButton);
diff --git a/ui/snippets/topBar/TopBar.pw.tsx b/ui/snippets/topBar/TopBar.pw.tsx
index 555f645707..5b7702f1e1 100644
--- a/ui/snippets/topBar/TopBar.pw.tsx
+++ b/ui/snippets/topBar/TopBar.pw.tsx
@@ -1,14 +1,22 @@
-import { test, expect } from '@playwright/experimental-ct-react';
+import { test as base, expect } from '@playwright/experimental-ct-react';
 import React from 'react';
 
 import * as statsMock from 'mocks/stats/index';
+import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
 import TestApp from 'playwright/TestApp';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
 
 import TopBar from './TopBar';
 
+const test = base.extend({
+  context: contextWithEnvs([
+    { name: 'NEXT_PUBLIC_SWAP_BUTTON_URL', value: 'uniswap' },
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  ]) as any,
+});
+
 test('default view +@dark-mode +@mobile', async({ mount, page }) => {
-  await page.route(buildApiUrl('homepage_stats'), (route) => route.fulfill({
+  await page.route(buildApiUrl('stats'), (route) => route.fulfill({
     status: 200,
     body: JSON.stringify(statsMock.base),
   }));
@@ -19,9 +27,9 @@ test('default view +@dark-mode +@mobile', async({ mount, page }) => {
     </TestApp>,
   );
 
-  await component.getByText(/gwei/i).hover();
+  await component.getByText(/\$1\.39/).click();
   await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1500, height: 220 } });
 
-  await component.getByLabel('color mode switch').click();
-  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1500, height: 220 } });
+  await component.getByLabel('User settings').click();
+  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 1500, height: 400 } });
 });
diff --git a/ui/snippets/topBar/TopBar.tsx b/ui/snippets/topBar/TopBar.tsx
index 23976769a5..0b97de2aff 100644
--- a/ui/snippets/topBar/TopBar.tsx
+++ b/ui/snippets/topBar/TopBar.tsx
@@ -1,9 +1,14 @@
-import { Flex, useColorModeValue } from '@chakra-ui/react';
+import { Flex, Divider, useColorModeValue } from '@chakra-ui/react';
 import React from 'react';
 
-import ColorModeSwitch from './ColorModeSwitch';
+import config from 'configs/app';
+
+import Settings from './settings/Settings';
+import SwapButton from './SwapButton';
 import TopBarStats from './TopBarStats';
 
+const feature = config.features.swapButton;
+
 const TopBar = () => {
   const bgColor = useColorModeValue('gray.50', 'whiteAlpha.100');
 
@@ -13,9 +18,18 @@ const TopBar = () => {
       px={ 6 }
       bgColor={ bgColor }
       justifyContent="space-between"
+      alignItems="center"
     >
       <TopBarStats/>
-      <ColorModeSwitch/>
+      <Flex alignItems="center">
+        { feature.isEnabled && (
+          <>
+            <SwapButton/>
+            <Divider mr={ 3 } ml={{ base: 2, sm: 3 }} height={ 4 } orientation="vertical"/>
+          </>
+        ) }
+        <Settings/>
+      </Flex>
     </Flex>
   );
 };
diff --git a/ui/snippets/topBar/TopBarStats.tsx b/ui/snippets/topBar/TopBarStats.tsx
index 758bcfb1a6..7bc180f0c6 100644
--- a/ui/snippets/topBar/TopBarStats.tsx
+++ b/ui/snippets/topBar/TopBarStats.tsx
@@ -1,28 +1,43 @@
-import { Flex, LightMode, Link, Skeleton, Tooltip, chakra, useDisclosure } from '@chakra-ui/react';
+import { Flex, Link, Skeleton, chakra } from '@chakra-ui/react';
 import React from 'react';
 
 import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';
+import dayjs from 'lib/date/dayjs';
 import { HOMEPAGE_STATS } from 'stubs/stats';
-import GasInfoTooltipContent from 'ui/shared/GasInfoTooltipContent/GasInfoTooltipContent';
+import GasInfoTooltip from 'ui/shared/gas/GasInfoTooltip';
+import GasPrice from 'ui/shared/gas/GasPrice';
 import TextSeparator from 'ui/shared/TextSeparator';
 
 const TopBarStats = () => {
-  // have to implement controlled tooltip because of the issue - https://github.com/chakra-ui/chakra-ui/issues/7107
-  const { isOpen, onOpen, onToggle, onClose } = useDisclosure();
-
-  const handleClick = React.useCallback((event: React.MouseEvent) => {
-    event.stopPropagation();
-    onToggle();
-  }, [ onToggle ]);
-
-  const { data, isPlaceholderData, isError } = useApiQuery('homepage_stats', {
+  const { data, isPlaceholderData, isError, refetch, dataUpdatedAt } = useApiQuery('stats', {
     queryOptions: {
       placeholderData: HOMEPAGE_STATS,
       refetchOnMount: false,
     },
   });
 
+  React.useEffect(() => {
+    if (isPlaceholderData || !data?.gas_price_updated_at) {
+      return;
+    }
+
+    const endDate = dayjs(dataUpdatedAt).add(data.gas_prices_update_in, 'ms');
+    const timeout = endDate.diff(dayjs(), 'ms');
+
+    if (timeout <= 0) {
+      return;
+    }
+
+    const timeoutId = window.setTimeout(() => {
+      refetch();
+    }, timeout);
+
+    return () => {
+      window.clearTimeout(timeoutId);
+    };
+  }, [ isPlaceholderData, data?.gas_price_updated_at, dataUpdatedAt, data?.gas_prices_update_in, refetch ]);
+
   if (isError) {
     return <div/>;
   }
@@ -34,35 +49,29 @@ const TopBarStats = () => {
       fontWeight={ 500 }
     >
       { data?.coin_price && (
-        <Skeleton isLoaded={ !isPlaceholderData }>
-          <chakra.span color="text_secondary">{ config.chain.governanceToken.symbol || config.chain.currency.symbol } </chakra.span>
-          <span>${ Number(data.coin_price).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 6 }) }</span>
-        </Skeleton>
+        <Flex columnGap={ 1 }>
+          <Skeleton isLoaded={ !isPlaceholderData }>
+            <chakra.span color="text_secondary">{ config.chain.governanceToken.symbol || config.chain.currency.symbol } </chakra.span>
+            <span>${ Number(data.coin_price).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 6 }) }</span>
+          </Skeleton>
+          { data.coin_price_change_percentage && (
+            <Skeleton isLoaded={ !isPlaceholderData }>
+              <chakra.span color={ Number(data.coin_price_change_percentage) >= 0 ? 'green.500' : 'red.500' }>
+                { Number(data.coin_price_change_percentage).toFixed(2) }%
+              </chakra.span>
+            </Skeleton>
+          ) }
+        </Flex>
       ) }
-      { data?.coin_price && config.UI.homepage.showGasTracker && <TextSeparator color="divider"/> }
-      { data?.gas_prices && data.gas_prices.average !== null && config.UI.homepage.showGasTracker && (
+      { data?.coin_price && config.features.gasTracker.isEnabled && <TextSeparator color="divider"/> }
+      { data?.gas_prices && data.gas_prices.average !== null && config.features.gasTracker.isEnabled && (
         <Skeleton isLoaded={ !isPlaceholderData }>
           <chakra.span color="text_secondary">Gas </chakra.span>
-          <LightMode>
-            <Tooltip
-              label={ <GasInfoTooltipContent gasPrices={ data.gas_prices }/> }
-              hasArrow={ false }
-              borderRadius="md"
-              offset={ [ 0, 16 ] }
-              bgColor="blackAlpha.900"
-              p={ 0 }
-              isOpen={ isOpen }
-            >
-              <Link
-                _hover={{ textDecoration: 'none', color: 'link_hovered' }}
-                onClick={ handleClick }
-                onMouseEnter={ onOpen }
-                onMouseLeave={ onClose }
-              >
-                { data.gas_prices.average } Gwei
-              </Link>
-            </Tooltip>
-          </LightMode>
+          <GasInfoTooltip data={ data } dataUpdatedAt={ dataUpdatedAt } >
+            <Link>
+              <GasPrice data={ data.gas_prices.average }/>
+            </Link>
+          </GasInfoTooltip>
         </Skeleton>
       ) }
     </Flex>
diff --git a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_dark-color-mode_default-view-dark-mode-mobile-1.png b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_dark-color-mode_default-view-dark-mode-mobile-1.png
index 6a2b7cbc92..ef9ee9ef75 100644
Binary files a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_dark-color-mode_default-view-dark-mode-mobile-1.png and b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_dark-color-mode_default-view-dark-mode-mobile-1.png differ
diff --git a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_dark-color-mode_default-view-dark-mode-mobile-2.png b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_dark-color-mode_default-view-dark-mode-mobile-2.png
index 5698b69615..81a796b202 100644
Binary files a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_dark-color-mode_default-view-dark-mode-mobile-2.png and b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_dark-color-mode_default-view-dark-mode-mobile-2.png differ
diff --git a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_default_default-view-dark-mode-mobile-1.png b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_default_default-view-dark-mode-mobile-1.png
index 5ad894f330..5d9431dffd 100644
Binary files a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_default_default-view-dark-mode-mobile-1.png and b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_default_default-view-dark-mode-mobile-1.png differ
diff --git a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_default_default-view-dark-mode-mobile-2.png b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_default_default-view-dark-mode-mobile-2.png
index 87b4a3ff01..05add27866 100644
Binary files a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_default_default-view-dark-mode-mobile-2.png and b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_default_default-view-dark-mode-mobile-2.png differ
diff --git a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_mobile_default-view-dark-mode-mobile-1.png b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_mobile_default-view-dark-mode-mobile-1.png
index 5f14a03434..346904777a 100644
Binary files a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_mobile_default-view-dark-mode-mobile-1.png and b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_mobile_default-view-dark-mode-mobile-1.png differ
diff --git a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_mobile_default-view-dark-mode-mobile-2.png b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_mobile_default-view-dark-mode-mobile-2.png
index cba6ce62e3..10916853a2 100644
Binary files a/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_mobile_default-view-dark-mode-mobile-2.png and b/ui/snippets/topBar/__screenshots__/TopBar.pw.tsx_mobile_default-view-dark-mode-mobile-2.png differ
diff --git a/ui/snippets/topBar/settings/Settings.tsx b/ui/snippets/topBar/settings/Settings.tsx
new file mode 100644
index 0000000000..664ec6461c
--- /dev/null
+++ b/ui/snippets/topBar/settings/Settings.tsx
@@ -0,0 +1,36 @@
+import { Box, IconButton, Popover, PopoverBody, PopoverContent, PopoverTrigger, useDisclosure } from '@chakra-ui/react';
+import React from 'react';
+
+import IconSvg from 'ui/shared/IconSvg';
+
+import SettingsColorTheme from './SettingsColorTheme';
+import SettingsIdentIcon from './SettingsIdentIcon';
+
+const Settings = () => {
+  const { isOpen, onToggle, onClose } = useDisclosure();
+
+  return (
+    <Popover placement="bottom-start" trigger="click" isOpen={ isOpen } onClose={ onClose }>
+      <PopoverTrigger>
+        <IconButton
+          variant="simple"
+          colorScheme="blue"
+          aria-label="User settings"
+          icon={ <IconSvg name="gear_slim" boxSize={ 5 }/> }
+          p="1px"
+          boxSize={ 5 }
+          onClick={ onToggle }
+        />
+      </PopoverTrigger>
+      <PopoverContent overflowY="hidden" w="auto" fontSize="sm">
+        <PopoverBody boxShadow="2xl" p={ 4 }>
+          <SettingsColorTheme/>
+          <Box borderColor="divider" borderWidth="1px" my={ 3 }/>
+          <SettingsIdentIcon/>
+        </PopoverBody>
+      </PopoverContent>
+    </Popover>
+  );
+};
+
+export default React.memo(Settings);
diff --git a/ui/snippets/topBar/settings/SettingsColorTheme.tsx b/ui/snippets/topBar/settings/SettingsColorTheme.tsx
new file mode 100644
index 0000000000..a8ba9c580e
--- /dev/null
+++ b/ui/snippets/topBar/settings/SettingsColorTheme.tsx
@@ -0,0 +1,85 @@
+import { Box, Flex, useColorMode } from '@chakra-ui/react';
+import React from 'react';
+
+import * as cookies from 'lib/cookies';
+
+import SettingsSample from './SettingsSample';
+import { COLOR_THEMES } from './utils';
+
+const SettingsColorTheme = () => {
+  const { setColorMode } = useColorMode();
+
+  const [ activeHex, setActiveHex ] = React.useState<string>();
+
+  const setTheme = React.useCallback((hex: string) => {
+    const nextTheme = COLOR_THEMES.find((theme) => theme.hex === hex);
+
+    if (!nextTheme) {
+      return;
+    }
+
+    setColorMode(nextTheme.colorMode);
+
+    const varName = nextTheme.colorMode === 'light' ? '--chakra-colors-white' : '--chakra-colors-black';
+    window.document.documentElement.style.setProperty(varName, hex);
+
+    cookies.set(cookies.NAMES.COLOR_MODE_HEX, hex);
+    window.localStorage.setItem(cookies.NAMES.COLOR_MODE, nextTheme.colorMode);
+  }, [ setColorMode ]);
+
+  React.useEffect(() => {
+    const cookieColorMode = cookies.get(cookies.NAMES.COLOR_MODE);
+
+    const nextColorMode = (() => {
+      if (!cookieColorMode) {
+        return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+      }
+
+      return cookieColorMode;
+    })();
+
+    const colorModeThemes = COLOR_THEMES.filter(theme => theme.colorMode === nextColorMode);
+    const fallbackHex = colorModeThemes[colorModeThemes.length - 1].hex;
+    const cookieHex = cookies.get(cookies.NAMES.COLOR_MODE_HEX) ?? fallbackHex;
+    setTheme(cookieHex);
+    setActiveHex(cookieHex);
+  // should run only on mount
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [ ]);
+
+  const handleSelect = React.useCallback((event: React.MouseEvent<HTMLDivElement>) => {
+    event.stopPropagation();
+
+    const hex = event.currentTarget.getAttribute('data-value');
+
+    if (!hex) {
+      return;
+    }
+
+    setTheme(hex);
+    setActiveHex(hex);
+  }, [ setTheme ]);
+
+  const activeTheme = COLOR_THEMES.find((theme) => theme.hex === activeHex);
+
+  return (
+    <div>
+      <Box fontWeight={ 600 }>Color theme</Box>
+      <Box color="text_secondary" mt={ 1 } mb={ 2 }>{ activeTheme?.label }</Box>
+      <Flex>
+        { COLOR_THEMES.map((theme) => (
+          <SettingsSample
+            key={ theme.label }
+            label={ theme.label }
+            value={ theme.hex }
+            bg={ theme.sampleBg }
+            isActive={ theme.hex === activeHex }
+            onClick={ handleSelect }
+          />
+        )) }
+      </Flex>
+    </div>
+  );
+};
+
+export default React.memo(SettingsColorTheme);
diff --git a/ui/snippets/topBar/settings/SettingsIdentIcon.tsx b/ui/snippets/topBar/settings/SettingsIdentIcon.tsx
new file mode 100644
index 0000000000..af8f4b3140
--- /dev/null
+++ b/ui/snippets/topBar/settings/SettingsIdentIcon.tsx
@@ -0,0 +1,53 @@
+import { Box, Flex } from '@chakra-ui/react';
+import React from 'react';
+
+import config from 'configs/app';
+import * as cookies from 'lib/cookies';
+
+import SettingsSample from './SettingsSample';
+import { IDENTICONS } from './utils';
+
+const SettingsIdentIcon = () => {
+  const [ activeId, setActiveId ] = React.useState<string>();
+
+  React.useEffect(() => {
+    const initialId = cookies.get(cookies.NAMES.ADDRESS_IDENTICON_TYPE) || config.UI.views.address.identiconType;
+    setActiveId(initialId);
+  }, []);
+
+  const handleSelect = React.useCallback((event: React.MouseEvent<HTMLDivElement>) => {
+    event.stopPropagation();
+
+    const id = event.currentTarget.getAttribute('data-value');
+
+    if (!id) {
+      return;
+    }
+
+    cookies.set(cookies.NAMES.ADDRESS_IDENTICON_TYPE, id);
+    window.location.reload();
+  }, []);
+
+  const activeIdenticon = IDENTICONS.find((identicon) => identicon.id === activeId);
+
+  return (
+    <div>
+      <Box fontWeight={ 600 }>Address identicon</Box>
+      <Box color="text_secondary" mt={ 1 } mb={ 2 }>{ activeIdenticon?.label }</Box>
+      <Flex>
+        { IDENTICONS.map((identicon) => (
+          <SettingsSample
+            key={ identicon.id }
+            label={ identicon.label }
+            value={ identicon.id }
+            bg={ identicon.sampleBg }
+            isActive={ identicon.id === activeId }
+            onClick={ handleSelect }
+          />
+        )) }
+      </Flex>
+    </div>
+  );
+};
+
+export default React.memo(SettingsIdentIcon);
diff --git a/ui/snippets/topBar/settings/SettingsSample.tsx b/ui/snippets/topBar/settings/SettingsSample.tsx
new file mode 100644
index 0000000000..b6986b1862
--- /dev/null
+++ b/ui/snippets/topBar/settings/SettingsSample.tsx
@@ -0,0 +1,63 @@
+import {
+  Box,
+  Tooltip,
+  useColorModeValue,
+  useToken,
+} from '@chakra-ui/react';
+import React from 'react';
+
+interface Props {
+  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
+  isActive: boolean;
+  bg: string;
+  value: string;
+  label: string;
+}
+
+const TOOLTIP_OFFSET: [ number, number ] = [ 0, 10 ];
+
+const SettingsSample = ({ label, value, bg, onClick, isActive }: Props) => {
+  const bgColor = useColorModeValue('white', 'gray.900');
+  const activeBgColor = useColorModeValue('blue.50', 'whiteAlpha.100');
+
+  const activeBorderColor = useToken('colors', useColorModeValue('blackAlpha.800', 'gray.50'));
+  const hoverBorderColor = useToken('colors', 'link_hovered');
+
+  return (
+    <Box p="9px" bgColor={ isActive ? activeBgColor : 'transparent' } borderRadius="base">
+      <Tooltip label={ label } offset={ TOOLTIP_OFFSET }>
+        <Box
+          bg={ bg }
+          boxSize="22px"
+          borderRadius="full"
+          borderWidth="1px"
+          borderColor={ isActive ? activeBgColor : bgColor }
+          position="relative"
+          cursor="pointer"
+          _before={{
+            position: 'absolute',
+            display: 'block',
+            content: '""',
+            top: '-3px',
+            left: '-3px',
+            width: 'calc(100% + 2px)',
+            height: 'calc(100% + 2px)',
+            borderStyle: 'solid',
+            borderRadius: 'full',
+            borderWidth: '2px',
+            borderColor: isActive ? activeBorderColor : 'transparent',
+          }}
+          _hover={{
+            _before: {
+              borderColor: isActive ? activeBorderColor : hoverBorderColor,
+            },
+          }}
+          data-value={ value }
+          onClick={ onClick }
+        />
+      </Tooltip>
+    </Box>
+  );
+};
+
+export default React.memo(SettingsSample);
diff --git a/ui/snippets/topBar/settings/utils.ts b/ui/snippets/topBar/settings/utils.ts
new file mode 100644
index 0000000000..5346846a33
--- /dev/null
+++ b/ui/snippets/topBar/settings/utils.ts
@@ -0,0 +1,53 @@
+import type { IdenticonType } from 'types/views/address';
+
+export const COLOR_THEMES = [
+  {
+    label: 'Light',
+    colorMode: 'light',
+    hex: '#FFFFFF',
+    sampleBg: 'linear-gradient(154deg, #EFEFEF 50%, rgba(255, 255, 255, 0.00) 330.86%)',
+  },
+  {
+    label: 'Dim',
+    colorMode: 'dark',
+    hex: '#232B37',
+    sampleBg: 'linear-gradient(152deg, #232B37 50%, rgba(255, 255, 255, 0.00) 290.71%)',
+  },
+  {
+    label: 'Midnight',
+    colorMode: 'dark',
+    hex: '#1B2E48',
+    sampleBg: 'linear-gradient(148deg, #1B3F71 50%, rgba(255, 255, 255, 0.00) 312.35%)',
+  },
+  {
+    label: 'Dark',
+    colorMode: 'dark',
+    hex: '#101112',
+    sampleBg: 'linear-gradient(161deg, #000 9.37%, #383838 92.52%)',
+  },
+];
+
+export type ColorTheme = typeof COLOR_THEMES[number];
+
+export const IDENTICONS: Array<{ label: string; id: IdenticonType; sampleBg: string }> = [
+  {
+    label: 'GitHub',
+    id: 'github',
+    sampleBg: 'url("/static/identicon_logos/github.png") center / contain no-repeat',
+  },
+  {
+    label: 'Metamask jazzicon',
+    id: 'jazzicon',
+    sampleBg: 'url("/static/identicon_logos/jazzicon.png") center / contain no-repeat',
+  },
+  {
+    label: 'Ethereum blockies',
+    id: 'blockie',
+    sampleBg: 'url("/static/identicon_logos/blockies.png") center / contain no-repeat',
+  },
+  {
+    label: 'Gradient avatar',
+    id: 'gradient_avatar',
+    sampleBg: 'url("/static/identicon_logos/gradient_avatar.png") center / contain no-repeat',
+  },
+];
diff --git a/ui/snippets/topBar/utils.ts b/ui/snippets/topBar/utils.ts
deleted file mode 100644
index 0644fcc9b2..0000000000
--- a/ui/snippets/topBar/utils.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-import type { IconName } from 'ui/shared/IconSvg';
-
-export const COLOR_THEMES = [
-  {
-    name: 'Light',
-    colorMode: 'light',
-    icon: 'sun' as IconName,
-    colors: [
-      { hex: '#FFFFFF', sampleBg: 'linear-gradient(154deg, #EFEFEF 50%, rgba(255, 255, 255, 0.00) 330.86%)' },
-    ],
-  },
-  {
-    name: 'Dim',
-    colorMode: 'dark',
-    icon: 'moon-with-star' as IconName,
-    colors: [
-      { hex: '#232B37', sampleBg: 'linear-gradient(152deg, #232B37 50%, rgba(255, 255, 255, 0.00) 290.71%)' },
-      { hex: '#1B2E48', sampleBg: 'linear-gradient(150deg, #1B2E48 50%, rgba(255, 255, 255, 0.00) 312.75%)' },
-    ],
-  },
-  {
-    name: 'Dark',
-    colorMode: 'dark',
-    icon: 'moon' as IconName,
-    colors: [
-      { hex: '#101112', sampleBg: 'linear-gradient(161deg, #000 9.37%, #383838 92.52%)' },
-    ],
-  },
-];
-
-export type ColorTheme = typeof COLOR_THEMES[number];
-
-export type ColorThemeColor = ColorTheme['colors'][number];
diff --git a/ui/snippets/walletMenu/WalletMenuContent.tsx b/ui/snippets/walletMenu/WalletMenuContent.tsx
index 2939d73f7b..0578d3c6c5 100644
--- a/ui/snippets/walletMenu/WalletMenuContent.tsx
+++ b/ui/snippets/walletMenu/WalletMenuContent.tsx
@@ -1,6 +1,7 @@
 import { Box, Button, Text } from '@chakra-ui/react';
 import React from 'react';
 
+import * as mixpanel from 'lib/mixpanel/index';
 import getDefaultTransitionProps from 'theme/utils/getDefaultTransitionProps';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 
@@ -9,38 +10,45 @@ type Props = {
   disconnect?: () => void;
 };
 
-const WalletMenuContent = ({ address, disconnect }: Props) => (
-  <Box>
-    <Text
-      fontSize="sm"
-      fontWeight={ 600 }
-      mb={ 1 }
-      { ...getDefaultTransitionProps() }
-    >
-      My wallet
-    </Text>
-    <Text
-      fontSize="sm"
-      mb={ 5 }
-      fontWeight={ 400 }
-      color="text_secondary"
-      { ...getDefaultTransitionProps() }
-    >
-      Your wallet is used to interact with apps and contracts in the explorer.
-    </Text>
-    <AddressEntity
-      address={{ hash: address }}
-      noTooltip
-      truncation="dynamic"
-      fontSize="sm"
-      fontWeight={ 700 }
-      color="text"
-      mb={ 6 }
-    />
-    <Button size="sm" width="full" variant="outline" onClick={ disconnect }>
-      Disconnect
-    </Button>
-  </Box>
-);
+const WalletMenuContent = ({ address, disconnect }: Props) => {
+  const onAddressClick = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.WALLET_ACTION, { Action: 'Address click' });
+  }, []);
+
+  return (
+    <Box>
+      <Text
+        fontSize="sm"
+        fontWeight={ 600 }
+        mb={ 1 }
+        { ...getDefaultTransitionProps() }
+      >
+        My wallet
+      </Text>
+      <Text
+        fontSize="sm"
+        mb={ 5 }
+        fontWeight={ 400 }
+        color="text_secondary"
+        { ...getDefaultTransitionProps() }
+      >
+        Your wallet is used to interact with apps and contracts in the explorer.
+      </Text>
+      <AddressEntity
+        address={{ hash: address }}
+        noTooltip
+        truncation="dynamic"
+        fontSize="sm"
+        fontWeight={ 700 }
+        color="text"
+        mb={ 6 }
+        onClick={ onAddressClick }
+      />
+      <Button size="sm" width="full" variant="outline" onClick={ disconnect }>
+        Disconnect
+      </Button>
+    </Box>
+  );
+};
 
 export default WalletMenuContent;
diff --git a/ui/snippets/walletMenu/WalletMenuDesktop.tsx b/ui/snippets/walletMenu/WalletMenuDesktop.tsx
index 14265b2349..df19ef5cf9 100644
--- a/ui/snippets/walletMenu/WalletMenuDesktop.tsx
+++ b/ui/snippets/walletMenu/WalletMenuDesktop.tsx
@@ -3,6 +3,7 @@ import { Popover, PopoverContent, PopoverBody, PopoverTrigger, Button, Box, useB
 import React from 'react';
 
 import useIsMobile from 'lib/hooks/useIsMobile';
+import * as mixpanel from 'lib/mixpanel/index';
 import AddressIdenticon from 'ui/shared/entities/address/AddressIdenticon';
 import HashStringShorten from 'ui/shared/HashStringShorten';
 import useWallet from 'ui/snippets/walletMenu/useWallet';
@@ -16,7 +17,7 @@ type Props = {
 };
 
 const WalletMenuDesktop = ({ isHomePage }: Props) => {
-  const { isWalletConnected, address, connect, disconnect, isModalOpening, isModalOpen } = useWallet();
+  const { isWalletConnected, address, connect, disconnect, isModalOpening, isModalOpen } = useWallet({ source: 'Header' });
   const { themedBackground, themedBorderColor, themedColor } = useMenuButtonColors();
   const [ isPopoverOpen, setIsPopoverOpen ] = useBoolean(false);
   const isMobile = useIsMobile();
@@ -48,6 +49,11 @@ const WalletMenuDesktop = ({ isHomePage }: Props) => {
     };
   }
 
+  const openPopover = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.WALLET_ACTION, { Action: 'Open' });
+    setIsPopoverOpen.on();
+  }, [ setIsPopoverOpen ]);
+
   return (
     <Popover
       openDelay={ 300 }
@@ -66,7 +72,7 @@ const WalletMenuDesktop = ({ isHomePage }: Props) => {
               flexShrink={ 0 }
               isLoading={ isModalOpening || isModalOpen }
               loadingText="Connect wallet"
-              onClick={ isWalletConnected ? setIsPopoverOpen.on : connect }
+              onClick={ isWalletConnected ? openPopover : connect }
               fontSize="sm"
               { ...buttonStyles }
             >
diff --git a/ui/snippets/walletMenu/WalletMenuMobile.tsx b/ui/snippets/walletMenu/WalletMenuMobile.tsx
index 9ffd5a3be5..e8e6bcb48a 100644
--- a/ui/snippets/walletMenu/WalletMenuMobile.tsx
+++ b/ui/snippets/walletMenu/WalletMenuMobile.tsx
@@ -2,6 +2,7 @@ import { Drawer, DrawerOverlay, DrawerContent, DrawerBody, useDisclosure, IconBu
 import React from 'react';
 
 import useIsMobile from 'lib/hooks/useIsMobile';
+import * as mixpanel from 'lib/mixpanel/index';
 import AddressIdenticon from 'ui/shared/entities/address/AddressIdenticon';
 import IconSvg from 'ui/shared/IconSvg';
 import useWallet from 'ui/snippets/walletMenu/useWallet';
@@ -12,10 +13,15 @@ import WalletTooltip from './WalletTooltip';
 
 const WalletMenuMobile = () => {
   const { isOpen, onOpen, onClose } = useDisclosure();
-  const { isWalletConnected, address, connect, disconnect, isModalOpening, isModalOpen } = useWallet();
+  const { isWalletConnected, address, connect, disconnect, isModalOpening, isModalOpen } = useWallet({ source: 'Header' });
   const { themedBackground, themedBorderColor, themedColor } = useMenuButtonColors();
   const isMobile = useIsMobile();
 
+  const openPopover = React.useCallback(() => {
+    mixpanel.logEvent(mixpanel.EventTypes.WALLET_ACTION, { Action: 'Open' });
+    onOpen();
+  }, [ onOpen ]);
+
   return (
     <>
       <WalletTooltip isDisabled={ isWalletConnected || isMobile === undefined || !isMobile } isMobile>
@@ -32,7 +38,7 @@ const WalletMenuMobile = () => {
           bg={ isWalletConnected ? themedBackground : undefined }
           color={ themedColor }
           borderColor={ !isWalletConnected ? themedBorderColor : undefined }
-          onClick={ isWalletConnected ? onOpen : connect }
+          onClick={ isWalletConnected ? openPopover : connect }
           isLoading={ isModalOpening || isModalOpen }
         />
       </WalletTooltip>
diff --git a/ui/snippets/walletMenu/WalletTooltip.tsx b/ui/snippets/walletMenu/WalletTooltip.tsx
index d0d7b042b3..fc03e6dcee 100644
--- a/ui/snippets/walletMenu/WalletTooltip.tsx
+++ b/ui/snippets/walletMenu/WalletTooltip.tsx
@@ -2,6 +2,9 @@ import { Tooltip, useBoolean, useOutsideClick } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
+import { SECOND } from 'lib/consts';
+import removeQueryParam from 'lib/router/removeQueryParam';
+
 type Props = {
   children: React.ReactNode;
   isDisabled?: boolean;
@@ -26,12 +29,29 @@ const WalletTooltip = ({ children, isDisabled, isMobile }: Props) => {
 
   React.useEffect(() => {
     const wasShown = window.localStorage.getItem(localStorageKey);
-    if (!isDisabled && !wasShown) {
-      setIsTooltipShown.on();
-      window.localStorage.setItem(localStorageKey, 'true');
-      setTimeout(() => setIsTooltipShown.off(), 3000);
+    const isMarketplacePage = [ '/apps', '/apps/[id]' ].includes(router.pathname);
+    const isTooltipShowAction = router.query.action === 'tooltip';
+    const isConnectWalletAction = router.query.action === 'connect';
+    const needToShow = (!wasShown && !isConnectWalletAction) || isTooltipShowAction;
+    let timer1: ReturnType<typeof setTimeout>;
+    let timer2: ReturnType<typeof setTimeout>;
+
+    if (!isDisabled && isMarketplacePage && needToShow) {
+      timer1 = setTimeout(() => {
+        setIsTooltipShown.on();
+        window.localStorage.setItem(localStorageKey, 'true');
+        timer2 = setTimeout(() => setIsTooltipShown.off(), 5 * SECOND);
+        if (isTooltipShowAction) {
+          removeQueryParam(router, 'action');
+        }
+      }, isTooltipShowAction ? 0 : SECOND);
     }
-  }, [ setIsTooltipShown, localStorageKey, isDisabled ]);
+
+    return () => {
+      clearTimeout(timer1);
+      clearTimeout(timer2);
+    };
+  }, [ setIsTooltipShown, localStorageKey, isDisabled, router ]);
 
   return (
     <Tooltip
diff --git a/ui/snippets/walletMenu/useWallet.tsx b/ui/snippets/walletMenu/useWallet.tsx
index b1ab280321..370c4f4d7e 100644
--- a/ui/snippets/walletMenu/useWallet.tsx
+++ b/ui/snippets/walletMenu/useWallet.tsx
@@ -1,15 +1,20 @@
 import { useWeb3Modal, useWeb3ModalState } from '@web3modal/wagmi/react';
 import React from 'react';
-import { useAccount, useDisconnect } from 'wagmi';
+import { useAccount, useDisconnect, useAccountEffect } from 'wagmi';
 
 import * as mixpanel from 'lib/mixpanel/index';
 
-export default function useWallet() {
+interface Params {
+  source: mixpanel.EventPayload<mixpanel.EventTypes.WALLET_CONNECT>['Source'];
+}
+
+export default function useWallet({ source }: Params) {
   const { open } = useWeb3Modal();
   const { open: isOpen } = useWeb3ModalState();
   const { disconnect } = useDisconnect();
   const [ isModalOpening, setIsModalOpening ] = React.useState(false);
   const [ isClientLoaded, setIsClientLoaded ] = React.useState(false);
+  const isConnectionStarted = React.useRef(false);
 
   React.useEffect(() => {
     setIsClientLoaded(true);
@@ -19,18 +24,23 @@ export default function useWallet() {
     setIsModalOpening(true);
     await open();
     setIsModalOpening(false);
-    mixpanel.logEvent(mixpanel.EventTypes.WALLET_CONNECT, { Source: 'Header', Status: 'Started' });
-  }, [ open ]);
+    mixpanel.logEvent(mixpanel.EventTypes.WALLET_CONNECT, { Source: source, Status: 'Started' });
+    isConnectionStarted.current = true;
+  }, [ open, source ]);
 
   const handleAccountConnected = React.useCallback(({ isReconnected }: { isReconnected: boolean }) => {
-    !isReconnected && mixpanel.logEvent(mixpanel.EventTypes.WALLET_CONNECT, { Source: 'Header', Status: 'Connected' });
-  }, []);
+    !isReconnected && isConnectionStarted.current &&
+      mixpanel.logEvent(mixpanel.EventTypes.WALLET_CONNECT, { Source: source, Status: 'Connected' });
+    isConnectionStarted.current = false;
+  }, [ source ]);
 
   const handleDisconnect = React.useCallback(() => {
     disconnect();
   }, [ disconnect ]);
 
-  const { address, isDisconnected } = useAccount({ onConnect: handleAccountConnected });
+  useAccountEffect({ onConnect: handleAccountConnected });
+
+  const { address, isDisconnected } = useAccount();
 
   const isWalletConnected = isClientLoaded && !isDisconnected && address !== undefined;
 
diff --git a/ui/sol2uml/Sol2UmlDiagram.tsx b/ui/sol2uml/Sol2UmlDiagram.tsx
index c7f1a1727b..eaebf9c3c1 100644
--- a/ui/sol2uml/Sol2UmlDiagram.tsx
+++ b/ui/sol2uml/Sol2UmlDiagram.tsx
@@ -5,6 +5,8 @@ import type { SmartContract } from 'types/api/contract';
 
 import type { ResourceError } from 'lib/api/resources';
 import useApiQuery from 'lib/api/useApiQuery';
+import throwOnAbsentParamError from 'lib/errors/throwOnAbsentParamError';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import ContentLoader from 'ui/shared/ContentLoader';
 
 interface Props {
@@ -59,23 +61,15 @@ const Sol2UmlDiagram = ({ addressHash }: Props) => {
     newWindow?.document.write(image.outerHTML);
   }, [ imgUrl ]);
 
-  if (!addressHash) {
-    throw Error('Contract address is not provided', { cause: { status: 404 } as unknown as Error });
-  }
-
-  if (contractQuery.isError) {
-    throw Error('Contract fetch error', { cause: contractQuery.error as unknown as Error });
-  }
-
-  if (umlQuery.isError) {
-    throw Error('Uml diagram fetch error', { cause: contractQuery.error as unknown as Error });
-  }
+  throwOnAbsentParamError(addressHash);
+  throwOnResourceLoadError(contractQuery);
+  throwOnResourceLoadError(umlQuery);
 
   if (contractQuery.isPending || umlQuery.isPending) {
     return <ContentLoader/>;
   }
 
-  if (!umlQuery.data.svg) {
+  if (!umlQuery.data?.svg || !contractQuery.data) {
     return <span>No data for visualization</span>;
   }
 
diff --git a/ui/stats/ChartWidgetContainer.tsx b/ui/stats/ChartWidgetContainer.tsx
index 3c577813b1..b9e45ebc79 100644
--- a/ui/stats/ChartWidgetContainer.tsx
+++ b/ui/stats/ChartWidgetContainer.tsx
@@ -1,3 +1,4 @@
+import { chakra } from '@chakra-ui/react';
 import React, { useEffect, useMemo } from 'react';
 
 import type { StatsIntervalIds } from 'types/client/stats';
@@ -15,13 +16,14 @@ type Props = {
   interval: StatsIntervalIds;
   onLoadingError: () => void;
   isPlaceholderData: boolean;
+  className?: string;
 }
 
 function formatDate(date: Date) {
   return date.toISOString().substring(0, 10);
 }
 
-const ChartWidgetContainer = ({ id, title, description, interval, onLoadingError, units, isPlaceholderData }: Props) => {
+const ChartWidgetContainer = ({ id, title, description, interval, onLoadingError, units, isPlaceholderData, className }: Props) => {
   const selectedInterval = STATS_INTERVALS[interval];
 
   const endDate = selectedInterval.start ? formatDate(new Date()) : undefined;
@@ -58,8 +60,9 @@ const ChartWidgetContainer = ({ id, title, description, interval, onLoadingError
       description={ description }
       isLoading={ isPending }
       minH="230px"
+      className={ className }
     />
   );
 };
 
-export default ChartWidgetContainer;
+export default chakra(ChartWidgetContainer);
diff --git a/ui/stats/ChartsWidgetsList.tsx b/ui/stats/ChartsWidgetsList.tsx
index f88f10d296..102ce73a7d 100644
--- a/ui/stats/ChartsWidgetsList.tsx
+++ b/ui/stats/ChartsWidgetsList.tsx
@@ -4,8 +4,11 @@ import React, { useCallback, useState } from 'react';
 import type { StatsChartsSection } from 'types/api/stats';
 import type { StatsIntervalIds } from 'types/client/stats';
 
+import useApiQuery from 'lib/api/useApiQuery';
 import { apos } from 'lib/html-entities';
 import EmptySearchResult from 'ui/shared/EmptySearchResult';
+import GasInfoTooltip from 'ui/shared/gas/GasInfoTooltip';
+import IconSvg from 'ui/shared/IconSvg';
 
 import ChartsLoadingErrorAlert from './ChartsLoadingErrorAlert';
 import ChartWidgetContainer from './ChartWidgetContainer';
@@ -23,6 +26,12 @@ const ChartsWidgetsList = ({ filterQuery, isError, isPlaceholderData, charts, in
   const isAnyChartDisplayed = charts?.some((section) => section.charts.length > 0);
   const isEmptyChartList = Boolean(filterQuery) && !isAnyChartDisplayed;
 
+  const homeStatsQuery = useApiQuery('stats', {
+    queryOptions: {
+      refetchOnMount: false,
+    },
+  });
+
   const handleChartLoadingError = useCallback(
     () => setIsSomeChartLoadingError(true),
     [ setIsSomeChartLoadingError ]);
@@ -51,10 +60,15 @@ const ChartsWidgetsList = ({ filterQuery, isError, isPlaceholderData, charts, in
                 marginBottom: 0,
               }}
             >
-              <Skeleton isLoaded={ !isPlaceholderData } mb={ 4 } display="inline-block">
+              <Skeleton isLoaded={ !isPlaceholderData } mb={ 4 } display="inline-flex" alignItems="center" columnGap={ 2 } id={ section.id }>
                 <Heading size="md" >
                   { section.title }
                 </Heading>
+                { section.id === 'gas' && homeStatsQuery.data && homeStatsQuery.data.gas_prices && (
+                  <GasInfoTooltip data={ homeStatsQuery.data } dataUpdatedAt={ homeStatsQuery.dataUpdatedAt }>
+                    <IconSvg name="info" boxSize={ 5 } display="block" cursor="pointer" _hover={{ color: 'link_hovered' }}/>
+                  </GasInfoTooltip>
+                ) }
               </Skeleton>
 
               <Grid
diff --git a/ui/stats/NumberWidget.tsx b/ui/stats/NumberWidget.tsx
deleted file mode 100644
index c64745e636..0000000000
--- a/ui/stats/NumberWidget.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import { Box, Flex, Skeleton, useColorModeValue } from '@chakra-ui/react';
-import React from 'react';
-
-import Hint from 'ui/shared/Hint';
-
-type Props = {
-  label: string;
-  description?: string;
-  value: string;
-  isLoading?: boolean;
-}
-
-const NumberWidget = ({ label, value, isLoading, description }: Props) => {
-  const bgColor = useColorModeValue('blue.50', 'blue.800');
-  const skeletonBgColor = useColorModeValue('blackAlpha.50', 'whiteAlpha.50');
-  const hintColor = useColorModeValue('gray.600', 'gray.400');
-
-  return (
-    <Flex
-      alignItems="flex-start"
-      bg={ isLoading ? skeletonBgColor : bgColor }
-      px={ 3 }
-      py={{ base: 2, lg: 3 }}
-      borderRadius={ 12 }
-      justifyContent="space-between"
-      columnGap={ 3 }
-    >
-      <Box
-      >
-        <Skeleton
-          isLoaded={ !isLoading }
-          color="text_secondary"
-          fontSize="xs"
-          w="fit-content"
-        >
-          <span>{ label }</span>
-        </Skeleton>
-
-        <Skeleton
-          isLoaded={ !isLoading }
-          fontWeight={ 500 }
-          fontSize="lg"
-          w="fit-content"
-        >
-          { value }
-        </Skeleton>
-
-      </Box>
-      <Skeleton isLoaded={ !isLoading } alignSelf="center" borderRadius="base">
-        <Hint
-          label={ description }
-          boxSize={ 6 }
-          color={ hintColor }
-        />
-      </Skeleton>
-    </Flex>
-  );
-};
-
-export default NumberWidget;
diff --git a/ui/stats/NumberWidgetsList.tsx b/ui/stats/NumberWidgetsList.tsx
index 6014693b41..758d9810c5 100644
--- a/ui/stats/NumberWidgetsList.tsx
+++ b/ui/stats/NumberWidgetsList.tsx
@@ -3,9 +3,9 @@ import React from 'react';
 
 import useApiQuery from 'lib/api/useApiQuery';
 import { STATS_COUNTER } from 'stubs/stats';
+import StatsWidget from 'ui/shared/stats/StatsWidget';
 
 import DataFetchAlert from '../shared/DataFetchAlert';
-import NumberWidget from './NumberWidget';
 
 const UNITS_WITHOUT_SPACE = [ 's' ];
 
@@ -36,12 +36,12 @@ const NumberWidgetsList = () => {
           }
 
           return (
-            <NumberWidget
+            <StatsWidget
               key={ id + (isPlaceholderData ? index : '') }
               label={ title }
               value={ `${ Number(value).toLocaleString(undefined, { maximumFractionDigits: 3, notation: 'compact' }) }${ unitsStr }` }
               isLoading={ isPlaceholderData }
-              description={ description }
+              hint={ description }
             />
           );
         })
diff --git a/ui/token/TokenDetails.tsx b/ui/token/TokenDetails.tsx
index 478ad7310a..d6a9c7b276 100644
--- a/ui/token/TokenDetails.tsx
+++ b/ui/token/TokenDetails.tsx
@@ -9,6 +9,7 @@ import type { TokenInfo } from 'types/api/token';
 
 import type { ResourceError } from 'lib/api/resources';
 import useApiQuery from 'lib/api/useApiQuery';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
 import getCurrencyValue from 'lib/getCurrencyValue';
 import { TOKEN_COUNTERS } from 'stubs/token';
 import type { TokenTabs } from 'ui/pages/Token';
@@ -63,9 +64,7 @@ const TokenDetails = ({ tokenQuery }: Props) => {
     );
   }, [ tokenCountersQuery.data, tokenCountersQuery.isPlaceholderData, changeUrlAndScroll ]);
 
-  if (tokenQuery.isError) {
-    throw Error('Token fetch error', { cause: tokenQuery.error as unknown as Error });
-  }
+  throwOnResourceLoadError(tokenQuery);
 
   const {
     exchange_rate: exchangeRate,
@@ -78,7 +77,7 @@ const TokenDetails = ({ tokenQuery }: Props) => {
 
   let totalSupplyValue;
 
-  if (type === 'ERC-20') {
+  if (decimals) {
     const totalValue = totalSupply ? getCurrencyValue({ value: totalSupply, accuracy: 3, accuracyUsd: 2, exchangeRate, decimals }) : undefined;
     totalSupplyValue = totalValue?.valueStr;
   } else {
diff --git a/ui/token/TokenHolders/TokenHoldersListItem.tsx b/ui/token/TokenHolders/TokenHoldersListItem.tsx
index cfe3b31a76..65dc4b2f3a 100644
--- a/ui/token/TokenHolders/TokenHoldersListItem.tsx
+++ b/ui/token/TokenHolders/TokenHoldersListItem.tsx
@@ -29,7 +29,7 @@ const TokenHoldersListItem = ({ holder, token, isLoading }: Props) => {
         />
       </ListItemMobileGrid.Value>
 
-      { token.type === 'ERC-1155' && 'token_id' in holder && (
+      { (token.type === 'ERC-1155' || token.type === 'ERC-404') && 'token_id' in holder && (
         <>
           <ListItemMobileGrid.Label isLoading={ isLoading }>ID#</ListItemMobileGrid.Label>
           <ListItemMobileGrid.Value>
@@ -47,7 +47,7 @@ const TokenHoldersListItem = ({ holder, token, isLoading }: Props) => {
         </Skeleton>
       </ListItemMobileGrid.Value>
 
-      { token.total_supply && (
+      { token.total_supply && token.type !== 'ERC-404' && (
         <>
           <ListItemMobileGrid.Label isLoading={ isLoading }>Percentage</ListItemMobileGrid.Label>
           <ListItemMobileGrid.Value>
diff --git a/ui/token/TokenHolders/TokenHoldersTable.tsx b/ui/token/TokenHolders/TokenHoldersTable.tsx
index e44e981bb6..22c229cd96 100644
--- a/ui/token/TokenHolders/TokenHoldersTable.tsx
+++ b/ui/token/TokenHolders/TokenHoldersTable.tsx
@@ -19,9 +19,9 @@ const TokenHoldersTable = ({ data, token, top, isLoading }: Props) => {
       <Thead top={ top }>
         <Tr>
           <Th>Holder</Th>
-          { token.type === 'ERC-1155' && <Th>ID#</Th> }
+          { (token.type === 'ERC-1155' || token.type === 'ERC-404') && <Th>ID#</Th> }
           <Th isNumeric>Quantity</Th>
-          { token.total_supply && <Th isNumeric width="175px">Percentage</Th> }
+          { token.total_supply && token.type !== 'ERC-404' && <Th isNumeric width="175px">Percentage</Th> }
         </Tr>
       </Thead>
       <Tbody>
diff --git a/ui/token/TokenHolders/TokenHoldersTableItem.tsx b/ui/token/TokenHolders/TokenHoldersTableItem.tsx
index 8bfc187e0a..8bbb815548 100644
--- a/ui/token/TokenHolders/TokenHoldersTableItem.tsx
+++ b/ui/token/TokenHolders/TokenHoldersTableItem.tsx
@@ -26,7 +26,7 @@ const TokenTransferTableItem = ({ holder, token, isLoading }: Props) => {
           fontWeight="700"
         />
       </Td>
-      { token.type === 'ERC-1155' && 'token_id' in holder && (
+      { (token.type === 'ERC-1155' || token.type === 'ERC-404') && 'token_id' in holder && (
         <Td verticalAlign="middle">
           <Skeleton isLoaded={ !isLoading } display="inline-block">
             { 'token_id' in holder && holder.token_id }
@@ -38,7 +38,7 @@ const TokenTransferTableItem = ({ holder, token, isLoading }: Props) => {
           { quantity }
         </Skeleton>
       </Td>
-      { token.total_supply && (
+      { token.total_supply && token.type !== 'ERC-404' && (
         <Td verticalAlign="middle" isNumeric>
           <Utilization
             value={ BigNumber(holder.value).div(BigNumber(token.total_supply)).dp(4).toNumber() }
diff --git a/ui/token/TokenInventory.tsx b/ui/token/TokenInventory.tsx
index 50153b466c..bbd1e264db 100644
--- a/ui/token/TokenInventory.tsx
+++ b/ui/token/TokenInventory.tsx
@@ -5,6 +5,7 @@ import React from 'react';
 import type { TokenInfo } from 'types/api/token';
 
 import type { ResourceError } from 'lib/api/resources';
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import ActionBar from 'ui/shared/ActionBar';
 import DataListDisplay from 'ui/shared/DataListDisplay';
@@ -58,21 +59,23 @@ const TokenInventory = ({ inventoryQuery, tokenQuery, ownerFilter }: Props) => {
   const token = tokenQuery.data;
 
   const content = items && token ? (
-    <Grid
-      w="100%"
-      columnGap={{ base: 3, lg: 6 }}
-      rowGap={{ base: 3, lg: 6 }}
-      gridTemplateColumns={{ base: 'repeat(2, calc((100% - 12px)/2))', lg: 'repeat(auto-fill, minmax(210px, 1fr))' }}
-    >
-      { items.map((item, index) => (
-        <TokenInventoryItem
-          key={ token.address + '_' + item.id + (inventoryQuery.isPlaceholderData ? '_' + index : '') }
-          item={ item }
-          isLoading={ inventoryQuery.isPlaceholderData || tokenQuery.isPlaceholderData }
-          token={ token }
-        />
-      )) }
-    </Grid>
+    <AddressHighlightProvider>
+      <Grid
+        w="100%"
+        columnGap={{ base: 3, lg: 6 }}
+        rowGap={{ base: 3, lg: 6 }}
+        gridTemplateColumns={{ base: 'repeat(2, calc((100% - 12px)/2))', lg: 'repeat(auto-fill, minmax(210px, 1fr))' }}
+      >
+        { items.map((item, index) => (
+          <TokenInventoryItem
+            key={ item.id + '_' + index + (inventoryQuery.isPlaceholderData ? '_' + 'placeholder' : '') }
+            item={ item }
+            isLoading={ inventoryQuery.isPlaceholderData || tokenQuery.isPlaceholderData }
+            token={ token }
+          />
+        )) }
+      </Grid>
+    </AddressHighlightProvider>
   ) : null;
 
   return (
@@ -80,6 +83,10 @@ const TokenInventory = ({ inventoryQuery, tokenQuery, ownerFilter }: Props) => {
       isError={ inventoryQuery.isError }
       items={ items }
       emptyText="There are no tokens."
+      filterProps={{
+        hasActiveFilters: Boolean(ownerFilter),
+        emptyFilteredText: 'No tokens found for the selected owner.',
+      }}
       content={ content }
       actionBar={ actionBar }
     />
diff --git a/ui/token/TokenInventoryItem.tsx b/ui/token/TokenInventoryItem.tsx
index 72f650d2b8..6add374550 100644
--- a/ui/token/TokenInventoryItem.tsx
+++ b/ui/token/TokenInventoryItem.tsx
@@ -20,7 +20,8 @@ const TokenInventoryItem = ({ item, token, isLoading }: Props) => {
   const mediaElement = (
     <NftMedia
       mb="18px"
-      url={ item.animation_url || item.image_url }
+      animationUrl={ item.animation_url }
+      imageUrl={ item.image_url }
       isLoading={ isLoading }
     />
   );
diff --git a/ui/token/TokenProjectInfo.tsx b/ui/token/TokenProjectInfo.tsx
index 3a6bd3fee7..4aa71e47f2 100644
--- a/ui/token/TokenProjectInfo.tsx
+++ b/ui/token/TokenProjectInfo.tsx
@@ -27,7 +27,7 @@ const TokenProjectInfo = ({ data }: Props) => {
   if (isMobile) {
     return (
       <>
-        <TriggerButton isOpen={ isOpen } onClick={ onToggle }/>
+        <TriggerButton onClick={ onToggle }/>
         <Modal isOpen={ isOpen } onClose={ onClose } size="full">
           <ModalContent>
             <ModalCloseButton/>
@@ -41,7 +41,7 @@ const TokenProjectInfo = ({ data }: Props) => {
   return (
     <Popover isOpen={ isOpen } onClose={ onClose } placement="bottom-start" isLazy>
       <PopoverTrigger>
-        <TriggerButton isOpen={ isOpen } onClick={ onToggle }/>
+        <TriggerButton onClick={ onToggle }/>
       </PopoverTrigger>
       <PopoverContent w="500px">
         <PopoverBody px={ 6 } py={ 5 }>
diff --git a/ui/token/TokenProjectInfo/TriggerButton.tsx b/ui/token/TokenProjectInfo/TriggerButton.tsx
index fcab97ab21..9a96e937d5 100644
--- a/ui/token/TokenProjectInfo/TriggerButton.tsx
+++ b/ui/token/TokenProjectInfo/TriggerButton.tsx
@@ -5,10 +5,9 @@ import IconSvg from 'ui/shared/IconSvg';
 
 interface Props {
   onClick: () => void;
-  isOpen: boolean;
 }
 
-const TriggerButton = ({ isOpen, onClick }: Props, ref: React.ForwardedRef<HTMLButtonElement>) => {
+const TriggerButton = ({ onClick }: Props, ref: React.ForwardedRef<HTMLButtonElement>) => {
   return (
     <Button
       ref={ ref }
@@ -18,12 +17,13 @@ const TriggerButton = ({ isOpen, onClick }: Props, ref: React.ForwardedRef<HTMLB
       onClick={ onClick }
       aria-label="Show project info"
       fontWeight={ 500 }
-      px={ 2 }
+      lineHeight={ 6 }
+      pl={ 1 }
+      pr={ 2 }
       h="32px"
     >
-      <IconSvg name="rocket" boxSize={ 5 } mr={ 1 }/>
+      <IconSvg name="info" boxSize={ 6 } mr={ 1 }/>
       <span>Info</span>
-      <IconSvg name="arrows/east-mini" transform={ isOpen ? 'rotate(90deg)' : 'rotate(-90deg)' } transitionDuration="faster" boxSize={ 5 } ml={ 1 }/>
     </Button>
   );
 };
diff --git a/ui/token/TokenTransfer/TokenTransferListItem.tsx b/ui/token/TokenTransfer/TokenTransferListItem.tsx
index 95aa336465..f4c582e039 100644
--- a/ui/token/TokenTransfer/TokenTransferListItem.tsx
+++ b/ui/token/TokenTransfer/TokenTransferListItem.tsx
@@ -5,11 +5,11 @@ import type { TokenTransfer } from 'types/api/tokenTransfer';
 
 import getCurrencyValue from 'lib/getCurrencyValue';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
+import { NFT_TOKEN_TYPE_IDS } from 'lib/token/tokenTypes';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import Tag from 'ui/shared/chakra/Tag';
-import AddressEntityWithTokenFilter from 'ui/shared/entities/address/AddressEntityWithTokenFilter';
 import NftEntity from 'ui/shared/entities/nft/NftEntity';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import IconSvg from 'ui/shared/IconSvg';
 import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
 import TruncatedValue from 'ui/shared/TruncatedValue';
 
@@ -27,7 +27,7 @@ const TokenTransferListItem = ({
   isLoading,
 }: Props) => {
   const timeAgo = useTimeAgoIncrement(timestamp, true);
-  const { usd, valueStr } = 'value' in total ? getCurrencyValue({
+  const { usd, valueStr } = 'value' in total && total.value !== null ? getCurrencyValue({
     value: total.value,
     exchangeRate: token.exchange_rate,
     accuracy: 8,
@@ -41,7 +41,7 @@ const TokenTransferListItem = ({
         <TxEntity
           isLoading={ isLoading }
           hash={ txHash }
-          truncation="constant"
+          truncation="constant_long"
           fontWeight="700"
         />
         { timestamp && (
@@ -53,23 +53,14 @@ const TokenTransferListItem = ({
         ) }
       </Flex>
       { method && <Tag isLoading={ isLoading }>{ method }</Tag> }
-      <Flex w="100%" columnGap={ 3 }>
-        <AddressEntityWithTokenFilter
-          address={ from }
-          isLoading={ isLoading }
-          tokenHash={ token.address }
-          width="50%"
-          fontWeight="500"
-        />
-        <IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" flexShrink={ 0 } isLoading={ isLoading }/>
-        <AddressEntityWithTokenFilter
-          address={ to }
-          isLoading={ isLoading }
-          tokenHash={ token.address }
-          width="50%"
-          fontWeight="500"
-        />
-      </Flex>
+      <AddressFromTo
+        from={ from }
+        to={ to }
+        isLoading={ isLoading }
+        tokenHash={ token.address }
+        w="100%"
+        fontWeight="500"
+      />
       { valueStr && (token.type === 'ERC-20' || token.type === 'ERC-1155') && (
         <Grid gap={ 2 } templateColumns={ `1fr auto auto${ usd ? ' auto' : '' }` }>
           <Skeleton isLoaded={ !isLoading } flexShrink={ 0 } fontWeight={ 500 }>
@@ -97,7 +88,7 @@ const TokenTransferListItem = ({
           ) }
         </Grid>
       ) }
-      { 'token_id' in total && (token.type === 'ERC-721' || token.type === 'ERC-1155') && (
+      { 'token_id' in total && (NFT_TOKEN_TYPE_IDS.includes(token.type)) && total.token_id !== null && (
         <NftEntity
           hash={ token.address }
           id={ total.token_id }
diff --git a/ui/token/TokenTransfer/TokenTransferTable.tsx b/ui/token/TokenTransfer/TokenTransferTable.tsx
index c48a1412e4..0b6a3cf80d 100644
--- a/ui/token/TokenTransfer/TokenTransferTable.tsx
+++ b/ui/token/TokenTransfer/TokenTransferTable.tsx
@@ -4,6 +4,8 @@ import React from 'react';
 import type { TokenInfo } from 'types/api/token';
 import type { TokenTransfer } from 'types/api/tokenTransfer';
 
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
+import { NFT_TOKEN_TYPE_IDS } from 'lib/token/tokenTypes';
 import * as SocketNewItemsNotice from 'ui/shared/SocketNewItemsNotice';
 import { default as Thead } from 'ui/shared/TheadSticky';
 import TruncatedValue from 'ui/shared/TruncatedValue';
@@ -24,42 +26,44 @@ const TokenTransferTable = ({ data, top, showSocketInfo, socketInfoAlert, socket
   const tokenType = data[0].token.type;
 
   return (
-    <Table variant="simple" size="sm" minW="950px">
-      <Thead top={ top }>
-        <Tr>
-          <Th width={ tokenType === 'ERC-1155' ? '60%' : '80%' }>Txn hash</Th>
-          <Th width="164px">Method</Th>
-          <Th width="160px">From</Th>
-          <Th width="36px" px={ 0 }/>
-          <Th width="218px" >To</Th>
-          { (tokenType === 'ERC-721' || tokenType === 'ERC-1155') && <Th width="20%" isNumeric={ tokenType === 'ERC-721' }>Token ID</Th> }
-          { (tokenType === 'ERC-20' || tokenType === 'ERC-1155') && (
-            <Th width="20%" isNumeric>
-              <TruncatedValue value={ `Value ${ token?.symbol || '' }` } w="100%" verticalAlign="middle"/>
-            </Th>
+    <AddressHighlightProvider>
+      <Table variant="simple" size="sm" minW="950px">
+        <Thead top={ top }>
+          <Tr>
+            <Th width="280px">Txn hash</Th>
+            <Th width="200px">Method</Th>
+            <Th width={{ lg: '224px', xl: '380px' }}>From/To</Th>
+            { (NFT_TOKEN_TYPE_IDS.includes(tokenType)) &&
+              <Th width={ tokenType === 'ERC-1155' || tokenType === 'ERC-404' ? '50%' : '100%' }>Token ID</Th>
+            }
+            { (tokenType === 'ERC-20' || tokenType === 'ERC-1155' || tokenType === 'ERC-404') && (
+              <Th width={ tokenType === 'ERC-20' ? '100%' : '50%' } isNumeric>
+                <TruncatedValue value={ `Value ${ token?.symbol || '' }` } w="100%" verticalAlign="middle"/>
+              </Th>
+            ) }
+          </Tr>
+        </Thead>
+        <Tbody>
+          { showSocketInfo && (
+            <SocketNewItemsNotice.Desktop
+              url={ window.location.href }
+              alert={ socketInfoAlert }
+              num={ socketInfoNum }
+              type="token_transfer"
+              isLoading={ isLoading }
+            />
           ) }
-        </Tr>
-      </Thead>
-      <Tbody>
-        { showSocketInfo && (
-          <SocketNewItemsNotice.Desktop
-            url={ window.location.href }
-            alert={ socketInfoAlert }
-            num={ socketInfoNum }
-            type="token_transfer"
-            isLoading={ isLoading }
-          />
-        ) }
-        { data.map((item, index) => (
-          <TokenTransferTableItem
-            key={ item.tx_hash + item.block_hash + item.log_index + '_' + index }
-            { ...item }
-            tokenId={ tokenId }
-            isLoading={ isLoading }
-          />
-        )) }
-      </Tbody>
-    </Table>
+          { data.map((item, index) => (
+            <TokenTransferTableItem
+              key={ item.tx_hash + item.block_hash + item.log_index + '_' + index }
+              { ...item }
+              tokenId={ tokenId }
+              isLoading={ isLoading }
+            />
+          )) }
+        </Tbody>
+      </Table>
+    </AddressHighlightProvider>
   );
 };
 
diff --git a/ui/token/TokenTransfer/TokenTransferTableItem.tsx b/ui/token/TokenTransfer/TokenTransferTableItem.tsx
index 50129dbbcf..63b2ee005f 100644
--- a/ui/token/TokenTransfer/TokenTransferTableItem.tsx
+++ b/ui/token/TokenTransfer/TokenTransferTableItem.tsx
@@ -1,15 +1,15 @@
-import { Tr, Td, Grid, Skeleton, Box } from '@chakra-ui/react';
+import { Tr, Td, Flex, Skeleton, Box } from '@chakra-ui/react';
 import React from 'react';
 
 import type { TokenTransfer } from 'types/api/tokenTransfer';
 
 import getCurrencyValue from 'lib/getCurrencyValue';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
+import { NFT_TOKEN_TYPE_IDS } from 'lib/token/tokenTypes';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import Tag from 'ui/shared/chakra/Tag';
-import AddressEntityWithTokenFilter from 'ui/shared/entities/address/AddressEntityWithTokenFilter';
 import NftEntity from 'ui/shared/entities/nft/NftEntity';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import IconSvg from 'ui/shared/IconSvg';
 
 type Props = TokenTransfer & { tokenId?: string; isLoading?: boolean }
 
@@ -25,7 +25,7 @@ const TokenTransferTableItem = ({
   isLoading,
 }: Props) => {
   const timeAgo = useTimeAgoIncrement(timestamp, true);
-  const { usd, valueStr } = 'value' in total ? getCurrencyValue({
+  const { usd, valueStr } = 'value' in total && total.value !== null ? getCurrencyValue({
     value: total.value,
     exchangeRate: token.exchange_rate,
     accuracy: 8,
@@ -36,12 +36,13 @@ const TokenTransferTableItem = ({
   return (
     <Tr alignItems="top">
       <Td>
-        <Grid alignItems="center" gridTemplateColumns="auto 130px" width="fit-content" py="7px">
+        <Flex alignItems="center" py="7px">
           <TxEntity
             hash={ txHash }
             isLoading={ isLoading }
             fontWeight={ 600 }
             noIcon
+            truncation="constant_long"
           />
           { timestamp && (
             <Skeleton isLoaded={ !isLoading } display="inline-block" color="gray.500" fontWeight="400" ml="10px">
@@ -50,7 +51,7 @@ const TokenTransferTableItem = ({
               </span>
             </Skeleton>
           ) }
-        </Grid>
+        </Flex>
       </Td>
       <Td>
         { method ? (
@@ -60,29 +61,18 @@ const TokenTransferTableItem = ({
         ) : null }
       </Td>
       <Td>
-        <AddressEntityWithTokenFilter
-          address={ from }
+        <AddressFromTo
+          from={ from }
+          to={ to }
           isLoading={ isLoading }
-          truncation="constant"
+          mt="5px"
+          mode={{ lg: 'compact', xl: 'long' }}
           tokenHash={ token.address }
-          my="5px"
         />
       </Td>
-      <Td px={ 0 }>
-        <IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" mt="3px" isLoading={ isLoading }/>
-      </Td>
-      <Td>
-        <AddressEntityWithTokenFilter
-          address={ to }
-          isLoading={ isLoading }
-          truncation="constant"
-          tokenHash={ token.address }
-          my="5px"
-        />
-      </Td>
-      { (token.type === 'ERC-721' || token.type === 'ERC-1155') && (
+      { (NFT_TOKEN_TYPE_IDS.includes(token.type)) && (
         <Td>
-          { 'token_id' in total ? (
+          { 'token_id' in total && total.token_id !== null ? (
             <NftEntity
               hash={ token.address }
               id={ total.token_id }
@@ -93,7 +83,7 @@ const TokenTransferTableItem = ({
           }
         </Td>
       ) }
-      { (token.type === 'ERC-20' || token.type === 'ERC-1155') && (
+      { (token.type === 'ERC-20' || token.type === 'ERC-1155' || token.type === 'ERC-404') && (
         <Td isNumeric verticalAlign="top">
           { valueStr && (
             <Skeleton isLoaded={ !isLoading } display="inline-block" mt="7px" wordBreak="break-all">
diff --git a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc1155-mobile-1.png b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc1155-mobile-1.png
index 883558d9aa..43303b917e 100644
Binary files a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc1155-mobile-1.png and b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc1155-mobile-1.png differ
diff --git a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc20-mobile-1.png b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc20-mobile-1.png
index 44a65059ad..78333858fb 100644
Binary files a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc20-mobile-1.png and b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc20-mobile-1.png differ
diff --git a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc721-mobile-1.png b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc721-mobile-1.png
index 5231ad1c6f..29f273fc2b 100644
Binary files a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc721-mobile-1.png and b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_default_erc721-mobile-1.png differ
diff --git a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc1155-mobile-1.png b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc1155-mobile-1.png
index c6add2e46a..7895f0e5e1 100644
Binary files a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc1155-mobile-1.png and b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc1155-mobile-1.png differ
diff --git a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc20-mobile-1.png b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc20-mobile-1.png
index 2b6f10df88..7270ffe8b1 100644
Binary files a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc20-mobile-1.png and b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc20-mobile-1.png differ
diff --git a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc721-mobile-1.png b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc721-mobile-1.png
index 3d163bd4ef..559d804613 100644
Binary files a/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc721-mobile-1.png and b/ui/token/TokenTransfer/__screenshots__/TokenTransfer.pw.tsx_mobile_erc721-mobile-1.png differ
diff --git a/ui/token/TokenVerifiedInfo.tsx b/ui/token/TokenVerifiedInfo.tsx
index 4beb5240d7..56af8bda88 100644
--- a/ui/token/TokenVerifiedInfo.tsx
+++ b/ui/token/TokenVerifiedInfo.tsx
@@ -28,7 +28,7 @@ const TokenVerifiedInfo = ({ verifiedInfoQuery }: Props) => {
         <>
           <Skeleton w="100px" h="30px" borderRadius="base"/>
           <Skeleton w="100px" h="30px" borderRadius="base"/>
-          <Skeleton w="80px" h="30px" borderRadius="base"/>
+          <Skeleton w="70px" h="30px" borderRadius="base"/>
         </>
       );
     }
diff --git a/ui/tokenInstance/TokenInstanceDetails.tsx b/ui/tokenInstance/TokenInstanceDetails.tsx
index 6896f1cc4c..dfff7aacc4 100644
--- a/ui/tokenInstance/TokenInstanceDetails.tsx
+++ b/ui/tokenInstance/TokenInstanceDetails.tsx
@@ -74,7 +74,8 @@ const TokenInstanceDetails = ({ data, token, scrollRef, isLoading }: Props) => {
           <TokenNftMarketplaces isLoading={ isLoading } hash={ token.address } id={ data.id }/>
         </Grid>
         <NftMedia
-          url={ data.animation_url || data.image_url }
+          animationUrl={ data.animation_url }
+          imageUrl={ data.image_url }
           w="250px"
           flexShrink={ 0 }
           alignSelf={{ base: 'center', lg: 'flex-start' }}
diff --git a/ui/tokens/TokensTableItem.tsx b/ui/tokens/TokensTableItem.tsx
index 37d3f04dee..e8f2916866 100644
--- a/ui/tokens/TokensTableItem.tsx
+++ b/ui/tokens/TokensTableItem.tsx
@@ -48,6 +48,7 @@ const TokensTableItem = ({
     implementation_name: null,
     is_contract: true,
     is_verified: false,
+    ens_domain_name: null,
   };
 
   return (
diff --git a/ui/tx/NftTokenTransferSnippet.tsx b/ui/tx/NftTokenTransferSnippet.tsx
index c9b053c158..be304f70db 100644
--- a/ui/tx/NftTokenTransferSnippet.tsx
+++ b/ui/tx/NftTokenTransferSnippet.tsx
@@ -1,4 +1,4 @@
-import { Flex, chakra } from '@chakra-ui/react';
+import { chakra } from '@chakra-ui/react';
 import React from 'react';
 
 import type { TokenInfo } from 'types/api/token';
@@ -9,14 +9,37 @@ import TokenEntity from 'ui/shared/entities/token/TokenEntity';
 interface Props {
   token: TokenInfo;
   value: string;
-  tokenId: string;
+  tokenId: string | null;
 }
 
 const NftTokenTransferSnippet = ({ value, token, tokenId }: Props) => {
   const num = value === '1' ? '' : value;
 
+  const tokenIdContent = (() => {
+    if (tokenId === null) {
+      // ERC-404 may not have an ID
+      if (token.type === 'ERC-404') {
+        return null;
+      }
+      return <chakra.span color="text_secondary"> N/A </chakra.span>;
+    }
+
+    return (
+      <NftEntity
+        hash={ token.address }
+        id={ tokenId }
+        fontWeight={ 600 }
+        iconSize="md"
+        maxW={{ base: '100%', lg: '150px' }}
+        w="auto"
+        flexShrink={ 0 }
+      />
+    );
+
+  })();
+
   return (
-    <Flex alignItems="center" columnGap={ 2 } rowGap={ 2 } flexWrap={{ base: 'wrap', lg: 'nowrap' }}>
+    <>
       { num ? (
         <>
           <chakra.span color="text_secondary">for</chakra.span>
@@ -26,15 +49,7 @@ const NftTokenTransferSnippet = ({ value, token, tokenId }: Props) => {
       ) : (
         <chakra.span color="text_secondary">for token ID</chakra.span>
       ) }
-      <NftEntity
-        hash={ token.address }
-        id={ tokenId }
-        fontWeight={ 600 }
-        iconSize="md"
-        maxW={{ base: '100%', lg: '150px' }}
-        w="auto"
-        flexShrink={ 0 }
-      />
+      { tokenIdContent }
       <chakra.span color="text_secondary">of</chakra.span>
       <TokenEntity
         token={ token }
@@ -42,7 +57,7 @@ const NftTokenTransferSnippet = ({ value, token, tokenId }: Props) => {
         w="auto"
         flexGrow={ 1 }
       />
-    </Flex>
+    </>
   );
 };
 
diff --git a/ui/tx/TxAssetFlows.tsx b/ui/tx/TxAssetFlows.tsx
new file mode 100644
index 0000000000..931332151b
--- /dev/null
+++ b/ui/tx/TxAssetFlows.tsx
@@ -0,0 +1,119 @@
+import { Table, Tbody, Tr, Th, Box, Skeleton, Text, Show, Hide } from '@chakra-ui/react';
+import _ from 'lodash';
+import React, { useMemo, useState } from 'react';
+
+import type { PaginationParams } from 'ui/shared/pagination/types';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import { NOVES_TRANSLATE } from 'stubs/noves/NovesTranslate';
+import ActionBar from 'ui/shared/ActionBar';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import Pagination from 'ui/shared/pagination/Pagination';
+import TheadSticky from 'ui/shared/TheadSticky';
+
+import TxAssetFlowsListItem from './assetFlows/TxAssetFlowsListItem';
+import TxAssetFlowsTableItem from './assetFlows/TxAssetFlowsTableItem';
+import { generateFlowViewData } from './assetFlows/utils/generateFlowViewData';
+
+interface FlowViewProps {
+  hash: string;
+}
+
+export default function TxAssetFlows(props: FlowViewProps) {
+
+  const { data: queryData, isPlaceholderData, isError } = useApiQuery('noves_transaction', {
+    pathParams: { hash: props.hash },
+    queryOptions: {
+      enabled: Boolean(props.hash),
+      placeholderData: NOVES_TRANSLATE,
+    },
+  });
+
+  const [ page, setPage ] = useState<number>(1);
+
+  const ViewData = useMemo(() => (queryData ? generateFlowViewData(queryData) : []), [ queryData ]);
+  const chunkedViewData = _.chunk(ViewData, 50);
+
+  const paginationProps: PaginationParams = useMemo(() => ({
+    onNextPageClick: () => setPage(page + 1),
+    onPrevPageClick: () => setPage(page - 1),
+    resetPage: () => setPage(1),
+    canGoBackwards: page > 1,
+    isLoading: isPlaceholderData,
+    page: page,
+    hasNextPage: Boolean(chunkedViewData[page]),
+    hasPages: Boolean(chunkedViewData[1]),
+    isVisible: Boolean(chunkedViewData[1]),
+  }), [ chunkedViewData, page, isPlaceholderData ]);
+
+  const data = chunkedViewData [page - 1];
+
+  const actionBar = (
+    <ActionBar mt={ -6 } pb={{ base: 6, md: 5 }} flexDir={{ base: 'column', md: 'initial' }} gap={{ base: '2', md: 'initial' }} >
+      <Box display="flex" alignItems="center" gap={ 1 }>
+        <Skeleton borderRadius="sm" isLoaded={ !isPlaceholderData } >
+          <Text fontWeight="400" mr={ 1 }>
+              Wallet
+          </Text>
+        </Skeleton>
+
+        <AddressEntity
+          address={{ hash: queryData?.accountAddress || '' }}
+          fontWeight="400"
+          truncation="dynamic"
+          isLoading={ isPlaceholderData }
+        />
+      </Box>
+      <Pagination ml={{ base: 'auto', lg: 8 }} { ...paginationProps }/>
+    </ActionBar>
+  );
+
+  const content = (
+    <>
+      <Hide above="lg" >
+        { data?.map((item, i) => (
+          <TxAssetFlowsListItem
+            key={ `${ i }-${ item.accountAddress }` }
+            item={ item }
+            isPlaceholderData={ isPlaceholderData }
+          />
+        )) }
+      </Hide>
+
+      <Show above="lg">
+        <Table variant="simple" size="sm">
+          <TheadSticky top={ 75 }>
+            <Tr>
+              <Th>
+                  Actions
+              </Th>
+              <Th width="450px">
+                  From/To
+              </Th>
+            </Tr>
+          </TheadSticky>
+          <Tbody>
+            { data?.map((item, i) => (
+              <TxAssetFlowsTableItem
+                key={ `${ i }-${ item.accountAddress }` }
+                item={ item }
+                isPlaceholderData={ isPlaceholderData }
+              />
+            )) }
+          </Tbody>
+        </Table>
+      </Show>
+    </>
+  );
+
+  return (
+    <DataListDisplay
+      isError={ isError }
+      items={ data }
+      emptyText="There are no transfers."
+      content={ content }
+      actionBar={ actionBar }
+    />
+  );
+}
diff --git a/ui/tx/TxBlobs.pw.tsx b/ui/tx/TxBlobs.pw.tsx
new file mode 100644
index 0000000000..dcec52a170
--- /dev/null
+++ b/ui/tx/TxBlobs.pw.tsx
@@ -0,0 +1,39 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import * as blobsMock from 'mocks/blobs/blobs';
+import * as txMock from 'mocks/txs/tx';
+import TestApp from 'playwright/TestApp';
+import buildApiUrl from 'playwright/utils/buildApiUrl';
+
+import TxBlobs from './TxBlobs';
+import type { TxQuery } from './useTxQuery';
+
+const TX_BLOBS_API_URL = buildApiUrl('tx_blobs', { hash: txMock.base.hash });
+const hooksConfig = {
+  router: {
+    query: { hash: txMock.base.hash },
+  },
+};
+
+test('base view +@mobile', async({ mount, page }) => {
+  await page.route(TX_BLOBS_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify(blobsMock.txBlobs),
+  }));
+
+  const txQuery = {
+    data: txMock.base,
+    isPlaceholderData: false,
+    isError: false,
+  } as TxQuery;
+
+  const component = await mount(
+    <TestApp>
+      <TxBlobs txQuery={ txQuery }/>
+    </TestApp>,
+    { hooksConfig },
+  );
+
+  await expect(component).toHaveScreenshot();
+});
diff --git a/ui/tx/TxBlobs.tsx b/ui/tx/TxBlobs.tsx
new file mode 100644
index 0000000000..fd10854681
--- /dev/null
+++ b/ui/tx/TxBlobs.tsx
@@ -0,0 +1,63 @@
+import { Hide, Show } from '@chakra-ui/react';
+import React from 'react';
+
+import { TX_BLOB } from 'stubs/blobs';
+import { generateListStub } from 'stubs/utils';
+import ActionBar from 'ui/shared/ActionBar';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+import Pagination from 'ui/shared/pagination/Pagination';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+
+import TxBlobsList from './blobs/TxBlobsList';
+import TxBlobsTable from './blobs/TxBlobsTable';
+import TxPendingAlert from './TxPendingAlert';
+import TxSocketAlert from './TxSocketAlert';
+import type { TxQuery } from './useTxQuery';
+
+interface Props {
+  txQuery: TxQuery;
+}
+
+const TxBlobs = ({ txQuery }: Props) => {
+  const { data, isPlaceholderData, isError, pagination } = useQueryWithPages({
+    resourceName: 'tx_blobs',
+    pathParams: { hash: txQuery.data?.hash },
+    options: {
+      enabled: !txQuery.isPlaceholderData && Boolean(txQuery.data?.hash) && Boolean(txQuery.data?.status),
+      placeholderData: generateListStub<'tx_blobs'>(TX_BLOB, 3, { next_page_params: null }),
+    },
+  });
+
+  if (!txQuery.isPending && !txQuery.isPlaceholderData && !txQuery.isError && !txQuery.data.status) {
+    return txQuery.socketStatus ? <TxSocketAlert status={ txQuery.socketStatus }/> : <TxPendingAlert/>;
+  }
+
+  const content = data ? (
+    <>
+      <Hide below="lg" ssr={ false }>
+        <TxBlobsTable data={ data.items } isLoading={ isPlaceholderData } top={ pagination.isVisible ? 80 : 0 }/>
+      </Hide>
+      <Show below="lg" ssr={ false }>
+        <TxBlobsList data={ data.items } isLoading={ isPlaceholderData }/>
+      </Show>
+    </>
+  ) : null;
+
+  const actionBar = pagination.isVisible ? (
+    <ActionBar mt={ -6 } showShadow>
+      <Pagination ml="auto" { ...pagination }/>
+    </ActionBar>
+  ) : null;
+
+  return (
+    <DataListDisplay
+      isError={ isError || txQuery.isError }
+      items={ data?.items }
+      emptyText="There are no blobs for this transaction."
+      content={ content }
+      actionBar={ actionBar }
+    />
+  );
+};
+
+export default TxBlobs;
diff --git a/ui/tx/TxDetails.tsx b/ui/tx/TxDetails.tsx
index 206c6190ab..f72012a234 100644
--- a/ui/tx/TxDetails.tsx
+++ b/ui/tx/TxDetails.tsx
@@ -1,522 +1,26 @@
-import {
-  Grid,
-  GridItem,
-  Text,
-  Box,
-  Link,
-  Spinner,
-  Flex,
-  Tooltip,
-  chakra,
-  useColorModeValue,
-  Skeleton,
-  Alert,
-} from '@chakra-ui/react';
-import BigNumber from 'bignumber.js';
 import React from 'react';
-import { scroller, Element } from 'react-scroll';
 
-import { ZKEVM_L2_TX_STATUSES } from 'types/api/transaction';
-
-import { route } from 'nextjs-routes';
-
-import config from 'configs/app';
-import { WEI, WEI_IN_GWEI } from 'lib/consts';
-import dayjs from 'lib/date/dayjs';
-import getNetworkValidatorTitle from 'lib/networks/getNetworkValidatorTitle';
-import getConfirmationDuration from 'lib/tx/getConfirmationDuration';
-import Tag from 'ui/shared/chakra/Tag';
-import CopyToClipboard from 'ui/shared/CopyToClipboard';
-import CurrencyValue from 'ui/shared/CurrencyValue';
+import TestnetWarning from 'ui/shared/alerts/TestnetWarning';
 import DataFetchAlert from 'ui/shared/DataFetchAlert';
-import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
-import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
-import DetailsSponsoredItem from 'ui/shared/DetailsSponsoredItem';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
-import BlockEntity from 'ui/shared/entities/block/BlockEntity';
-import ZkEvmBatchEntityL2 from 'ui/shared/entities/block/ZkEvmBatchEntityL2';
-import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
-import IconSvg from 'ui/shared/IconSvg';
-import LogDecodedInputData from 'ui/shared/logs/LogDecodedInputData';
-import RawInputData from 'ui/shared/RawInputData';
-import TxStatus from 'ui/shared/statusTag/TxStatus';
-import TextSeparator from 'ui/shared/TextSeparator';
-import TxFeeStability from 'ui/shared/tx/TxFeeStability';
-import Utilization from 'ui/shared/Utilization/Utilization';
-import VerificationSteps from 'ui/shared/verificationSteps/VerificationSteps';
-import TxDetailsActions from 'ui/tx/details/txDetailsActions/TxDetailsActions';
-import TxDetailsFeePerGas from 'ui/tx/details/TxDetailsFeePerGas';
-import TxDetailsGasPrice from 'ui/tx/details/TxDetailsGasPrice';
-import TxDetailsOther from 'ui/tx/details/TxDetailsOther';
-import TxDetailsTokenTransfers from 'ui/tx/details/TxDetailsTokenTransfers';
-import TxDetailsWithdrawalStatus from 'ui/tx/details/TxDetailsWithdrawalStatus';
-import TxRevertReason from 'ui/tx/details/TxRevertReason';
-import TxAllowedPeekers from 'ui/tx/TxAllowedPeekers';
-import TxSocketAlert from 'ui/tx/TxSocketAlert';
-import useFetchTxInfo from 'ui/tx/useFetchTxInfo';
-
-const TxDetails = () => {
-  const { data, isPlaceholderData, isError, socketStatus, error } = useFetchTxInfo();
 
-  const [ isExpanded, setIsExpanded ] = React.useState(false);
+import TxInfo from './details/TxInfo';
+import type { TxQuery } from './useTxQuery';
 
-  const handleCutClick = React.useCallback(() => {
-    setIsExpanded((flag) => !flag);
-    scroller.scrollTo('TxDetails__cutLink', {
-      duration: 500,
-      smooth: true,
-    });
-  }, []);
-  const executionSuccessIconColor = useColorModeValue('blackAlpha.800', 'whiteAlpha.800');
-
-  if (isError) {
-    if (error?.status === 422) {
-      throw Error('Invalid tx hash', { cause: error as unknown as Error });
-    }
-
-    if (error?.status === 404) {
-      throw Error('Tx not found', { cause: error as unknown as Error });
-    }
+interface Props {
+  txQuery: TxQuery;
+}
 
+const TxDetails = ({ txQuery }: Props) => {
+  if (txQuery.isError) {
     return <DataFetchAlert/>;
   }
 
-  if (!data) {
-    return null;
-  }
-
-  const addressFromTags = [
-    ...data.from.private_tags || [],
-    ...data.from.public_tags || [],
-    ...data.from.watchlist_names || [],
-  ].map((tag) => <Tag key={ tag.label }>{ tag.display_name }</Tag>);
-
-  const toAddress = data.to ? data.to : data.created_contract;
-  const addressToTags = [
-    ...toAddress?.private_tags || [],
-    ...toAddress?.public_tags || [],
-    ...toAddress?.watchlist_names || [],
-  ].map((tag) => <Tag key={ tag.label }>{ tag.display_name }</Tag>);
-
-  const executionSuccessBadge = toAddress?.is_contract && data.result === 'success' ? (
-    <Tooltip label="Contract execution completed">
-      <chakra.span display="inline-flex" ml={ 2 } mr={ 1 }>
-        <IconSvg name="status/success" boxSize={ 4 } color={ executionSuccessIconColor } cursor="pointer"/>
-      </chakra.span>
-    </Tooltip>
-  ) : null;
-  const executionFailedBadge = toAddress?.is_contract && Boolean(data.status) && data.result !== 'success' ? (
-    <Tooltip label="Error occurred during contract execution">
-      <chakra.span display="inline-flex" ml={ 2 } mr={ 1 }>
-        <IconSvg name="status/error" boxSize={ 4 } color="error" cursor="pointer"/>
-      </chakra.span>
-    </Tooltip>
-  ) : null;
-
   return (
     <>
-      { config.chain.isTestnet && (
-        <Skeleton mb={ 6 } isLoaded={ !isPlaceholderData }>
-          <Alert status="warning">This is a testnet transaction only</Alert>
-        </Skeleton>
-      ) }
-      <Grid columnGap={ 8 } rowGap={{ base: 3, lg: 3 }} templateColumns={{ base: 'minmax(0, 1fr)', lg: 'max-content minmax(728px, auto)' }}>
-        { socketStatus && (
-          <GridItem colSpan={{ base: undefined, lg: 2 }} mb={ 2 }>
-            <TxSocketAlert status={ socketStatus }/>
-          </GridItem>
-        ) }
-        <DetailsInfoItem
-          title="Transaction hash"
-          hint="Unique character string (TxID) assigned to every verified transaction"
-          flexWrap="nowrap"
-          isLoading={ isPlaceholderData }
-        >
-          { data.status === null && <Spinner mr={ 2 } size="sm" flexShrink={ 0 }/> }
-          <Skeleton isLoaded={ !isPlaceholderData } overflow="hidden">
-            <HashStringShortenDynamic hash={ data.hash }/>
-          </Skeleton>
-          <CopyToClipboard text={ data.hash } isLoading={ isPlaceholderData }/>
-        </DetailsInfoItem>
-        <DetailsInfoItem
-          title={ config.features.zkEvmRollup.isEnabled ? 'L2 status and method' : 'Status and method' }
-          hint="Current transaction state: Success, Failed (Error), or Pending (In Process)"
-          isLoading={ isPlaceholderData }
-        >
-          <TxStatus status={ data.status } errorText={ data.status === 'error' ? data.result : undefined } isLoading={ isPlaceholderData }/>
-          { data.method && (
-            <Tag colorScheme={ data.method === 'Multicall' ? 'teal' : 'gray' } isLoading={ isPlaceholderData } isTruncated ml={ 3 }>
-              { data.method }
-            </Tag>
-          ) }
-        </DetailsInfoItem>
-        <TxDetailsWithdrawalStatus
-          status={ data.op_withdrawal_status }
-          l1TxHash={ data.op_l1_transaction_hash }
-        />
-        { data.zkevm_status && (
-          <DetailsInfoItem
-            title="Confirmation status"
-            hint="Status of the transaction confirmation path to L1"
-            isLoading={ isPlaceholderData }
-          >
-            <VerificationSteps currentStep={ data.zkevm_status } steps={ ZKEVM_L2_TX_STATUSES } isLoading={ isPlaceholderData }/>
-          </DetailsInfoItem>
-        ) }
-        { data.revert_reason && (
-          <DetailsInfoItem
-            title="Revert reason"
-            hint="The revert reason of the transaction"
-          >
-            <TxRevertReason { ...data.revert_reason }/>
-          </DetailsInfoItem>
-        ) }
-        <DetailsInfoItem
-          title="Block"
-          hint="Block number containing the transaction"
-          isLoading={ isPlaceholderData }
-        >
-          { data.block === null ?
-            <Text>Pending</Text> : (
-              <BlockEntity
-                isLoading={ isPlaceholderData }
-                number={ data.block }
-                noIcon
-              />
-            ) }
-          { Boolean(data.confirmations) && (
-            <>
-              <TextSeparator color="gray.500"/>
-              <Skeleton isLoaded={ !isPlaceholderData } color="text_secondary">
-                <span>{ data.confirmations } Block confirmations</span>
-              </Skeleton>
-            </>
-          ) }
-        </DetailsInfoItem>
-        { data.zkevm_batch_number && (
-          <DetailsInfoItem
-            title="Tx batch"
-            hint="Batch index for this transaction"
-            isLoading={ isPlaceholderData }
-          >
-            <ZkEvmBatchEntityL2
-              isLoading={ isPlaceholderData }
-              number={ data.zkevm_batch_number }
-            />
-          </DetailsInfoItem>
-        ) }
-        { data.timestamp && (
-          <DetailsInfoItem
-            title="Timestamp"
-            hint="Date & time of transaction inclusion, including length of time for confirmation"
-            isLoading={ isPlaceholderData }
-          >
-            <IconSvg name="clock" boxSize={ 5 } color="gray.500" isLoading={ isPlaceholderData }/>
-            <Skeleton isLoaded={ !isPlaceholderData } ml={ 2 }>{ dayjs(data.timestamp).fromNow() }</Skeleton>
-            <TextSeparator/>
-            <Skeleton isLoaded={ !isPlaceholderData } whiteSpace="normal">{ dayjs(data.timestamp).format('llll') }</Skeleton>
-            <TextSeparator color="gray.500"/>
-            <Skeleton isLoaded={ !isPlaceholderData } color="text_secondary">
-              <span>{ getConfirmationDuration(data.confirmation_duration) }</span>
-            </Skeleton>
-          </DetailsInfoItem>
-        ) }
-        { data.execution_node && (
-          <DetailsInfoItem
-            title="Kettle"
-            hint="Node that carried out the confidential computation"
-            isLoading={ isPlaceholderData }
-          >
-            <AddressEntity
-              address={ data.execution_node }
-              href={ route({ pathname: '/txs/kettle/[hash]', query: { hash: data.execution_node.hash } }) }
-            />
-          </DetailsInfoItem>
-        ) }
-        { data.allowed_peekers && data.allowed_peekers.length > 0 && (
-          <TxAllowedPeekers items={ data.allowed_peekers }/>
-        ) }
-        <DetailsSponsoredItem isLoading={ isPlaceholderData }/>
-
-        <DetailsInfoItemDivider/>
-
-        <TxDetailsActions hash={ data.hash } actions={ data.actions } isTxDataLoading={ isPlaceholderData }/>
-
-        <DetailsInfoItem
-          title="From"
-          hint="Address (external or contract) sending the transaction"
-          isLoading={ isPlaceholderData }
-          columnGap={ 3 }
-        >
-          <AddressEntity
-            address={ data.from }
-            isLoading={ isPlaceholderData }
-          />
-          { data.from.name && <Text>{ data.from.name }</Text> }
-          { addressFromTags.length > 0 && (
-            <Flex columnGap={ 3 }>
-              { addressFromTags }
-            </Flex>
-          ) }
-        </DetailsInfoItem>
-        <DetailsInfoItem
-          title={ data.to?.is_contract ? 'Interacted with contract' : 'To' }
-          hint="Address (external or contract) receiving the transaction"
-          isLoading={ isPlaceholderData }
-          flexWrap={{ base: 'wrap', lg: 'nowrap' }}
-          columnGap={ 3 }
-        >
-          { toAddress ? (
-            <>
-              { data.to && data.to.hash ? (
-                <Flex flexWrap="nowrap" alignItems="center" maxW="100%">
-                  <AddressEntity
-                    address={ toAddress }
-                    isLoading={ isPlaceholderData }
-                  />
-                  { executionSuccessBadge }
-                  { executionFailedBadge }
-                </Flex>
-              ) : (
-                <Flex width="100%" whiteSpace="pre" alignItems="center" flexShrink={ 0 }>
-                  <span>[Contract </span>
-                  <AddressEntity
-                    address={ toAddress }
-                    isLoading={ isPlaceholderData }
-                    noIcon
-                  />
-                  <span>created]</span>
-                  { executionSuccessBadge }
-                  { executionFailedBadge }
-                </Flex>
-              ) }
-              { addressToTags.length > 0 && (
-                <Flex columnGap={ 3 }>
-                  { addressToTags }
-                </Flex>
-              ) }
-            </>
-          ) : (
-            <span>[ Contract creation ]</span>
-          ) }
-        </DetailsInfoItem>
-        { data.token_transfers && <TxDetailsTokenTransfers data={ data.token_transfers } txHash={ data.hash } isOverflow={ data.token_transfers_overflow }/> }
-
-        <DetailsInfoItemDivider/>
-
-        { data.zkevm_sequence_hash && (
-          <DetailsInfoItem
-            title="Sequence tx hash"
-            flexWrap="nowrap"
-
-            isLoading={ isPlaceholderData }
-          >
-            <Skeleton isLoaded={ !isPlaceholderData } overflow="hidden">
-              <HashStringShortenDynamic hash={ data.zkevm_sequence_hash }/>
-            </Skeleton>
-            <CopyToClipboard text={ data.zkevm_sequence_hash } isLoading={ isPlaceholderData }/>
-          </DetailsInfoItem>
-        ) }
-        { data.zkevm_verify_hash && (
-          <DetailsInfoItem
-            title="Verify tx hash"
-            flexWrap="nowrap"
-            isLoading={ isPlaceholderData }
-          >
-            <Skeleton isLoaded={ !isPlaceholderData } overflow="hidden">
-
-              <HashStringShortenDynamic hash={ data.zkevm_verify_hash }/>
-            </Skeleton>
-            <CopyToClipboard text={ data.zkevm_verify_hash } isLoading={ isPlaceholderData }/>
-
-          </DetailsInfoItem>
-        ) }
-
-        { (data.zkevm_batch_number || data.zkevm_verify_hash) && <DetailsInfoItemDivider/> }
-
-        { !config.UI.views.tx.hiddenFields?.value && (
-          <DetailsInfoItem
-            title="Value"
-            hint="Value sent in the native token (and USD) if applicable"
-            isLoading={ isPlaceholderData }
-          >
-            <CurrencyValue
-              value={ data.value }
-              currency={ config.chain.currency.symbol }
-              exchangeRate={ data.exchange_rate }
-              isLoading={ isPlaceholderData }
-              flexWrap="wrap"
-            />
-          </DetailsInfoItem>
-        ) }
-        { !config.UI.views.tx.hiddenFields?.tx_fee && (
-          <DetailsInfoItem
-            title="Transaction fee"
-            hint="Total transaction fee"
-            isLoading={ isPlaceholderData }
-          >
-            { data.stability_fee ? (
-              <TxFeeStability data={ data.stability_fee } isLoading={ isPlaceholderData }/>
-            ) : (
-              <CurrencyValue
-                value={ data.fee.value }
-                currency={ config.UI.views.tx.hiddenFields?.fee_currency ? '' : config.chain.currency.symbol }
-                exchangeRate={ data.exchange_rate }
-                flexWrap="wrap"
-                isLoading={ isPlaceholderData }
-              />
-            ) }
-          </DetailsInfoItem>
-        ) }
-
-        <TxDetailsGasPrice gasPrice={ data.gas_price } isLoading={ isPlaceholderData }/>
-
-        <TxDetailsFeePerGas txFee={ data.fee.value } gasUsed={ data.gas_used } isLoading={ isPlaceholderData }/>
-
-        <DetailsInfoItem
-          title="Gas usage & limit by txn"
-          hint="Actual gas amount used by the transaction"
-          isLoading={ isPlaceholderData }
-        >
-          <Skeleton isLoaded={ !isPlaceholderData }>{ BigNumber(data.gas_used || 0).toFormat() }</Skeleton>
-          <TextSeparator/>
-          <Skeleton isLoaded={ !isPlaceholderData }>{ BigNumber(data.gas_limit).toFormat() }</Skeleton>
-          <Utilization ml={ 4 } value={ BigNumber(data.gas_used || 0).dividedBy(BigNumber(data.gas_limit)).toNumber() } isLoading={ isPlaceholderData }/>
-        </DetailsInfoItem>
-        { !config.UI.views.tx.hiddenFields?.gas_fees &&
-          (data.base_fee_per_gas || data.max_fee_per_gas || data.max_priority_fee_per_gas) && (
-          <DetailsInfoItem
-            title="Gas fees (Gwei)"
-            // eslint-disable-next-line max-len
-            hint={ `
-              Base Fee refers to the network Base Fee at the time of the block, 
-              while Max Fee & Max Priority Fee refer to the max amount a user is willing to pay 
-              for their tx & to give to the ${ getNetworkValidatorTitle() } respectively
-            ` }
-            isLoading={ isPlaceholderData }
-          >
-            { data.base_fee_per_gas && (
-              <Skeleton isLoaded={ !isPlaceholderData }>
-                <Text as="span" fontWeight="500">Base: </Text>
-                <Text fontWeight="600" as="span">{ BigNumber(data.base_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() }</Text>
-                { (data.max_fee_per_gas || data.max_priority_fee_per_gas) && <TextSeparator/> }
-              </Skeleton>
-            ) }
-            { data.max_fee_per_gas && (
-              <Box>
-                <Text as="span" fontWeight="500">Max: </Text>
-                <Text fontWeight="600" as="span">{ BigNumber(data.max_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() }</Text>
-                { data.max_priority_fee_per_gas && <TextSeparator/> }
-              </Box>
-            ) }
-            { data.max_priority_fee_per_gas && (
-              <Box>
-                <Text as="span" fontWeight="500">Max priority: </Text>
-                <Text fontWeight="600" as="span">{ BigNumber(data.max_priority_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() }</Text>
-              </Box>
-            ) }
-          </DetailsInfoItem>
-        ) }
-        { data.tx_burnt_fee && !config.UI.views.tx.hiddenFields?.burnt_fees && !config.features.optimisticRollup.isEnabled && (
-          <DetailsInfoItem
-            title="Burnt fees"
-            hint={ `Amount of ${ config.chain.currency.symbol } burned for this transaction. Equals Block Base Fee per Gas * Gas Used` }
-          >
-            <IconSvg name="flame" boxSize={ 5 } color="gray.500"/>
-            <CurrencyValue
-              value={ String(data.tx_burnt_fee) }
-              currency={ config.chain.currency.symbol }
-              exchangeRate={ data.exchange_rate }
-              flexWrap="wrap"
-              ml={ 2 }
-            />
-          </DetailsInfoItem>
-        ) }
-        { config.features.optimisticRollup.isEnabled && (
-          <>
-            { data.l1_gas_used && (
-              <DetailsInfoItem
-                title="L1 gas used by txn"
-                hint="L1 gas used by transaction"
-                isLoading={ isPlaceholderData }
-              >
-                <Text>{ BigNumber(data.l1_gas_used).toFormat() }</Text>
-              </DetailsInfoItem>
-            ) }
-            { data.l1_gas_price && (
-              <DetailsInfoItem
-                title="L1 gas price"
-                hint="L1 gas price"
-                isLoading={ isPlaceholderData }
-              >
-                <Text mr={ 1 }>{ BigNumber(data.l1_gas_price).dividedBy(WEI).toFixed() } { config.chain.currency.symbol }</Text>
-                <Text variant="secondary">({ BigNumber(data.l1_gas_price).dividedBy(WEI_IN_GWEI).toFixed() } Gwei)</Text>
-              </DetailsInfoItem>
-            ) }
-            { data.l1_fee && (
-              <DetailsInfoItem
-                title="L1 fee"
-                // eslint-disable-next-line max-len
-                hint={ `L1 Data Fee which is used to cover the L1 "security" cost from the batch submission mechanism. In combination with L2 execution fee, L1 fee makes the total amount of fees that a transaction pays.` }
-                isLoading={ isPlaceholderData }
-              >
-                <CurrencyValue
-                  value={ data.l1_fee }
-                  currency={ config.chain.currency.symbol }
-                  exchangeRate={ data.exchange_rate }
-                  flexWrap="wrap"
-                />
-              </DetailsInfoItem>
-            ) }
-            { data.l1_fee_scalar && (
-              <DetailsInfoItem
-                title="L1 fee scalar"
-                hint="A Dynamic overhead (fee scalar) premium, which serves as a buffer in case L1 prices rapidly increase."
-                isLoading={ isPlaceholderData }
-              >
-                <Text>{ data.l1_fee_scalar }</Text>
-              </DetailsInfoItem>
-            ) }
-          </>
-        ) }
-        <GridItem colSpan={{ base: undefined, lg: 2 }}>
-          <Element name="TxDetails__cutLink">
-            <Skeleton isLoaded={ !isPlaceholderData } mt={ 6 } display="inline-block">
-              <Link
-                display="inline-block"
-                fontSize="sm"
-                textDecorationLine="underline"
-                textDecorationStyle="dashed"
-                onClick={ handleCutClick }
-              >
-                { isExpanded ? 'Hide details' : 'View details' }
-              </Link>
-            </Skeleton>
-          </Element>
-        </GridItem>
-        { isExpanded && (
-          <>
-            <GridItem colSpan={{ base: undefined, lg: 2 }} mt={{ base: 1, lg: 4 }}/>
-            <TxDetailsOther nonce={ data.nonce } type={ data.type } position={ data.position }/>
-            <DetailsInfoItem
-              title="Raw input"
-              hint="Binary data included with the transaction. See logs tab for additional info"
-            >
-              <RawInputData hex={ data.raw_input }/>
-            </DetailsInfoItem>
-            { data.decoded_input && (
-              <DetailsInfoItem
-                title="Decoded input data"
-                hint="Decoded input data"
-              >
-                <LogDecodedInputData data={ data.decoded_input }/>
-              </DetailsInfoItem>
-            ) }
-          </>
-        ) }
-      </Grid>
+      <TestnetWarning mb={ 6 } isLoading={ txQuery.isPlaceholderData }/>
+      <TxInfo data={ txQuery.data } isLoading={ txQuery.isPlaceholderData } socketStatus={ txQuery.socketStatus }/>
     </>
   );
 };
 
-export default TxDetails;
+export default React.memo(TxDetails);
diff --git a/ui/tx/TxDetailsDegraded.tsx b/ui/tx/TxDetailsDegraded.tsx
new file mode 100644
index 0000000000..e1bace40d9
--- /dev/null
+++ b/ui/tx/TxDetailsDegraded.tsx
@@ -0,0 +1,164 @@
+import { Flex } from '@chakra-ui/react';
+import { useQuery } from '@tanstack/react-query';
+import React from 'react';
+import type { Chain, GetBlockReturnType, GetTransactionReturnType, TransactionReceipt } from 'viem';
+
+import type { Transaction } from 'types/api/transaction';
+
+import { SECOND } from 'lib/consts';
+import dayjs from 'lib/date/dayjs';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import hexToDecimal from 'lib/hexToDecimal';
+import { publicClient } from 'lib/web3/client';
+import { GET_BLOCK, GET_TRANSACTION, GET_TRANSACTION_RECEIPT, GET_TRANSACTION_CONFIRMATIONS } from 'stubs/RPC';
+import { unknownAddress } from 'ui/shared/address/utils';
+import ServiceDegradationWarning from 'ui/shared/alerts/ServiceDegradationWarning';
+import TestnetWarning from 'ui/shared/alerts/TestnetWarning';
+import isCustomAppError from 'ui/shared/AppError/isCustomAppError';
+import DataFetchAlert from 'ui/shared/DataFetchAlert';
+
+import TxInfo from './details/TxInfo';
+import type { TxQuery } from './useTxQuery';
+
+type RpcResponseType = [
+  GetTransactionReturnType<Chain, 'latest'>,
+  TransactionReceipt | null,
+  bigint | null,
+  GetBlockReturnType<Chain, false, 'latest'> | null,
+];
+
+interface Props {
+  hash: string;
+  txQuery: TxQuery;
+}
+
+const TxDetailsDegraded = ({ hash, txQuery }: Props) => {
+
+  const [ originalError ] = React.useState(txQuery.error);
+
+  const query = useQuery<RpcResponseType, unknown, Transaction | null>({
+    queryKey: [ 'RPC', 'tx', { hash } ],
+    queryFn: async() => {
+      if (!publicClient) {
+        throw new Error('No public RPC client');
+      }
+
+      const tx = await publicClient.getTransaction({ hash: hash as `0x${ string }` });
+
+      if (!tx) {
+        throw new Error('Not found');
+      }
+
+      const txReceipt = await publicClient.getTransactionReceipt({ hash: hash as `0x${ string }` }).catch(() => null);
+      const block = await publicClient.getBlock({ blockHash: tx.blockHash }).catch(() => null);
+      const latestBlock = await publicClient.getBlock().catch(() => null);
+      const confirmations = latestBlock && block ? latestBlock.number - block.number + BigInt(1) : null;
+
+      return [
+        tx,
+        txReceipt,
+        confirmations,
+        block,
+      ];
+    },
+    select: (response) => {
+      const [ tx, txReceipt, txConfirmations, block ] = response;
+
+      const status = (() => {
+        if (!txReceipt) {
+          return null;
+        }
+
+        return txReceipt.status === 'success' ? 'ok' : 'error';
+      })();
+
+      const gasPrice = txReceipt?.effectiveGasPrice ?? tx.gasPrice;
+
+      return {
+        from: { ...unknownAddress, hash: tx.from as string },
+        to: tx.to ? { ...unknownAddress, hash: tx.to as string } : null,
+        hash: tx.hash as string,
+        timestamp: block?.timestamp ? dayjs.unix(Number(block.timestamp)).format() : null,
+        confirmation_duration: null,
+        status,
+        block: tx.blockNumber ? Number(tx.blockNumber) : null,
+        value: tx.value.toString(),
+        gas_price: gasPrice?.toString() ?? null,
+        base_fee_per_gas: block?.baseFeePerGas?.toString() ?? null,
+        max_fee_per_gas: tx.maxFeePerGas?.toString() ?? null,
+        max_priority_fee_per_gas: tx.maxPriorityFeePerGas?.toString() ?? null,
+        nonce: tx.nonce,
+        position: tx.transactionIndex,
+        type: tx.typeHex ? hexToDecimal(tx.typeHex) : null,
+        raw_input: tx.input,
+        gas_used: txReceipt?.gasUsed?.toString() ?? null,
+        gas_limit: tx.gas.toString(),
+        confirmations: txConfirmations && txConfirmations > 0 ? Number(txConfirmations) : 0,
+        fee: {
+          value: txReceipt && gasPrice ? (txReceipt.gasUsed * gasPrice).toString() : null,
+          type: 'actual',
+        },
+        created_contract: txReceipt?.contractAddress ?
+          { ...unknownAddress, hash: txReceipt.contractAddress, is_contract: true } :
+          null,
+        result: '',
+        priority_fee: null,
+        tx_burnt_fee: null,
+        revert_reason: null,
+        decoded_input: null,
+        has_error_in_internal_txs: null,
+        token_transfers: null,
+        token_transfers_overflow: false,
+        exchange_rate: null,
+        method: null,
+        tx_types: [],
+        tx_tag: null,
+        actions: [],
+      };
+    },
+    placeholderData: [
+      GET_TRANSACTION,
+      GET_TRANSACTION_RECEIPT,
+      GET_TRANSACTION_CONFIRMATIONS,
+      GET_BLOCK,
+    ],
+    refetchOnMount: false,
+    enabled: !txQuery.isPlaceholderData,
+    retry: 2,
+    retryDelay: 5 * SECOND,
+  });
+
+  const hasData = Boolean(query.data);
+
+  React.useEffect(() => {
+    if (!query.isPlaceholderData && hasData) {
+      txQuery.setRefetchOnError.on();
+    }
+  }, [ hasData, query.isPlaceholderData, txQuery ]);
+
+  React.useEffect(() => {
+    return () => {
+      txQuery.setRefetchOnError.off();
+    };
+  }, [ txQuery.setRefetchOnError ]);
+
+  if (!query.data) {
+    if (originalError && isCustomAppError(originalError)) {
+      throwOnResourceLoadError({ resource: 'tx', error: originalError, isError: true });
+    }
+
+    return <DataFetchAlert/>;
+  }
+
+  return (
+    <>
+      <Flex rowGap={ 2 } mb={ 6 } flexDir="column">
+        <TestnetWarning isLoading={ query.isPlaceholderData }/>
+        { originalError?.status !== 404 && <ServiceDegradationWarning isLoading={ query.isPlaceholderData }/> }
+      </Flex>
+      <TxInfo data={ query.data } isLoading={ query.isPlaceholderData }/>
+    </>
+  );
+};
+
+export default React.memo(TxDetailsDegraded);
diff --git a/ui/tx/TxDetailsWrapped.tsx b/ui/tx/TxDetailsWrapped.tsx
index aba295159c..d01a740739 100644
--- a/ui/tx/TxDetailsWrapped.tsx
+++ b/ui/tx/TxDetailsWrapped.tsx
@@ -5,7 +5,7 @@ import React from 'react';
 import type { Transaction } from 'types/api/transaction';
 import type { ExcludeUndefined } from 'types/utils';
 
-import config from 'configs/app';
+import { currencyUnits } from 'lib/units';
 import Tag from 'ui/shared/chakra/Tag';
 import CurrencyValue from 'ui/shared/CurrencyValue';
 import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
@@ -61,7 +61,7 @@ const TxDetailsWrapped = ({ data }: Props) => {
       >
         <CurrencyValue
           value={ data.value }
-          currency={ config.chain.currency.symbol }
+          currency={ currencyUnits.ether }
           flexWrap="wrap"
         />
       </DetailsInfoItem>
@@ -72,7 +72,7 @@ const TxDetailsWrapped = ({ data }: Props) => {
         >
           <CurrencyValue
             value={ data.fee.value }
-            currency={ config.chain.currency.symbol }
+            currency={ currencyUnits.ether }
             flexWrap="wrap"
           />
         </DetailsInfoItem>
diff --git a/ui/tx/TxInternals.pw.tsx b/ui/tx/TxInternals.pw.tsx
index 6f8ced6123..3e0c2e30be 100644
--- a/ui/tx/TxInternals.pw.tsx
+++ b/ui/tx/TxInternals.pw.tsx
@@ -7,9 +7,9 @@ import TestApp from 'playwright/TestApp';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
 
 import TxInternals from './TxInternals';
+import type { TxQuery } from './useTxQuery';
 
 const TX_HASH = txMock.base.hash;
-const API_URL_TX = buildApiUrl('tx', { hash: TX_HASH });
 const API_URL_TX_INTERNALS = buildApiUrl('tx_internal_txs', { hash: TX_HASH });
 const hooksConfig = {
   router: {
@@ -18,18 +18,20 @@ const hooksConfig = {
 };
 
 test('base view +@mobile', async({ mount, page }) => {
-  await page.route(API_URL_TX, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.base),
-  }));
   await page.route(API_URL_TX_INTERNALS, (route) => route.fulfill({
     status: 200,
     body: JSON.stringify(internalTxsMock.baseResponse),
   }));
 
+  const txQuery = {
+    data: txMock.base,
+    isPlaceholderData: false,
+    isError: false,
+  } as TxQuery;
+
   const component = await mount(
     <TestApp>
-      <TxInternals/>
+      <TxInternals txQuery={ txQuery }/>
     </TestApp>,
     { hooksConfig },
   );
diff --git a/ui/tx/TxInternals.tsx b/ui/tx/TxInternals.tsx
index b94d2f4064..3f0396c155 100644
--- a/ui/tx/TxInternals.tsx
+++ b/ui/tx/TxInternals.tsx
@@ -3,7 +3,6 @@ import React from 'react';
 
 import type { InternalTransaction } from 'types/api/internalTransaction';
 
-import { SECOND } from 'lib/consts';
 // import { apos } from 'lib/html-entities';
 import { INTERNAL_TX } from 'stubs/internalTx';
 import { generateListStub } from 'stubs/utils';
@@ -19,7 +18,8 @@ import TxInternalsTable from 'ui/tx/internals/TxInternalsTable';
 import type { Sort, SortField } from 'ui/tx/internals/utils';
 import TxPendingAlert from 'ui/tx/TxPendingAlert';
 import TxSocketAlert from 'ui/tx/TxSocketAlert';
-import useFetchTxInfo from 'ui/tx/useFetchTxInfo';
+
+import type { TxQuery } from './useTxQuery';
 
 const SORT_SEQUENCE: Record<SortField, Array<Sort | undefined>> = {
   value: [ 'value-desc', 'value-asc', undefined ],
@@ -62,17 +62,20 @@ const sortFn = (sort: Sort | undefined) => (a: InternalTransaction, b: InternalT
 //     item.to.hash.toLowerCase().includes(formattedSearchTerm);
 // };
 
-const TxInternals = () => {
+interface Props {
+  txQuery: TxQuery;
+}
+
+const TxInternals = ({ txQuery }: Props) => {
   // filters are not implemented yet in api
   // const [ filters, setFilters ] = React.useState<Array<TxInternalsType>>([]);
   // const [ searchTerm, setSearchTerm ] = React.useState<string>('');
   const [ sort, setSort ] = React.useState<Sort>();
-  const txInfo = useFetchTxInfo({ updateDelay: 5 * SECOND });
   const { data, isPlaceholderData, isError, pagination } = useQueryWithPages({
     resourceName: 'tx_internal_txs',
-    pathParams: { hash: txInfo.data?.hash },
+    pathParams: { hash: txQuery.data?.hash },
     options: {
-      enabled: !txInfo.isPlaceholderData && Boolean(txInfo.data?.hash) && Boolean(txInfo.data?.status),
+      enabled: !txQuery.isPlaceholderData && Boolean(txQuery.data?.hash) && Boolean(txQuery.data?.status),
       placeholderData: generateListStub<'tx_internal_txs'>(INTERNAL_TX, 3, { next_page_params: null }),
     },
   });
@@ -90,8 +93,8 @@ const TxInternals = () => {
     };
   }, [ isPlaceholderData ]);
 
-  if (!txInfo.isPlaceholderData && !txInfo.isError && !txInfo.data?.status) {
-    return txInfo.socketStatus ? <TxSocketAlert status={ txInfo.socketStatus }/> : <TxPendingAlert/>;
+  if (!txQuery.isPlaceholderData && !txQuery.isError && !txQuery.data?.status) {
+    return txQuery.socketStatus ? <TxSocketAlert status={ txQuery.socketStatus }/> : <TxPendingAlert/>;
   }
 
   const filteredData = data?.items
@@ -125,7 +128,7 @@ const TxInternals = () => {
 
   return (
     <DataListDisplay
-      isError={ isError || txInfo.isError }
+      isError={ isError || txQuery.isError }
       items={ data?.items }
       emptyText="There are no internal transactions for this transaction."
       // filterProps={{
diff --git a/ui/tx/TxLogs.tsx b/ui/tx/TxLogs.tsx
index 68af313493..c554069b3c 100644
--- a/ui/tx/TxLogs.tsx
+++ b/ui/tx/TxLogs.tsx
@@ -1,7 +1,8 @@
 import { Box, Text } from '@chakra-ui/react';
 import React from 'react';
 
-import { SECOND } from 'lib/consts';
+import type { Log } from 'types/api/log';
+
 import { LOG } from 'stubs/log';
 import { generateListStub } from 'stubs/utils';
 import ActionBar from 'ui/shared/ActionBar';
@@ -11,28 +12,43 @@ import Pagination from 'ui/shared/pagination/Pagination';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import TxPendingAlert from 'ui/tx/TxPendingAlert';
 import TxSocketAlert from 'ui/tx/TxSocketAlert';
-import useFetchTxInfo from 'ui/tx/useFetchTxInfo';
 
-const TxLogs = () => {
-  const txInfo = useFetchTxInfo({ updateDelay: 5 * SECOND });
+import type { TxQuery } from './useTxQuery';
+
+interface Props {
+  txQuery: TxQuery;
+  logsFilter?: (log: Log) => boolean;
+}
+
+const TxLogs = ({ txQuery, logsFilter }: Props) => {
   const { data, isPlaceholderData, isError, pagination } = useQueryWithPages({
     resourceName: 'tx_logs',
-    pathParams: { hash: txInfo.data?.hash },
+    pathParams: { hash: txQuery.data?.hash },
     options: {
-      enabled: !txInfo.isPlaceholderData && Boolean(txInfo.data?.hash) && Boolean(txInfo.data?.status),
+      enabled: !txQuery.isPlaceholderData && Boolean(txQuery.data?.hash) && Boolean(txQuery.data?.status),
       placeholderData: generateListStub<'tx_logs'>(LOG, 3, { next_page_params: null }),
     },
   });
 
-  if (!txInfo.isPending && !txInfo.isPlaceholderData && !txInfo.isError && !txInfo.data.status) {
-    return txInfo.socketStatus ? <TxSocketAlert status={ txInfo.socketStatus }/> : <TxPendingAlert/>;
+  if (!txQuery.isPending && !txQuery.isPlaceholderData && !txQuery.isError && !txQuery.data.status) {
+    return txQuery.socketStatus ? <TxSocketAlert status={ txQuery.socketStatus }/> : <TxPendingAlert/>;
   }
 
-  if (isError || txInfo.isError) {
+  if (isError || txQuery.isError) {
     return <DataFetchAlert/>;
   }
 
-  if (!data?.items.length) {
+  let items: Array<Log> = [];
+
+  if (data?.items) {
+    if (isPlaceholderData) {
+      items = data?.items;
+    } else {
+      items = logsFilter ? data.items.filter(logsFilter) : data.items;
+    }
+  }
+
+  if (!items.length) {
     return <Text as="span">There are no logs for this transaction.</Text>;
   }
 
@@ -43,7 +59,7 @@ const TxLogs = () => {
           <Pagination ml="auto" { ...pagination }/>
         </ActionBar>
       ) }
-      { data?.items.map((item, index) => <LogItem key={ index } { ...item } type="transaction" isLoading={ isPlaceholderData }/>) }
+      { items.map((item, index) => <LogItem key={ index } { ...item } type="transaction" isLoading={ isPlaceholderData }/>) }
     </Box>
   );
 };
diff --git a/ui/tx/TxRawTrace.tsx b/ui/tx/TxRawTrace.tsx
index ec49b81e73..e3bcc1ee70 100644
--- a/ui/tx/TxRawTrace.tsx
+++ b/ui/tx/TxRawTrace.tsx
@@ -5,7 +5,6 @@ import type { SocketMessage } from 'lib/socket/types';
 import type { RawTracesResponse } from 'types/api/rawTrace';
 
 import useApiQuery from 'lib/api/useApiQuery';
-import { SECOND } from 'lib/consts';
 import getQueryParamString from 'lib/router/getQueryParamString';
 import useSocketChannel from 'lib/socket/useSocketChannel';
 import useSocketMessage from 'lib/socket/useSocketMessage';
@@ -14,19 +13,23 @@ import DataFetchAlert from 'ui/shared/DataFetchAlert';
 import RawDataSnippet from 'ui/shared/RawDataSnippet';
 import TxPendingAlert from 'ui/tx/TxPendingAlert';
 import TxSocketAlert from 'ui/tx/TxSocketAlert';
-import useFetchTxInfo from 'ui/tx/useFetchTxInfo';
 
-const TxRawTrace = () => {
+import type { TxQuery } from './useTxQuery';
+
+interface Props {
+  txQuery: TxQuery;
+}
+
+const TxRawTrace = ({ txQuery }: Props) => {
   const [ isQueryEnabled, setIsQueryEnabled ] = React.useState(false);
   const [ rawTraces, setRawTraces ] = React.useState<RawTracesResponse>();
   const router = useRouter();
   const hash = getQueryParamString(router.query.hash);
 
-  const txInfo = useFetchTxInfo({ updateDelay: 5 * SECOND });
   const { data, isPlaceholderData, isError } = useApiQuery('tx_raw_trace', {
     pathParams: { hash },
     queryOptions: {
-      enabled: Boolean(hash) && Boolean(txInfo.data?.status) && isQueryEnabled,
+      enabled: Boolean(hash) && Boolean(txQuery.data?.status) && isQueryEnabled,
       placeholderData: TX_RAW_TRACE,
     },
   });
@@ -39,7 +42,7 @@ const TxRawTrace = () => {
 
   const channel = useSocketChannel({
     topic: `transactions:${ hash }`,
-    isDisabled: !hash || txInfo.isPlaceholderData || !txInfo.data?.status,
+    isDisabled: !hash || txQuery.isPlaceholderData || !txQuery.data?.status,
     onJoin: enableQuery,
     onSocketError: enableQuery,
   });
@@ -49,11 +52,11 @@ const TxRawTrace = () => {
     handler: handleRawTraceMessage,
   });
 
-  if (!txInfo.isPending && !txInfo.isPlaceholderData && !txInfo.isError && !txInfo.data.status) {
-    return txInfo.socketStatus ? <TxSocketAlert status={ txInfo.socketStatus }/> : <TxPendingAlert/>;
+  if (!txQuery.isPending && !txQuery.isPlaceholderData && !txQuery.isError && !txQuery.data.status) {
+    return txQuery.socketStatus ? <TxSocketAlert status={ txQuery.socketStatus }/> : <TxPendingAlert/>;
   }
 
-  if (isError || txInfo.isError) {
+  if (isError || txQuery.isError) {
     return <DataFetchAlert/>;
   }
 
diff --git a/ui/tx/TxState.pw.tsx b/ui/tx/TxState.pw.tsx
index f04541edc3..9c65e1cd5d 100644
--- a/ui/tx/TxState.pw.tsx
+++ b/ui/tx/TxState.pw.tsx
@@ -7,8 +7,8 @@ import TestApp from 'playwright/TestApp';
 import buildApiUrl from 'playwright/utils/buildApiUrl';
 
 import TxState from './TxState';
+import type { TxQuery } from './useTxQuery';
 
-const TX_INFO_API_URL = buildApiUrl('tx', { hash: txMock.base.hash });
 const TX_STATE_API_URL = buildApiUrl('tx_state_changes', { hash: txMock.base.hash });
 const hooksConfig = {
   router: {
@@ -17,18 +17,20 @@ const hooksConfig = {
 };
 
 test('base view +@mobile', async({ mount, page }) => {
-  await page.route(TX_INFO_API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.base),
-  }));
   await page.route(TX_STATE_API_URL, (route) => route.fulfill({
     status: 200,
     body: JSON.stringify(txStateMock.baseResponse),
   }));
 
+  const txQuery = {
+    data: txMock.base,
+    isPlaceholderData: false,
+    isError: false,
+  } as TxQuery;
+
   const component = await mount(
     <TestApp>
-      <TxState/>
+      <TxState txQuery={ txQuery }/>
     </TestApp>,
     { hooksConfig },
   );
diff --git a/ui/tx/TxState.tsx b/ui/tx/TxState.tsx
index 61eff78451..c20b4e7a7d 100644
--- a/ui/tx/TxState.tsx
+++ b/ui/tx/TxState.tsx
@@ -1,7 +1,6 @@
 import { Accordion, Hide, Show, Text } from '@chakra-ui/react';
 import React from 'react';
 
-import { SECOND } from 'lib/consts';
 import { TX_STATE_CHANGES } from 'stubs/txStateChanges';
 import ActionBar from 'ui/shared/ActionBar';
 import DataListDisplay from 'ui/shared/DataListDisplay';
@@ -9,18 +8,21 @@ import Pagination from 'ui/shared/pagination/Pagination';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 import TxStateList from 'ui/tx/state/TxStateList';
 import TxStateTable from 'ui/tx/state/TxStateTable';
-import useFetchTxInfo from 'ui/tx/useFetchTxInfo';
 
 import TxPendingAlert from './TxPendingAlert';
 import TxSocketAlert from './TxSocketAlert';
+import type { TxQuery } from './useTxQuery';
 
-const TxState = () => {
-  const txInfo = useFetchTxInfo({ updateDelay: 5 * SECOND });
+interface Props {
+  txQuery: TxQuery;
+}
+
+const TxState = ({ txQuery }: Props) => {
   const { data, isPlaceholderData, isError, pagination } = useQueryWithPages({
     resourceName: 'tx_state_changes',
-    pathParams: { hash: txInfo.data?.hash },
+    pathParams: { hash: txQuery.data?.hash },
     options: {
-      enabled: !txInfo.isPlaceholderData && Boolean(txInfo.data?.hash) && Boolean(txInfo.data?.status),
+      enabled: !txQuery.isPlaceholderData && Boolean(txQuery.data?.hash) && Boolean(txQuery.data?.status),
       placeholderData: {
         items: TX_STATE_CHANGES,
         next_page_params: {
@@ -31,8 +33,8 @@ const TxState = () => {
     },
   });
 
-  if (!txInfo.isPending && !txInfo.isPlaceholderData && !txInfo.isError && !txInfo.data.status) {
-    return txInfo.socketStatus ? <TxSocketAlert status={ txInfo.socketStatus }/> : <TxPendingAlert/>;
+  if (!txQuery.isPending && !txQuery.isPlaceholderData && !txQuery.isError && !txQuery.data.status) {
+    return txQuery.socketStatus ? <TxSocketAlert status={ txQuery.socketStatus }/> : <TxPendingAlert/>;
   }
 
   const content = data ? (
@@ -54,12 +56,14 @@ const TxState = () => {
 
   return (
     <>
-      <Text mb={ 6 }>
-        A set of information that represents the current state is updated when a transaction takes place on the network.
-        The below is a summary of those changes.
-      </Text>
+      { !isError && !txQuery.isError && (
+        <Text mb={ 6 }>
+          A set of information that represents the current state is updated when a transaction takes place on the network.
+          The below is a summary of those changes.
+        </Text>
+      ) }
       <DataListDisplay
-        isError={ isError }
+        isError={ isError || txQuery.isError }
         items={ data?.items }
         emptyText="There are no state changes for this transaction."
         content={ content }
diff --git a/ui/tx/TxSubHeading.pw.tsx b/ui/tx/TxSubHeading.pw.tsx
index 39b4397b4e..93f51906fb 100644
--- a/ui/tx/TxSubHeading.pw.tsx
+++ b/ui/tx/TxSubHeading.pw.tsx
@@ -1,6 +1,7 @@
 import { test, expect } from '@playwright/experimental-ct-react';
 import React from 'react';
 
+import * as txMock from 'mocks/txs/tx';
 import { txInterpretation } from 'mocks/txs/txInterpretation';
 import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
 import TestApp from 'playwright/TestApp';
@@ -8,15 +9,22 @@ import buildApiUrl from 'playwright/utils/buildApiUrl';
 import * as configs from 'playwright/utils/configs';
 
 import TxSubHeading from './TxSubHeading';
+import type { TxQuery } from './useTxQuery';
 
 const hash = '0x62d597ebcf3e8d60096dd0363bc2f0f5e2df27ba1dacd696c51aa7c9409f3193';
 
 const TX_INTERPRETATION_API_URL = buildApiUrl('tx_interpretation', { hash });
 
+const txQuery = {
+  data: txMock.base,
+  isPlaceholderData: false,
+  isError: false,
+} as TxQuery;
+
 test('no interpretation +@mobile', async({ mount }) => {
   const component = await mount(
     <TestApp>
-      <TxSubHeading hash={ hash } hasTag={ false }/>
+      <TxSubHeading hash={ hash } hasTag={ false } txQuery={ txQuery }/>
     </TestApp>,
   );
 
@@ -36,7 +44,37 @@ bsInterpretationTest('with interpretation +@mobile +@dark-mode', async({ mount,
 
   const component = await mount(
     <TestApp>
-      <TxSubHeading hash={ hash } hasTag={ false }/>
+      <TxSubHeading hash={ hash } hasTag={ false } txQuery={ txQuery }/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
+
+bsInterpretationTest('with interpretation and view all link +@mobile', async({ mount, page }) => {
+  await page.route(TX_INTERPRETATION_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify({ data: { summaries: [ ...txInterpretation.data.summaries, ...txInterpretation.data.summaries ] } }),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <TxSubHeading hash={ hash } hasTag={ false } txQuery={ txQuery }/>
+    </TestApp>,
+  );
+
+  await expect(component).toHaveScreenshot();
+});
+
+bsInterpretationTest('no interpretation, has method called', async({ mount, page }) => {
+  await page.route(TX_INTERPRETATION_API_URL, (route) => route.fulfill({
+    status: 200,
+    body: JSON.stringify({ data: { summaries: [] } }),
+  }));
+
+  const component = await mount(
+    <TestApp>
+      <TxSubHeading hash={ hash } hasTag={ false } txQuery={ txQuery }/>
     </TestApp>,
   );
 
@@ -44,6 +82,11 @@ bsInterpretationTest('with interpretation +@mobile +@dark-mode', async({ mount,
 });
 
 bsInterpretationTest('no interpretation', async({ mount, page }) => {
+  const txPendingQuery = {
+    data: txMock.pending,
+    isPlaceholderData: false,
+    isError: false,
+  } as TxQuery;
   await page.route(TX_INTERPRETATION_API_URL, (route) => route.fulfill({
     status: 200,
     body: JSON.stringify({ data: { summaries: [] } }),
@@ -51,7 +94,7 @@ bsInterpretationTest('no interpretation', async({ mount, page }) => {
 
   const component = await mount(
     <TestApp>
-      <TxSubHeading hash={ hash } hasTag={ false }/>
+      <TxSubHeading hash={ hash } hasTag={ false } txQuery={ txPendingQuery }/>
     </TestApp>,
   );
 
diff --git a/ui/tx/TxSubHeading.tsx b/ui/tx/TxSubHeading.tsx
index 477aeddef6..7ee1336512 100644
--- a/ui/tx/TxSubHeading.tsx
+++ b/ui/tx/TxSubHeading.tsx
@@ -3,46 +3,111 @@ import React from 'react';
 
 import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';
+import { NOVES_TRANSLATE } from 'stubs/noves/NovesTranslate';
 import { TX_INTERPRETATION } from 'stubs/txInterpretation';
 import AccountActionsMenu from 'ui/shared/AccountActionsMenu/AccountActionsMenu';
+import { TX_ACTIONS_BLOCK_ID } from 'ui/shared/DetailsActionsWrapper';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
 import NetworkExplorers from 'ui/shared/NetworkExplorers';
-import { TX_ACTIONS_BLOCK_ID } from 'ui/tx/details/txDetailsActions/TxDetailsActionsWrapper';
-import TxInterpretation from 'ui/tx/interpretation/TxInterpretation';
+import TxInterpretation from 'ui/shared/tx/interpretation/TxInterpretation';
+
+import { createNovesSummaryObject } from './assetFlows/utils/createNovesSummaryObject';
+import type { TxQuery } from './useTxQuery';
 
 type Props = {
   hash?: string;
   hasTag: boolean;
+  txQuery: TxQuery;
 }
 
-const TxSubHeading = ({ hash, hasTag }: Props) => {
-  const hasInterpretationFeature = config.features.txInterpretation.isEnabled;
+const feature = config.features.txInterpretation;
+
+const TxSubHeading = ({ hash, hasTag, txQuery }: Props) => {
+  const hasInterpretationFeature = feature.isEnabled;
+  const isNovesInterpretation = hasInterpretationFeature && feature.provider === 'noves';
 
   const txInterpretationQuery = useApiQuery('tx_interpretation', {
     pathParams: { hash },
     queryOptions: {
-      enabled: Boolean(hash) && hasInterpretationFeature,
+      enabled: Boolean(hash) && (hasInterpretationFeature && !isNovesInterpretation),
       placeholderData: TX_INTERPRETATION,
     },
   });
 
-  const hasInterpretation = hasInterpretationFeature &&
+  const novesInterpretationQuery = useApiQuery('noves_transaction', {
+    pathParams: { hash },
+    queryOptions: {
+      enabled: Boolean(hash) && isNovesInterpretation,
+      placeholderData: NOVES_TRANSLATE,
+    },
+  });
+
+  const content = (() => {
+    const hasNovesInterpretation = isNovesInterpretation &&
+    (novesInterpretationQuery.isPlaceholderData || Boolean(novesInterpretationQuery.data?.classificationData.description));
+
+    const hasInternalInterpretation = (hasInterpretationFeature && !isNovesInterpretation) &&
     (txInterpretationQuery.isPlaceholderData || Boolean(txInterpretationQuery.data?.data.summaries.length));
 
-  return (
-    <Box display={{ base: 'block', lg: 'flex' }} alignItems="center" w="100%">
-      { hasInterpretation && (
+    const hasViewAllInterpretationsLink =
+      !txInterpretationQuery.isPlaceholderData && txInterpretationQuery.data?.data.summaries && txInterpretationQuery.data?.data.summaries.length > 1;
+
+    if (hasNovesInterpretation && novesInterpretationQuery.data) {
+      const novesSummary = createNovesSummaryObject(novesInterpretationQuery.data);
+
+      return (
+        <TxInterpretation
+          summary={ novesSummary }
+          isLoading={ novesInterpretationQuery.isPlaceholderData }
+          fontSize="lg"
+          mr={{ base: 0, lg: 6 }}
+        />
+      );
+    } else if (hasInternalInterpretation) {
+      return (
         <Flex mr={{ base: 0, lg: 6 }} flexWrap="wrap" alignItems="center">
           <TxInterpretation
             summary={ txInterpretationQuery.data?.data.summaries[0] }
             isLoading={ txInterpretationQuery.isPlaceholderData }
             fontSize="lg"
+            mr={ hasViewAllInterpretationsLink ? 3 : 0 }
           />
-          { !txInterpretationQuery.isPlaceholderData && txInterpretationQuery.data?.data.summaries && txInterpretationQuery.data?.data.summaries.length > 1 &&
-            <Link ml={ 3 } href={ `#${ TX_ACTIONS_BLOCK_ID }` }>all actions</Link> }
+          { hasViewAllInterpretationsLink &&
+          <Link href={ `#${ TX_ACTIONS_BLOCK_ID }` }>View all</Link> }
         </Flex>
-      ) }
-      { !hasInterpretation && <TxEntity hash={ hash } noLink noCopy={ false } fontWeight={ 500 } mr={{ base: 0, lg: 2 }} fontFamily="heading"/> }
+      );
+    } else if (hasInterpretationFeature && txQuery.data?.method && txQuery.data?.from && txQuery.data?.to) {
+      return (
+        <TxInterpretation
+          summary={{
+            summary_template: `{sender_hash} called {method} on {receiver_hash}`,
+            summary_template_variables: {
+              sender_hash: {
+                type: 'address',
+                value: txQuery.data.from,
+              },
+              method: {
+                type: 'method',
+                value: txQuery.data.method,
+              },
+              receiver_hash: {
+                type: 'address',
+                value: txQuery.data.to,
+              },
+            },
+          }}
+          isLoading={ txQuery.isPlaceholderData }
+          fontSize="lg"
+        />
+      );
+    } else {
+      return <TxEntity hash={ hash } noLink noCopy={ false } fontWeight={ 500 } mr={{ base: 0, lg: 2 }} fontFamily="heading"/>;
+    }
+  })();
+
+  return (
+    <Box display={{ base: 'block', lg: 'flex' }} alignItems="center" w="100%">
+      { content }
       <Flex alignItems="center" justifyContent={{ base: 'start', lg: 'space-between' }} flexGrow={ 1 }>
         { !hasTag && <AccountActionsMenu mr={ 3 } mt={{ base: 3, lg: 0 }}/> }
         <NetworkExplorers type="tx" pathParam={ hash } ml={{ base: 0, lg: 'auto' }} mt={{ base: 3, lg: 0 }}/>
diff --git a/ui/tx/TxTokenTransfer.tsx b/ui/tx/TxTokenTransfer.tsx
index 834b601ccf..e50ceda1cf 100644
--- a/ui/tx/TxTokenTransfer.tsx
+++ b/ui/tx/TxTokenTransfer.tsx
@@ -3,8 +3,8 @@ import { useRouter } from 'next/router';
 import React from 'react';
 
 import type { TokenType } from 'types/api/token';
+import type { TokenTransfer } from 'types/api/tokenTransfer';
 
-import { SECOND } from 'lib/consts';
 import getFilterValuesFromQuery from 'lib/getFilterValuesFromQuery';
 import { apos } from 'lib/html-entities';
 import { TOKEN_TYPE_IDS } from 'lib/token/tokenTypes';
@@ -19,22 +19,26 @@ import TokenTransferList from 'ui/shared/TokenTransfer/TokenTransferList';
 import TokenTransferTable from 'ui/shared/TokenTransfer/TokenTransferTable';
 import TxPendingAlert from 'ui/tx/TxPendingAlert';
 import TxSocketAlert from 'ui/tx/TxSocketAlert';
-import useFetchTxInfo from 'ui/tx/useFetchTxInfo';
+
+import type { TxQuery } from './useTxQuery';
 
 const getTokenFilterValue = (getFilterValuesFromQuery<TokenType>).bind(null, TOKEN_TYPE_IDS);
 
-const TxTokenTransfer = () => {
-  const txsInfo = useFetchTxInfo({ updateDelay: 5 * SECOND });
+interface Props {
+  txQuery: TxQuery;
+  tokenTransferFilter?: (data: TokenTransfer) => boolean;
+}
 
+const TxTokenTransfer = ({ txQuery, tokenTransferFilter }: Props) => {
   const router = useRouter();
 
   const [ typeFilter, setTypeFilter ] = React.useState<Array<TokenType>>(getTokenFilterValue(router.query.type) || []);
 
   const tokenTransferQuery = useQueryWithPages({
     resourceName: 'tx_token_transfers',
-    pathParams: { hash: txsInfo.data?.hash.toString() },
+    pathParams: { hash: txQuery.data?.hash.toString() },
     options: {
-      enabled: !txsInfo.isPlaceholderData && Boolean(txsInfo.data?.status && txsInfo.data?.hash),
+      enabled: !txQuery.isPlaceholderData && Boolean(txQuery.data?.status && txQuery.data?.hash),
       placeholderData: getTokenTransfersStub(),
     },
     filters: { type: typeFilter },
@@ -45,24 +49,34 @@ const TxTokenTransfer = () => {
     setTypeFilter(nextValue);
   }, [ tokenTransferQuery ]);
 
-  if (!txsInfo.isPending && !txsInfo.isPlaceholderData && !txsInfo.isError && !txsInfo.data.status) {
-    return txsInfo.socketStatus ? <TxSocketAlert status={ txsInfo.socketStatus }/> : <TxPendingAlert/>;
+  if (!txQuery.isPending && !txQuery.isPlaceholderData && !txQuery.isError && !txQuery.data.status) {
+    return txQuery.socketStatus ? <TxSocketAlert status={ txQuery.socketStatus }/> : <TxPendingAlert/>;
   }
 
-  if (txsInfo.isError || tokenTransferQuery.isError) {
+  if (txQuery.isError || tokenTransferQuery.isError) {
     return <DataFetchAlert/>;
   }
 
   const numActiveFilters = typeFilter.length;
   const isActionBarHidden = !numActiveFilters && !tokenTransferQuery.data?.items.length;
 
+  let items: Array<TokenTransfer> = [];
+
+  if (tokenTransferQuery.data?.items) {
+    if (tokenTransferQuery.isPlaceholderData) {
+      items = tokenTransferQuery.data?.items;
+    } else {
+      items = tokenTransferFilter ? tokenTransferQuery.data.items.filter(tokenTransferFilter) : tokenTransferQuery.data.items;
+    }
+  }
+
   const content = tokenTransferQuery.data?.items ? (
     <>
       <Hide below="lg" ssr={ false }>
-        <TokenTransferTable data={ tokenTransferQuery.data?.items } top={ isActionBarHidden ? 0 : 80 } isLoading={ tokenTransferQuery.isPlaceholderData }/>
+        <TokenTransferTable data={ items } top={ isActionBarHidden ? 0 : 80 } isLoading={ tokenTransferQuery.isPlaceholderData }/>
       </Hide>
       <Show below="lg" ssr={ false }>
-        <TokenTransferList data={ tokenTransferQuery.data?.items } isLoading={ tokenTransferQuery.isPlaceholderData }/>
+        <TokenTransferList data={ items } isLoading={ tokenTransferQuery.isPlaceholderData }/>
       </Show>
     </>
   ) : null;
@@ -81,8 +95,8 @@ const TxTokenTransfer = () => {
 
   return (
     <DataListDisplay
-      isError={ txsInfo.isError || tokenTransferQuery.isError }
-      items={ tokenTransferQuery.data?.items }
+      isError={ txQuery.isError || tokenTransferQuery.isError }
+      items={ items }
       emptyText="There are no token transfers."
       filterProps={{
         emptyFilteredText: `Couldn${ apos }t find any token transfer that matches your query.`,
diff --git a/ui/tx/TxUserOps.tsx b/ui/tx/TxUserOps.tsx
new file mode 100644
index 0000000000..33cc899f7d
--- /dev/null
+++ b/ui/tx/TxUserOps.tsx
@@ -0,0 +1,39 @@
+import React from 'react';
+
+import { USER_OPS_ITEM } from 'stubs/userOps';
+import { generateListStub } from 'stubs/utils';
+import DataFetchAlert from 'ui/shared/DataFetchAlert';
+import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
+import TxPendingAlert from 'ui/tx/TxPendingAlert';
+import TxSocketAlert from 'ui/tx/TxSocketAlert';
+import UserOpsContent from 'ui/userOps/UserOpsContent';
+
+import type { TxQuery } from './useTxQuery';
+
+interface Props {
+  txQuery: TxQuery;
+}
+
+const TxUserOps = ({ txQuery }: Props) => {
+  const userOpsQuery = useQueryWithPages({
+    resourceName: 'user_ops',
+    options: {
+      enabled: !txQuery.isPlaceholderData && Boolean(txQuery.data?.status && txQuery.data?.hash),
+      // most often there is only one user op in one tx
+      placeholderData: generateListStub<'user_ops'>(USER_OPS_ITEM, 1, { next_page_params: null }),
+    },
+    filters: { transaction_hash: txQuery.data?.hash },
+  });
+
+  if (!txQuery.isPending && !txQuery.isPlaceholderData && !txQuery.isError && !txQuery.data.status) {
+    return txQuery.socketStatus ? <TxSocketAlert status={ txQuery.socketStatus }/> : <TxPendingAlert/>;
+  }
+
+  if (txQuery.isError) {
+    return <DataFetchAlert/>;
+  }
+
+  return <UserOpsContent query={ userOpsQuery } showTx={ false }/>;
+};
+
+export default TxUserOps;
diff --git a/ui/tx/__screenshots__/TxBlobs.pw.tsx_default_base-view-mobile-1.png b/ui/tx/__screenshots__/TxBlobs.pw.tsx_default_base-view-mobile-1.png
new file mode 100644
index 0000000000..02a3b1808b
Binary files /dev/null and b/ui/tx/__screenshots__/TxBlobs.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxBlobs.pw.tsx_mobile_base-view-mobile-1.png b/ui/tx/__screenshots__/TxBlobs.pw.tsx_mobile_base-view-mobile-1.png
new file mode 100644
index 0000000000..a9b7d593dd
Binary files /dev/null and b/ui/tx/__screenshots__/TxBlobs.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_dark-color-mode_between-addresses-mobile-dark-mode-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_dark-color-mode_between-addresses-mobile-dark-mode-1.png
deleted file mode 100644
index 68ad19bf42..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_dark-color-mode_between-addresses-mobile-dark-mode-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_dark-color-mode_with-actions-uniswap-mobile-dark-mode-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_dark-color-mode_with-actions-uniswap-mobile-dark-mode-1.png
deleted file mode 100644
index e8d07d8ee0..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_dark-color-mode_with-actions-uniswap-mobile-dark-mode-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_between-addresses-mobile-dark-mode-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_between-addresses-mobile-dark-mode-1.png
deleted file mode 100644
index bfc23c2e9c..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_between-addresses-mobile-dark-mode-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_creating-contact-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_creating-contact-1.png
deleted file mode 100644
index 26a0a022d2..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_creating-contact-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_l2-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_l2-1.png
deleted file mode 100644
index dd560f465d..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_l2-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_pending-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_pending-1.png
deleted file mode 100644
index b8fd8b5594..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_pending-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_stability-customization-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_stability-customization-1.png
deleted file mode 100644
index 7f82ce728f..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_stability-customization-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-actions-uniswap-mobile-dark-mode-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-actions-uniswap-mobile-dark-mode-1.png
deleted file mode 100644
index 5e1108feca..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-actions-uniswap-mobile-dark-mode-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-decoded-raw-reason-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-decoded-raw-reason-1.png
deleted file mode 100644
index 952d53e5dc..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-decoded-raw-reason-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-decoded-revert-reason-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-decoded-revert-reason-1.png
deleted file mode 100644
index 8c62fbd45b..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-decoded-revert-reason-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-token-transfer-mobile-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-token-transfer-mobile-1.png
deleted file mode 100644
index 974f0373e8..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_with-token-transfer-mobile-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_without-testnet-warning-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_default_without-testnet-warning-1.png
deleted file mode 100644
index 48ac2733f9..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_default_without-testnet-warning-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_mobile_between-addresses-mobile-dark-mode-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_mobile_between-addresses-mobile-dark-mode-1.png
deleted file mode 100644
index d7b8988da4..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_mobile_between-addresses-mobile-dark-mode-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_mobile_with-actions-uniswap-mobile-dark-mode-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_mobile_with-actions-uniswap-mobile-dark-mode-1.png
deleted file mode 100644
index c04ced57cd..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_mobile_with-actions-uniswap-mobile-dark-mode-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxDetails.pw.tsx_mobile_with-token-transfer-mobile-1.png b/ui/tx/__screenshots__/TxDetails.pw.tsx_mobile_with-token-transfer-mobile-1.png
deleted file mode 100644
index 58863375dd..0000000000
Binary files a/ui/tx/__screenshots__/TxDetails.pw.tsx_mobile_with-token-transfer-mobile-1.png and /dev/null differ
diff --git a/ui/tx/__screenshots__/TxInternals.pw.tsx_default_base-view-mobile-1.png b/ui/tx/__screenshots__/TxInternals.pw.tsx_default_base-view-mobile-1.png
index 55b8612904..6edf2b297f 100644
Binary files a/ui/tx/__screenshots__/TxInternals.pw.tsx_default_base-view-mobile-1.png and b/ui/tx/__screenshots__/TxInternals.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxInternals.pw.tsx_mobile_base-view-mobile-1.png b/ui/tx/__screenshots__/TxInternals.pw.tsx_mobile_base-view-mobile-1.png
index 80d7e53681..ee76f592c7 100644
Binary files a/ui/tx/__screenshots__/TxInternals.pw.tsx_mobile_base-view-mobile-1.png and b/ui/tx/__screenshots__/TxInternals.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxState.pw.tsx_default_base-view-mobile-1.png b/ui/tx/__screenshots__/TxState.pw.tsx_default_base-view-mobile-1.png
index 722bff88a2..f3e85c4fa4 100644
Binary files a/ui/tx/__screenshots__/TxState.pw.tsx_default_base-view-mobile-1.png and b/ui/tx/__screenshots__/TxState.pw.tsx_default_base-view-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxState.pw.tsx_mobile_base-view-mobile-1.png b/ui/tx/__screenshots__/TxState.pw.tsx_mobile_base-view-mobile-1.png
index 08e60b899f..71988d6ce4 100644
Binary files a/ui/tx/__screenshots__/TxState.pw.tsx_mobile_base-view-mobile-1.png and b/ui/tx/__screenshots__/TxState.pw.tsx_mobile_base-view-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_dark-color-mode_with-interpretation-mobile-dark-mode-1.png b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_dark-color-mode_with-interpretation-mobile-dark-mode-1.png
index d207a60184..d87e1bcea8 100644
Binary files a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_dark-color-mode_with-interpretation-mobile-dark-mode-1.png and b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_dark-color-mode_with-interpretation-mobile-dark-mode-1.png differ
diff --git a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-1.png b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-1.png
index 86e1242778..218085ff3e 100644
Binary files a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-1.png and b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-1.png differ
diff --git a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-has-method-called-1.png b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-has-method-called-1.png
new file mode 100644
index 0000000000..9fb4c06b48
Binary files /dev/null and b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-has-method-called-1.png differ
diff --git a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-mobile-1.png b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-mobile-1.png
index 86e1242778..218085ff3e 100644
Binary files a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-mobile-1.png and b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_no-interpretation-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_with-interpretation-and-view-all-link-mobile-1.png b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_with-interpretation-and-view-all-link-mobile-1.png
new file mode 100644
index 0000000000..6660b6a1ad
Binary files /dev/null and b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_with-interpretation-and-view-all-link-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_with-interpretation-mobile-dark-mode-1.png b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_with-interpretation-mobile-dark-mode-1.png
index 69b55d642c..96cc6bf0d6 100644
Binary files a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_with-interpretation-mobile-dark-mode-1.png and b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_default_with-interpretation-mobile-dark-mode-1.png differ
diff --git a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_no-interpretation-mobile-1.png b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_no-interpretation-mobile-1.png
index c72dc3aacb..469001baf7 100644
Binary files a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_no-interpretation-mobile-1.png and b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_no-interpretation-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_with-interpretation-and-view-all-link-mobile-1.png b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_with-interpretation-and-view-all-link-mobile-1.png
new file mode 100644
index 0000000000..d2ab3aa40d
Binary files /dev/null and b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_with-interpretation-and-view-all-link-mobile-1.png differ
diff --git a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_with-interpretation-mobile-dark-mode-1.png b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_with-interpretation-mobile-dark-mode-1.png
index 4d0e85260a..aa2a6801ce 100644
Binary files a/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_with-interpretation-mobile-dark-mode-1.png and b/ui/tx/__screenshots__/TxSubHeading.pw.tsx_mobile_with-interpretation-mobile-dark-mode-1.png differ
diff --git a/ui/tx/assetFlows/TxAssetFlowsListItem.tsx b/ui/tx/assetFlows/TxAssetFlowsListItem.tsx
new file mode 100644
index 0000000000..9a9b491248
--- /dev/null
+++ b/ui/tx/assetFlows/TxAssetFlowsListItem.tsx
@@ -0,0 +1,46 @@
+import { Box, Skeleton, Text } from '@chakra-ui/react';
+import React from 'react';
+
+import IconSvg from 'ui/shared/IconSvg';
+import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
+import NovesFromTo from 'ui/shared/Noves/NovesFromTo';
+
+import NovesActionSnippet from './components/NovesActionSnippet';
+import type { NovesFlowViewItem } from './utils/generateFlowViewData';
+
+type Props = {
+  isPlaceholderData: boolean;
+  item: NovesFlowViewItem;
+};
+
+const TxAssetFlowsListItem = (props: Props) => {
+
+  return (
+    <ListItemMobile rowGap={ 4 } w="full" >
+      <Skeleton borderRadius="sm" isLoaded={ !props.isPlaceholderData } w="full">
+
+        <Box display="flex" >
+          <IconSvg
+            name="lightning"
+            height="5"
+            width="5"
+            color="text_secondary"
+          />
+
+          <Text fontSize="sm" fontWeight={ 500 }>
+            Action
+          </Text>
+        </Box>
+
+      </Skeleton>
+
+      <NovesActionSnippet item={ props.item } isLoaded={ !props.isPlaceholderData }/>
+
+      <Box maxW="full">
+        <NovesFromTo item={ props.item } isLoaded={ !props.isPlaceholderData }/>
+      </Box>
+    </ListItemMobile>
+  );
+};
+
+export default React.memo(TxAssetFlowsListItem);
diff --git a/ui/tx/assetFlows/TxAssetFlowsTableItem.tsx b/ui/tx/assetFlows/TxAssetFlowsTableItem.tsx
new file mode 100644
index 0000000000..0e2056b038
--- /dev/null
+++ b/ui/tx/assetFlows/TxAssetFlowsTableItem.tsx
@@ -0,0 +1,28 @@
+import { Td, Tr } from '@chakra-ui/react';
+import React from 'react';
+
+import NovesFromTo from 'ui/shared/Noves/NovesFromTo';
+
+import NovesActionSnippet from './components/NovesActionSnippet';
+import type { NovesFlowViewItem } from './utils/generateFlowViewData';
+
+type Props = {
+  isPlaceholderData: boolean;
+  item: NovesFlowViewItem;
+};
+
+const TxAssetFlowsTableItem = (props: Props) => {
+
+  return (
+    <Tr >
+      <Td px={ 3 } py={ 5 } fontSize="sm" borderColor="gray.200" _dark={{ borderColor: 'whiteAlpha.200' }}>
+        <NovesActionSnippet item={ props.item } isLoaded={ !props.isPlaceholderData }/>
+      </Td>
+      <Td px={ 3 } py="18px" fontSize="sm" borderColor="gray.200" _dark={{ borderColor: 'whiteAlpha.200' }}>
+        <NovesFromTo item={ props.item } isLoaded={ !props.isPlaceholderData }/>
+      </Td>
+    </Tr>
+  );
+};
+
+export default React.memo(TxAssetFlowsTableItem);
diff --git a/ui/tx/assetFlows/components/NovesActionSnippet.tsx b/ui/tx/assetFlows/components/NovesActionSnippet.tsx
new file mode 100644
index 0000000000..c1acc6b0db
--- /dev/null
+++ b/ui/tx/assetFlows/components/NovesActionSnippet.tsx
@@ -0,0 +1,116 @@
+import { Box, Hide, Popover, PopoverArrow, PopoverContent, PopoverTrigger, Show, Skeleton, Text, useColorModeValue } from '@chakra-ui/react';
+import type { FC } from 'react';
+import React from 'react';
+
+import { HEX_REGEXP } from 'lib/regexp';
+import TokenEntity from 'ui/shared/entities/token/TokenEntity';
+import IconSvg from 'ui/shared/IconSvg';
+
+import type { NovesFlowViewItem } from '../utils/generateFlowViewData';
+import NovesTokenTooltipContent from './NovesTokenTooltipContent';
+
+interface Props {
+  item: NovesFlowViewItem;
+  isLoaded: boolean;
+}
+
+const NovesActionSnippet: FC<Props> = ({ item, isLoaded }) => {
+  const popoverBg = useColorModeValue('gray.700', 'gray.300');
+
+  const token = React.useMemo(() => {
+    const action = item.action;
+
+    const name = action.nft?.name || action.token?.name;
+    const symbol = action.nft?.symbol || action.token?.symbol;
+
+    const token = {
+      name: name,
+      symbol: symbol?.toLowerCase() === name?.toLowerCase() ? undefined : symbol,
+      address: action.nft?.address || action.token?.address,
+    };
+
+    return token;
+  }, [ item.action ]);
+
+  const validTokenAddress = token.address ? HEX_REGEXP.test(token.address) : false;
+
+  return (
+    <Skeleton borderRadius="sm" isLoaded={ isLoaded }>
+      <Hide above="lg">
+        <Box display="flex" gap={ 2 } cursor="pointer" flexWrap="wrap">
+          <Text fontWeight="700" >
+            { item.action.label }
+          </Text>
+          <Text fontWeight="500">
+            { item.action.amount }
+          </Text>
+          <TokenEntity
+            token={ token }
+            noCopy
+            noSymbol
+            noLink={ !validTokenAddress }
+            fontWeight="500"
+            color="link"
+            w="fit-content"
+          />
+        </Box>
+      </Hide>
+      <Show above="lg">
+
+        <Popover
+          trigger="hover"
+          openDelay={ 50 }
+          closeDelay={ 50 }
+          arrowSize={ 15 }
+          arrowShadowColor="transparent"
+          placement="bottom"
+          flip={ false }
+        >
+          <PopoverTrigger>
+            <Box display="flex" gap={ 2 } cursor="pointer" w="fit-content" maxW="100%" alignItems="center">
+              <IconSvg
+                name="lightning"
+                height="5"
+                width="5"
+                color="gray.500"
+                _dark={{ color: 'gray.400' }}
+              />
+              <Text fontWeight="700" >
+                { item.action.label }
+              </Text>
+              <Text fontWeight="500">
+                { item.action.amount }
+              </Text>
+              <TokenEntity
+                token={ token }
+                noCopy
+                jointSymbol
+                noLink={ !validTokenAddress }
+                fontWeight="500"
+                color="link"
+                w="fit-content"
+              />
+            </Box>
+
+          </PopoverTrigger>
+          <PopoverContent
+            bg={ popoverBg }
+            shadow="lg"
+            width="fit-content"
+            zIndex="modal"
+            padding={ 2 }
+          >
+            <PopoverArrow bg={ popoverBg }/>
+
+            <NovesTokenTooltipContent
+              token={ item.action.token || item.action.nft }
+              amount={ item.action.amount }
+            />
+          </PopoverContent>
+        </Popover>
+      </Show>
+    </Skeleton>
+  );
+};
+
+export default React.memo(NovesActionSnippet);
diff --git a/ui/tx/assetFlows/components/NovesTokenTooltipContent.tsx b/ui/tx/assetFlows/components/NovesTokenTooltipContent.tsx
new file mode 100644
index 0000000000..f2bebb068c
--- /dev/null
+++ b/ui/tx/assetFlows/components/NovesTokenTooltipContent.tsx
@@ -0,0 +1,55 @@
+import { Box, Text, useColorModeValue } from '@chakra-ui/react';
+import type { FC } from 'react';
+import React from 'react';
+
+import type { NovesNft, NovesToken } from 'types/api/noves';
+
+import { HEX_REGEXP } from 'lib/regexp';
+import CopyToClipboard from 'ui/shared/CopyToClipboard';
+
+interface Props {
+  amount?: string;
+  token: NovesToken | NovesNft | undefined;
+}
+
+const NovesTokenTooltipContent: FC<Props> = ({ token, amount }) => {
+  const textColor = useColorModeValue('white', 'blackAlpha.900');
+
+  if (!token) {
+    return null;
+  }
+
+  const showTokenName = token.symbol !== token.name;
+  const showTokenAddress = HEX_REGEXP.test(token.address);
+
+  return (
+    <Box color={ textColor } display="flex" flexDir="column" alignItems="center" gap={ 1 }>
+      <Text as="p" color="inherit" fontWeight="600">
+        <Text color="inherit" as="span">
+          { amount }
+        </Text>
+        <Text color="inherit" as="span" ml={ 1 }>
+          { token.symbol }
+        </Text>
+      </Text>
+
+      { showTokenName && (
+        <Text as="p" color="inherit" fontWeight="600" mt="6px">
+          { token.name }
+        </Text>
+      ) }
+
+      { showTokenAddress && (
+        <Box display="flex" alignItems="center">
+          <Text color="inherit" fontWeight="400">
+            { token.address }
+          </Text>
+          <CopyToClipboard text={ token.address }/>
+        </Box>
+      ) }
+
+    </Box>
+  );
+};
+
+export default React.memo(NovesTokenTooltipContent);
diff --git a/ui/tx/assetFlows/utils/createNovesSummaryObject.test.ts b/ui/tx/assetFlows/utils/createNovesSummaryObject.test.ts
new file mode 100644
index 0000000000..35275d22bc
--- /dev/null
+++ b/ui/tx/assetFlows/utils/createNovesSummaryObject.test.ts
@@ -0,0 +1,20 @@
+import * as transactionMock from 'mocks/noves/transaction';
+
+import { createNovesSummaryObject } from './createNovesSummaryObject';
+
+it('creates interpretation summary object', async() => {
+  const result = createNovesSummaryObject(transactionMock.transaction);
+
+  expect(result).toEqual({
+    summary_template: ' Called function \'stake\' on contract{0xef326CdAdA59D3A740A76bB5f4F88Fb2}',
+    summary_template_variables: {
+      '0xef326CdAdA59D3A740A76bB5f4F88Fb2': {
+        type: 'address',
+        value: {
+          hash: '0xef326CdAdA59D3A740A76bB5f4F88Fb2f1076164',
+          is_contract: true,
+        },
+      },
+    },
+  });
+});
diff --git a/ui/tx/assetFlows/utils/createNovesSummaryObject.ts b/ui/tx/assetFlows/utils/createNovesSummaryObject.ts
new file mode 100644
index 0000000000..81c2e956f0
--- /dev/null
+++ b/ui/tx/assetFlows/utils/createNovesSummaryObject.ts
@@ -0,0 +1,139 @@
+import type { NovesResponseData } from 'types/api/noves';
+import type { TxInterpretationSummary } from 'types/api/txInterpretation';
+
+import { createAddressValues } from './getAddressValues';
+import type { NovesTokenInfo, TokensData } from './getTokensData';
+import { getTokensData } from './getTokensData';
+
+export interface SummaryAddress {
+  hash: string;
+  name?: string | null;
+  is_contract?: boolean;
+}
+
+export interface SummaryValues {
+  match: string;
+  value: NovesTokenInfo | SummaryAddress;
+  type: 'token' | 'address';
+}
+
+interface NovesSummary {
+  summary_template: string;
+  summary_template_variables: {[x: string]: unknown};
+}
+
+export const createNovesSummaryObject = (translateData: NovesResponseData) => {
+
+  // Remove final dot and add space at the start to avoid matching issues
+  const description = translateData.classificationData.description;
+  const removedFinalDot = description.endsWith('.') ? description.slice(0, description.length - 1) : description;
+  let parsedDescription = ' ' + removedFinalDot + ' ';
+  const tokenData = getTokensData(translateData);
+
+  const idsMatched = tokenData.idList.filter(id => parsedDescription.includes(`#${ id }`));
+  const tokensMatchedByName = tokenData.nameList.filter(name => parsedDescription.toUpperCase().includes(` ${ name.toUpperCase() }`));
+  let tokensMatchedBySymbol = tokenData.symbolList.filter(symbol => parsedDescription.toUpperCase().includes(` ${ symbol.toUpperCase() }`));
+
+  // Filter symbols if they're already matched by name
+  tokensMatchedBySymbol = tokensMatchedBySymbol.filter(symbol => !tokensMatchedByName.includes(tokenData.bySymbol[symbol]?.name || ''));
+
+  const summaryValues: Array<SummaryValues> = [];
+
+  if (idsMatched.length) {
+    parsedDescription = removeIds(tokensMatchedByName, tokensMatchedBySymbol, idsMatched, tokenData, parsedDescription);
+  }
+
+  if (tokensMatchedByName.length) {
+    const values = createTokensSummaryValues(tokensMatchedByName, tokenData.byName);
+    summaryValues.push(...values);
+  }
+
+  if (tokensMatchedBySymbol.length) {
+    const values = createTokensSummaryValues(tokensMatchedBySymbol, tokenData.bySymbol);
+    summaryValues.push(...values);
+  }
+
+  const addressSummaryValues = createAddressValues(translateData, parsedDescription);
+  if (addressSummaryValues.length) {
+    summaryValues.push(...addressSummaryValues);
+  }
+
+  return createSummaryTemplate(summaryValues, parsedDescription) as TxInterpretationSummary;
+};
+
+const removeIds = (
+  tokensMatchedByName: Array<string>,
+  tokensMatchedBySymbol: Array<string>,
+  idsMatched: Array<string>,
+  tokenData: TokensData,
+  parsedDescription: string,
+) => {
+  // Remove ids from the description since we already have that info in the token object
+  let description = parsedDescription;
+
+  tokensMatchedByName.forEach(name => {
+    const hasId = idsMatched.includes(tokenData.byName[name].id || '');
+    if (hasId) {
+      description = description.replaceAll(`#${ tokenData.byName[name].id }`, '');
+    }
+  });
+
+  tokensMatchedBySymbol.forEach(name => {
+    const hasId = idsMatched.includes(tokenData.bySymbol[name].id || '');
+    if (hasId) {
+      description = description.replaceAll(`#${ tokenData.bySymbol[name].id }`, '');
+    }
+  });
+
+  return description;
+};
+
+const createTokensSummaryValues = (
+  matchedStrings: Array<string>,
+  tokens: {
+    [x: string]: NovesTokenInfo;
+  },
+) => {
+  const summaryValues: Array<SummaryValues> = matchedStrings.map(match => ({
+    match,
+    type: 'token',
+    value: tokens[match],
+  }));
+
+  return summaryValues;
+};
+
+const createSummaryTemplate = (summaryValues: Array<SummaryValues | undefined>, parsedDescription: string) => {
+  let newDescription = parsedDescription;
+
+  const result: NovesSummary = {
+    summary_template: newDescription,
+    summary_template_variables: {},
+  };
+
+  if (!summaryValues[0]) {
+    return result;
+  }
+
+  const createTemplate = (data: SummaryValues, index = 0) => {
+    newDescription = newDescription.replaceAll(new RegExp(` ${ data.match } `, 'gi'), `{${ data.match }}`);
+
+    const variable = {
+      type: data.type,
+      value: data.value,
+    };
+
+    result.summary_template_variables[data.match] = variable;
+
+    const nextValue = summaryValues[index + 1];
+    if (nextValue) {
+      createTemplate(nextValue, index + 1);
+    }
+  };
+
+  createTemplate(summaryValues[0]);
+
+  result.summary_template = newDescription;
+
+  return result;
+};
diff --git a/ui/tx/assetFlows/utils/generateFlowViewData.test.ts b/ui/tx/assetFlows/utils/generateFlowViewData.test.ts
new file mode 100644
index 0000000000..0cbb2770dd
--- /dev/null
+++ b/ui/tx/assetFlows/utils/generateFlowViewData.test.ts
@@ -0,0 +1,48 @@
+import * as transactionMock from 'mocks/noves/transaction';
+
+import { generateFlowViewData } from './generateFlowViewData';
+
+it('creates asset flows items', async() => {
+  const result = generateFlowViewData(transactionMock.transaction);
+
+  expect(result).toEqual(
+    [
+      {
+        action: {
+          label: 'Sent',
+          amount: '3000',
+          flowDirection: 'toRight',
+          token: {
+            address: '0x1bfe4298796198f8664b18a98640cec7c89b5baa',
+            decimals: 18,
+            name: 'PQR-Test',
+            symbol: 'PQR',
+          },
+        },
+        rightActor: {
+          address: '0xdD15D2650387Fb6FEDE27ae7392C402a393F8A37',
+          name: null,
+        },
+        accountAddress: '0xef6595a423c99f3f2821190a4d96fce4dcd89a80',
+      },
+      {
+        action: {
+          label: 'Paid Gas',
+          amount: '0.000395521502109448',
+          flowDirection: 'toRight',
+          token: {
+            address: 'ETH',
+            decimals: 18,
+            name: 'ETH',
+            symbol: 'ETH',
+          },
+        },
+        rightActor: {
+          address: '',
+          name: 'Validators',
+        },
+        accountAddress: '0xef6595a423c99f3f2821190a4d96fce4dcd89a80',
+      },
+    ],
+  );
+});
diff --git a/ui/tx/assetFlows/utils/generateFlowViewData.ts b/ui/tx/assetFlows/utils/generateFlowViewData.ts
new file mode 100644
index 0000000000..9564c574d8
--- /dev/null
+++ b/ui/tx/assetFlows/utils/generateFlowViewData.ts
@@ -0,0 +1,76 @@
+import _ from 'lodash';
+
+import type { NovesNft, NovesResponseData, NovesSentReceived, NovesToken } from 'types/api/noves';
+
+export interface NovesAction {
+  label: string;
+  amount: string | undefined;
+  flowDirection: 'toLeft' | 'toRight';
+  nft: NovesNft | undefined;
+  token: NovesToken | undefined;
+}
+
+export interface NovesFlowViewItem {
+  action: NovesAction;
+  rightActor: {
+    address: string ;
+    name: string | null;
+  };
+  accountAddress: string;
+}
+
+export function generateFlowViewData(data: NovesResponseData): Array<NovesFlowViewItem> {
+  const perspectiveAddress = data.accountAddress.toLowerCase();
+
+  const sent = data.classificationData.sent || [];
+  const received = data.classificationData.received || [];
+
+  const txItems = [ ...sent, ...received ];
+
+  const paidGasIndex = _.findIndex(txItems, (item) => item.action === 'paidGas');
+  if (paidGasIndex >= 0) {
+    const element = txItems.splice(paidGasIndex, 1)[0];
+    element.to.name = 'Validators';
+    txItems.splice(txItems.length, 0, element);
+  }
+
+  const flowViewData = txItems.map((item) => {
+    const action = {
+      label: item.actionFormatted || item.action,
+      amount: item.amount || undefined,
+      flowDirection: getFlowDirection(item, perspectiveAddress),
+      nft: item.nft || undefined,
+      token: item.token || undefined,
+    };
+
+    if (item.from.name && item.from.name.includes('(this wallet)')) {
+      item.from.name = item.from.name.split('(this wallet)')[0];
+    }
+
+    if (item.to.name && item.to.name.includes('(this wallet)')) {
+      item.to.name = item.to.name.split('(this wallet)')[0];
+    }
+
+    const rightActor = getRightActor(item, perspectiveAddress);
+
+    return { action, rightActor, accountAddress: perspectiveAddress };
+  });
+
+  return flowViewData;
+}
+
+function getRightActor(item: NovesSentReceived, perspectiveAddress: string) {
+  if (!item.to.address || item.to.address.toLowerCase() !== perspectiveAddress) {
+    return { address: item.to.address || '', name: item.to.name };
+  }
+
+  return { address: item.from.address, name: item.from.name };
+}
+
+function getFlowDirection(item: NovesSentReceived, perspectiveAddress: string): 'toLeft' | 'toRight' {
+  if (item.from.address && item.from.address.toLowerCase() === perspectiveAddress) {
+    return 'toRight';
+  }
+
+  return 'toLeft';
+}
diff --git a/ui/tx/assetFlows/utils/getAddressValues.test.ts b/ui/tx/assetFlows/utils/getAddressValues.test.ts
new file mode 100644
index 0000000000..f911253cce
--- /dev/null
+++ b/ui/tx/assetFlows/utils/getAddressValues.test.ts
@@ -0,0 +1,18 @@
+import * as transactionMock from 'mocks/noves/transaction';
+
+import { createAddressValues } from './getAddressValues';
+
+it('creates addresses summary values', async() => {
+  const result = createAddressValues(transactionMock.transaction, transactionMock.transaction.classificationData.description);
+
+  expect(result).toEqual([
+    {
+      match: '0xef326CdAdA59D3A740A76bB5f4F88Fb2',
+      type: 'address',
+      value: {
+        hash: '0xef326CdAdA59D3A740A76bB5f4F88Fb2f1076164',
+        is_contract: true,
+      },
+    },
+  ]);
+});
diff --git a/ui/tx/assetFlows/utils/getAddressValues.ts b/ui/tx/assetFlows/utils/getAddressValues.ts
new file mode 100644
index 0000000000..9588a44392
--- /dev/null
+++ b/ui/tx/assetFlows/utils/getAddressValues.ts
@@ -0,0 +1,76 @@
+import type { NovesResponseData } from 'types/api/noves';
+
+import type { SummaryAddress, SummaryValues } from './createNovesSummaryObject';
+
+const ADDRESS_REGEXP = /(0x[\da-f]+\b)/gi;
+const CONTRACT_REGEXP = /(contract 0x[\da-f]+\b)/gi;
+
+export const createAddressValues = (translateData: NovesResponseData, description: string) => {
+  const addressMatches = description.match(ADDRESS_REGEXP);
+  const contractMatches = description.match(CONTRACT_REGEXP);
+
+  let descriptionAddresses: Array<string> = addressMatches ? addressMatches : [];
+  let contractAddresses: Array<string> = [];
+
+  if (contractMatches?.length) {
+    contractAddresses = contractMatches.map(text => text.split(ADDRESS_REGEXP)[1]);
+    descriptionAddresses = addressMatches?.filter(address => !contractAddresses.includes(address)) || [];
+  }
+
+  const addresses = extractAddresses(translateData);
+
+  const descriptionSummaryValues = createAddressSummaryValues(descriptionAddresses, addresses);
+  const contractSummaryValues = createAddressSummaryValues(contractAddresses, addresses, true);
+
+  const summaryValues = [ ...descriptionSummaryValues, ...contractSummaryValues ];
+
+  return summaryValues;
+};
+
+const createAddressSummaryValues = (descriptionAddresses: Array<string>, addresses: Array<SummaryAddress>, isContract = false) => {
+  const summaryValues: Array<SummaryValues | undefined> = descriptionAddresses.map(match => {
+    const address = addresses.find(address => address.hash.toUpperCase().startsWith(match.toUpperCase()));
+
+    if (!address) {
+      return undefined;
+    }
+
+    const value: SummaryValues = {
+      match: match,
+      type: 'address',
+      value: isContract ? { ...address, is_contract: true } : address,
+    };
+
+    return value;
+  });
+
+  return summaryValues.filter(value => value !== undefined) as Array<SummaryValues>;
+};
+
+function extractAddresses(data: NovesResponseData) {
+  const addressesSet: Set<{ hash: string | null; name?: string | null }> = new Set(); // Use a Set to store unique addresses
+
+  addressesSet.add({ hash: data.rawTransactionData.fromAddress });
+  addressesSet.add({ hash: data.rawTransactionData.toAddress });
+
+  if (data.classificationData.approved) {
+    addressesSet.add({ hash: data.classificationData.approved.spender });
+  }
+
+  if (data.txTypeVersion === 2) {
+    data.classificationData.sent.forEach((transaction) => {
+      addressesSet.add({ hash: transaction.from.address, name: transaction.from.name });
+      addressesSet.add({ hash: transaction.to.address, name: transaction.to.name });
+    });
+
+    data.classificationData.received.forEach((transaction) => {
+      addressesSet.add({ hash: transaction.from.address, name: transaction.from.name });
+      addressesSet.add({ hash: transaction.to.address, name: transaction.to.name });
+    });
+  }
+
+  const addresses = Array.from(addressesSet) as Array<{hash: string; name?: string}>; // Convert Set to an array
+
+  // Remove empty and null values
+  return addresses.filter(address => address.hash !== null && address.hash !== '');
+}
diff --git a/ui/tx/assetFlows/utils/getTokensData.test.ts b/ui/tx/assetFlows/utils/getTokensData.test.ts
new file mode 100644
index 0000000000..37124e000c
--- /dev/null
+++ b/ui/tx/assetFlows/utils/getTokensData.test.ts
@@ -0,0 +1,9 @@
+import * as transactionMock from 'mocks/noves/transaction';
+
+import { getTokensData } from './getTokensData';
+
+it('creates a tokens data object', async() => {
+  const result = getTokensData(transactionMock.transaction);
+
+  expect(result).toEqual(transactionMock.tokenData);
+});
diff --git a/ui/tx/assetFlows/utils/getTokensData.ts b/ui/tx/assetFlows/utils/getTokensData.ts
new file mode 100644
index 0000000000..2b14c9231c
--- /dev/null
+++ b/ui/tx/assetFlows/utils/getTokensData.ts
@@ -0,0 +1,80 @@
+import _ from 'lodash';
+
+import type { NovesResponseData } from 'types/api/noves';
+import type { TokenInfo } from 'types/api/token';
+
+import { HEX_REGEXP } from 'lib/regexp';
+
+export interface NovesTokenInfo extends Pick<TokenInfo, 'address' | 'name' | 'symbol'> {
+  id?: string | undefined;
+}
+
+export interface TokensData {
+  nameList: Array<string>;
+  symbolList: Array<string>;
+  idList: Array<string>;
+  byName: {
+    [x: string]: NovesTokenInfo;
+  };
+  bySymbol: {
+    [x: string]: NovesTokenInfo;
+  };
+}
+
+export function getTokensData(data: NovesResponseData): TokensData {
+  const sent = data.classificationData.sent || [];
+  const received = data.classificationData.received || [];
+  const approved = data.classificationData.approved ? [ data.classificationData.approved ] : [];
+
+  const txItems = [ ...sent, ...received, ...approved ];
+
+  // Extract all tokens data
+  const tokens = txItems.map((item) => {
+    const name = item.nft?.name || item.token?.name || null;
+    const symbol = item.nft?.symbol || item.token?.symbol || null;
+    const address = item.nft?.address || item.token?.address || '';
+
+    const validTokenAddress = address ? HEX_REGEXP.test(address) : false;
+
+    const token = {
+      name: name,
+      symbol: symbol?.toLowerCase() === name?.toLowerCase() ? null : symbol,
+      address: validTokenAddress ? address : '',
+      id: item.nft?.id || item.token?.id,
+    };
+
+    return token;
+  });
+
+  // Group tokens by property into arrays
+  const tokensGroupByname = _.groupBy(tokens, 'name');
+  const tokensGroupBySymbol = _.groupBy(tokens, 'symbol');
+  const tokensGroupById = _.groupBy(tokens, 'id');
+
+  // Map properties to an object and remove duplicates
+  const mappedNames = _.mapValues(tokensGroupByname, (i) => {
+    return i[0];
+  });
+
+  const mappedSymbols = _.mapValues(tokensGroupBySymbol, (i) => {
+    return i[0];
+  });
+
+  const mappedIds = _.mapValues(tokensGroupById, (i) => {
+    return i[0];
+  });
+
+  const filters = [ 'undefined', 'null' ];
+  // Array of keys to match in string
+  const nameList = _.keysIn(mappedNames).filter(i => !filters.includes(i));
+  const symbolList = _.keysIn(mappedSymbols).filter(i => !filters.includes(i));
+  const idList = _.keysIn(mappedIds).filter(i => !filters.includes(i));
+
+  return {
+    nameList,
+    symbolList,
+    idList,
+    byName: mappedNames,
+    bySymbol: mappedSymbols,
+  };
+}
diff --git a/ui/tx/blobs/TxBlobListItem.tsx b/ui/tx/blobs/TxBlobListItem.tsx
new file mode 100644
index 0000000000..e246d24b1a
--- /dev/null
+++ b/ui/tx/blobs/TxBlobListItem.tsx
@@ -0,0 +1,40 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { TxBlob } from 'types/api/blobs';
+
+import BlobDataType from 'ui/shared/blob/BlobDataType';
+import BlobEntity from 'ui/shared/entities/blob/BlobEntity';
+import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
+
+interface Props {
+  data: TxBlob;
+  isLoading?: boolean;
+}
+
+const TxBlobListItem = ({ data, isLoading }: Props) => {
+  const size = data.blob_data ? data.blob_data.replace('0x', '').length / 2 : '-';
+
+  return (
+    <ListItemMobileGrid.Container>
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Blob hash</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <BlobEntity hash={ data.hash } isLoading={ isLoading }/>
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Data type</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        { data.blob_data ? <BlobDataType isLoading={ isLoading } data={ data.blob_data }/> : '-' }
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Size, bytes</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <Skeleton isLoaded={ !isLoading }>
+          { size.toLocaleString() }
+        </Skeleton>
+      </ListItemMobileGrid.Value>
+    </ListItemMobileGrid.Container>
+  );
+};
+
+export default React.memo(TxBlobListItem);
diff --git a/ui/tx/blobs/TxBlobsList.tsx b/ui/tx/blobs/TxBlobsList.tsx
new file mode 100644
index 0000000000..29018039f6
--- /dev/null
+++ b/ui/tx/blobs/TxBlobsList.tsx
@@ -0,0 +1,22 @@
+import { Box } from '@chakra-ui/react';
+import React from 'react';
+
+import type { TxBlob } from 'types/api/blobs';
+
+import TxBlobListItem from './TxBlobListItem';
+
+const TxBlobList = ({ data, isLoading }: { data: Array<TxBlob>; isLoading?: boolean }) => {
+  return (
+    <Box>
+      { data.map((item, index) => (
+        <TxBlobListItem
+          key={ item.hash + (isLoading ? index : '') }
+          data={ item }
+          isLoading={ isLoading }
+        />
+      )) }
+    </Box>
+  );
+};
+
+export default TxBlobList;
diff --git a/ui/tx/blobs/TxBlobsTable.tsx b/ui/tx/blobs/TxBlobsTable.tsx
new file mode 100644
index 0000000000..5dc0cd28af
--- /dev/null
+++ b/ui/tx/blobs/TxBlobsTable.tsx
@@ -0,0 +1,36 @@
+import { Table, Tbody, Tr, Th } from '@chakra-ui/react';
+import React from 'react';
+
+import type { TxBlob } from 'types/api/blobs';
+
+import { default as Thead } from 'ui/shared/TheadSticky';
+
+import TxBlobsTableItem from './TxBlobsTableItem';
+
+interface Props {
+  data: Array<TxBlob>;
+  top: number;
+  isLoading?: boolean;
+}
+
+const TxInternalsTable = ({ data, top, isLoading }: Props) => {
+
+  return (
+    <Table variant="simple" size="sm">
+      <Thead top={ top }>
+        <Tr>
+          <Th width="60%">Blob hash</Th>
+          <Th width="20%">Data type</Th>
+          <Th width="20%">Size, bytes</Th>
+        </Tr>
+      </Thead>
+      <Tbody>
+        { data.map((item, index) => (
+          <TxBlobsTableItem key={ item.hash + (isLoading ? index : '') } data={ item } isLoading={ isLoading }/>
+        )) }
+      </Tbody>
+    </Table>
+  );
+};
+
+export default TxInternalsTable;
diff --git a/ui/tx/blobs/TxBlobsTableItem.tsx b/ui/tx/blobs/TxBlobsTableItem.tsx
new file mode 100644
index 0000000000..4c82a784dd
--- /dev/null
+++ b/ui/tx/blobs/TxBlobsTableItem.tsx
@@ -0,0 +1,34 @@
+import { Tr, Td, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { TxBlob } from 'types/api/blobs';
+
+import BlobDataType from 'ui/shared/blob/BlobDataType';
+import BlobEntity from 'ui/shared/entities/blob/BlobEntity';
+
+interface Props {
+  data: TxBlob;
+  isLoading?: boolean;
+}
+
+const TxBlobsTableItem = ({ data, isLoading }: Props) => {
+  const size = data.blob_data ? data.blob_data.replace('0x', '').length / 2 : '-';
+
+  return (
+    <Tr alignItems="top">
+      <Td>
+        <BlobEntity hash={ data.hash } noIcon isLoading={ isLoading }/>
+      </Td>
+      <Td verticalAlign="middle">
+        { data.blob_data ? <BlobDataType isLoading={ isLoading } data={ data.blob_data }/> : '-' }
+      </Td>
+      <Td verticalAlign="middle">
+        <Skeleton isLoaded={ !isLoading } display="inline-block">
+          { size.toLocaleString() }
+        </Skeleton>
+      </Td>
+    </Tr>
+  );
+};
+
+export default React.memo(TxBlobsTableItem);
diff --git a/ui/tx/details/TxDetailsBurntFees.tsx b/ui/tx/details/TxDetailsBurntFees.tsx
new file mode 100644
index 0000000000..dc613035c5
--- /dev/null
+++ b/ui/tx/details/TxDetailsBurntFees.tsx
@@ -0,0 +1,54 @@
+import BigNumber from 'bignumber.js';
+import React from 'react';
+
+import type { Transaction } from 'types/api/transaction';
+
+import config from 'configs/app';
+import { ZERO } from 'lib/consts';
+import { currencyUnits } from 'lib/units';
+import CurrencyValue from 'ui/shared/CurrencyValue';
+import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
+import IconSvg from 'ui/shared/IconSvg';
+
+const rollupFeature = config.features.rollup;
+
+interface Props {
+  data: Transaction;
+  isLoading?: boolean;
+}
+
+const TxDetailsBurntFees = ({ data, isLoading }: Props) => {
+
+  if (config.UI.views.tx.hiddenFields?.burnt_fees || (rollupFeature.isEnabled && rollupFeature.type === 'optimistic')) {
+    return null;
+  }
+
+  const value = BigNumber(data.tx_burnt_fee || 0).plus(BigNumber(data.blob_gas_used || 0).multipliedBy(BigNumber(data.blob_gas_price || 0)));
+
+  if (value.isEqualTo(ZERO)) {
+    return null;
+  }
+
+  return (
+    <DetailsInfoItem
+      title="Burnt fees"
+      hint={ `
+            Amount of ${ currencyUnits.ether } burned for this transaction. Equals Block Base Fee per Gas * Gas Used
+            ${ data.blob_gas_price && data.blob_gas_used ? ' + Blob Gas Price * Blob Gas Used' : '' }
+          ` }
+      isLoading={ isLoading }
+    >
+      <IconSvg name="flame" boxSize={ 5 } color="gray.500" isLoading={ isLoading }/>
+      <CurrencyValue
+        value={ value.toString() }
+        currency={ currencyUnits.ether }
+        exchangeRate={ data.exchange_rate }
+        flexWrap="wrap"
+        ml={ 2 }
+        isLoading={ isLoading }
+      />
+    </DetailsInfoItem>
+  );
+};
+
+export default React.memo(TxDetailsBurntFees);
diff --git a/ui/tx/details/TxDetailsFeePerGas.tsx b/ui/tx/details/TxDetailsFeePerGas.tsx
index fa20c03906..3cbe465e5b 100644
--- a/ui/tx/details/TxDetailsFeePerGas.tsx
+++ b/ui/tx/details/TxDetailsFeePerGas.tsx
@@ -3,6 +3,7 @@ import BigNumber from 'bignumber.js';
 import React from 'react';
 
 import config from 'configs/app';
+import { currencyUnits } from 'lib/units';
 import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
 
 interface Props {
@@ -24,7 +25,7 @@ const TxDetailsFeePerGas = ({ txFee, gasUsed, isLoading }: Props) => {
     >
       <Skeleton isLoaded={ !isLoading } mr={ 1 }>
         { BigNumber(txFee).dividedBy(10 ** config.chain.currency.decimals).dividedBy(gasUsed).toFixed() }
-        { config.UI.views.tx.hiddenFields?.fee_currency ? '' : ` ${ config.chain.currency.symbol }` }
+        { config.UI.views.tx.hiddenFields?.fee_currency ? '' : ` ${ currencyUnits.ether }` }
       </Skeleton>
     </DetailsInfoItem>
   );
diff --git a/ui/tx/details/TxDetailsGasPrice.tsx b/ui/tx/details/TxDetailsGasPrice.tsx
index 1cf50e595b..e27d2880a2 100644
--- a/ui/tx/details/TxDetailsGasPrice.tsx
+++ b/ui/tx/details/TxDetailsGasPrice.tsx
@@ -4,15 +4,16 @@ import React from 'react';
 
 import config from 'configs/app';
 import { WEI, WEI_IN_GWEI } from 'lib/consts';
+import { currencyUnits } from 'lib/units';
 import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
 
 interface Props {
-  gasPrice: string;
+  gasPrice: string | null;
   isLoading?: boolean;
 }
 
 const TxDetailsGasPrice = ({ gasPrice, isLoading }: Props) => {
-  if (config.UI.views.tx.hiddenFields?.gas_price) {
+  if (config.UI.views.tx.hiddenFields?.gas_price || !gasPrice) {
     return null;
   }
 
@@ -23,10 +24,10 @@ const TxDetailsGasPrice = ({ gasPrice, isLoading }: Props) => {
       isLoading={ isLoading }
     >
       <Skeleton isLoaded={ !isLoading } mr={ 1 }>
-        { BigNumber(gasPrice).dividedBy(WEI).toFixed() } { config.chain.currency.symbol }
+        { BigNumber(gasPrice).dividedBy(WEI).toFixed() } { currencyUnits.ether }
       </Skeleton>
       <Skeleton isLoaded={ !isLoading } color="text_secondary">
-        <span>({ BigNumber(gasPrice).dividedBy(WEI_IN_GWEI).toFixed() } Gwei)</span>
+        <span>({ BigNumber(gasPrice).dividedBy(WEI_IN_GWEI).toFixed() } { currencyUnits.gwei })</span>
       </Skeleton>
     </DetailsInfoItem>
   );
diff --git a/ui/tx/details/TxDetailsOther.tsx b/ui/tx/details/TxDetailsOther.tsx
index 97f5d4114a..2ca2450978 100644
--- a/ui/tx/details/TxDetailsOther.tsx
+++ b/ui/tx/details/TxDetailsOther.tsx
@@ -21,6 +21,7 @@ const TxDetailsOther = ({ nonce, type, position }: Props) => {
               <Text as="span" fontWeight="500">Txn type: </Text>
               <Text fontWeight="600" as="span">{ type }</Text>
               { type === 2 && <Text fontWeight="400" as="span" ml={ 1 } variant="secondary">(EIP-1559)</Text> }
+              { type === 3 && <Text fontWeight="400" as="span" ml={ 1 } variant="secondary">(EIP-4844)</Text> }
             </Box>
           ),
           <Box key="nonce">
diff --git a/ui/tx/details/TxDetailsTokenTransfer.tsx b/ui/tx/details/TxDetailsTokenTransfer.tsx
index 6a1c71e342..4307b77ab8 100644
--- a/ui/tx/details/TxDetailsTokenTransfer.tsx
+++ b/ui/tx/details/TxDetailsTokenTransfer.tsx
@@ -1,12 +1,17 @@
 import { Flex, chakra } from '@chakra-ui/react';
 import React from 'react';
 
-import type { TokenTransfer as TTokenTransfer, Erc20TotalPayload, Erc721TotalPayload, Erc1155TotalPayload } from 'types/api/tokenTransfer';
+import type {
+  TokenTransfer as TTokenTransfer,
+  Erc20TotalPayload,
+  Erc721TotalPayload,
+  Erc1155TotalPayload,
+  Erc404TotalPayload,
+} from 'types/api/tokenTransfer';
 
 import getCurrencyValue from 'lib/getCurrencyValue';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import TokenEntity from 'ui/shared/entities/token/TokenEntity';
-import IconSvg from 'ui/shared/IconSvg';
 import NftTokenTransferSnippet from 'ui/tx/NftTokenTransferSnippet';
 
 interface Props {
@@ -27,7 +32,7 @@ const TxDetailsTokenTransfer = ({ data }: Props) => {
         });
 
         return (
-          <Flex flexWrap="wrap" columnGap={ 2 } rowGap={ 2 }>
+          <>
             <chakra.span color="text_secondary">for</chakra.span>
             <span>{ valueStr }</span>
             <TokenEntity
@@ -37,7 +42,7 @@ const TxDetailsTokenTransfer = ({ data }: Props) => {
               w="auto"
             />
             { usd && <chakra.span color="text_secondary">(${ usd })</chakra.span> }
-          </Flex>
+          </>
         );
       }
 
@@ -63,26 +68,41 @@ const TxDetailsTokenTransfer = ({ data }: Props) => {
           />
         );
       }
+
+      case 'ERC-404': {
+        const total = data.total as Erc404TotalPayload;
+        return (
+          <NftTokenTransferSnippet
+            token={ data.token }
+            tokenId={ 'token_id' in total ? total.token_id : null }
+            value={ 'value' in total && total.value ?
+              getCurrencyValue({ value: total.value, decimals: total.decimals || '0', accuracy: 2 }).valueStr :
+              '1'
+            }
+          />
+        );
+      }
     }
   })();
 
   return (
     <Flex
       alignItems="flex-start"
-      flexWrap={{ base: 'wrap', lg: 'nowrap' }}
+      flexWrap="wrap"
       columnGap={ 2 }
       rowGap={ 3 }
       flexDir="row"
       w="100%"
+      fontWeight={ 500 }
     >
-      <Flex alignItems="center" fontWeight="500">
-        <AddressEntity address={ data.from } truncation="constant" noIcon maxW="150px"/>
-        <IconSvg name="arrows/east" boxSize={ 5 } mx={ 2 } color="gray.500"/>
-        <AddressEntity address={ data.to } truncation="constant" noIcon maxW="150px"/>
-      </Flex>
-      <Flex flexDir="column" rowGap={ 5 } w="100%" overflow="hidden" fontWeight={ 500 }>
-        { content }
-      </Flex>
+      <AddressFromTo
+        from={ data.from }
+        to={ data.to }
+        truncation="constant"
+        noIcon
+        fontWeight="500"
+      />
+      { content }
     </Flex>
   );
 };
diff --git a/ui/tx/details/TxDetailsWithdrawalStatus.pw.tsx b/ui/tx/details/TxDetailsWithdrawalStatus.pw.tsx
index 586c0bdfc3..b4cc8c6171 100644
--- a/ui/tx/details/TxDetailsWithdrawalStatus.pw.tsx
+++ b/ui/tx/details/TxDetailsWithdrawalStatus.pw.tsx
@@ -1,7 +1,8 @@
+import { Box } from '@chakra-ui/react';
 import { test as base, expect } from '@playwright/experimental-ct-react';
 import React from 'react';
 
-import type { L2WithdrawalStatus } from 'types/api/l2Withdrawals';
+import type { OptimisticL2WithdrawalStatus } from 'types/api/optimisticL2';
 
 import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
 import TestApp from 'playwright/TestApp';
@@ -9,7 +10,7 @@ import * as configs from 'playwright/utils/configs';
 
 import TxDetailsWithdrawalStatus from './TxDetailsWithdrawalStatus';
 
-const statuses: Array<L2WithdrawalStatus> = [
+const statuses: Array<OptimisticL2WithdrawalStatus> = [
   'Waiting for state root',
   'Ready for relay',
   'Relayed',
@@ -25,7 +26,9 @@ statuses.forEach((status) => {
 
     const component = await mount(
       <TestApp>
-        <TxDetailsWithdrawalStatus status={ status } l1TxHash="0x7d93a59a228e97d084a635181c3053e324237d07566ec12287eae6da2bcf9456"/>
+        <Box p={ 2 }>
+          <TxDetailsWithdrawalStatus status={ status } l1TxHash="0x7d93a59a228e97d084a635181c3053e324237d07566ec12287eae6da2bcf9456"/>
+        </Box>
       </TestApp>,
     );
 
diff --git a/ui/tx/details/TxDetailsWithdrawalStatus.tsx b/ui/tx/details/TxDetailsWithdrawalStatus.tsx
index 5bc99d8cbb..b2b7c88ce4 100644
--- a/ui/tx/details/TxDetailsWithdrawalStatus.tsx
+++ b/ui/tx/details/TxDetailsWithdrawalStatus.tsx
@@ -1,24 +1,18 @@
 import { Button } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2WithdrawalStatus } from 'types/api/l2Withdrawals';
-import { WITHDRAWAL_STATUSES } from 'types/api/l2Withdrawals';
+import type { OptimisticL2WithdrawalStatus } from 'types/api/optimisticL2';
+import { WITHDRAWAL_STATUSES } from 'types/api/optimisticL2';
 
-import config from 'configs/app';
-import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 import VerificationSteps from 'ui/shared/verificationSteps/VerificationSteps';
 
 interface Props {
-  status: L2WithdrawalStatus | undefined;
+  status: OptimisticL2WithdrawalStatus | undefined;
   l1TxHash: string | undefined;
 }
 
 const TxDetailsWithdrawalStatus = ({ status, l1TxHash }: Props) => {
-  if (!config.features.optimisticRollup.isEnabled) {
-    return null;
-  }
-
   if (!status || !WITHDRAWAL_STATUSES.includes(status)) {
     return null;
   }
@@ -55,23 +49,18 @@ const TxDetailsWithdrawalStatus = ({ status, l1TxHash }: Props) => {
       href="https://app.optimism.io/bridge/withdraw"
       target="_blank"
     >
-            Claim funds
+      Claim funds
     </Button>
   ) : null;
 
   return (
-    <DetailsInfoItem
-      title="Withdrawal status"
-      hint="Detailed status progress of the transaction"
-    >
-      <VerificationSteps
-        steps={ steps as unknown as Array<L2WithdrawalStatus> }
-        currentStep={ status }
-        rightSlot={ rightSlot }
-        my={ hasClaimButton ? '-6px' : 0 }
-        lineHeight={ hasClaimButton ? 8 : undefined }
-      />
-    </DetailsInfoItem>
+    <VerificationSteps
+      steps={ steps as unknown as Array<OptimisticL2WithdrawalStatus> }
+      currentStep={ status }
+      rightSlot={ rightSlot }
+      my={ hasClaimButton ? '-6px' : 0 }
+      lineHeight={ hasClaimButton ? 8 : undefined }
+    />
   );
 };
 
diff --git a/ui/tx/TxDetails.pw.tsx b/ui/tx/details/TxInfo.pw.tsx
similarity index 71%
rename from ui/tx/TxDetails.pw.tsx
rename to ui/tx/details/TxInfo.pw.tsx
index 2c59d2a55c..3a81c773d7 100644
--- a/ui/tx/TxDetails.pw.tsx
+++ b/ui/tx/details/TxInfo.pw.tsx
@@ -4,12 +4,10 @@ import React from 'react';
 import * as txMock from 'mocks/txs/tx';
 import contextWithEnvs from 'playwright/fixtures/contextWithEnvs';
 import TestApp from 'playwright/TestApp';
-import buildApiUrl from 'playwright/utils/buildApiUrl';
 import * as configs from 'playwright/utils/configs';
 
-import TxDetails from './TxDetails';
+import TxInfo from './TxInfo';
 
-const API_URL = buildApiUrl('tx', { hash: '1' });
 const hooksConfig = {
   router: {
     query: { hash: 1 },
@@ -17,14 +15,9 @@ const hooksConfig = {
 };
 
 test('between addresses +@mobile +@dark-mode', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.base),
-  }));
-
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.base } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
@@ -38,14 +31,9 @@ test('between addresses +@mobile +@dark-mode', async({ mount, page }) => {
 });
 
 test('creating contact', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.withContractCreation),
-  }));
-
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.withContractCreation } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
@@ -57,14 +45,9 @@ test('creating contact', async({ mount, page }) => {
 });
 
 test('with token transfer +@mobile', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.withTokenTransfer),
-  }));
-
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.withTokenTransfer } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
@@ -76,14 +59,9 @@ test('with token transfer +@mobile', async({ mount, page }) => {
 });
 
 test('with decoded revert reason', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.withDecodedRevertReason),
-  }));
-
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.withDecodedRevertReason } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
@@ -95,14 +73,9 @@ test('with decoded revert reason', async({ mount, page }) => {
 });
 
 test('with decoded raw reason', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.withRawRevertReason),
-  }));
-
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.withRawRevertReason } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
@@ -114,14 +87,9 @@ test('with decoded raw reason', async({ mount, page }) => {
 });
 
 test('pending', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.pending),
-  }));
-
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.pending } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
@@ -135,18 +103,29 @@ test('pending', async({ mount, page }) => {
 });
 
 test('with actions uniswap +@mobile +@dark-mode', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.withActionsUniswap),
-  }));
+  const component = await mount(
+    <TestApp>
+      <TxInfo data={ txMock.withActionsUniswap } isLoading={ false }/>
+    </TestApp>,
+    { hooksConfig },
+  );
 
+  await expect(component).toHaveScreenshot({
+    mask: [ page.locator(configs.adsBannerSelector) ],
+    maskColor: configs.maskColor,
+  });
+});
+
+test('with blob', async({ mount, page }) => {
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.withBlob } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
 
+  await page.getByText('View details').click();
+
   await expect(component).toHaveScreenshot({
     mask: [ page.locator(configs.adsBannerSelector) ],
     maskColor: configs.maskColor,
@@ -159,14 +138,9 @@ const l2Test = test.extend({
 });
 
 l2Test('l2', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.l2tx),
-  }));
-
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.l2tx } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
@@ -185,14 +159,9 @@ const mainnetTest = test.extend({
 });
 
 mainnetTest('without testnet warning', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.l2tx),
-  }));
-
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.l2tx } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
@@ -209,14 +178,9 @@ const stabilityTest = test.extend({
 });
 
 stabilityTest('stability customization', async({ mount, page }) => {
-  await page.route(API_URL, (route) => route.fulfill({
-    status: 200,
-    body: JSON.stringify(txMock.stabilityTx),
-  }));
-
   const component = await mount(
     <TestApp>
-      <TxDetails/>
+      <TxInfo data={ txMock.stabilityTx } isLoading={ false }/>
     </TestApp>,
     { hooksConfig },
   );
diff --git a/ui/tx/details/TxInfo.tsx b/ui/tx/details/TxInfo.tsx
new file mode 100644
index 0000000000..f038a278a8
--- /dev/null
+++ b/ui/tx/details/TxInfo.tsx
@@ -0,0 +1,603 @@
+import {
+  Box,
+  Grid,
+  GridItem,
+  Text,
+  Link,
+  Spinner,
+  Flex,
+  Tooltip,
+  chakra,
+  useColorModeValue,
+  Skeleton,
+} from '@chakra-ui/react';
+import BigNumber from 'bignumber.js';
+import React from 'react';
+import { scroller, Element } from 'react-scroll';
+
+import type { Transaction } from 'types/api/transaction';
+import { ZKEVM_L2_TX_STATUSES } from 'types/api/transaction';
+import { ZKSYNC_L2_TX_BATCH_STATUSES } from 'types/api/zkSyncL2';
+
+import { route } from 'nextjs-routes';
+
+import config from 'configs/app';
+import { WEI, WEI_IN_GWEI } from 'lib/consts';
+import getNetworkValidatorTitle from 'lib/networks/getNetworkValidatorTitle';
+import getConfirmationDuration from 'lib/tx/getConfirmationDuration';
+import { currencyUnits } from 'lib/units';
+import Tag from 'ui/shared/chakra/Tag';
+import CopyToClipboard from 'ui/shared/CopyToClipboard';
+import CurrencyValue from 'ui/shared/CurrencyValue';
+import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
+import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
+import DetailsSponsoredItem from 'ui/shared/DetailsSponsoredItem';
+import DetailsTimestamp from 'ui/shared/DetailsTimestamp';
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import BatchEntityL2 from 'ui/shared/entities/block/BatchEntityL2';
+import BlockEntity from 'ui/shared/entities/block/BlockEntity';
+import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
+import IconSvg from 'ui/shared/IconSvg';
+import LogDecodedInputData from 'ui/shared/logs/LogDecodedInputData';
+import RawInputData from 'ui/shared/RawInputData';
+import TxStatus from 'ui/shared/statusTag/TxStatus';
+import TextSeparator from 'ui/shared/TextSeparator';
+import TxFeeStability from 'ui/shared/tx/TxFeeStability';
+import Utilization from 'ui/shared/Utilization/Utilization';
+import VerificationSteps from 'ui/shared/verificationSteps/VerificationSteps';
+import TxDetailsActions from 'ui/tx/details/txDetailsActions/TxDetailsActions';
+import TxDetailsBurntFees from 'ui/tx/details/TxDetailsBurntFees';
+import TxDetailsFeePerGas from 'ui/tx/details/TxDetailsFeePerGas';
+import TxDetailsGasPrice from 'ui/tx/details/TxDetailsGasPrice';
+import TxDetailsOther from 'ui/tx/details/TxDetailsOther';
+import TxDetailsTokenTransfers from 'ui/tx/details/TxDetailsTokenTransfers';
+import TxDetailsWithdrawalStatus from 'ui/tx/details/TxDetailsWithdrawalStatus';
+import TxRevertReason from 'ui/tx/details/TxRevertReason';
+import TxAllowedPeekers from 'ui/tx/TxAllowedPeekers';
+import TxSocketAlert from 'ui/tx/TxSocketAlert';
+import ZkSyncL2TxnBatchHashesInfo from 'ui/txnBatches/zkSyncL2/ZkSyncL2TxnBatchHashesInfo';
+
+const rollupFeature = config.features.rollup;
+
+interface Props {
+  data: Transaction | undefined;
+  isLoading: boolean;
+  socketStatus?: 'close' | 'error';
+}
+
+const TxInfo = ({ data, isLoading, socketStatus }: Props) => {
+  const [ isExpanded, setIsExpanded ] = React.useState(false);
+
+  const handleCutClick = React.useCallback(() => {
+    setIsExpanded((flag) => !flag);
+    scroller.scrollTo('TxInfo__cutLink', {
+      duration: 500,
+      smooth: true,
+    });
+  }, []);
+  const executionSuccessIconColor = useColorModeValue('blackAlpha.800', 'whiteAlpha.800');
+
+  if (!data) {
+    return null;
+  }
+
+  const addressFromTags = [
+    ...data.from.private_tags || [],
+    ...data.from.public_tags || [],
+    ...data.from.watchlist_names || [],
+  ].map((tag) => <Tag key={ tag.label }>{ tag.display_name }</Tag>);
+
+  const toAddress = data.to ? data.to : data.created_contract;
+  const addressToTags = [
+    ...toAddress?.private_tags || [],
+    ...toAddress?.public_tags || [],
+    ...toAddress?.watchlist_names || [],
+  ].map((tag) => <Tag key={ tag.label }>{ tag.display_name }</Tag>);
+
+  const executionSuccessBadge = toAddress?.is_contract && data.result === 'success' ? (
+    <Tooltip label="Contract execution completed">
+      <chakra.span display="inline-flex" ml={ 2 } mr={ 1 }>
+        <IconSvg name="status/success" boxSize={ 4 } color={ executionSuccessIconColor } cursor="pointer"/>
+      </chakra.span>
+    </Tooltip>
+  ) : null;
+  const executionFailedBadge = toAddress?.is_contract && Boolean(data.status) && data.result !== 'success' ? (
+    <Tooltip label="Error occurred during contract execution">
+      <chakra.span display="inline-flex" ml={ 2 } mr={ 1 }>
+        <IconSvg name="status/error" boxSize={ 4 } color="error" cursor="pointer"/>
+      </chakra.span>
+    </Tooltip>
+  ) : null;
+
+  return (
+    <Grid columnGap={ 8 } rowGap={{ base: 3, lg: 3 }} templateColumns={{ base: 'minmax(0, 1fr)', lg: 'max-content minmax(728px, auto)' }}>
+
+      { config.features.metasuites.isEnabled && (
+        <>
+          <Box display="none" id="meta-suites__tx-info-label" data-status={ data.status } data-ready={ !isLoading }/>
+          <Box display="none" id="meta-suites__tx-info-value"/>
+          <DetailsInfoItemDivider display="none" id="meta-suites__details-info-item-divider"/>
+        </>
+      ) }
+
+      { socketStatus && (
+        <GridItem colSpan={{ base: undefined, lg: 2 }} mb={ 2 }>
+          <TxSocketAlert status={ socketStatus }/>
+        </GridItem>
+      ) }
+      <DetailsInfoItem
+        title="Transaction hash"
+        hint="Unique character string (TxID) assigned to every verified transaction"
+        flexWrap="nowrap"
+        isLoading={ isLoading }
+      >
+        { data.status === null && <Spinner mr={ 2 } size="sm" flexShrink={ 0 }/> }
+        <Skeleton isLoaded={ !isLoading } overflow="hidden">
+          <HashStringShortenDynamic hash={ data.hash }/>
+        </Skeleton>
+        <CopyToClipboard text={ data.hash } isLoading={ isLoading }/>
+
+        { config.features.metasuites.isEnabled && (
+          <>
+            <TextSeparator color="gray.500" flexShrink={ 0 } display="none" id="meta-suites__tx-explorer-separator"/>
+            <Box display="none" flexShrink={ 0 } id="meta-suites__tx-explorer-link"/>
+          </>
+        ) }
+      </DetailsInfoItem>
+      <DetailsInfoItem
+        title={
+          rollupFeature.isEnabled && (rollupFeature.type === 'zkEvm' || rollupFeature.type === 'zkSync') ?
+            'L2 status and method' :
+            'Status and method'
+        }
+        hint="Current transaction state: Success, Failed (Error), or Pending (In Process)"
+        isLoading={ isLoading }
+      >
+        <TxStatus status={ data.status } errorText={ data.status === 'error' ? data.result : undefined } isLoading={ isLoading }/>
+        { data.method && (
+          <Tag colorScheme={ data.method === 'Multicall' ? 'teal' : 'gray' } isLoading={ isLoading } isTruncated ml={ 3 }>
+            { data.method }
+          </Tag>
+        ) }
+      </DetailsInfoItem>
+      { rollupFeature.isEnabled && rollupFeature.type === 'optimistic' && data.op_withdrawals && data.op_withdrawals.length > 0 && (
+        <DetailsInfoItem
+          title="Withdrawal status"
+          hint="Detailed status progress of the transaction"
+        >
+          <Flex flexDir="column" rowGap={ 2 }>
+            { data.op_withdrawals.map((withdrawal) => (
+              <Box key={ withdrawal.nonce }>
+                <Box mb={ 2 }>
+                  <span>Nonce: </span>
+                  <chakra.span fontWeight={ 600 }>{ withdrawal.nonce }</chakra.span>
+                </Box>
+                <TxDetailsWithdrawalStatus
+                  status={ withdrawal.status }
+                  l1TxHash={ withdrawal.l1_transaction_hash }
+                />
+              </Box>
+            )) }
+          </Flex>
+        </DetailsInfoItem>
+      ) }
+      { data.zkevm_status && (
+        <DetailsInfoItem
+          title="Confirmation status"
+          hint="Status of the transaction confirmation path to L1"
+          isLoading={ isLoading }
+        >
+          <VerificationSteps currentStep={ data.zkevm_status } steps={ ZKEVM_L2_TX_STATUSES } isLoading={ isLoading }/>
+        </DetailsInfoItem>
+      ) }
+      { data.revert_reason && (
+        <DetailsInfoItem
+          title="Revert reason"
+          hint="The revert reason of the transaction"
+        >
+          <TxRevertReason { ...data.revert_reason }/>
+        </DetailsInfoItem>
+      ) }
+      { data.zksync && (
+        <DetailsInfoItem
+          title="L1 status"
+          hint="Status is the short interpretation of the batch lifecycle"
+          isLoading={ isLoading }
+        >
+          <VerificationSteps steps={ ZKSYNC_L2_TX_BATCH_STATUSES } currentStep={ data.zksync.status } isLoading={ isLoading }/>
+        </DetailsInfoItem>
+      ) }
+      <DetailsInfoItem
+        title="Block"
+        hint="Block number containing the transaction"
+        isLoading={ isLoading }
+      >
+        { data.block === null ?
+          <Text>Pending</Text> : (
+            <BlockEntity
+              isLoading={ isLoading }
+              number={ data.block }
+              noIcon
+            />
+          ) }
+        { Boolean(data.confirmations) && (
+          <>
+            <TextSeparator color="gray.500"/>
+            <Skeleton isLoaded={ !isLoading } color="text_secondary">
+              <span>{ data.confirmations } Block confirmations</span>
+            </Skeleton>
+          </>
+        ) }
+      </DetailsInfoItem>
+      { data.zkevm_batch_number && (
+        <DetailsInfoItem
+          title="Tx batch"
+          hint="Batch index for this transaction"
+          isLoading={ isLoading }
+        >
+          <BatchEntityL2
+            isLoading={ isLoading }
+            number={ data.zkevm_batch_number }
+          />
+        </DetailsInfoItem>
+      ) }
+      { data.zksync && (
+        <DetailsInfoItem
+          title="Batch"
+          hint="Batch number"
+          isLoading={ isLoading }
+        >
+          { data.zksync.batch_number ? (
+            <BatchEntityL2
+              isLoading={ isLoading }
+              number={ data.zksync.batch_number }
+            />
+          ) : <Skeleton isLoaded={ !isLoading }>Pending</Skeleton> }
+        </DetailsInfoItem>
+      ) }
+      { data.timestamp && (
+        <DetailsInfoItem
+          title="Timestamp"
+          hint="Date & time of transaction inclusion, including length of time for confirmation"
+          isLoading={ isLoading }
+        >
+          <DetailsTimestamp timestamp={ data.timestamp } isLoading={ isLoading }/>
+          { data.confirmation_duration && (
+            <>
+              <TextSeparator color="gray.500"/>
+              <Skeleton isLoaded={ !isLoading } color="text_secondary">
+                <span>{ getConfirmationDuration(data.confirmation_duration) }</span>
+              </Skeleton>
+            </>
+          ) }
+        </DetailsInfoItem>
+      ) }
+      { data.execution_node && (
+        <DetailsInfoItem
+          title="Kettle"
+          hint="Node that carried out the confidential computation"
+          isLoading={ isLoading }
+        >
+          <AddressEntity
+            address={ data.execution_node }
+            href={ route({ pathname: '/txs/kettle/[hash]', query: { hash: data.execution_node.hash } }) }
+          />
+        </DetailsInfoItem>
+      ) }
+      { data.allowed_peekers && data.allowed_peekers.length > 0 && (
+        <TxAllowedPeekers items={ data.allowed_peekers }/>
+      ) }
+      <DetailsSponsoredItem isLoading={ isLoading }/>
+
+      <DetailsInfoItemDivider/>
+
+      <TxDetailsActions hash={ data.hash } actions={ data.actions } isTxDataLoading={ isLoading }/>
+
+      <DetailsInfoItem
+        title="From"
+        hint="Address (external or contract) sending the transaction"
+        isLoading={ isLoading }
+        columnGap={ 3 }
+      >
+        <AddressEntity
+          address={ data.from }
+          isLoading={ isLoading }
+        />
+        { data.from.name && <Text>{ data.from.name }</Text> }
+        { addressFromTags.length > 0 && (
+          <Flex columnGap={ 3 }>
+            { addressFromTags }
+          </Flex>
+        ) }
+      </DetailsInfoItem>
+      <DetailsInfoItem
+        title={ data.to?.is_contract ? 'Interacted with contract' : 'To' }
+        hint="Address (external or contract) receiving the transaction"
+        isLoading={ isLoading }
+        flexWrap={{ base: 'wrap', lg: 'nowrap' }}
+        columnGap={ 3 }
+      >
+        { toAddress ? (
+          <>
+            { data.to && data.to.hash ? (
+              <Flex flexWrap="nowrap" alignItems="center" maxW="100%">
+                <AddressEntity
+                  address={ toAddress }
+                  isLoading={ isLoading }
+                />
+                { executionSuccessBadge }
+                { executionFailedBadge }
+              </Flex>
+            ) : (
+              <Flex width="100%" whiteSpace="pre" alignItems="center" flexShrink={ 0 }>
+                <span>[Contract </span>
+                <AddressEntity
+                  address={ toAddress }
+                  isLoading={ isLoading }
+                  noIcon
+                />
+                <span>created]</span>
+                { executionSuccessBadge }
+                { executionFailedBadge }
+              </Flex>
+            ) }
+            { addressToTags.length > 0 && (
+              <Flex columnGap={ 3 }>
+                { addressToTags }
+              </Flex>
+            ) }
+          </>
+        ) : (
+          <span>[ Contract creation ]</span>
+        ) }
+      </DetailsInfoItem>
+      { data.token_transfers && <TxDetailsTokenTransfers data={ data.token_transfers } txHash={ data.hash } isOverflow={ data.token_transfers_overflow }/> }
+
+      <DetailsInfoItemDivider/>
+
+      { data.zkevm_sequence_hash && (
+        <DetailsInfoItem
+          title="Sequence tx hash"
+          flexWrap="nowrap"
+
+          isLoading={ isLoading }
+        >
+          <Skeleton isLoaded={ !isLoading } overflow="hidden">
+            <HashStringShortenDynamic hash={ data.zkevm_sequence_hash }/>
+          </Skeleton>
+          <CopyToClipboard text={ data.zkevm_sequence_hash } isLoading={ isLoading }/>
+        </DetailsInfoItem>
+      ) }
+      { data.zkevm_verify_hash && (
+        <DetailsInfoItem
+          title="Verify tx hash"
+          flexWrap="nowrap"
+          isLoading={ isLoading }
+        >
+          <Skeleton isLoaded={ !isLoading } overflow="hidden">
+
+            <HashStringShortenDynamic hash={ data.zkevm_verify_hash }/>
+          </Skeleton>
+          <CopyToClipboard text={ data.zkevm_verify_hash } isLoading={ isLoading }/>
+
+        </DetailsInfoItem>
+      ) }
+
+      { (data.zkevm_batch_number || data.zkevm_verify_hash) && <DetailsInfoItemDivider/> }
+
+      { !config.UI.views.tx.hiddenFields?.value && (
+        <DetailsInfoItem
+          title="Value"
+          hint="Value sent in the native token (and USD) if applicable"
+          isLoading={ isLoading }
+        >
+          <CurrencyValue
+            value={ data.value }
+            currency={ currencyUnits.ether }
+            exchangeRate={ data.exchange_rate }
+            isLoading={ isLoading }
+            flexWrap="wrap"
+          />
+        </DetailsInfoItem>
+      ) }
+      { !config.UI.views.tx.hiddenFields?.tx_fee && (
+        <DetailsInfoItem
+          title="Transaction fee"
+          hint={ data.blob_gas_used ? 'Transaction fee without blob fee' : 'Total transaction fee' }
+          isLoading={ isLoading }
+        >
+          { data.stability_fee ? (
+            <TxFeeStability data={ data.stability_fee } isLoading={ isLoading }/>
+          ) : (
+            <CurrencyValue
+              value={ data.fee.value }
+              currency={ config.UI.views.tx.hiddenFields?.fee_currency ? '' : currencyUnits.ether }
+              exchangeRate={ data.exchange_rate }
+              flexWrap="wrap"
+              isLoading={ isLoading }
+            />
+          ) }
+        </DetailsInfoItem>
+      ) }
+
+      <TxDetailsGasPrice gasPrice={ data.gas_price } isLoading={ isLoading }/>
+
+      <TxDetailsFeePerGas txFee={ data.fee.value } gasUsed={ data.gas_used } isLoading={ isLoading }/>
+
+      <DetailsInfoItem
+        title="Gas usage & limit by txn"
+        hint="Actual gas amount used by the transaction"
+        isLoading={ isLoading }
+      >
+        <Skeleton isLoaded={ !isLoading }>{ BigNumber(data.gas_used || 0).toFormat() }</Skeleton>
+        <TextSeparator/>
+        <Skeleton isLoaded={ !isLoading }>{ BigNumber(data.gas_limit).toFormat() }</Skeleton>
+        <Utilization ml={ 4 } value={ BigNumber(data.gas_used || 0).dividedBy(BigNumber(data.gas_limit)).toNumber() } isLoading={ isLoading }/>
+      </DetailsInfoItem>
+      { !config.UI.views.tx.hiddenFields?.gas_fees &&
+            (data.base_fee_per_gas || data.max_fee_per_gas || data.max_priority_fee_per_gas) && (
+        <DetailsInfoItem
+          title={ `Gas fees (${ currencyUnits.gwei })` }
+          // eslint-disable-next-line max-len
+          hint={ `
+                Base Fee refers to the network Base Fee at the time of the block, 
+                while Max Fee & Max Priority Fee refer to the max amount a user is willing to pay 
+                for their tx & to give to the ${ getNetworkValidatorTitle() } respectively
+              ` }
+          isLoading={ isLoading }
+        >
+          { data.base_fee_per_gas && (
+            <Skeleton isLoaded={ !isLoading }>
+              <Text as="span" fontWeight="500">Base: </Text>
+              <Text fontWeight="600" as="span">{ BigNumber(data.base_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() }</Text>
+              { (data.max_fee_per_gas || data.max_priority_fee_per_gas) && <TextSeparator/> }
+            </Skeleton>
+          ) }
+          { data.max_fee_per_gas && (
+            <Skeleton isLoaded={ !isLoading }>
+              <Text as="span" fontWeight="500">Max: </Text>
+              <Text fontWeight="600" as="span">{ BigNumber(data.max_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() }</Text>
+              { data.max_priority_fee_per_gas && <TextSeparator/> }
+            </Skeleton>
+          ) }
+          { data.max_priority_fee_per_gas && (
+            <Skeleton isLoaded={ !isLoading }>
+              <Text as="span" fontWeight="500">Max priority: </Text>
+              <Text fontWeight="600" as="span">{ BigNumber(data.max_priority_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() }</Text>
+            </Skeleton>
+          ) }
+        </DetailsInfoItem>
+      ) }
+      <TxDetailsBurntFees data={ data } isLoading={ isLoading }/>
+      { rollupFeature.isEnabled && rollupFeature.type === 'optimistic' && (
+        <>
+          { data.l1_gas_used && (
+            <DetailsInfoItem
+              title="L1 gas used by txn"
+              hint="L1 gas used by transaction"
+              isLoading={ isLoading }
+            >
+              <Text>{ BigNumber(data.l1_gas_used).toFormat() }</Text>
+            </DetailsInfoItem>
+          ) }
+          { data.l1_gas_price && (
+            <DetailsInfoItem
+              title="L1 gas price"
+              hint="L1 gas price"
+              isLoading={ isLoading }
+            >
+              <Text mr={ 1 }>{ BigNumber(data.l1_gas_price).dividedBy(WEI).toFixed() } { currencyUnits.ether }</Text>
+              <Text variant="secondary">({ BigNumber(data.l1_gas_price).dividedBy(WEI_IN_GWEI).toFixed() } { currencyUnits.gwei })</Text>
+            </DetailsInfoItem>
+          ) }
+          { data.l1_fee && (
+            <DetailsInfoItem
+              title="L1 fee"
+              // eslint-disable-next-line max-len
+              hint={ `L1 Data Fee which is used to cover the L1 "security" cost from the batch submission mechanism. In combination with L2 execution fee, L1 fee makes the total amount of fees that a transaction pays.` }
+              isLoading={ isLoading }
+            >
+              <CurrencyValue
+                value={ data.l1_fee }
+                currency={ currencyUnits.ether }
+                exchangeRate={ data.exchange_rate }
+                flexWrap="wrap"
+              />
+            </DetailsInfoItem>
+          ) }
+          { data.l1_fee_scalar && (
+            <DetailsInfoItem
+              title="L1 fee scalar"
+              hint="A Dynamic overhead (fee scalar) premium, which serves as a buffer in case L1 prices rapidly increase."
+              isLoading={ isLoading }
+            >
+              <Text>{ data.l1_fee_scalar }</Text>
+            </DetailsInfoItem>
+          ) }
+        </>
+      ) }
+      <GridItem colSpan={{ base: undefined, lg: 2 }}>
+        <Element name="TxInfo__cutLink">
+          <Skeleton isLoaded={ !isLoading } mt={ 6 } display="inline-block">
+            <Link
+              display="inline-block"
+              fontSize="sm"
+              textDecorationLine="underline"
+              textDecorationStyle="dashed"
+              onClick={ handleCutClick }
+            >
+              { isExpanded ? 'Hide details' : 'View details' }
+            </Link>
+          </Skeleton>
+        </Element>
+      </GridItem>
+      { isExpanded && (
+        <>
+          <GridItem colSpan={{ base: undefined, lg: 2 }} mt={{ base: 1, lg: 4 }}/>
+          { (data.blob_gas_used || data.max_fee_per_blob_gas || data.blob_gas_price) && (
+            <>
+              { data.blob_gas_used && data.blob_gas_price && (
+                <DetailsInfoItem
+                  title="Blob fee"
+                  hint="Blob fee for this transaction"
+                >
+                  <CurrencyValue
+                    value={ BigNumber(data.blob_gas_used).multipliedBy(data.blob_gas_price).toString() }
+                    currency={ config.UI.views.tx.hiddenFields?.fee_currency ? '' : currencyUnits.ether }
+                    exchangeRate={ data.exchange_rate }
+                    flexWrap="wrap"
+                    isLoading={ isLoading }
+                  />
+                </DetailsInfoItem>
+              ) }
+              { data.blob_gas_used && (
+                <DetailsInfoItem
+                  title="Blob gas usage"
+                  hint="Amount of gas used by the blobs in this transaction"
+                >
+                  { BigNumber(data.blob_gas_used).toFormat() }
+                </DetailsInfoItem>
+              ) }
+              { (data.max_fee_per_blob_gas || data.blob_gas_price) && (
+                <DetailsInfoItem
+                  title={ `Blob gas fees (${ currencyUnits.gwei })` }
+                  hint={ `Amount of ${ currencyUnits.ether } used for blobs in this transaction` }
+                >
+                  { data.blob_gas_price && (
+                    <Text fontWeight="600" as="span">{ BigNumber(data.blob_gas_price).dividedBy(WEI_IN_GWEI).toFixed() }</Text>
+                  ) }
+                  { (data.max_fee_per_blob_gas && data.blob_gas_price) && <TextSeparator/> }
+                  { data.max_fee_per_blob_gas && (
+                    <>
+                      <Text as="span" fontWeight="500" whiteSpace="pre">Max: </Text>
+                      <Text fontWeight="600" as="span">{ BigNumber(data.max_fee_per_blob_gas).dividedBy(WEI_IN_GWEI).toFixed() }</Text>
+                    </>
+                  ) }
+                </DetailsInfoItem>
+              ) }
+              <DetailsInfoItemDivider/>
+            </>
+          ) }
+          <TxDetailsOther nonce={ data.nonce } type={ data.type } position={ data.position }/>
+          <DetailsInfoItem
+            title="Raw input"
+            hint="Binary data included with the transaction. See logs tab for additional info"
+          >
+            <RawInputData hex={ data.raw_input }/>
+          </DetailsInfoItem>
+          { data.decoded_input && (
+            <DetailsInfoItem
+              title="Decoded input data"
+              hint="Decoded input data"
+            >
+              <LogDecodedInputData data={ data.decoded_input }/>
+            </DetailsInfoItem>
+          ) }
+          { data.zksync && <ZkSyncL2TxnBatchHashesInfo data={ data.zksync } isLoading={ isLoading }/> }
+        </>
+      ) }
+    </Grid>
+  );
+};
+
+export default TxInfo;
diff --git a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Ready-for-relay-1.png b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Ready-for-relay-1.png
index 7f22f779ea..32b575c41d 100644
Binary files a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Ready-for-relay-1.png and b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Ready-for-relay-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Relayed-1.png b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Relayed-1.png
index de0211aa9a..b18b962eed 100644
Binary files a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Relayed-1.png and b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Relayed-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Waiting-for-state-root-1.png b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Waiting-for-state-root-1.png
index a2d70d6297..3e47297064 100644
Binary files a/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Waiting-for-state-root-1.png and b/ui/tx/details/__screenshots__/TxDetailsWithdrawalStatus.pw.tsx_default_status-Waiting-for-state-root-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_dark-color-mode_between-addresses-mobile-dark-mode-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_dark-color-mode_between-addresses-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..91953a5e74
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_dark-color-mode_between-addresses-mobile-dark-mode-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_dark-color-mode_with-actions-uniswap-mobile-dark-mode-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_dark-color-mode_with-actions-uniswap-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..8a71ebe581
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_dark-color-mode_with-actions-uniswap-mobile-dark-mode-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_between-addresses-mobile-dark-mode-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_between-addresses-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..1e3bee9a6c
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_between-addresses-mobile-dark-mode-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_creating-contact-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_creating-contact-1.png
new file mode 100644
index 0000000000..5fb55385df
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_creating-contact-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_l2-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_l2-1.png
new file mode 100644
index 0000000000..e86df21951
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_l2-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_pending-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_pending-1.png
new file mode 100644
index 0000000000..560ea1cf2e
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_pending-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_stability-customization-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_stability-customization-1.png
new file mode 100644
index 0000000000..8dffcc2499
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_stability-customization-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-actions-uniswap-mobile-dark-mode-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-actions-uniswap-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..cef58d0109
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-actions-uniswap-mobile-dark-mode-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-blob-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-blob-1.png
new file mode 100644
index 0000000000..771512447d
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-blob-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-decoded-raw-reason-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-decoded-raw-reason-1.png
new file mode 100644
index 0000000000..e95db83c7c
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-decoded-raw-reason-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-decoded-revert-reason-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-decoded-revert-reason-1.png
new file mode 100644
index 0000000000..6ad9c3e012
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-decoded-revert-reason-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-token-transfer-mobile-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-token-transfer-mobile-1.png
new file mode 100644
index 0000000000..718db98cde
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_with-token-transfer-mobile-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_without-testnet-warning-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_without-testnet-warning-1.png
new file mode 100644
index 0000000000..736a3bcad7
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_default_without-testnet-warning-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_mobile_between-addresses-mobile-dark-mode-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_mobile_between-addresses-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..0aadfa46a6
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_mobile_between-addresses-mobile-dark-mode-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_mobile_with-actions-uniswap-mobile-dark-mode-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_mobile_with-actions-uniswap-mobile-dark-mode-1.png
new file mode 100644
index 0000000000..647188a354
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_mobile_with-actions-uniswap-mobile-dark-mode-1.png differ
diff --git a/ui/tx/details/__screenshots__/TxInfo.pw.tsx_mobile_with-token-transfer-mobile-1.png b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_mobile_with-token-transfer-mobile-1.png
new file mode 100644
index 0000000000..9a792f4474
Binary files /dev/null and b/ui/tx/details/__screenshots__/TxInfo.pw.tsx_mobile_with-token-transfer-mobile-1.png differ
diff --git a/ui/tx/details/txDetailsActions/TxDetailsActionsInterpretation.tsx b/ui/tx/details/txDetailsActions/TxDetailsActionsInterpretation.tsx
index ade6ac072a..00e7401d84 100644
--- a/ui/tx/details/txDetailsActions/TxDetailsActionsInterpretation.tsx
+++ b/ui/tx/details/txDetailsActions/TxDetailsActionsInterpretation.tsx
@@ -2,10 +2,9 @@ import React from 'react';
 
 import useApiQuery from 'lib/api/useApiQuery';
 import { TX_INTERPRETATION } from 'stubs/txInterpretation';
+import DetailsActionsWrapper from 'ui/shared/DetailsActionsWrapper';
 import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
-import TxInterpretation from 'ui/tx/interpretation/TxInterpretation';
-
-import TxDetailsActionsWrapper from './TxDetailsActionsWrapper';
+import TxInterpretation from 'ui/shared/tx/interpretation/TxInterpretation';
 
 interface Props {
   hash?: string;
@@ -30,7 +29,7 @@ const TxDetailsActionsInterpretation = ({ hash, isTxDataLoading }: Props) => {
 
   return (
     <>
-      <TxDetailsActionsWrapper isLoading={ isTxDataLoading || txInterpretationQuery.isPlaceholderData }>
+      <DetailsActionsWrapper isLoading={ isTxDataLoading || txInterpretationQuery.isPlaceholderData } type="tx">
         { actions.map((action, index: number) => (
           <TxInterpretation
             key={ index }
@@ -39,7 +38,7 @@ const TxDetailsActionsInterpretation = ({ hash, isTxDataLoading }: Props) => {
           />
         ),
         ) }
-      </TxDetailsActionsWrapper>
+      </DetailsActionsWrapper>
       <DetailsInfoItemDivider/>
     </>
   );
diff --git a/ui/tx/details/txDetailsActions/TxDetailsActionsRaw.tsx b/ui/tx/details/txDetailsActions/TxDetailsActionsRaw.tsx
index a024347519..b2afdb2043 100644
--- a/ui/tx/details/txDetailsActions/TxDetailsActionsRaw.tsx
+++ b/ui/tx/details/txDetailsActions/TxDetailsActionsRaw.tsx
@@ -2,10 +2,10 @@ import React from 'react';
 
 import type { TxAction } from 'types/api/txAction';
 
+import DetailsActionsWrapper from 'ui/shared/DetailsActionsWrapper';
 import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
 
 import TxDetailsAction from './TxDetailsAction';
-import TxDetailsActionsWrapper from './TxDetailsActionsWrapper';
 
 interface Props {
   actions: Array<TxAction>;
@@ -15,9 +15,9 @@ interface Props {
 const TxDetailsActionsRaw = ({ actions, isLoading }: Props) => {
   return (
     <>
-      <TxDetailsActionsWrapper isLoading={ isLoading }>
+      <DetailsActionsWrapper isLoading={ isLoading } type="tx">
         { actions.map((action, index: number) => <TxDetailsAction key={ index } action={ action }/>) }
-      </TxDetailsActionsWrapper>
+      </DetailsActionsWrapper>
       <DetailsInfoItemDivider/>
     </>
   );
diff --git a/ui/tx/details/txDetailsActions/TxDetailsActionsWrapper.tsx b/ui/tx/details/txDetailsActions/TxDetailsActionsWrapper.tsx
deleted file mode 100644
index c9e963e803..0000000000
--- a/ui/tx/details/txDetailsActions/TxDetailsActionsWrapper.tsx
+++ /dev/null
@@ -1,65 +0,0 @@
-import { Flex, useColorModeValue } from '@chakra-ui/react';
-import React from 'react';
-
-import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
-
-const SCROLL_GRADIENT_HEIGHT = 48;
-
-type Props = {
-  children: React.ReactNode;
-  isLoading?: boolean;
-}
-
-export const TX_ACTIONS_BLOCK_ID = 'tx-actions';
-
-const TxDetailsActions = ({ children, isLoading }: Props) => {
-  const containerRef = React.useRef<HTMLDivElement>(null);
-  const [ hasScroll, setHasScroll ] = React.useState(false);
-
-  const gradientStartColor = useColorModeValue('whiteAlpha.600', 'blackAlpha.600');
-  const gradientEndColor = useColorModeValue('whiteAlpha.900', 'blackAlpha.900');
-
-  React.useEffect(() => {
-    if (!containerRef.current) {
-      return;
-    }
-
-    setHasScroll(containerRef.current.scrollHeight >= containerRef.current.clientHeight + SCROLL_GRADIENT_HEIGHT / 2);
-  }, []);
-
-  return (
-    <DetailsInfoItem
-      title="Transaction action"
-      hint="Highlighted events of the transaction"
-      note={ hasScroll ? 'Scroll to see more' : undefined }
-      position="relative"
-      isLoading={ isLoading }
-    >
-      <Flex
-        id={ TX_ACTIONS_BLOCK_ID }
-        flexDirection="column"
-        alignItems="stretch"
-        rowGap={ 5 }
-        w="100%"
-        maxH="200px"
-        overflowY="scroll"
-        ref={ containerRef }
-        _after={ hasScroll ? {
-          position: 'absolute',
-          content: '""',
-          bottom: 0,
-          left: 0,
-          right: '20px',
-          height: `${ SCROLL_GRADIENT_HEIGHT }px`,
-          bgGradient: `linear(to-b, ${ gradientStartColor } 37.5%, ${ gradientEndColor } 77.5%)`,
-        } : undefined }
-        pr={ hasScroll ? 5 : 0 }
-        pb={ hasScroll ? 10 : 0 }
-      >
-        { children }
-      </Flex>
-    </DetailsInfoItem>
-  );
-};
-
-export default React.memo(TxDetailsActions);
diff --git a/ui/tx/internals/TxInternalsListItem.tsx b/ui/tx/internals/TxInternalsListItem.tsx
index df6d73519f..513c05cfd1 100644
--- a/ui/tx/internals/TxInternalsListItem.tsx
+++ b/ui/tx/internals/TxInternalsListItem.tsx
@@ -1,13 +1,13 @@
-import { Flex, Box, HStack, Skeleton } from '@chakra-ui/react';
+import { Flex, HStack, Skeleton } from '@chakra-ui/react';
 import BigNumber from 'bignumber.js';
 import React from 'react';
 
 import type { InternalTransaction } from 'types/api/internalTransaction';
 
 import config from 'configs/app';
+import { currencyUnits } from 'lib/units';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import Tag from 'ui/shared/chakra/Tag';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
-import IconSvg from 'ui/shared/IconSvg';
 import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
 import TxStatus from 'ui/shared/statusTag/TxStatus';
 import { TX_INTERNALS_ITEMS } from 'ui/tx/internals/utils';
@@ -24,23 +24,15 @@ const TxInternalsListItem = ({ type, from, to, value, success, error, gas_limit:
         { typeTitle && <Tag colorScheme="cyan" isLoading={ isLoading }>{ typeTitle }</Tag> }
         <TxStatus status={ success ? 'ok' : 'error' } errorText={ error } isLoading={ isLoading }/>
       </Flex>
-      <Box w="100%" display="flex" columnGap={ 3 } fontWeight="500">
-        <AddressEntity
-          address={ from }
-          isLoading={ isLoading }
-          width="calc((100% - 48px) / 2)"
-        />
-        <IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" isLoading={ isLoading }/>
-        { toData && (
-          <AddressEntity
-            address={ toData }
-            isLoading={ isLoading }
-            width="calc((100% - 48px) / 2)"
-          />
-        ) }
-      </Box>
+      <AddressFromTo
+        from={ from }
+        to={ toData }
+        isLoading={ isLoading }
+        w="100%"
+        fontWeight="500"
+      />
       <HStack spacing={ 3 }>
-        <Skeleton isLoaded={ !isLoading } fontSize="sm" fontWeight={ 500 }>Value { config.chain.currency.symbol }</Skeleton>
+        <Skeleton isLoaded={ !isLoading } fontSize="sm" fontWeight={ 500 }>Value { currencyUnits.ether }</Skeleton>
         <Skeleton isLoaded={ !isLoading } fontSize="sm" color="text_secondary">
           { BigNumber(value).div(BigNumber(10 ** config.chain.currency.decimals)).toFormat() }
         </Skeleton>
diff --git a/ui/tx/internals/TxInternalsTable.tsx b/ui/tx/internals/TxInternalsTable.tsx
index 65f4a3d6ac..2a833310c6 100644
--- a/ui/tx/internals/TxInternalsTable.tsx
+++ b/ui/tx/internals/TxInternalsTable.tsx
@@ -3,7 +3,8 @@ import React from 'react';
 
 import type { InternalTransaction } from 'types/api/internalTransaction';
 
-import config from 'configs/app';
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
+import { currencyUnits } from 'lib/units';
 import IconSvg from 'ui/shared/IconSvg';
 import { default as Thead } from 'ui/shared/TheadSticky';
 import TxInternalsTableItem from 'ui/tx/internals/TxInternalsTableItem';
@@ -21,33 +22,33 @@ const TxInternalsTable = ({ data, sort, onSortToggle, top, isLoading }: Props) =
   const sortIconTransform = sort?.includes('asc') ? 'rotate(-90deg)' : 'rotate(90deg)';
 
   return (
-    <Table variant="simple" size="sm">
-      <Thead top={ top }>
-        <Tr>
-          <Th width="28%">Type</Th>
-          <Th width="20%">From</Th>
-          <Th width="24px" px={ 0 }/>
-          <Th width="20%">To</Th>
-          <Th width="16%" isNumeric>
-            <Link display="flex" alignItems="center" justifyContent="flex-end" onClick={ onSortToggle('value') } columnGap={ 1 }>
-              { sort?.includes('value') && <IconSvg name="arrows/east" boxSize={ 4 } transform={ sortIconTransform }/> }
-                Value { config.chain.currency.symbol }
-            </Link>
-          </Th>
-          <Th width="16%" isNumeric>
-            <Link display="flex" alignItems="center" justifyContent="flex-end" onClick={ onSortToggle('gas-limit') } columnGap={ 1 }>
-              { sort?.includes('gas-limit') && <IconSvg name="arrows/east" boxSize={ 4 } transform={ sortIconTransform }/> }
-                Gas limit { config.chain.currency.symbol }
-            </Link>
-          </Th>
-        </Tr>
-      </Thead>
-      <Tbody>
-        { data.map((item, index) => (
-          <TxInternalsTableItem key={ item.transaction_hash + (isLoading ? index : '') } { ...item } isLoading={ isLoading }/>
-        )) }
-      </Tbody>
-    </Table>
+    <AddressHighlightProvider>
+      <Table variant="simple" size="sm">
+        <Thead top={ top }>
+          <Tr>
+            <Th width="28%">Type</Th>
+            <Th width="40%">From/To</Th>
+            <Th width="16%" isNumeric>
+              <Link display="flex" alignItems="center" justifyContent="flex-end" onClick={ onSortToggle('value') } columnGap={ 1 }>
+                { sort?.includes('value') && <IconSvg name="arrows/east" boxSize={ 4 } transform={ sortIconTransform }/> }
+                Value { currencyUnits.ether }
+              </Link>
+            </Th>
+            <Th width="16%" isNumeric>
+              <Link display="flex" alignItems="center" justifyContent="flex-end" onClick={ onSortToggle('gas-limit') } columnGap={ 1 }>
+                { sort?.includes('gas-limit') && <IconSvg name="arrows/east" boxSize={ 4 } transform={ sortIconTransform }/> }
+                Gas limit { currencyUnits.ether }
+              </Link>
+            </Th>
+          </Tr>
+        </Thead>
+        <Tbody>
+          { data.map((item, index) => (
+            <TxInternalsTableItem key={ item.transaction_hash + (isLoading ? index : '') } { ...item } isLoading={ isLoading }/>
+          )) }
+        </Tbody>
+      </Table>
+    </AddressHighlightProvider>
   );
 };
 
diff --git a/ui/tx/internals/TxInternalsTableItem.tsx b/ui/tx/internals/TxInternalsTableItem.tsx
index cfa1bca773..b344b81147 100644
--- a/ui/tx/internals/TxInternalsTableItem.tsx
+++ b/ui/tx/internals/TxInternalsTableItem.tsx
@@ -5,9 +5,8 @@ import React from 'react';
 import type { InternalTransaction } from 'types/api/internalTransaction';
 
 import config from 'configs/app';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import Tag from 'ui/shared/chakra/Tag';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
-import IconSvg from 'ui/shared/IconSvg';
 import TxStatus from 'ui/shared/statusTag/TxStatus';
 import { TX_INTERNALS_ITEMS } from 'ui/tx/internals/utils';
 
@@ -32,22 +31,12 @@ const TxInternalTableItem = ({ type, from, to, value, success, error, gas_limit:
         </Flex>
       </Td>
       <Td verticalAlign="middle">
-        <AddressEntity
-          address={ from }
+        <AddressFromTo
+          from={ from }
+          to={ toData }
           isLoading={ isLoading }
         />
       </Td>
-      <Td px={ 0 } verticalAlign="middle">
-        <IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" isLoading={ isLoading } display="block"/>
-      </Td>
-      <Td verticalAlign="middle">
-        { toData && (
-          <AddressEntity
-            address={ toData }
-            isLoading={ isLoading }
-          />
-        ) }
-      </Td>
       <Td isNumeric verticalAlign="middle">
         <Skeleton isLoaded={ !isLoading } display="inline-block">
           { BigNumber(value).div(BigNumber(10 ** config.chain.currency.decimals)).toFormat() }
diff --git a/ui/tx/interpretation/TxInterpretation.tsx b/ui/tx/interpretation/TxInterpretation.tsx
deleted file mode 100644
index 293d712977..0000000000
--- a/ui/tx/interpretation/TxInterpretation.tsx
+++ /dev/null
@@ -1,115 +0,0 @@
-import { Skeleton, Flex, Text, chakra } from '@chakra-ui/react';
-import BigNumber from 'bignumber.js';
-import React from 'react';
-
-import type { TxInterpretationSummary, TxInterpretationVariable } from 'types/api/txInterpretation';
-
-import config from 'configs/app';
-import dayjs from 'lib/date/dayjs';
-import * as mixpanel from 'lib/mixpanel/index';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
-import TokenEntity from 'ui/shared/entities/token/TokenEntity';
-import IconSvg from 'ui/shared/IconSvg';
-
-import { extractVariables, getStringChunks, NATIVE_COIN_SYMBOL_VAR_NAME } from './utils';
-
-type Props = {
-  summary?: TxInterpretationSummary;
-  isLoading?: boolean;
-  className?: string;
-}
-
-const TxInterpretationElementByType = ({ variable }: { variable?: TxInterpretationVariable }) => {
-  const onAddressClick = React.useCallback(() => {
-    mixpanel.logEvent(mixpanel.EventTypes.TX_INTERPRETATION_INTERACTION, { Type: 'Address click' });
-  }, []);
-
-  const onTokenClick = React.useCallback(() => {
-    mixpanel.logEvent(mixpanel.EventTypes.TX_INTERPRETATION_INTERACTION, { Type: 'Token click' });
-  }, []);
-
-  if (!variable) {
-    return null;
-  }
-
-  const { type, value } = variable;
-  switch (type) {
-    case 'address': {
-      return (
-        <AddressEntity
-          address={ value }
-          truncation="constant"
-          sx={{ ':not(:first-child)': { marginLeft: 1 } }}
-          whiteSpace="initial"
-          onClick={ onAddressClick }
-        />
-      );
-    }
-    case 'token':
-      return (
-        <TokenEntity
-          token={ value }
-          onlySymbol
-          noCopy
-          width="fit-content"
-          sx={{ ':not(:first-child)': { marginLeft: 1 } }}
-          mr={ 2 }
-          whiteSpace="initial"
-          onClick={ onTokenClick }
-        />
-      );
-    case 'currency': {
-      let numberString = '';
-      if (BigNumber(value).isLessThan(0.1)) {
-        numberString = BigNumber(value).toPrecision(2);
-      } else if (BigNumber(value).isLessThan(10000)) {
-        numberString = BigNumber(value).dp(2).toFormat();
-      } else if (BigNumber(value).isLessThan(1000000)) {
-        numberString = BigNumber(value).dividedBy(1000).toFormat(2) + 'K';
-      } else {
-        numberString = BigNumber(value).dividedBy(1000000).toFormat(2) + 'M';
-      }
-      return <Text>{ numberString + ' ' }</Text>;
-    }
-    case 'timestamp':
-      // timestamp is in unix format
-      return <Text color="text_secondary">{ dayjs(Number(value) * 1000).format('llll') + ' ' }</Text>;
-    case 'string':
-    default: {
-      return <Text color="text_secondary">{ value.toString() + ' ' }</Text>;
-    }
-  }
-};
-
-const TxInterpretation = ({ summary, isLoading, className }: Props) => {
-  if (!summary) {
-    return null;
-  }
-
-  const template = summary.summary_template;
-  const variables = summary.summary_template_variables;
-
-  const variablesNames = extractVariables(template);
-
-  const chunks = getStringChunks(template);
-
-  return (
-    <Skeleton display="flex" flexWrap="wrap" alignItems="center" isLoaded={ !isLoading } className={ className }>
-      <IconSvg name="lightning" boxSize={ 5 } color="text_secondary" mr={ 2 }/>
-      { chunks.map((chunk, index) => {
-        return (
-          <Flex whiteSpace="pre" key={ chunk + index } fontWeight={ 500 }>
-            <Text color="text_secondary">{ chunk.trim() + (chunk.trim() && variablesNames[index] ? ' ' : '') }</Text>
-            { index < variablesNames.length && (
-              variablesNames[index] === NATIVE_COIN_SYMBOL_VAR_NAME ?
-                <Text>{ config.chain.currency.symbol + ' ' }</Text> :
-                <TxInterpretationElementByType variable={ variables[variablesNames[index]] }/>
-            ) }
-          </Flex>
-        );
-      }) }
-    </Skeleton>
-  );
-};
-
-export default chakra(TxInterpretation);
diff --git a/ui/tx/interpretation/utils.test.ts b/ui/tx/interpretation/utils.test.ts
deleted file mode 100644
index c3089594b7..0000000000
--- a/ui/tx/interpretation/utils.test.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import { extractVariables, getStringChunks } from './utils';
-
-const template = '{action_type} {source_amount} {native} into {destination_amount} {destination_token}';
-
-it('extracts variables names', () => {
-  const result = extractVariables(template);
-  expect(result).toEqual([ 'action_type', 'source_amount', 'native', 'destination_amount', 'destination_token' ]);
-});
-
-it('split string without capturing variables', () => {
-  const result = getStringChunks(template);
-  expect(result).toEqual([ '', ' ', ' ', ' into ', ' ', '' ]);
-});
diff --git a/ui/tx/interpretation/utils.ts b/ui/tx/interpretation/utils.ts
deleted file mode 100644
index c6ffbb6e42..0000000000
--- a/ui/tx/interpretation/utils.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-// we use that regex as a separator when splitting template and dont want to capture variables
-// eslint-disable-next-line regexp/no-useless-non-capturing-group
-export const VAR_REGEXP = /\{(?:[^}]+)\}/g;
-
-export const NATIVE_COIN_SYMBOL_VAR_NAME = 'native';
-
-export function extractVariables(templateString: string) {
-
-  const matches = templateString.match(VAR_REGEXP);
-
-  const variablesNames = matches ? matches.map(match => match.slice(1, -1)) : [];
-
-  return variablesNames;
-}
-
-export function getStringChunks(template: string) {
-  return template.split(VAR_REGEXP);
-}
diff --git a/ui/tx/state/TxStateListItem.tsx b/ui/tx/state/TxStateListItem.tsx
index c752a2b840..2dbc3c5e23 100644
--- a/ui/tx/state/TxStateListItem.tsx
+++ b/ui/tx/state/TxStateListItem.tsx
@@ -24,6 +24,7 @@ const TxStateListItem = ({ data, isLoading }: Props) => {
         <AddressEntity
           address={ data.address }
           isLoading={ isLoading }
+          truncation="constant"
         />
         { tag }
       </ListItemMobileGrid.Value>
diff --git a/ui/tx/state/TxStateTable.tsx b/ui/tx/state/TxStateTable.tsx
index 9740486c66..216648830c 100644
--- a/ui/tx/state/TxStateTable.tsx
+++ b/ui/tx/state/TxStateTable.tsx
@@ -8,6 +8,7 @@ import React from 'react';
 
 import type { TxStateChange } from 'types/api/txStateChanges';
 
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import { default as Thead } from 'ui/shared/TheadSticky';
 import TxStateTableItem from 'ui/tx/state/TxStateTableItem';
 
@@ -19,21 +20,23 @@ interface Props {
 
 const TxStateTable = ({ data, isLoading, top }: Props) => {
   return (
-    <Table variant="simple" minWidth="1000px" size="sm" w="100%">
-      <Thead top={ top }>
-        <Tr>
-          <Th width="140px">Type</Th>
-          <Th width="160px">Address</Th>
-          <Th width="33%" isNumeric>Before</Th>
-          <Th width="33%" isNumeric>After</Th>
-          <Th width="33%" isNumeric>Change</Th>
-          <Th width="150px" minW="80px" maxW="150px">Token ID</Th>
-        </Tr>
-      </Thead>
-      <Tbody>
-        { data.map((item, index) => <TxStateTableItem data={ item } key={ index } isLoading={ isLoading }/>) }
-      </Tbody>
-    </Table>
+    <AddressHighlightProvider>
+      <Table variant="simple" minWidth="1000px" size="sm" w="100%">
+        <Thead top={ top }>
+          <Tr>
+            <Th width="140px">Type</Th>
+            <Th width="160px">Address</Th>
+            <Th width="33%" isNumeric>Before</Th>
+            <Th width="33%" isNumeric>After</Th>
+            <Th width="33%" isNumeric>Change</Th>
+            <Th width="150px" minW="80px" maxW="150px">Token ID</Th>
+          </Tr>
+        </Thead>
+        <Tbody>
+          { data.map((item, index) => <TxStateTableItem data={ item } key={ index } isLoading={ isLoading }/>) }
+        </Tbody>
+      </Table>
+    </AddressHighlightProvider>
   );
 };
 
diff --git a/ui/tx/state/TxStateTableItem.tsx b/ui/tx/state/TxStateTableItem.tsx
index 81c6ba5ca8..a963242429 100644
--- a/ui/tx/state/TxStateTableItem.tsx
+++ b/ui/tx/state/TxStateTableItem.tsx
@@ -27,7 +27,8 @@ const TxStateTableItem = ({ data, isLoading }: Props) => {
           address={ data.address }
           isLoading={ isLoading }
           truncation="constant"
-          py="7px"
+          my="7px"
+          w="100%"
         />
       </Td>
       <Td isNumeric><Box py="7px">{ before }</Box></Td>
diff --git a/ui/tx/state/TxStateTokenIdList.tsx b/ui/tx/state/TxStateTokenIdList.tsx
index e04d496532..a2dcf1ab2d 100644
--- a/ui/tx/state/TxStateTokenIdList.tsx
+++ b/ui/tx/state/TxStateTokenIdList.tsx
@@ -1,10 +1,10 @@
-import { Flex, Link, useBoolean } from '@chakra-ui/react';
+import { Flex, Text, Link, useBoolean } from '@chakra-ui/react';
 import React from 'react';
 
 import NftEntity from 'ui/shared/entities/nft/NftEntity';
 
 interface Props {
-  items: Array<{total: { token_id: string} }>;
+  items: Array<{total: { token_id: string | null} }>;
   tokenAddress: string;
   isLoading?: boolean;
 }
@@ -14,14 +14,20 @@ const TxStateTokenIdList = ({ items, tokenAddress, isLoading }: Props) => {
 
   return (
     <Flex flexDir="column" rowGap={ 2 }>
-      { items.slice(0, isCut ? 3 : items.length).map((item, index) => (
-        <NftEntity
-          key={ index }
-          hash={ tokenAddress }
-          id={ item.total.token_id }
-          isLoading={ isLoading }
-        />
-      )) }
+      { items.slice(0, isCut ? 3 : items.length).map((item, index) => {
+        if (item.total.token_id !== null) {
+          return (
+            <NftEntity
+              key={ index }
+              hash={ tokenAddress }
+              id={ item.total.token_id }
+              isLoading={ isLoading }
+            />
+          );
+        } else {
+          return <Text key={ index } color="text_secondary">N/A</Text>;
+        }
+      }) }
       { items.length > 3 && (
         <Link
           fontWeight={ 400 }
diff --git a/ui/tx/state/utils.tsx b/ui/tx/state/utils.tsx
index 3b9e58db1a..604574c329 100644
--- a/ui/tx/state/utils.tsx
+++ b/ui/tx/state/utils.tsx
@@ -8,6 +8,7 @@ import config from 'configs/app';
 import { ZERO_ADDRESS } from 'lib/consts';
 import { nbsp, space } from 'lib/html-entities';
 import getNetworkValidatorTitle from 'lib/networks/getNetworkValidatorTitle';
+import { currencyUnits } from 'lib/units';
 import Tag from 'ui/shared/chakra/Tag';
 import NftEntity from 'ui/shared/entities/nft/NftEntity';
 import TokenEntity from 'ui/shared/entities/token/TokenEntity';
@@ -59,12 +60,12 @@ export function getStateElements(data: TxStateChange, isLoading?: boolean) {
       return {
         before: (
           <Skeleton isLoaded={ !isLoading } wordBreak="break-all" display="inline-block">
-            { beforeBn.toFormat() } { config.chain.currency.symbol }
+            { beforeBn.toFormat() } { currencyUnits.ether }
           </Skeleton>
         ),
         after: (
           <Skeleton isLoaded={ !isLoading } wordBreak="break-all" display="inline-block">
-            { afterBn.toFormat() } { config.chain.currency.symbol }
+            { afterBn.toFormat() } { currencyUnits.ether }
           </Skeleton>
         ),
         change: (
diff --git a/ui/tx/useFetchTxInfo.tsx b/ui/tx/useTxQuery.tsx
similarity index 56%
rename from ui/tx/useFetchTxInfo.tsx
rename to ui/tx/useTxQuery.tsx
index e83e9ff085..4e9c97a13b 100644
--- a/ui/tx/useFetchTxInfo.tsx
+++ b/ui/tx/useTxQuery.tsx
@@ -1,3 +1,4 @@
+import { useBoolean } from '@chakra-ui/react';
 import type { UseQueryResult } from '@tanstack/react-query';
 import { useQueryClient } from '@tanstack/react-query';
 import { useRouter } from 'next/router';
@@ -9,44 +10,65 @@ import type { Transaction } from 'types/api/transaction';
 import config from 'configs/app';
 import type { ResourceError } from 'lib/api/resources';
 import useApiQuery, { getResourceKey } from 'lib/api/useApiQuery';
+import { retry } from 'lib/api/useQueryClientConfig';
+import { SECOND } from 'lib/consts';
 import delay from 'lib/delay';
 import getQueryParamString from 'lib/router/getQueryParamString';
 import useSocketChannel from 'lib/socket/useSocketChannel';
 import useSocketMessage from 'lib/socket/useSocketMessage';
 import { TX, TX_ZKEVM_L2 } from 'stubs/tx';
 
-interface Params {
-  onTxStatusUpdate?: () => void;
-  updateDelay?: number;
-}
+const rollupFeature = config.features.rollup;
 
-type ReturnType = UseQueryResult<Transaction, ResourceError<{ status: number }>> & {
+export type TxQuery = UseQueryResult<Transaction, ResourceError<{ status: number }>> & {
   socketStatus: 'close' | 'error' | undefined;
+  setRefetchOnError: {
+    on: () => void;
+    off: () => void;
+    toggle: () => void;
+  };
+}
+
+interface Params {
+  hash?: string;
+  isEnabled?: boolean;
 }
 
-export default function useFetchTxInfo({ onTxStatusUpdate, updateDelay }: Params | undefined = {}): ReturnType {
+export default function useTxQuery(params?: Params): TxQuery {
+  const [ socketStatus, setSocketStatus ] = React.useState<'close' | 'error'>();
+  const [ isRefetchEnabled, setRefetchEnabled ] = useBoolean(false);
+
   const router = useRouter();
   const queryClient = useQueryClient();
-  const [ socketStatus, setSocketStatus ] = React.useState<'close' | 'error'>();
-  const hash = getQueryParamString(router.query.hash);
+
+  const hash = params?.hash ?? getQueryParamString(router.query.hash);
 
   const queryResult = useApiQuery<'tx', { status: number }>('tx', {
     pathParams: { hash },
     queryOptions: {
-      enabled: Boolean(hash),
+      enabled: Boolean(hash) && params?.isEnabled !== false,
       refetchOnMount: false,
-      placeholderData: config.features.zkEvmRollup.isEnabled ? TX_ZKEVM_L2 : TX,
+      placeholderData: rollupFeature.isEnabled && rollupFeature.type === 'zkEvm' ? TX_ZKEVM_L2 : TX,
+      retry: (failureCount, error) => {
+        if (isRefetchEnabled) {
+          return false;
+        }
+
+        return retry(failureCount, error);
+      },
+      refetchInterval: (): number | false => {
+        return isRefetchEnabled ? 15 * SECOND : false;
+      },
     },
   });
-  const { data, isError, isPending } = queryResult;
+  const { data, isError, isPlaceholderData, isPending } = queryResult;
 
   const handleStatusUpdateMessage: SocketMessage.TxStatusUpdate['handler'] = React.useCallback(async() => {
-    updateDelay && await delay(updateDelay);
+    await delay(5 * SECOND);
     queryClient.invalidateQueries({
       queryKey: getResourceKey('tx', { pathParams: { hash } }),
     });
-    onTxStatusUpdate?.();
-  }, [ onTxStatusUpdate, queryClient, hash, updateDelay ]);
+  }, [ queryClient, hash ]);
 
   const handleSocketClose = React.useCallback(() => {
     setSocketStatus('close');
@@ -60,7 +82,7 @@ export default function useFetchTxInfo({ onTxStatusUpdate, updateDelay }: Params
     topic: `transactions:${ hash }`,
     onSocketClose: handleSocketClose,
     onSocketError: handleSocketError,
-    isDisabled: isPending || isError || data.status !== null,
+    isDisabled: isPending || isPlaceholderData || isError || data.status !== null,
   });
   useSocketMessage({
     channel,
@@ -68,8 +90,9 @@ export default function useFetchTxInfo({ onTxStatusUpdate, updateDelay }: Params
     handler: handleStatusUpdateMessage,
   });
 
-  return {
+  return React.useMemo(() => ({
     ...queryResult,
     socketStatus,
-  };
+    setRefetchOnError: setRefetchEnabled,
+  }), [ queryResult, socketStatus, setRefetchEnabled ]);
 }
diff --git a/ui/l2TxnBatches/TxnBatchesListItem.tsx b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesListItem.tsx
similarity index 75%
rename from ui/l2TxnBatches/TxnBatchesListItem.tsx
rename to ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesListItem.tsx
index 3efba7b03e..4a322b02e7 100644
--- a/ui/l2TxnBatches/TxnBatchesListItem.tsx
+++ b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesListItem.tsx
@@ -1,26 +1,25 @@
 import { Skeleton, VStack } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2TxnBatchesItem } from 'types/api/l2TxnBatches';
+import type { OptimisticL2TxnBatchesItem } from 'types/api/optimisticL2';
 
 import { route } from 'nextjs-routes';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
-import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1';
 import BlockEntityL2 from 'ui/shared/entities/block/BlockEntityL2';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 import LinkInternal from 'ui/shared/LinkInternal';
 import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
-type Props = { item: L2TxnBatchesItem; isLoading?: boolean };
+type Props = { item: OptimisticL2TxnBatchesItem; isLoading?: boolean };
 
-const TxnBatchesListItem = ({ item, isLoading }: Props) => {
+const OptimisticL2TxnBatchesListItem = ({ item, isLoading }: Props) => {
   const timeAgo = dayjs(item.l1_timestamp).fromNow();
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'optimistic') {
     return null;
   }
 
@@ -50,18 +49,6 @@ const TxnBatchesListItem = ({ item, isLoading }: Props) => {
         </LinkInternal>
       </ListItemMobileGrid.Value>
 
-      <ListItemMobileGrid.Label isLoading={ isLoading }>Epoch number</ListItemMobileGrid.Label>
-      <ListItemMobileGrid.Value>
-        <BlockEntityL1
-          isLoading={ isLoading }
-          number={ item.epoch_number }
-          noIcon
-          fontSize="sm"
-          lineHeight={ 5 }
-          fontWeight={ 600 }
-        />
-      </ListItemMobileGrid.Value>
-
       <ListItemMobileGrid.Label isLoading={ isLoading }>L1 txn hash</ListItemMobileGrid.Label>
       <ListItemMobileGrid.Value py="3px">
         <VStack spacing={ 3 } w="100%" overflow="hidden" alignItems="flex-start">
@@ -72,7 +59,7 @@ const TxnBatchesListItem = ({ item, isLoading }: Props) => {
               hash={ hash }
               fontSize="sm"
               lineHeight={ 5 }
-              maxW="100%"
+              truncation="constant_long"
             />
           )) }
         </VStack>
@@ -87,4 +74,4 @@ const TxnBatchesListItem = ({ item, isLoading }: Props) => {
   );
 };
 
-export default TxnBatchesListItem;
+export default OptimisticL2TxnBatchesListItem;
diff --git a/ui/l2TxnBatches/TxnBatchesTable.tsx b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesTable.tsx
similarity index 67%
rename from ui/l2TxnBatches/TxnBatchesTable.tsx
rename to ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesTable.tsx
index 17770faa01..3df60d996b 100644
--- a/ui/l2TxnBatches/TxnBatchesTable.tsx
+++ b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesTable.tsx
@@ -1,33 +1,32 @@
 import { Table, Tbody, Th, Tr } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2TxnBatchesItem } from 'types/api/l2TxnBatches';
+import type { OptimisticL2TxnBatchesItem } from 'types/api/optimisticL2';
 
 import { default as Thead } from 'ui/shared/TheadSticky';
 
-import TxnBatchesTableItem from './TxnBatchesTableItem';
+import OptimisticL2TxnBatchesTableItem from './OptimisticL2TxnBatchesTableItem';
 
 type Props = {
-  items: Array<L2TxnBatchesItem>;
+  items: Array<OptimisticL2TxnBatchesItem>;
   top: number;
   isLoading?: boolean;
 }
 
-const TxnBatchesTable = ({ items, top, isLoading }: Props) => {
+const OptimisticL2TxnBatchesTable = ({ items, top, isLoading }: Props) => {
   return (
     <Table variant="simple" size="sm" minW="850px">
       <Thead top={ top }>
         <Tr>
           <Th width="170px">L2 block #</Th>
           <Th width="170px">L2 block txn count</Th>
-          <Th width="160px">Epoch number</Th>
           <Th width="100%">L1 txn hash</Th>
           <Th width="150px">Age</Th>
         </Tr>
       </Thead>
       <Tbody>
         { items.map((item, index) => (
-          <TxnBatchesTableItem
+          <OptimisticL2TxnBatchesTableItem
             key={ item.l2_block_number + (isLoading ? String(index) : '') }
             item={ item }
             isLoading={ isLoading }
@@ -38,4 +37,4 @@ const TxnBatchesTable = ({ items, top, isLoading }: Props) => {
   );
 };
 
-export default TxnBatchesTable;
+export default OptimisticL2TxnBatchesTable;
diff --git a/ui/l2TxnBatches/TxnBatchesTableItem.tsx b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesTableItem.tsx
similarity index 72%
rename from ui/l2TxnBatches/TxnBatchesTableItem.tsx
rename to ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesTableItem.tsx
index 8409b8e736..4cc1b9e4b9 100644
--- a/ui/l2TxnBatches/TxnBatchesTableItem.tsx
+++ b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesTableItem.tsx
@@ -1,25 +1,24 @@
 import { Td, Tr, VStack, Skeleton } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2TxnBatchesItem } from 'types/api/l2TxnBatches';
+import type { OptimisticL2TxnBatchesItem } from 'types/api/optimisticL2';
 
 import { route } from 'nextjs-routes';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
-import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1';
 import BlockEntityL2 from 'ui/shared/entities/block/BlockEntityL2';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 import LinkInternal from 'ui/shared/LinkInternal';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
-type Props = { item: L2TxnBatchesItem; isLoading?: boolean };
+type Props = { item: OptimisticL2TxnBatchesItem; isLoading?: boolean };
 
-const TxnBatchesTableItem = ({ item, isLoading }: Props) => {
+const OptimisticL2TxnBatchesTableItem = ({ item, isLoading }: Props) => {
   const timeAgo = dayjs(item.l1_timestamp).fromNow();
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'optimistic') {
     return null;
   }
 
@@ -32,6 +31,7 @@ const TxnBatchesTableItem = ({ item, isLoading }: Props) => {
           fontSize="sm"
           lineHeight={ 5 }
           fontWeight={ 600 }
+          noIcon
         />
       </Td>
       <Td>
@@ -44,17 +44,6 @@ const TxnBatchesTableItem = ({ item, isLoading }: Props) => {
           </Skeleton>
         </LinkInternal>
       </Td>
-      <Td>
-        <BlockEntityL1
-          isLoading={ isLoading }
-          number={ item.epoch_number }
-          fontSize="sm"
-          lineHeight={ 5 }
-          fontWeight={ 600 }
-          py="2px"
-          noIcon
-        />
-      </Td>
       <Td pr={ 12 }>
         <VStack spacing={ 3 } alignItems="flex-start">
           { item.l1_tx_hashes.map(hash => (
@@ -64,7 +53,8 @@ const TxnBatchesTableItem = ({ item, isLoading }: Props) => {
               hash={ hash }
               fontSize="sm"
               lineHeight={ 5 }
-              maxW="100%"
+              truncation="constant_long"
+              noIcon
             />
           )) }
         </VStack>
@@ -78,4 +68,4 @@ const TxnBatchesTableItem = ({ item, isLoading }: Props) => {
   );
 };
 
-export default TxnBatchesTableItem;
+export default OptimisticL2TxnBatchesTableItem;
diff --git a/ui/zkEvmL2TxnBatches/ZkEvmL2TxnBatchDetails.tsx b/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx
similarity index 80%
rename from ui/zkEvmL2TxnBatches/ZkEvmL2TxnBatchDetails.tsx
rename to ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx
index 3d2b767863..950a2ccec7 100644
--- a/ui/zkEvmL2TxnBatches/ZkEvmL2TxnBatchDetails.tsx
+++ b/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx
@@ -3,23 +3,23 @@ import type { UseQueryResult } from '@tanstack/react-query';
 import { useRouter } from 'next/router';
 import React from 'react';
 
-import { ZKEVM_L2_TX_BATCH_STATUSES } from 'types/api/zkEvmL2TxnBatches';
-import type { ZkEvmL2TxnBatch } from 'types/api/zkEvmL2TxnBatches';
+import { ZKEVM_L2_TX_BATCH_STATUSES } from 'types/api/zkEvmL2';
+import type { ZkEvmL2TxnBatch } from 'types/api/zkEvmL2';
 
 import { route } from 'nextjs-routes';
 
 import type { ResourceError } from 'lib/api/resources';
-import dayjs from 'lib/date/dayjs';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import isCustomAppError from 'ui/shared/AppError/isCustomAppError';
 import CopyToClipboard from 'ui/shared/CopyToClipboard';
 import DataFetchAlert from 'ui/shared/DataFetchAlert';
 import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
 import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
+import DetailsTimestamp from 'ui/shared/DetailsTimestamp';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
-import IconSvg from 'ui/shared/IconSvg';
 import LinkInternal from 'ui/shared/LinkInternal';
 import PrevNext from 'ui/shared/PrevNext';
-import TextSeparator from 'ui/shared/TextSeparator';
 import VerificationSteps from 'ui/shared/verificationSteps/VerificationSteps';
 
 interface Props {
@@ -39,16 +39,12 @@ const ZkEvmL2TxnBatchDetails = ({ query }: Props) => {
     const increment = direction === 'next' ? +1 : -1;
     const nextId = String(data.number + increment);
 
-    router.push({ pathname: '/zkevm-l2-txn-batch/[number]', query: { number: nextId } }, undefined);
+    router.push({ pathname: '/batches/[number]', query: { number: nextId } }, undefined);
   }, [ data, router ]);
 
   if (isError) {
-    if (error?.status === 404) {
-      throw Error('Tx Batch not found', { cause: error as unknown as Error });
-    }
-
-    if (error?.status === 422) {
-      throw Error('Invalid tx batch number', { cause: error as unknown as Error });
+    if (isCustomAppError(error)) {
+      throwOnResourceLoadError({ isError, error });
     }
 
     return <DataFetchAlert/>;
@@ -91,14 +87,7 @@ const ZkEvmL2TxnBatchDetails = ({ query }: Props) => {
         title="Timestamp"
         isLoading={ isPlaceholderData }
       >
-        <IconSvg name="clock" boxSize={ 5 } color="gray.500" isLoading={ isPlaceholderData }/>
-        <Skeleton isLoaded={ !isPlaceholderData } ml={ 1 }>
-          { dayjs(data.timestamp).fromNow() }
-        </Skeleton>
-        <TextSeparator/>
-        <Skeleton isLoaded={ !isPlaceholderData } whiteSpace="normal">
-          { dayjs(data.timestamp).format('llll') }
-        </Skeleton>
+        { data.timestamp ? <DetailsTimestamp timestamp={ data.timestamp } isLoading={ isPlaceholderData }/> : 'Undefined' }
       </DetailsInfoItem>
       <DetailsInfoItem
         title="Verify tx hash"
@@ -110,14 +99,14 @@ const ZkEvmL2TxnBatchDetails = ({ query }: Props) => {
             hash={ data.verify_tx_hash }
             maxW="100%"
           />
-        ) : <Text>pending</Text> }
+        ) : <Text>Pending</Text> }
       </DetailsInfoItem>
       <DetailsInfoItem
         title="Transactions"
         isLoading={ isPlaceholderData }
       >
         <Skeleton isLoaded={ !isPlaceholderData }>
-          <LinkInternal href={ route({ pathname: '/zkevm-l2-txn-batch/[number]', query: { number: data.number.toString(), tab: 'txs' } }) }>
+          <LinkInternal href={ route({ pathname: '/batches/[number]', query: { number: data.number.toString(), tab: 'txs' } }) }>
             { data.transactions.length } transaction{ data.transactions.length === 1 ? '' : 's' }
           </LinkInternal>
         </Skeleton>
diff --git a/ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesListItem.tsx b/ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesListItem.tsx
similarity index 80%
rename from ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesListItem.tsx
rename to ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesListItem.tsx
index 4b99a2e6c3..401e64bbf3 100644
--- a/ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesListItem.tsx
+++ b/ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesListItem.tsx
@@ -1,26 +1,26 @@
 import { Skeleton, Text } from '@chakra-ui/react';
 import React from 'react';
 
-import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2';
 
 import { route } from 'nextjs-routes';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
-import ZkEvmBatchEntityL2 from 'ui/shared/entities/block/ZkEvmBatchEntityL2';
+import BatchEntityL2 from 'ui/shared/entities/block/BatchEntityL2';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 import LinkInternal from 'ui/shared/LinkInternal';
 import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
 import ZkEvmL2TxnBatchStatus from 'ui/shared/statusTag/ZkEvmL2TxnBatchStatus';
 
-const feature = config.features.zkEvmRollup;
+const rollupFeature = config.features.rollup;
 
 type Props = { item: ZkEvmL2TxnBatchesItem; isLoading?: boolean };
 
 const ZkEvmTxnBatchesListItem = ({ item, isLoading }: Props) => {
-  const timeAgo = dayjs(item.timestamp).fromNow();
+  const timeAgo = item.timestamp ? dayjs(item.timestamp).fromNow() : 'Undefined';
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'zkEvm') {
     return null;
   }
 
@@ -29,7 +29,7 @@ const ZkEvmTxnBatchesListItem = ({ item, isLoading }: Props) => {
 
       <ListItemMobileGrid.Label isLoading={ isLoading }>Batch #</ListItemMobileGrid.Label>
       <ListItemMobileGrid.Value>
-        <ZkEvmBatchEntityL2
+        <BatchEntityL2
           isLoading={ isLoading }
           number={ item.number }
           fontSize="sm"
@@ -51,7 +51,7 @@ const ZkEvmTxnBatchesListItem = ({ item, isLoading }: Props) => {
       <ListItemMobileGrid.Label isLoading={ isLoading }>Txn count</ListItemMobileGrid.Label>
       <ListItemMobileGrid.Value>
         <LinkInternal
-          href={ route({ pathname: '/zkevm-l2-txn-batch/[number]', query: { number: item.number.toString(), tab: 'txs' } }) }
+          href={ route({ pathname: '/batches/[number]', query: { number: item.number.toString(), tab: 'txs' } }) }
           isLoading={ isLoading }
           fontWeight={ 600 }
         >
@@ -61,7 +61,7 @@ const ZkEvmTxnBatchesListItem = ({ item, isLoading }: Props) => {
         </LinkInternal>
       </ListItemMobileGrid.Value>
 
-      <ListItemMobileGrid.Label isLoading={ isLoading }>Verify Tx Has</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Verify tx hash</ListItemMobileGrid.Label>
       <ListItemMobileGrid.Value>
         { item.verify_tx_hash ? (
           <TxEntityL1
@@ -69,7 +69,7 @@ const ZkEvmTxnBatchesListItem = ({ item, isLoading }: Props) => {
             hash={ item.verify_tx_hash }
             fontSize="sm"
             lineHeight={ 5 }
-            maxW="100%"
+            truncation="constant_long"
           />
         ) : <Text>Pending</Text> }
       </ListItemMobileGrid.Value>
@@ -82,7 +82,7 @@ const ZkEvmTxnBatchesListItem = ({ item, isLoading }: Props) => {
             hash={ item.sequence_tx_hash }
             fontSize="sm"
             lineHeight={ 5 }
-            maxW="100%"
+            truncation="constant_long"
           />
         ) : <Text>Pending</Text> }
       </ListItemMobileGrid.Value>
diff --git a/ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesTable.tsx b/ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesTable.tsx
similarity index 70%
rename from ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesTable.tsx
rename to ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesTable.tsx
index fabbc0ae70..33f25f1f8d 100644
--- a/ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesTable.tsx
+++ b/ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesTable.tsx
@@ -1,7 +1,7 @@
 import { Table, Tbody, Th, Tr } from '@chakra-ui/react';
 import React from 'react';
 
-import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2';
 
 import { default as Thead } from 'ui/shared/TheadSticky';
 
@@ -15,15 +15,15 @@ type Props = {
 
 const TxnBatchesTable = ({ items, top, isLoading }: Props) => {
   return (
-    <Table variant="simple" size="sm" minW="850px">
+    <Table variant="simple" size="sm" minW="1000px">
       <Thead top={ top }>
         <Tr>
-          <Th width="170px">Batch #</Th>
-          <Th width="150px">Status</Th>
+          <Th width="33%">Batch #</Th>
+          <Th width="33%">Status</Th>
           <Th width="150px">Age</Th>
-          <Th width="170px">Txn count</Th>
-          <Th width="50%">Verify Tx Has</Th>
-          <Th width="50%">Sequence hash</Th>
+          <Th width="150px">Txn count</Th>
+          <Th width="230px">Verify tx hash</Th>
+          <Th width="230px">Sequence hash</Th>
         </Tr>
       </Thead>
       <Tbody>
diff --git a/ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesTableItem.tsx b/ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesTableItem.tsx
similarity index 76%
rename from ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesTableItem.tsx
rename to ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesTableItem.tsx
index 3485414e71..a22c3e3fcd 100644
--- a/ui/zkEvmL2TxnBatches/ZkEvmTxnBatchesTableItem.tsx
+++ b/ui/txnBatches/zkEvmL2/ZkEvmTxnBatchesTableItem.tsx
@@ -1,37 +1,38 @@
 import { Td, Tr, Text, Skeleton } from '@chakra-ui/react';
 import React from 'react';
 
-import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2TxnBatches';
+import type { ZkEvmL2TxnBatchesItem } from 'types/api/zkEvmL2';
 
 import { route } from 'nextjs-routes';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
-import ZkEvmBatchEntityL2 from 'ui/shared/entities/block/ZkEvmBatchEntityL2';
+import BatchEntityL2 from 'ui/shared/entities/block/BatchEntityL2';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 import LinkInternal from 'ui/shared/LinkInternal';
 import ZkEvmL2TxnBatchStatus from 'ui/shared/statusTag/ZkEvmL2TxnBatchStatus';
 
-const feature = config.features.zkEvmRollup;
+const rollupFeature = config.features.rollup;
 
 type Props = { item: ZkEvmL2TxnBatchesItem; isLoading?: boolean };
 
 const TxnBatchesTableItem = ({ item, isLoading }: Props) => {
-  const timeAgo = dayjs(item.timestamp).fromNow();
+  const timeAgo = item.timestamp ? dayjs(item.timestamp).fromNow() : 'Undefined';
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'zkEvm') {
     return null;
   }
 
   return (
     <Tr>
       <Td verticalAlign="middle">
-        <ZkEvmBatchEntityL2
+        <BatchEntityL2
           isLoading={ isLoading }
           number={ item.number }
           fontSize="sm"
           lineHeight={ 5 }
           fontWeight={ 600 }
+          noIcon
         />
       </Td>
       <Td verticalAlign="middle">
@@ -44,7 +45,7 @@ const TxnBatchesTableItem = ({ item, isLoading }: Props) => {
       </Td>
       <Td verticalAlign="middle">
         <LinkInternal
-          href={ route({ pathname: '/zkevm-l2-txn-batch/[number]', query: { number: item.number.toString(), tab: 'txs' } }) }
+          href={ route({ pathname: '/batches/[number]', query: { number: item.number.toString(), tab: 'txs' } }) }
           isLoading={ isLoading }
         >
           <Skeleton isLoaded={ !isLoading } minW="40px" my={ 1 }>
@@ -59,7 +60,8 @@ const TxnBatchesTableItem = ({ item, isLoading }: Props) => {
             hash={ item.verify_tx_hash }
             fontSize="sm"
             lineHeight={ 5 }
-            maxW="100%"
+            truncation="constant_long"
+            noIcon
           />
         ) : <Text>Pending</Text> }
       </Td>
@@ -70,7 +72,8 @@ const TxnBatchesTableItem = ({ item, isLoading }: Props) => {
             hash={ item.sequence_tx_hash }
             fontSize="sm"
             lineHeight={ 5 }
-            maxW="100%"
+            truncation="constant_long"
+            noIcon
           />
         ) : <Text>Pending</Text> }
       </Td>
diff --git a/ui/txnBatches/zkSyncL2/ZkSyncL2TxnBatchDetails.tsx b/ui/txnBatches/zkSyncL2/ZkSyncL2TxnBatchDetails.tsx
new file mode 100644
index 0000000000..8505177d25
--- /dev/null
+++ b/ui/txnBatches/zkSyncL2/ZkSyncL2TxnBatchDetails.tsx
@@ -0,0 +1,180 @@
+import { Grid, GridItem, Link, Skeleton, Text } from '@chakra-ui/react';
+import type { UseQueryResult } from '@tanstack/react-query';
+import BigNumber from 'bignumber.js';
+import { useRouter } from 'next/router';
+import React from 'react';
+import { scroller, Element } from 'react-scroll';
+
+import { ZKSYNC_L2_TX_BATCH_STATUSES, type ZkSyncBatch } from 'types/api/zkSyncL2';
+
+import { route } from 'nextjs-routes';
+
+import type { ResourceError } from 'lib/api/resources';
+import { WEI, WEI_IN_GWEI } from 'lib/consts';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import { currencyUnits } from 'lib/units';
+import isCustomAppError from 'ui/shared/AppError/isCustomAppError';
+import CopyToClipboard from 'ui/shared/CopyToClipboard';
+import DataFetchAlert from 'ui/shared/DataFetchAlert';
+import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
+import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
+import DetailsTimestamp from 'ui/shared/DetailsTimestamp';
+import LinkInternal from 'ui/shared/LinkInternal';
+import PrevNext from 'ui/shared/PrevNext';
+import TruncatedValue from 'ui/shared/TruncatedValue';
+import VerificationSteps from 'ui/shared/verificationSteps/VerificationSteps';
+
+import ZkSyncL2TxnBatchHashesInfo from './ZkSyncL2TxnBatchHashesInfo';
+
+interface Props {
+  query: UseQueryResult<ZkSyncBatch, ResourceError>;
+}
+
+const ZkSyncL2TxnBatchDetails = ({ query }: Props) => {
+  const router = useRouter();
+  const [ isExpanded, setIsExpanded ] = React.useState(false);
+
+  const { data, isPlaceholderData, isError, error } = query;
+
+  const handlePrevNextClick = React.useCallback((direction: 'prev' | 'next') => {
+    if (!data) {
+      return;
+    }
+
+    const increment = direction === 'next' ? +1 : -1;
+    const nextId = String(data.number + increment);
+
+    router.push({ pathname: '/batches/[number]', query: { number: nextId } }, undefined);
+  }, [ data, router ]);
+
+  const handleCutClick = React.useCallback(() => {
+    setIsExpanded((flag) => !flag);
+    scroller.scrollTo('ZkSyncL2TxnBatchDetails__cutLink', {
+      duration: 500,
+      smooth: true,
+    });
+  }, []);
+
+  if (isError) {
+    if (isCustomAppError(error)) {
+      throwOnResourceLoadError({ isError, error });
+    }
+
+    return <DataFetchAlert/>;
+  }
+
+  if (!data) {
+    return null;
+  }
+
+  const txNum = data.l2_tx_count + data.l1_tx_count;
+
+  return (
+    <Grid
+      columnGap={ 8 }
+      rowGap={{ base: 3, lg: 3 }}
+      templateColumns={{ base: 'minmax(0, 1fr)', lg: 'minmax(min-content, 200px) minmax(0, 1fr)' }}
+      overflow="hidden"
+    >
+      <DetailsInfoItem
+        title="Tx batch number"
+        hint="Batch number indicates the length of batches produced by grouping L2 blocks to be proven on Ethereum."
+        isLoading={ isPlaceholderData }
+      >
+        <Skeleton isLoaded={ !isPlaceholderData }>
+          { data.number }
+        </Skeleton>
+        <PrevNext
+          ml={ 6 }
+          onClick={ handlePrevNextClick }
+          prevLabel="View previous tx batch"
+          nextLabel="View next tx batch"
+          isPrevDisabled={ data.number === 0 }
+          isLoading={ isPlaceholderData }
+        />
+      </DetailsInfoItem>
+
+      <DetailsInfoItem
+        title="Status"
+        hint="Status is the short interpretation of the batch lifecycle"
+        isLoading={ isPlaceholderData }
+      >
+        <VerificationSteps steps={ ZKSYNC_L2_TX_BATCH_STATUSES.slice(1) } currentStep={ data.status } isLoading={ isPlaceholderData }/>
+      </DetailsInfoItem>
+
+      <DetailsInfoItem
+        title="Timestamp"
+        hint="Date and time at which batch is produced"
+        isLoading={ isPlaceholderData }
+      >
+        { data.timestamp ? <DetailsTimestamp timestamp={ data.timestamp } isLoading={ isPlaceholderData }/> : 'Undefined' }
+      </DetailsInfoItem>
+
+      <DetailsInfoItem
+        title="Transactions"
+        hint="Number of transactions inside the batch."
+        isLoading={ isPlaceholderData }
+      >
+        <Skeleton isLoaded={ !isPlaceholderData }>
+          <LinkInternal href={ route({ pathname: '/batches/[number]', query: { number: data.number.toString(), tab: 'txs' } }) }>
+            { txNum } transaction{ txNum === 1 ? '' : 's' }
+          </LinkInternal>
+        </Skeleton>
+      </DetailsInfoItem>
+
+      <DetailsInfoItemDivider/>
+
+      <ZkSyncL2TxnBatchHashesInfo isLoading={ isPlaceholderData } data={ data }/>
+
+      <GridItem colSpan={{ base: undefined, lg: 2 }}>
+        <Element name="ZkSyncL2TxnBatchDetails__cutLink">
+          <Skeleton isLoaded={ !isPlaceholderData } mt={ 6 } display="inline-block">
+            <Link
+              display="inline-block"
+              fontSize="sm"
+              textDecorationLine="underline"
+              textDecorationStyle="dashed"
+              onClick={ handleCutClick }
+            >
+              { isExpanded ? 'Hide details' : 'View details' }
+            </Link>
+          </Skeleton>
+        </Element>
+      </GridItem>
+
+      { isExpanded && (
+        <>
+          <GridItem colSpan={{ base: undefined, lg: 2 }} mt={{ base: 1, lg: 4 }}/>
+
+          <DetailsInfoItem
+            title="Root hash"
+            hint="L1 batch root is a hash that summarizes batch data and submitted to the L1"
+            flexWrap="nowrap"
+            alignSelf="flex-start"
+          >
+            <TruncatedValue value={ data.root_hash }/>
+            <CopyToClipboard text={ data.root_hash }/>
+          </DetailsInfoItem>
+
+          <DetailsInfoItem
+            title="L1 gas price"
+            hint="Gas price for the batch settlement transaction on L1"
+          >
+            <Text mr={ 1 }>{ BigNumber(data.l1_gas_price).dividedBy(WEI).toFixed() } { currencyUnits.ether }</Text>
+            <Text variant="secondary">({ BigNumber(data.l1_gas_price).dividedBy(WEI_IN_GWEI).toFixed() } { currencyUnits.gwei })</Text>
+          </DetailsInfoItem>
+
+          <DetailsInfoItem
+            title="L2 fair gas price"
+            hint={ 'The gas price below which the "baseFee" of the batch should not fall' }
+          >
+            <Text mr={ 1 }>{ BigNumber(data.l2_fair_gas_price).dividedBy(WEI).toFixed() } { currencyUnits.ether }</Text>
+            <Text variant="secondary">({ BigNumber(data.l2_fair_gas_price).dividedBy(WEI_IN_GWEI).toFixed() } { currencyUnits.gwei })</Text>
+          </DetailsInfoItem>
+        </>
+      ) }
+    </Grid>
+  );
+};
+
+export default ZkSyncL2TxnBatchDetails;
diff --git a/ui/txnBatches/zkSyncL2/ZkSyncL2TxnBatchHashesInfo.tsx b/ui/txnBatches/zkSyncL2/ZkSyncL2TxnBatchHashesInfo.tsx
new file mode 100644
index 0000000000..bb0bfcb80d
--- /dev/null
+++ b/ui/txnBatches/zkSyncL2/ZkSyncL2TxnBatchHashesInfo.tsx
@@ -0,0 +1,101 @@
+import { Flex, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { ZkSyncBatch } from 'types/api/zkSyncL2';
+
+import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
+import DetailsTimestamp from 'ui/shared/DetailsTimestamp';
+import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
+
+interface Props {
+  isLoading: boolean;
+  data: Pick<
+  ZkSyncBatch,
+  'commit_transaction_hash' |
+  'commit_transaction_timestamp' |
+  'prove_transaction_hash' |
+  'prove_transaction_timestamp' |
+  'execute_transaction_hash' |
+  'execute_transaction_timestamp'
+  >;
+}
+
+const ZkSyncL2TxnBatchHashesInfo = ({ isLoading, data }: Props) => {
+  return (
+    <>
+      <DetailsInfoItem
+        title="Commit tx hash"
+        hint="Hash of L1 tx on which the batch was committed"
+        isLoading={ isLoading }
+        flexDir="column"
+        alignItems="flex-start"
+      >
+        { data.commit_transaction_hash ? (
+          <>
+            <TxEntityL1
+              isLoading={ isLoading }
+              hash={ data.commit_transaction_hash }
+              maxW="100%"
+              noCopy={ false }
+            />
+            { data.commit_transaction_timestamp && (
+              <Flex alignItems="center" flexWrap="wrap" rowGap={ 3 }>
+                <DetailsTimestamp timestamp={ data.commit_transaction_timestamp } isLoading={ isLoading }/>
+              </Flex>
+            ) }
+          </>
+        ) : <Skeleton isLoaded={ !isLoading }>Pending</Skeleton> }
+      </DetailsInfoItem>
+
+      <DetailsInfoItem
+        title="Prove tx hash"
+        hint="Hash of L1 tx on which the batch was proven"
+        isLoading={ isLoading }
+        flexDir="column"
+        alignItems="flex-start"
+      >
+        { data.prove_transaction_hash ? (
+          <>
+            <TxEntityL1
+              isLoading={ isLoading }
+              hash={ data.prove_transaction_hash }
+              maxW="100%"
+              noCopy={ false }
+            />
+            { data.prove_transaction_timestamp && (
+              <Flex alignItems="center" flexWrap="wrap" rowGap={ 3 }>
+                <DetailsTimestamp timestamp={ data.prove_transaction_timestamp } isLoading={ isLoading }/>
+              </Flex>
+            ) }
+          </>
+        ) : <Skeleton isLoaded={ !isLoading }>Pending</Skeleton> }
+      </DetailsInfoItem>
+
+      <DetailsInfoItem
+        title="Execute tx hash"
+        hint="Hash of L1 tx on which the batch was executed and finalized"
+        isLoading={ isLoading }
+        flexDir="column"
+        alignItems="flex-start"
+      >
+        { data.execute_transaction_hash ? (
+          <>
+            <TxEntityL1
+              isLoading={ isLoading }
+              hash={ data.execute_transaction_hash }
+              maxW="100%"
+              noCopy={ false }
+            />
+            { data.execute_transaction_timestamp && (
+              <Flex alignItems="center" flexWrap="wrap" rowGap={ 3 }>
+                <DetailsTimestamp timestamp={ data.execute_transaction_timestamp } isLoading={ isLoading }/>
+              </Flex>
+            ) }
+          </>
+        ) : <Skeleton isLoaded={ !isLoading }>Pending</Skeleton> }
+      </DetailsInfoItem>
+    </>
+  );
+};
+
+export default React.memo(ZkSyncL2TxnBatchHashesInfo);
diff --git a/ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesListItem.tsx b/ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesListItem.tsx
new file mode 100644
index 0000000000..d930604763
--- /dev/null
+++ b/ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesListItem.tsx
@@ -0,0 +1,94 @@
+import { Skeleton, Text } from '@chakra-ui/react';
+import React from 'react';
+
+import type { ZkSyncBatchesItem } from 'types/api/zkSyncL2';
+
+import { route } from 'nextjs-routes';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import BatchEntityL2 from 'ui/shared/entities/block/BatchEntityL2';
+import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
+import LinkInternal from 'ui/shared/LinkInternal';
+import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
+import ZkSyncL2TxnBatchStatus from 'ui/shared/statusTag/ZkSyncL2TxnBatchStatus';
+
+const rollupFeature = config.features.rollup;
+
+type Props = { item: ZkSyncBatchesItem; isLoading?: boolean };
+
+const ZkSyncTxnBatchesListItem = ({ item, isLoading }: Props) => {
+  const timeAgo = item.timestamp ? dayjs(item.timestamp).fromNow() : 'Undefined';
+
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'zkSync') {
+    return null;
+  }
+
+  return (
+    <ListItemMobileGrid.Container gridTemplateColumns="110px auto">
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Batch #</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <BatchEntityL2
+          isLoading={ isLoading }
+          number={ item.number }
+          fontSize="sm"
+          lineHeight={ 5 }
+          fontWeight={ 600 }
+        />
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Status</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <ZkSyncL2TxnBatchStatus status={ item.status } isLoading={ isLoading }/>
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Age</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <Skeleton isLoaded={ !isLoading } display="inline-block">{ timeAgo }</Skeleton>
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Txn count</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <LinkInternal
+          href={ route({ pathname: '/batches/[number]', query: { number: item.number.toString(), tab: 'txs' } }) }
+          isLoading={ isLoading }
+          fontWeight={ 600 }
+        >
+          <Skeleton isLoaded={ !isLoading } minW="40px">
+            { item.tx_count }
+          </Skeleton>
+        </LinkInternal>
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Commit tx</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        { item.commit_transaction_hash ? (
+          <TxEntityL1
+            isLoading={ isLoading }
+            hash={ item.commit_transaction_hash }
+            fontSize="sm"
+            lineHeight={ 5 }
+            truncation="constant_long"
+          />
+        ) : <Text>Pending</Text> }
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Prove tx</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        { item.prove_transaction_hash ? (
+          <TxEntityL1
+            isLoading={ isLoading }
+            hash={ item.prove_transaction_hash }
+            fontSize="sm"
+            lineHeight={ 5 }
+            truncation="constant_long"
+          />
+        ) : <Text>Pending</Text> }
+      </ListItemMobileGrid.Value>
+
+    </ListItemMobileGrid.Container>
+  );
+};
+
+export default ZkSyncTxnBatchesListItem;
diff --git a/ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesTable.tsx b/ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesTable.tsx
new file mode 100644
index 0000000000..d96754466f
--- /dev/null
+++ b/ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesTable.tsx
@@ -0,0 +1,42 @@
+import { Table, Tbody, Th, Tr } from '@chakra-ui/react';
+import React from 'react';
+
+import type { ZkSyncBatchesItem } from 'types/api/zkSyncL2';
+
+import { default as Thead } from 'ui/shared/TheadSticky';
+
+import ZkSyncTxnBatchesTableItem from './ZkSyncTxnBatchesTableItem';
+
+type Props = {
+  items: Array<ZkSyncBatchesItem>;
+  top: number;
+  isLoading?: boolean;
+}
+
+const ZkSyncTxnBatchesTable = ({ items, top, isLoading }: Props) => {
+  return (
+    <Table variant="simple" size="sm" minW="1000px">
+      <Thead top={ top }>
+        <Tr>
+          <Th width="40%">Batch #</Th>
+          <Th width="60%">Status</Th>
+          <Th width="150px">Age</Th>
+          <Th width="150px">Txn count</Th>
+          <Th width="210px">Commit tx</Th>
+          <Th width="210px">Prove tx</Th>
+        </Tr>
+      </Thead>
+      <Tbody>
+        { items.map((item, index) => (
+          <ZkSyncTxnBatchesTableItem
+            key={ item.number + (isLoading ? String(index) : '') }
+            item={ item }
+            isLoading={ isLoading }
+          />
+        )) }
+      </Tbody>
+    </Table>
+  );
+};
+
+export default ZkSyncTxnBatchesTable;
diff --git a/ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesTableItem.tsx b/ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesTableItem.tsx
new file mode 100644
index 0000000000..82a2f93fdf
--- /dev/null
+++ b/ui/txnBatches/zkSyncL2/ZkSyncTxnBatchesTableItem.tsx
@@ -0,0 +1,84 @@
+import { Td, Tr, Text, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { ZkSyncBatchesItem } from 'types/api/zkSyncL2';
+
+import { route } from 'nextjs-routes';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import BatchEntityL2 from 'ui/shared/entities/block/BatchEntityL2';
+import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
+import LinkInternal from 'ui/shared/LinkInternal';
+import ZkSyncL2TxnBatchStatus from 'ui/shared/statusTag/ZkSyncL2TxnBatchStatus';
+
+const rollupFeature = config.features.rollup;
+
+type Props = { item: ZkSyncBatchesItem; isLoading?: boolean };
+
+const ZkSyncTxnBatchesTableItem = ({ item, isLoading }: Props) => {
+  const timeAgo = item.timestamp ? dayjs(item.timestamp).fromNow() : 'Undefined';
+
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'zkSync') {
+    return null;
+  }
+
+  return (
+    <Tr>
+      <Td verticalAlign="middle">
+        <BatchEntityL2
+          isLoading={ isLoading }
+          number={ item.number }
+          fontSize="sm"
+          lineHeight={ 5 }
+          fontWeight={ 600 }
+          noIcon
+        />
+      </Td>
+      <Td verticalAlign="middle">
+        <ZkSyncL2TxnBatchStatus status={ item.status } isLoading={ isLoading }/>
+      </Td>
+      <Td verticalAlign="middle">
+        <Skeleton isLoaded={ !isLoading } color="text_secondary">
+          <span>{ timeAgo }</span>
+        </Skeleton>
+      </Td>
+      <Td verticalAlign="middle">
+        <LinkInternal
+          href={ route({ pathname: '/batches/[number]', query: { number: item.number.toString(), tab: 'txs' } }) }
+          isLoading={ isLoading }
+        >
+          <Skeleton isLoaded={ !isLoading } minW="40px" my={ 1 }>
+            { item.tx_count }
+          </Skeleton>
+        </LinkInternal>
+      </Td>
+      <Td verticalAlign="middle">
+        { item.commit_transaction_hash ? (
+          <TxEntityL1
+            isLoading={ isLoading }
+            hash={ item.commit_transaction_hash }
+            fontSize="sm"
+            lineHeight={ 5 }
+            truncation="constant_long"
+            noIcon
+          />
+        ) : <Text>Pending</Text> }
+      </Td>
+      <Td verticalAlign="middle">
+        { item.prove_transaction_hash ? (
+          <TxEntityL1
+            isLoading={ isLoading }
+            hash={ item.prove_transaction_hash }
+            fontSize="sm"
+            lineHeight={ 5 }
+            truncation="constant_long"
+            noIcon
+          />
+        ) : <Text>Pending</Text> }
+      </Td>
+    </Tr>
+  );
+};
+
+export default ZkSyncTxnBatchesTableItem;
diff --git a/ui/txs/TxAdditionalInfo.pw.tsx b/ui/txs/TxAdditionalInfo.pw.tsx
new file mode 100644
index 0000000000..3b12be42a5
--- /dev/null
+++ b/ui/txs/TxAdditionalInfo.pw.tsx
@@ -0,0 +1,43 @@
+import { test, expect } from '@playwright/experimental-ct-react';
+import React from 'react';
+
+import * as txMock from 'mocks/txs/tx';
+import TestApp from 'playwright/TestApp';
+
+import TxAdditionalInfo from './TxAdditionalInfo';
+
+test('regular transaction +@dark-mode', async({ mount, page }) => {
+  const component = await mount(
+    <TestApp>
+      <TxAdditionalInfo tx={ txMock.base }/>
+    </TestApp>,
+  );
+
+  await component.getByLabel('Transaction info').click();
+
+  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 400, height: 600 } });
+});
+
+test('regular transaction +@mobile -@default', async({ mount, page }) => {
+  const component = await mount(
+    <TestApp>
+      <TxAdditionalInfo tx={ txMock.base } isMobile/>
+    </TestApp>,
+  );
+
+  await component.getByLabel('Transaction info').click();
+
+  await expect(page).toHaveScreenshot();
+});
+
+test('blob transaction', async({ mount, page }) => {
+  const component = await mount(
+    <TestApp>
+      <TxAdditionalInfo tx={ txMock.withBlob }/>
+    </TestApp>,
+  );
+
+  await component.getByLabel('Transaction info').click();
+
+  await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 400, height: 600 } });
+});
diff --git a/ui/txs/TxAdditionalInfo.tsx b/ui/txs/TxAdditionalInfo.tsx
index 8450dc7546..3acba5141f 100644
--- a/ui/txs/TxAdditionalInfo.tsx
+++ b/ui/txs/TxAdditionalInfo.tsx
@@ -1,4 +1,5 @@
 import {
+  chakra,
   Modal,
   ModalContent,
   ModalCloseButton,
@@ -28,9 +29,10 @@ type Props =
   }) & {
     isMobile?: boolean;
     isLoading?: boolean;
+    className?: string;
   }
 
-const TxAdditionalInfo = ({ hash, tx, isMobile, isLoading }: Props) => {
+const TxAdditionalInfo = ({ hash, tx, isMobile, isLoading, className }: Props) => {
   const { isOpen, onOpen, onClose } = useDisclosure();
 
   const content = hash !== undefined ? <TxAdditionalInfoContainer hash={ hash }/> : <TxAdditionalInfoContent tx={ tx }/>;
@@ -38,7 +40,7 @@ const TxAdditionalInfo = ({ hash, tx, isMobile, isLoading }: Props) => {
   if (isMobile) {
     return (
       <>
-        <AdditionalInfoButton onClick={ onOpen } isLoading={ isLoading }/>
+        <AdditionalInfoButton onClick={ onOpen } isLoading={ isLoading } className={ className }/>
         <Modal isOpen={ isOpen } onClose={ onClose } size="full">
           <ModalContent paddingTop={ 4 }>
             <ModalCloseButton/>
@@ -53,10 +55,10 @@ const TxAdditionalInfo = ({ hash, tx, isMobile, isLoading }: Props) => {
       { ({ isOpen }) => (
         <>
           <PopoverTrigger>
-            <AdditionalInfoButton isOpen={ isOpen } isLoading={ isLoading }/>
+            <AdditionalInfoButton isOpen={ isOpen } isLoading={ isLoading } className={ className }/>
           </PopoverTrigger>
           <PopoverContent border="1px solid" borderColor="divider">
-            <PopoverBody>
+            <PopoverBody fontWeight={ 400 } fontSize="sm">
               { content }
             </PopoverBody>
           </PopoverContent>
@@ -66,4 +68,4 @@ const TxAdditionalInfo = ({ hash, tx, isMobile, isLoading }: Props) => {
   );
 };
 
-export default React.memo(TxAdditionalInfo);
+export default React.memo(chakra(TxAdditionalInfo));
diff --git a/ui/txs/TxAdditionalInfoContent.tsx b/ui/txs/TxAdditionalInfoContent.tsx
index e16a768439..88588ea06a 100644
--- a/ui/txs/TxAdditionalInfoContent.tsx
+++ b/ui/txs/TxAdditionalInfoContent.tsx
@@ -8,7 +8,9 @@ import { route } from 'nextjs-routes';
 
 import config from 'configs/app';
 import getValueWithUnit from 'lib/getValueWithUnit';
+import { currencyUnits } from 'lib/units';
 import CurrencyValue from 'ui/shared/CurrencyValue';
+import BlobEntity from 'ui/shared/entities/blob/BlobEntity';
 import LinkInternal from 'ui/shared/LinkInternal';
 import TextSeparator from 'ui/shared/TextSeparator';
 import TxFeeStability from 'ui/shared/tx/TxFeeStability';
@@ -25,12 +27,34 @@ const TxAdditionalInfoContent = ({ tx }: { tx: Transaction }) => {
     color: 'gray.500',
     fontWeight: 600,
     marginBottom: 3,
-    fontSize: 'sm',
   };
 
   return (
     <>
       <Heading as="h4" size="sm" mb={ 6 }>Additional info </Heading>
+      { tx.blob_versioned_hashes && tx.blob_versioned_hashes.length > 0 && (
+        <Box { ...sectionProps } mb={ 4 }>
+          <Flex alignItems="center" justifyContent="space-between">
+            <Text { ...sectionTitleProps }>Blobs: { tx.blob_versioned_hashes.length }</Text>
+            { tx.blob_versioned_hashes.length > 3 && (
+              <LinkInternal
+                href={ route({ pathname: '/tx/[hash]', query: { hash: tx.hash, tab: 'blobs' } }) }
+                mb={ 3 }
+              >
+                view all
+              </LinkInternal>
+            ) }
+          </Flex>
+          <Flex flexDir="column" rowGap={ 3 }>
+            { tx.blob_versioned_hashes.slice(0, 3).map((hash, index) => (
+              <Flex key={ hash } columnGap={ 2 }>
+                <Box fontWeight={ 500 }>{ index + 1 }</Box>
+                <BlobEntity hash={ hash } noIcon/>
+              </Flex>
+            )) }
+          </Flex>
+        </Box>
+      ) }
       { !config.UI.views.tx.hiddenFields?.tx_fee && (
         <Box { ...sectionProps } mb={ 4 }>
           { (tx.stability_fee !== undefined || tx.fee.value !== null) && (
@@ -42,7 +66,7 @@ const TxAdditionalInfoContent = ({ tx }: { tx: Transaction }) => {
                 <Flex>
                   <CurrencyValue
                     value={ tx.fee.value }
-                    currency={ config.UI.views.tx.hiddenFields?.fee_currency ? '' : config.chain.currency.symbol }
+                    currency={ config.UI.views.tx.hiddenFields?.fee_currency ? '' : currencyUnits.ether }
                     exchangeRate={ tx.exchange_rate }
                     accuracyUsd={ 2 }
                     flexWrap="wrap"
@@ -68,44 +92,46 @@ const TxAdditionalInfoContent = ({ tx }: { tx: Transaction }) => {
       { !config.UI.views.tx.hiddenFields?.gas_fees &&
         (tx.base_fee_per_gas !== null || tx.max_fee_per_gas !== null || tx.max_priority_fee_per_gas !== null) && (
         <Box { ...sectionProps } mb={ 4 }>
-          <Text { ...sectionTitleProps }>Gas fees (Gwei)</Text>
+          <Text { ...sectionTitleProps }>Gas fees ({ currencyUnits.gwei })</Text>
           { tx.base_fee_per_gas !== null && (
             <Box>
               <Text as="span" fontWeight="500">Base: </Text>
-              <Text fontWeight="600" as="span">{ getValueWithUnit(tx.base_fee_per_gas, 'gwei').toFormat() }</Text>
+              <Text fontWeight="700" as="span">{ getValueWithUnit(tx.base_fee_per_gas, 'gwei').toFormat() }</Text>
             </Box>
           ) }
           { tx.max_fee_per_gas !== null && (
             <Box mt={ 1 }>
               <Text as="span" fontWeight="500">Max: </Text>
-              <Text fontWeight="600" as="span">{ getValueWithUnit(tx.max_fee_per_gas, 'gwei').toFormat() }</Text>
+              <Text fontWeight="700" as="span">{ getValueWithUnit(tx.max_fee_per_gas, 'gwei').toFormat() }</Text>
             </Box>
           ) }
           { tx.max_priority_fee_per_gas !== null && (
             <Box mt={ 1 }>
               <Text as="span" fontWeight="500">Max priority: </Text>
-              <Text fontWeight="600" as="span">{ getValueWithUnit(tx.max_priority_fee_per_gas, 'gwei').toFormat() }</Text>
+              <Text fontWeight="700" as="span">{ getValueWithUnit(tx.max_priority_fee_per_gas, 'gwei').toFormat() }</Text>
             </Box>
           ) }
         </Box>
       ) }
-      <Box { ...sectionProps } mb={ 4 }>
-        <Text { ...sectionTitleProps }>Others</Text>
-        <Box>
-          <Text as="span" fontWeight="500">Txn type: </Text>
-          <Text fontWeight="600" as="span">{ tx.type }</Text>
-          { tx.type === 2 && <Text fontWeight="400" as="span" ml={ 1 } color="gray.500">(EIP-1559)</Text> }
-        </Box>
-        <Box mt={ 1 }>
-          <Text as="span" fontWeight="500">Nonce: </Text>
-          <Text fontWeight="600" as="span">{ tx.nonce }</Text>
-        </Box>
-        <Box mt={ 1 }>
-          <Text as="span" fontWeight="500">Position: </Text>
-          <Text fontWeight="600" as="span">{ tx.position }</Text>
+      { !(tx.blob_versioned_hashes && tx.blob_versioned_hashes.length > 0) && (
+        <Box { ...sectionProps } mb={ 4 }>
+          <Text { ...sectionTitleProps }>Others</Text>
+          <Box>
+            <Text as="span" fontWeight="500">Txn type: </Text>
+            <Text fontWeight="600" as="span">{ tx.type }</Text>
+            { tx.type === 2 && <Text fontWeight="400" as="span" ml={ 1 } color="gray.500">(EIP-1559)</Text> }
+          </Box>
+          <Box mt={ 1 }>
+            <Text as="span" fontWeight="500">Nonce: </Text>
+            <Text fontWeight="600" as="span">{ tx.nonce }</Text>
+          </Box>
+          <Box mt={ 1 }>
+            <Text as="span" fontWeight="500">Position: </Text>
+            <Text fontWeight="600" as="span">{ tx.position }</Text>
+          </Box>
         </Box>
-      </Box>
-      <LinkInternal fontSize="sm" href={ route({ pathname: '/tx/[hash]', query: { hash: tx.hash } }) }>More details</LinkInternal>
+      ) }
+      <LinkInternal href={ route({ pathname: '/tx/[hash]', query: { hash: tx.hash } }) }>More details</LinkInternal>
     </>
   );
 };
diff --git a/ui/txs/TxTranslationType.tsx b/ui/txs/TxTranslationType.tsx
new file mode 100644
index 0000000000..4086efb80f
--- /dev/null
+++ b/ui/txs/TxTranslationType.tsx
@@ -0,0 +1,32 @@
+import React from 'react';
+
+import type { TransactionType } from 'types/api/transaction';
+
+import Tag from 'ui/shared/chakra/Tag';
+
+import { camelCaseToSentence } from './noves/utils';
+import TxType from './TxType';
+
+export interface Props {
+  types: Array<TransactionType>;
+  isLoading?: boolean;
+  translatationType: string | undefined;
+}
+
+const TxTranslationType = ({ types, isLoading, translatationType }: Props) => {
+
+  const filteredTypes = [ 'unclassified' ];
+
+  if (!translatationType || filteredTypes.includes(translatationType)) {
+    return <TxType types={ types } isLoading={ isLoading }/>;
+  }
+
+  return (
+    <Tag colorScheme="purple" isLoading={ isLoading }>
+      { camelCaseToSentence(translatationType) }
+    </Tag>
+  );
+
+};
+
+export default TxTranslationType;
diff --git a/ui/txs/TxType.tsx b/ui/txs/TxType.tsx
index fe856096dc..fb772a9584 100644
--- a/ui/txs/TxType.tsx
+++ b/ui/txs/TxType.tsx
@@ -9,7 +9,16 @@ export interface Props {
   isLoading?: boolean;
 }
 
-const TYPES_ORDER = [ 'rootstock_remasc', 'rootstock_bridge', 'token_creation', 'contract_creation', 'token_transfer', 'contract_call', 'coin_transfer' ];
+const TYPES_ORDER: Array<TransactionType> = [
+  'blob_transaction',
+  'rootstock_remasc',
+  'rootstock_bridge',
+  'token_creation',
+  'contract_creation',
+  'token_transfer',
+  'contract_call',
+  'coin_transfer',
+];
 
 const TxType = ({ types, isLoading }: Props) => {
   const typeToShow = types.sort((t1, t2) => TYPES_ORDER.indexOf(t1) - TYPES_ORDER.indexOf(t2))[0];
@@ -22,6 +31,10 @@ const TxType = ({ types, isLoading }: Props) => {
       label = 'Contract call';
       colorScheme = 'blue';
       break;
+    case 'blob_transaction':
+      label = 'Blob txn';
+      colorScheme = 'yellow';
+      break;
     case 'contract_creation':
       label = 'Contract creation';
       colorScheme = 'blue';
diff --git a/ui/txs/TxsContent.tsx b/ui/txs/TxsContent.tsx
index 101a7ed31c..44f687afc5 100644
--- a/ui/txs/TxsContent.tsx
+++ b/ui/txs/TxsContent.tsx
@@ -1,4 +1,4 @@
-import { Box, Show, Hide } from '@chakra-ui/react';
+import { Show, Hide } from '@chakra-ui/react';
 import React from 'react';
 
 import type { AddressFromToFilter } from 'types/api/address';
@@ -8,11 +8,11 @@ import useIsMobile from 'lib/hooks/useIsMobile';
 import AddressCsvExportLink from 'ui/address/AddressCsvExportLink';
 import DataListDisplay from 'ui/shared/DataListDisplay';
 import type { QueryWithPagesResult } from 'ui/shared/pagination/useQueryWithPages';
-import * as SocketNewItemsNotice from 'ui/shared/SocketNewItemsNotice';
 import getNextSortValue from 'ui/shared/sort/getNextSortValue';
 
+import useDescribeTxs from './noves/useDescribeTxs';
 import TxsHeaderMobile from './TxsHeaderMobile';
-import TxsListItem from './TxsListItem';
+import TxsList from './TxsList';
 import TxsTable from './TxsTable';
 
 const SORT_SEQUENCE: Record<TransactionsSortingField, Array<TransactionsSortingValue | undefined>> = {
@@ -63,33 +63,25 @@ const TxsContent = ({
     setSorting(value);
   }, [ sort, setSorting ]);
 
-  const content = items ? (
+  const itemsWithTranslation = useDescribeTxs(items, currentAddress, query.isPlaceholderData);
+
+  const content = itemsWithTranslation ? (
     <>
       <Show below="lg" ssr={ false }>
-        <Box>
-          { showSocketInfo && (
-            <SocketNewItemsNotice.Mobile
-              url={ window.location.href }
-              num={ socketInfoNum }
-              alert={ socketInfoAlert }
-              isLoading={ isPlaceholderData }
-            />
-          ) }
-          { items.map((tx, index) => (
-            <TxsListItem
-              key={ tx.hash + (isPlaceholderData ? index : '') }
-              tx={ tx }
-              showBlockInfo={ showBlockInfo }
-              currentAddress={ currentAddress }
-              enableTimeIncrement={ enableTimeIncrement }
-              isLoading={ isPlaceholderData }
-            />
-          )) }
-        </Box>
+        <TxsList
+          showBlockInfo={ showBlockInfo }
+          showSocketInfo={ showSocketInfo }
+          socketInfoAlert={ socketInfoAlert }
+          socketInfoNum={ socketInfoNum }
+          isLoading={ isPlaceholderData }
+          enableTimeIncrement={ enableTimeIncrement }
+          currentAddress={ currentAddress }
+          items={ itemsWithTranslation }
+        />
       </Show>
       <Hide below="lg" ssr={ false }>
         <TxsTable
-          txs={ items }
+          txs={ itemsWithTranslation }
           sort={ onSortToggle }
           sorting={ sort }
           showBlockInfo={ showBlockInfo }
@@ -127,7 +119,7 @@ const TxsContent = ({
   return (
     <DataListDisplay
       isError={ isError }
-      items={ items }
+      items={ itemsWithTranslation }
       emptyText="There are no transactions."
       content={ content }
       actionBar={ actionBar }
diff --git a/ui/txs/TxsList.tsx b/ui/txs/TxsList.tsx
new file mode 100644
index 0000000000..3ae05589b7
--- /dev/null
+++ b/ui/txs/TxsList.tsx
@@ -0,0 +1,50 @@
+import { Box } from '@chakra-ui/react';
+import React from 'react';
+
+import type { Transaction } from 'types/api/transaction';
+
+import useLazyRenderedList from 'lib/hooks/useLazyRenderedList';
+import * as SocketNewItemsNotice from 'ui/shared/SocketNewItemsNotice';
+
+import TxsListItem from './TxsListItem';
+
+interface Props {
+  showBlockInfo: boolean;
+  showSocketInfo?: boolean;
+  socketInfoAlert?: string;
+  socketInfoNum?: number;
+  enableTimeIncrement?: boolean;
+  currentAddress?: string;
+  isLoading: boolean;
+  items: Array<Transaction>;
+}
+
+const TxsList = (props: Props) => {
+  const { cutRef, renderedItemsNum } = useLazyRenderedList(props.items, !props.isLoading);
+
+  return (
+    <Box>
+      { props.showSocketInfo && (
+        <SocketNewItemsNotice.Mobile
+          url={ window.location.href }
+          num={ props.socketInfoNum }
+          alert={ props.socketInfoAlert }
+          isLoading={ props.isLoading }
+        />
+      ) }
+      { props.items.slice(0, renderedItemsNum).map((tx, index) => (
+        <TxsListItem
+          key={ tx.hash + (props.isLoading ? index : '') }
+          tx={ tx }
+          showBlockInfo={ props.showBlockInfo }
+          currentAddress={ props.currentAddress }
+          enableTimeIncrement={ props.enableTimeIncrement }
+          isLoading={ props.isLoading }
+        />
+      )) }
+      <Box ref={ cutRef } h={ 0 }/>
+    </Box>
+  );
+};
+
+export default React.memo(TxsList);
diff --git a/ui/txs/TxsListItem.tsx b/ui/txs/TxsListItem.tsx
index 84ac614f50..654c83239c 100644
--- a/ui/txs/TxsListItem.tsx
+++ b/ui/txs/TxsListItem.tsx
@@ -11,11 +11,10 @@ import config from 'configs/app';
 import getValueWithUnit from 'lib/getValueWithUnit';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
 import { space } from 'lib/html-entities';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import { currencyUnits } from 'lib/units';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import IconSvg from 'ui/shared/IconSvg';
-import InOutTag from 'ui/shared/InOutTag';
 import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile';
 import TxStatus from 'ui/shared/statusTag/TxStatus';
 import TxFeeStability from 'ui/shared/tx/TxFeeStability';
@@ -23,6 +22,8 @@ import TxWatchListTags from 'ui/shared/tx/TxWatchListTags';
 import TxAdditionalInfo from 'ui/txs/TxAdditionalInfo';
 import TxType from 'ui/txs/TxType';
 
+import TxTranslationType from './TxTranslationType';
+
 type Props = {
   tx: Transaction;
   showBlockInfo: boolean;
@@ -31,22 +32,19 @@ type Props = {
   isLoading?: boolean;
 }
 
-const TAG_WIDTH = 48;
-const ARROW_WIDTH = 24;
-
 const TxsListItem = ({ tx, isLoading, showBlockInfo, currentAddress, enableTimeIncrement }: Props) => {
   const dataTo = tx.to ? tx.to : tx.created_contract;
 
-  const isOut = Boolean(currentAddress && currentAddress === tx.from.hash);
-  const isIn = Boolean(currentAddress && currentAddress === tx.to?.hash);
-
   const timeAgo = useTimeAgoIncrement(tx.timestamp, enableTimeIncrement);
 
   return (
     <ListItemMobile display="block" width="100%" isAnimated key={ tx.hash }>
       <Flex justifyContent="space-between" mt={ 4 }>
         <HStack flexWrap="wrap">
-          <TxType types={ tx.tx_types } isLoading={ isLoading }/>
+          { tx.translation ?
+            <TxTranslationType types={ tx.tx_types } isLoading={ isLoading || tx.translation.isLoading } translatationType={ tx.translation.data?.type }/> :
+            <TxType types={ tx.tx_types } isLoading={ isLoading }/>
+          }
           <TxStatus status={ tx.status } errorText={ tx.status === 'error' ? tx.result : undefined } isLoading={ isLoading }/>
           <TxWatchListTags tx={ tx } isLoading={ isLoading }/>
         </HStack>
@@ -56,7 +54,7 @@ const TxsListItem = ({ tx, isLoading, showBlockInfo, currentAddress, enableTimeI
         <TxEntity
           isLoading={ isLoading }
           hash={ tx.hash }
-          truncation="constant"
+          truncation="constant_long"
           fontWeight="700"
         />
         { tx.timestamp && (
@@ -89,44 +87,21 @@ const TxsListItem = ({ tx, isLoading, showBlockInfo, currentAddress, enableTimeI
           />
         </Flex>
       ) }
-      <Flex alignItems="center" height={ 6 } mt={ 6 }>
-        <AddressEntity
-          address={ tx.from }
-          isLoading={ isLoading }
-          noLink={ isOut }
-          noCopy={ isOut }
-          w={ `calc((100% - ${ currentAddress ? TAG_WIDTH + 16 : ARROW_WIDTH + 8 }px)/2)` }
-          fontWeight="500"
-        />
-        { (isIn || isOut) ?
-          <InOutTag isIn={ isIn } isOut={ isOut } width="48px" mx={ 2 } isLoading={ isLoading }/> : (
-            <IconSvg
-              name="arrows/east"
-              boxSize={ 6 }
-              color="gray.500"
-              isLoading={ isLoading }
-              mx={ 2 }
-              flexShrink={ 0 }
-            />
-          ) }
-        { dataTo ? (
-          <AddressEntity
-            address={ dataTo }
-            isLoading={ isLoading }
-            noLink={ isIn }
-            noCopy={ isIn }
-            w={ `calc((100% - ${ currentAddress ? TAG_WIDTH + 16 : ARROW_WIDTH + 8 }px)/2)` }
-            fontWeight="500"
-          />
-        ) : '-' }
-      </Flex>
+      <AddressFromTo
+        from={ tx.from }
+        to={ dataTo }
+        current={ currentAddress }
+        isLoading={ isLoading }
+        mt={ 6 }
+        fontWeight="500"
+      />
       { !config.UI.views.tx.hiddenFields?.value && (
         <Flex mt={ 2 } columnGap={ 2 }>
           <Skeleton isLoaded={ !isLoading } display="inline-block" whiteSpace="pre">Value</Skeleton>
           <Skeleton isLoaded={ !isLoading } display="inline-block" variant="text_secondary" whiteSpace="pre">
             { getValueWithUnit(tx.value).toFormat() }
             { space }
-            { config.chain.currency.symbol }
+            { currencyUnits.ether }
           </Skeleton>
         </Flex>
       ) }
@@ -140,7 +115,7 @@ const TxsListItem = ({ tx, isLoading, showBlockInfo, currentAddress, enableTimeI
               ) : (
                 <Skeleton isLoaded={ !isLoading } display="inline-block" variant="text_secondary" whiteSpace="pre">
                   { getValueWithUnit(tx.fee.value || 0).toFormat() }
-                  { config.UI.views.tx.hiddenFields?.fee_currency ? '' : ` ${ config.chain.currency.symbol }` }
+                  { config.UI.views.tx.hiddenFields?.fee_currency ? '' : ` ${ currencyUnits.ether }` }
                 </Skeleton>
               ) }
             </>
diff --git a/ui/txs/TxsTable.pw.tsx b/ui/txs/TxsTable.pw.tsx
index c2433456b5..7cd4d86eb6 100644
--- a/ui/txs/TxsTable.pw.tsx
+++ b/ui/txs/TxsTable.pw.tsx
@@ -17,6 +17,8 @@ test.describe('base view', () => {
       </TestApp>,
     );
 
+    await component.getByText('kitty').first().hover();
+
     await expect(component).toHaveScreenshot();
   });
 
@@ -31,6 +33,8 @@ test.describe('base view', () => {
         </TestApp>,
       );
 
+      await component.getByText('kitty').first().hover();
+
       await expect(component).toHaveScreenshot();
     });
   });
diff --git a/ui/txs/TxsTable.tsx b/ui/txs/TxsTable.tsx
index c1946320fd..d581056365 100644
--- a/ui/txs/TxsTable.tsx
+++ b/ui/txs/TxsTable.tsx
@@ -1,10 +1,13 @@
-import { Link, Table, Tbody, Tr, Th, Show, Hide } from '@chakra-ui/react';
+import { Link, Table, Tbody, Tr, Th } from '@chakra-ui/react';
 import { AnimatePresence } from 'framer-motion';
 import React from 'react';
 
 import type { Transaction, TransactionsSortingField, TransactionsSortingValue } from 'types/api/transaction';
 
 import config from 'configs/app';
+import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
+import useLazyRenderedList from 'lib/hooks/useLazyRenderedList';
+import { currencyUnits } from 'lib/units';
 import IconSvg from 'ui/shared/IconSvg';
 import * as SocketNewItemsNotice from 'ui/shared/SocketNewItemsNotice';
 import TheadSticky from 'ui/shared/TheadSticky';
@@ -38,66 +41,64 @@ const TxsTable = ({
   enableTimeIncrement,
   isLoading,
 }: Props) => {
+  const { cutRef, renderedItemsNum } = useLazyRenderedList(txs, !isLoading);
+
   return (
-    <Table variant="simple" minWidth="950px" size="xs">
-      <TheadSticky top={ top }>
-        <Tr>
-          <Th width="54px"></Th>
-          <Th width="22%">Txn hash</Th>
-          <Th width="160px">Type</Th>
-          <Th width="20%">Method</Th>
-          { showBlockInfo && <Th width="18%">Block</Th> }
-          <Th width={{ xl: '152px', base: '86px' }}>
-            <Show above="xl" ssr={ false }>From</Show>
-            <Hide above="xl" ssr={ false }>From / To</Hide>
-          </Th>
-          <Th width={{ xl: currentAddress ? '48px' : '36px', base: currentAddress ? '52px' : '28px' }}></Th>
-          <Th width={{ xl: '152px', base: '86px' }}>
-            <Show above="xl" ssr={ false }>To</Show>
-          </Th>
-          { !config.UI.views.tx.hiddenFields?.value && (
-            <Th width="20%" isNumeric>
-              <Link onClick={ sort('value') } display="flex" justifyContent="end">
-                { sorting === 'value-asc' && <IconSvg boxSize={ 5 } name="arrows/east" transform="rotate(-90deg)"/> }
-                { sorting === 'value-desc' && <IconSvg boxSize={ 5 } name="arrows/east" transform="rotate(90deg)"/> }
-                { `Value ${ config.chain.currency.symbol }` }
-              </Link>
-            </Th>
-          ) }
-          { !config.UI.views.tx.hiddenFields?.tx_fee && (
-            <Th width="20%" isNumeric pr={ 5 }>
-              <Link onClick={ sort('fee') } display="flex" justifyContent="end">
-                { sorting === 'fee-asc' && <IconSvg boxSize={ 5 } name="arrows/east" transform="rotate(-90deg)"/> }
-                { sorting === 'fee-desc' && <IconSvg boxSize={ 5 } name="arrows/east" transform="rotate(90deg)"/> }
-                { `Fee${ config.UI.views.tx.hiddenFields?.fee_currency ? '' : ` ${ config.chain.currency.symbol }` }` }
-              </Link>
-            </Th>
-          ) }
-        </Tr>
-      </TheadSticky>
-      <Tbody>
-        { showSocketInfo && (
-          <SocketNewItemsNotice.Desktop
-            url={ window.location.href }
-            alert={ socketInfoAlert }
-            num={ socketInfoNum }
-            isLoading={ isLoading }
-          />
-        ) }
-        <AnimatePresence initial={ false }>
-          { txs.map((item, index) => (
-            <TxsTableItem
-              key={ item.hash + (isLoading ? index : '') }
-              tx={ item }
-              showBlockInfo={ showBlockInfo }
-              currentAddress={ currentAddress }
-              enableTimeIncrement={ enableTimeIncrement }
+    <AddressHighlightProvider>
+      <Table variant="simple" minWidth="950px" size="xs">
+        <TheadSticky top={ top }>
+          <Tr>
+            <Th width="54px"></Th>
+            <Th width="180px">Txn hash</Th>
+            <Th width="160px">Type</Th>
+            <Th width="20%">Method</Th>
+            { showBlockInfo && <Th width="18%">Block</Th> }
+            <Th width="224px">From/To</Th>
+            { !config.UI.views.tx.hiddenFields?.value && (
+              <Th width="20%" isNumeric>
+                <Link onClick={ sort('value') } display="flex" justifyContent="end">
+                  { sorting === 'value-asc' && <IconSvg boxSize={ 5 } name="arrows/east" transform="rotate(-90deg)"/> }
+                  { sorting === 'value-desc' && <IconSvg boxSize={ 5 } name="arrows/east" transform="rotate(90deg)"/> }
+                  { `Value ${ currencyUnits.ether }` }
+                </Link>
+              </Th>
+            ) }
+            { !config.UI.views.tx.hiddenFields?.tx_fee && (
+              <Th width="20%" isNumeric pr={ 5 }>
+                <Link onClick={ sort('fee') } display="flex" justifyContent="end">
+                  { sorting === 'fee-asc' && <IconSvg boxSize={ 5 } name="arrows/east" transform="rotate(-90deg)"/> }
+                  { sorting === 'fee-desc' && <IconSvg boxSize={ 5 } name="arrows/east" transform="rotate(90deg)"/> }
+                  { `Fee${ config.UI.views.tx.hiddenFields?.fee_currency ? '' : ` ${ currencyUnits.ether }` }` }
+                </Link>
+              </Th>
+            ) }
+          </Tr>
+        </TheadSticky>
+        <Tbody>
+          { showSocketInfo && (
+            <SocketNewItemsNotice.Desktop
+              url={ window.location.href }
+              alert={ socketInfoAlert }
+              num={ socketInfoNum }
               isLoading={ isLoading }
             />
-          )) }
-        </AnimatePresence>
-      </Tbody>
-    </Table>
+          ) }
+          <AnimatePresence initial={ false }>
+            { txs.slice(0, renderedItemsNum).map((item, index) => (
+              <TxsTableItem
+                key={ item.hash + (isLoading ? index : '') }
+                tx={ item }
+                showBlockInfo={ showBlockInfo }
+                currentAddress={ currentAddress }
+                enableTimeIncrement={ enableTimeIncrement }
+                isLoading={ isLoading }
+              />
+            )) }
+          </AnimatePresence>
+        </Tbody>
+      </Table>
+      <div ref={ cutRef }/>
+    </AddressHighlightProvider>
   );
 };
 
diff --git a/ui/txs/TxsTableItem.tsx b/ui/txs/TxsTableItem.tsx
index eb95016674..216003bfeb 100644
--- a/ui/txs/TxsTableItem.tsx
+++ b/ui/txs/TxsTableItem.tsx
@@ -2,11 +2,7 @@ import {
   Tr,
   Td,
   VStack,
-  Show,
-  Hide,
-  Flex,
   Skeleton,
-  Box,
 } from '@chakra-ui/react';
 import { motion } from 'framer-motion';
 import React from 'react';
@@ -15,18 +11,17 @@ import type { Transaction } from 'types/api/transaction';
 
 import config from 'configs/app';
 import useTimeAgoIncrement from 'lib/hooks/useTimeAgoIncrement';
+import AddressFromTo from 'ui/shared/address/AddressFromTo';
 import Tag from 'ui/shared/chakra/Tag';
 import CurrencyValue from 'ui/shared/CurrencyValue';
-import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';
-import IconSvg from 'ui/shared/IconSvg';
-import InOutTag from 'ui/shared/InOutTag';
 import TxStatus from 'ui/shared/statusTag/TxStatus';
 import TxFeeStability from 'ui/shared/tx/TxFeeStability';
 import TxWatchListTags from 'ui/shared/tx/TxWatchListTags';
 import TxAdditionalInfo from 'ui/txs/TxAdditionalInfo';
 
+import TxTranslationType from './TxTranslationType';
 import TxType from './TxType';
 
 type Props = {
@@ -39,35 +34,8 @@ type Props = {
 
 const TxsTableItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement, isLoading }: Props) => {
   const dataTo = tx.to ? tx.to : tx.created_contract;
-  const isOut = Boolean(currentAddress && currentAddress === tx.from.hash);
-  const isIn = Boolean(currentAddress && currentAddress === dataTo?.hash);
-
   const timeAgo = useTimeAgoIncrement(tx.timestamp, enableTimeIncrement);
 
-  const addressFrom = (
-    <AddressEntity
-      address={ tx.from }
-      isLoading={ isLoading }
-      noCopy={ isOut }
-      noLink={ isOut }
-      truncation="constant"
-      w="100%"
-      py="2px"
-    />
-  );
-
-  const addressTo = dataTo ? (
-    <AddressEntity
-      address={ dataTo }
-      isLoading={ isLoading }
-      truncation="constant"
-      noCopy={ isIn }
-      noLink={ isIn }
-      w="100%"
-      py="2px"
-    />
-  ) : '-';
-
   return (
     <Tr
       as={ motion.tr }
@@ -88,13 +56,17 @@ const TxsTableItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement,
             fontWeight={ 700 }
             noIcon
             maxW="100%"
+            truncation="constant_long"
           />
           { tx.timestamp && <Skeleton color="text_secondary" fontWeight="400" isLoaded={ !isLoading }><span>{ timeAgo }</span></Skeleton> }
         </VStack>
       </Td>
       <Td>
         <VStack alignItems="start">
-          <TxType types={ tx.tx_types } isLoading={ isLoading }/>
+          { tx.translation ?
+            <TxTranslationType types={ tx.tx_types } isLoading={ isLoading || tx.translation.isLoading } translatationType={ tx.translation.data?.type }/> :
+            <TxType types={ tx.tx_types } isLoading={ isLoading }/>
+          }
           <TxStatus status={ tx.status } errorText={ tx.status === 'error' ? tx.result : undefined } isLoading={ isLoading }/>
           <TxWatchListTags tx={ tx } isLoading={ isLoading }/>
         </VStack>
@@ -120,42 +92,16 @@ const TxsTableItem = ({ tx, showBlockInfo, currentAddress, enableTimeIncrement,
           ) }
         </Td>
       ) }
-      <Show above="xl" ssr={ false }>
-        <Td>
-          { addressFrom }
-        </Td>
-        <Td px={ 0 }>
-          { (isIn || isOut) ?
-            <InOutTag isIn={ isIn } isOut={ isOut } width="48px" mr={ 2 } isLoading={ isLoading }/> : (
-              <Box mx="6px">
-                <IconSvg name="arrows/east" boxSize={ 6 } color="gray.500" isLoading={ isLoading }/>
-              </Box>
-            ) }
-        </Td>
-        <Td>
-          { addressTo }
-        </Td>
-      </Show>
-      <Hide above="xl" ssr={ false }>
-        <Td colSpan={ 3 }>
-          <Flex alignItems="center">
-            { (isIn || isOut) ?
-              <InOutTag isIn={ isIn } isOut={ isOut } width="48px" isLoading={ isLoading }/> : (
-                <IconSvg
-                  name="arrows/east"
-                  boxSize={ 6 }
-                  color="gray.500"
-                  transform="rotate(90deg)"
-                  isLoading={ isLoading }
-                />
-              ) }
-            <VStack alignItems="start" overflow="hidden" ml={ 1 }>
-              { addressFrom }
-              { addressTo }
-            </VStack>
-          </Flex>
-        </Td>
-      </Hide>
+      <Td>
+        <AddressFromTo
+          from={ tx.from }
+          to={ dataTo }
+          current={ currentAddress }
+          isLoading={ isLoading }
+          mt="2px"
+          mode="compact"
+        />
+      </Td>
       { !config.UI.views.tx.hiddenFields?.value && (
         <Td isNumeric>
           <CurrencyValue value={ tx.value } accuracy={ 8 } isLoading={ isLoading }/>
diff --git a/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_dark-color-mode_regular-transaction-dark-mode-1.png b/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_dark-color-mode_regular-transaction-dark-mode-1.png
new file mode 100644
index 0000000000..da0dcb7bc2
Binary files /dev/null and b/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_dark-color-mode_regular-transaction-dark-mode-1.png differ
diff --git a/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_default_blob-transaction-1.png b/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_default_blob-transaction-1.png
new file mode 100644
index 0000000000..878f198c9b
Binary files /dev/null and b/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_default_blob-transaction-1.png differ
diff --git a/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_default_regular-transaction-dark-mode-1.png b/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_default_regular-transaction-dark-mode-1.png
new file mode 100644
index 0000000000..e1a2be103b
Binary files /dev/null and b/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_default_regular-transaction-dark-mode-1.png differ
diff --git a/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_mobile_regular-transaction-mobile---default-1.png b/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_mobile_regular-transaction-mobile---default-1.png
new file mode 100644
index 0000000000..c632730f0f
Binary files /dev/null and b/ui/txs/__screenshots__/TxAdditionalInfo.pw.tsx_mobile_regular-transaction-mobile---default-1.png differ
diff --git a/ui/txs/__screenshots__/TxsListItem.pw.tsx_dark-color-mode_base-view-dark-mode-1.png b/ui/txs/__screenshots__/TxsListItem.pw.tsx_dark-color-mode_base-view-dark-mode-1.png
index 50ff51df8f..3e12af58d1 100644
Binary files a/ui/txs/__screenshots__/TxsListItem.pw.tsx_dark-color-mode_base-view-dark-mode-1.png and b/ui/txs/__screenshots__/TxsListItem.pw.tsx_dark-color-mode_base-view-dark-mode-1.png differ
diff --git a/ui/txs/__screenshots__/TxsListItem.pw.tsx_default_base-view-dark-mode-1.png b/ui/txs/__screenshots__/TxsListItem.pw.tsx_default_base-view-dark-mode-1.png
index 304fba7300..0cb72cb8d0 100644
Binary files a/ui/txs/__screenshots__/TxsListItem.pw.tsx_default_base-view-dark-mode-1.png and b/ui/txs/__screenshots__/TxsListItem.pw.tsx_default_base-view-dark-mode-1.png differ
diff --git a/ui/txs/__screenshots__/TxsListItem.pw.tsx_default_with-base-address-1.png b/ui/txs/__screenshots__/TxsListItem.pw.tsx_default_with-base-address-1.png
index ac6657a22a..175908210a 100644
Binary files a/ui/txs/__screenshots__/TxsListItem.pw.tsx_default_with-base-address-1.png and b/ui/txs/__screenshots__/TxsListItem.pw.tsx_default_with-base-address-1.png differ
diff --git a/ui/txs/__screenshots__/TxsTable.pw.tsx_dark-color-mode_base-view-dark-mode-1.png b/ui/txs/__screenshots__/TxsTable.pw.tsx_dark-color-mode_base-view-dark-mode-1.png
index a0d6907004..f2715618aa 100644
Binary files a/ui/txs/__screenshots__/TxsTable.pw.tsx_dark-color-mode_base-view-dark-mode-1.png and b/ui/txs/__screenshots__/TxsTable.pw.tsx_dark-color-mode_base-view-dark-mode-1.png differ
diff --git a/ui/txs/__screenshots__/TxsTable.pw.tsx_default_base-view-dark-mode-1.png b/ui/txs/__screenshots__/TxsTable.pw.tsx_default_base-view-dark-mode-1.png
index c27152bc67..1f20725451 100644
Binary files a/ui/txs/__screenshots__/TxsTable.pw.tsx_default_base-view-dark-mode-1.png and b/ui/txs/__screenshots__/TxsTable.pw.tsx_default_base-view-dark-mode-1.png differ
diff --git a/ui/txs/__screenshots__/TxsTable.pw.tsx_default_base-view-screen-xl-1.png b/ui/txs/__screenshots__/TxsTable.pw.tsx_default_base-view-screen-xl-1.png
index f4a76d6f03..79573c1691 100644
Binary files a/ui/txs/__screenshots__/TxsTable.pw.tsx_default_base-view-screen-xl-1.png and b/ui/txs/__screenshots__/TxsTable.pw.tsx_default_base-view-screen-xl-1.png differ
diff --git a/ui/txs/noves/useDescribeTxs.tsx b/ui/txs/noves/useDescribeTxs.tsx
new file mode 100644
index 0000000000..d9081492cd
--- /dev/null
+++ b/ui/txs/noves/useDescribeTxs.tsx
@@ -0,0 +1,89 @@
+import { useQuery } from '@tanstack/react-query';
+import _ from 'lodash';
+import React from 'react';
+
+import type { NovesDescribeTxsResponse } from 'types/api/noves';
+import type { Transaction } from 'types/api/transaction';
+
+import config from 'configs/app';
+import useApiFetch from 'lib/api/useApiFetch';
+
+const feature = config.features.txInterpretation;
+
+const translateEnabled = feature.isEnabled && feature.provider === 'noves';
+
+export default function useDescribeTxs(items: Array<Transaction> | undefined, viewAsAccountAddress: string | undefined, isPlaceholderData: boolean) {
+  const apiFetch = useApiFetch();
+
+  const txsHash = _.uniq(items?.map(i => i.hash));
+  const txChunks = _.chunk(txsHash, 10);
+
+  const queryKey = {
+    viewAsAccountAddress,
+    firstHash: txsHash[0] || '',
+    lastHash: txsHash[txsHash.length - 1] || '',
+  };
+
+  const describeQuery = useQuery({
+    queryKey: [ 'noves_describe_txs', queryKey ],
+    queryFn: async() => {
+      const queries = txChunks.map((hashes) => {
+        if (hashes.length === 0) {
+          return Promise.resolve([]);
+        }
+
+        return apiFetch('noves_describe_txs', {
+          queryParams: {
+            viewAsAccountAddress,
+            hashes,
+          },
+        }) as Promise<NovesDescribeTxsResponse>;
+      });
+
+      return Promise.all(queries);
+    },
+    select: (data) => {
+      return data.flat();
+    },
+    enabled: translateEnabled && !isPlaceholderData,
+  });
+
+  const itemsWithTranslation = React.useMemo(() => items?.map(tx => {
+    const queryData = describeQuery.data;
+    const isLoading = describeQuery.isLoading;
+
+    if (isLoading) {
+      return {
+        ...tx,
+        translation: {
+          isLoading,
+        },
+      };
+    }
+
+    if (!queryData || !translateEnabled) {
+      return tx;
+    }
+
+    const query = queryData.find(data => data.txHash.toLowerCase() === tx.hash.toLowerCase());
+
+    if (query) {
+      return {
+        ...tx,
+        translation: {
+          data: query,
+          isLoading: false,
+        },
+      };
+    }
+
+    return tx;
+  }), [ items, describeQuery ]);
+
+  if (!translateEnabled || isPlaceholderData) {
+    return items;
+  }
+
+  // return same "items" array of Transaction with a new "translation" field.
+  return itemsWithTranslation;
+}
diff --git a/ui/txs/noves/utils.ts b/ui/txs/noves/utils.ts
new file mode 100644
index 0000000000..c5a986b66a
--- /dev/null
+++ b/ui/txs/noves/utils.ts
@@ -0,0 +1,11 @@
+export function camelCaseToSentence(camelCaseString: string | undefined) {
+  if (!camelCaseString) {
+    return '';
+  }
+
+  let sentence = camelCaseString.replace(/([a-z])([A-Z])/g, '$1 $2');
+  sentence = sentence.replace(/([A-Z])([A-Z][a-z])/g, '$1 $2');
+  sentence = sentence.charAt(0).toUpperCase() + sentence.slice(1);
+
+  return sentence;
+}
diff --git a/ui/txs/sortTxs.test.ts b/ui/txs/sortTxs.test.ts
new file mode 100644
index 0000000000..d4d33e5b92
--- /dev/null
+++ b/ui/txs/sortTxs.test.ts
@@ -0,0 +1,79 @@
+import type { Transaction } from 'types/api/transaction';
+
+import sortTxs, { sortTxsFromSocket } from './sortTxs';
+
+describe('sortTxs', () => {
+  it('should sort transactions by value in descending order', () => {
+    const txs = [
+      { value: '42' },
+      { value: '11' },
+      { value: '24' },
+    ] as Array<Transaction>;
+    const result = txs.sort(sortTxs('value-desc'));
+    expect(result).toEqual([
+      { value: '42' },
+      { value: '24' },
+      { value: '11' },
+    ]);
+  });
+
+  it('should sort transactions by value in ascending order', () => {
+    const txs = [
+      { value: '42' },
+      { value: '11' },
+      { value: '24' },
+    ] as Array<Transaction>;
+    const result = txs.sort(sortTxs('value-asc'));
+    expect(result).toEqual([
+      { value: '11' },
+      { value: '24' },
+      { value: '42' },
+    ]);
+  });
+
+  it('should sort transactions by fee in descending order', () => {
+    const txs = [
+      { fee: { value: '42' } },
+      { fee: { value: '11' } },
+      { fee: { value: '24' } },
+    ] as Array<Transaction>;
+    const result = txs.sort(sortTxs('fee-desc'));
+    expect(result).toEqual([
+      { fee: { value: '42' } },
+      { fee: { value: '24' } },
+      { fee: { value: '11' } },
+    ]);
+  });
+
+  it('should sort transactions by fee in ascending order', () => {
+    const txs = [
+      { fee: { value: '42' } },
+      { fee: { value: '11' } },
+      { fee: { value: '24' } },
+    ] as Array<Transaction>;
+    const result = txs.sort(sortTxs('fee-asc'));
+    expect(result).toEqual([
+      { fee: { value: '11' } },
+      { fee: { value: '24' } },
+      { fee: { value: '42' } },
+    ]);
+  });
+});
+
+describe('sortTxsFromSocket', () => {
+  it('should sort transaction by age in ascending order if sorting is not provided', () => {
+    const txs = [
+      { timestamp: '2022-11-01T12:33:00Z' },
+      { timestamp: '2022-11-01T12:00:00Z' },
+      { timestamp: null },
+      { timestamp: '2022-11-03T03:03:00Z' },
+    ] as Array<Transaction>;
+    const result = txs.sort(sortTxsFromSocket(undefined));
+    expect(result).toEqual([
+      { timestamp: null },
+      { timestamp: '2022-11-03T03:03:00Z' },
+      { timestamp: '2022-11-01T12:33:00Z' },
+      { timestamp: '2022-11-01T12:00:00Z' },
+    ]);
+  });
+});
diff --git a/ui/txs/sortTxs.ts b/ui/txs/sortTxs.ts
new file mode 100644
index 0000000000..3993612e4c
--- /dev/null
+++ b/ui/txs/sortTxs.ts
@@ -0,0 +1,38 @@
+import type { Transaction, TransactionsSortingValue } from 'types/api/transaction';
+
+import compareBns from 'lib/bigint/compareBns';
+
+export default function sortTxs(sorting: TransactionsSortingValue | undefined) {
+  return function sortingFn(tx1: Transaction, tx2: Transaction) {
+    switch (sorting) {
+      case 'value-desc':
+        return compareBns(tx2.value, tx1.value);
+      case 'value-asc':
+        return compareBns(tx1.value, tx2.value);
+      case 'fee-desc':
+        return compareBns(tx2.fee.value || 0, tx1.fee.value || 0);
+      case 'fee-asc':
+        return compareBns(tx1.fee.value || 0, tx2.fee.value || 0);
+      default:
+        return 0;
+    }
+  };
+}
+
+export function sortTxsFromSocket(sorting: TransactionsSortingValue | undefined) {
+  if (sorting) {
+    return sortTxs(sorting);
+  }
+
+  return function sortingFn(tx1: Transaction, tx2: Transaction) {
+    if (!tx1.timestamp) {
+      return -1;
+    }
+
+    if (!tx2.timestamp) {
+      return 1;
+    }
+
+    return tx2.timestamp.localeCompare(tx1.timestamp);
+  };
+}
diff --git a/ui/txs/useTxsSort.tsx b/ui/txs/useTxsSort.tsx
index bee6eefddd..c2ec9d8377 100644
--- a/ui/txs/useTxsSort.tsx
+++ b/ui/txs/useTxsSort.tsx
@@ -1,13 +1,14 @@
 import type { UseQueryResult } from '@tanstack/react-query';
 import React from 'react';
 
-import type { Transaction, TransactionsSortingValue, TxsResponse } from 'types/api/transaction';
+import type { TransactionsSortingValue, TxsResponse } from 'types/api/transaction';
 
 import type { ResourceError } from 'lib/api/resources';
-import compareBns from 'lib/bigint/compareBns';
 import * as cookies from 'lib/cookies';
 import type { Option } from 'ui/shared/sort/Sort';
 
+import sortTxs from './sortTxs';
+
 export const SORT_OPTIONS: Array<Option<TransactionsSortingValue>> = [
   { title: 'Default', id: undefined },
   { title: 'Value ascending', id: 'value-asc' },
@@ -23,21 +24,6 @@ type HookResult = UseQueryResult<TxsResponse, ResourceError<unknown>> & {
   setSortByValue: (value: SortingValue) => void;
 }
 
-const sortTxs = (sorting: SortingValue) => (tx1: Transaction, tx2: Transaction) => {
-  switch (sorting) {
-    case 'value-desc':
-      return compareBns(tx1.value, tx2.value);
-    case 'value-asc':
-      return compareBns(tx2.value, tx1.value);
-    case 'fee-desc':
-      return compareBns(tx1.fee.value || 0, tx2.fee.value || 0);
-    case 'fee-asc':
-      return compareBns(tx2.fee.value || 0, tx1.fee.value || 0);
-    default:
-      return 0;
-  }
-};
-
 export default function useTxsSort(
   queryResult: UseQueryResult<TxsResponse, ResourceError<unknown>>,
 ): HookResult {
diff --git a/ui/userOp/UserOpDetails.tsx b/ui/userOp/UserOpDetails.tsx
new file mode 100644
index 0000000000..9d06807485
--- /dev/null
+++ b/ui/userOp/UserOpDetails.tsx
@@ -0,0 +1,315 @@
+import { Grid, GridItem, Text, Link, Skeleton } from '@chakra-ui/react';
+import type { UseQueryResult } from '@tanstack/react-query';
+import BigNumber from 'bignumber.js';
+import React from 'react';
+import { scroller, Element } from 'react-scroll';
+
+import type { UserOp } from 'types/api/userOps';
+
+import config from 'configs/app';
+import type { ResourceError } from 'lib/api/resources';
+import { WEI, WEI_IN_GWEI } from 'lib/consts';
+import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
+import { space } from 'lib/html-entities';
+import { currencyUnits } from 'lib/units';
+import isCustomAppError from 'ui/shared/AppError/isCustomAppError';
+import CurrencyValue from 'ui/shared/CurrencyValue';
+import DataFetchAlert from 'ui/shared/DataFetchAlert';
+import DetailsInfoItem from 'ui/shared/DetailsInfoItem';
+import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
+import DetailsTimestamp from 'ui/shared/DetailsTimestamp';
+import AddressStringOrParam from 'ui/shared/entities/address/AddressStringOrParam';
+import BlockEntity from 'ui/shared/entities/block/BlockEntity';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+import UserOpEntity from 'ui/shared/entities/userOp/UserOpEntity';
+import RawInputData from 'ui/shared/RawInputData';
+import UserOpSponsorType from 'ui/shared/userOps/UserOpSponsorType';
+import UserOpStatus from 'ui/shared/userOps/UserOpStatus';
+import Utilization from 'ui/shared/Utilization/Utilization';
+
+import UserOpDetailsActions from './UserOpDetailsActions';
+
+interface Props {
+  query: UseQueryResult<UserOp, ResourceError>;
+}
+
+const CUT_LINK_NAME = 'UserOpDetails__cutLink';
+
+const UserOpDetails = ({ query }: Props) => {
+  const [ isExpanded, setIsExpanded ] = React.useState(false);
+
+  const { data, isPlaceholderData, isError, error } = query;
+
+  const handleCutClick = React.useCallback(() => {
+    setIsExpanded((flag) => !flag);
+    scroller.scrollTo(CUT_LINK_NAME, {
+      duration: 500,
+      smooth: true,
+    });
+  }, []);
+
+  if (isError) {
+    if (error?.status === 400 || isCustomAppError(error)) {
+      throwOnResourceLoadError({ isError, error });
+    }
+
+    return <DataFetchAlert/>;
+  }
+
+  if (!data) {
+    return null;
+  }
+
+  return (
+    <Grid
+      columnGap={ 8 }
+      rowGap={{ base: 3, lg: 3 }}
+      templateColumns={{ base: 'minmax(0, 1fr)', lg: 'minmax(min-content, 220px) minmax(0, 1fr)' }}
+      overflow="hidden"
+    >
+      <DetailsInfoItem
+        title="User operation hash"
+        hint="Unique character string assigned to every User operation"
+        isLoading={ isPlaceholderData }
+      >
+        <Skeleton isLoaded={ !isPlaceholderData } overflow="hidden">
+          <UserOpEntity hash={ data.hash } noIcon noLink noCopy={ false }/>
+        </Skeleton>
+      </DetailsInfoItem>
+      <DetailsInfoItem
+        title="Sender"
+        hint="The address of the smart contract account"
+        isLoading={ isPlaceholderData }
+      >
+        <AddressStringOrParam address={ data.sender } isLoading={ isPlaceholderData }/>
+      </DetailsInfoItem>
+      <DetailsInfoItem
+        title="Status"
+        hint="Current User operation state"
+        isLoading={ isPlaceholderData }
+      >
+        <UserOpStatus status={ data.status } isLoading={ isPlaceholderData }/>
+      </DetailsInfoItem>
+      { data.revert_reason && (
+        <DetailsInfoItem
+          title="Revert reason"
+          hint="The revert reason of the User operation"
+          isLoading={ isPlaceholderData }
+          wordBreak="break-all"
+          whiteSpace="normal"
+        >
+          <Skeleton isLoaded={ !isPlaceholderData }>
+            { data.revert_reason }
+          </Skeleton>
+        </DetailsInfoItem>
+      ) }
+      { data.timestamp && (
+        <DetailsInfoItem
+          title="Timestamp"
+          hint="Date and time of User operation"
+          isLoading={ isPlaceholderData }
+        >
+          <DetailsTimestamp timestamp={ data.timestamp } isLoading={ isPlaceholderData }/>
+        </DetailsInfoItem>
+      ) }
+      { !config.UI.views.tx.hiddenFields?.tx_fee && (
+        <DetailsInfoItem
+          title="Fee"
+          hint="Total User operation fee"
+          isLoading={ isPlaceholderData }
+        >
+          <CurrencyValue
+            value={ data.fee }
+            currency={ currencyUnits.ether }
+            isLoading={ isPlaceholderData }
+          />
+        </DetailsInfoItem>
+      ) }
+      <DetailsInfoItem
+        title="Gas limit"
+        hint="Gas limit for the User operation"
+        isLoading={ isPlaceholderData }
+      >
+        <Skeleton isLoaded={ !isPlaceholderData }>
+          { BigNumber(data.gas).toFormat() }
+        </Skeleton>
+      </DetailsInfoItem>
+      <DetailsInfoItem
+        title="Gas used"
+        hint="Actual gas amount used by the User operation"
+        isLoading={ isPlaceholderData }
+      >
+        <Skeleton isLoaded={ !isPlaceholderData }>
+          { BigNumber(data.gas_used).toFormat() }
+        </Skeleton>
+        <Utilization
+          ml={ 4 }
+          colorScheme="gray"
+          value={ BigNumber(data.gas_used).dividedBy(BigNumber(data.gas)).toNumber() }
+          isLoading={ isPlaceholderData }
+        />
+      </DetailsInfoItem>
+      <DetailsInfoItem
+        title="Transaction hash"
+        hint="Hash of the transaction this User operation belongs to"
+        isLoading={ isPlaceholderData }
+      >
+        <TxEntity hash={ data.transaction_hash } isLoading={ isPlaceholderData } noCopy={ false }/>
+      </DetailsInfoItem>
+      <DetailsInfoItem
+        title="Block"
+        hint="Block number containing this User operation"
+        isLoading={ isPlaceholderData }
+      >
+        <BlockEntity number={ data.block_number } isLoading={ isPlaceholderData }/>
+      </DetailsInfoItem>
+      <DetailsInfoItem
+        title="Entry point"
+        hint="Contract that executes bundles of User operations"
+        isLoading={ isPlaceholderData }
+      >
+        <AddressStringOrParam address={ data.entry_point } isLoading={ isPlaceholderData }/>
+      </DetailsInfoItem>
+
+      { config.features.txInterpretation.isEnabled && <UserOpDetailsActions hash={ data.hash } isUserOpDataLoading={ isPlaceholderData }/> }
+
+      { /* CUT */ }
+      <GridItem colSpan={{ base: undefined, lg: 2 }}>
+        <Element name={ CUT_LINK_NAME }>
+          <Skeleton isLoaded={ !isPlaceholderData } mt={ 6 } display="inline-block">
+            <Link
+              fontSize="sm"
+              textDecorationLine="underline"
+              textDecorationStyle="dashed"
+              onClick={ handleCutClick }
+            >
+              { isExpanded ? 'Hide details' : 'View details' }
+            </Link>
+          </Skeleton>
+        </Element>
+      </GridItem>
+
+      { /* ADDITIONAL INFO */ }
+      { isExpanded && !isPlaceholderData && (
+        <>
+          <GridItem colSpan={{ base: undefined, lg: 2 }} mt={{ base: 1, lg: 4 }}/>
+
+          <DetailsInfoItem
+            title="Call gas limit"
+            hint="Gas limit for execution phase"
+          >
+            { BigNumber(data.call_gas_limit).toFormat() }
+          </DetailsInfoItem>
+          <DetailsInfoItem
+            title="Verification gas limit"
+            hint="Gas limit for verification phase"
+          >
+            { BigNumber(data.verification_gas_limit).toFormat() }
+          </DetailsInfoItem>
+          <DetailsInfoItem
+            title="Pre-verification gas"
+            hint="Gas to compensate the bundler"
+          >
+            { BigNumber(data.pre_verification_gas).toFormat() }
+          </DetailsInfoItem>
+          { !config.UI.views.tx.hiddenFields?.gas_fees && (
+            <>
+              <DetailsInfoItem
+                title="Max fee per gas"
+                hint="Maximum fee per gas "
+              >
+                <Text>{ BigNumber(data.max_fee_per_gas).dividedBy(WEI).toFixed() } { currencyUnits.ether } </Text>
+                <Text variant="secondary" whiteSpace="pre">
+                  { space }({ BigNumber(data.max_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() } { currencyUnits.gwei })
+                </Text>
+              </DetailsInfoItem><DetailsInfoItem
+                title="Max priority fee per gas"
+                hint="Maximum priority fee per gas"
+              >
+                <Text>{ BigNumber(data.max_priority_fee_per_gas).dividedBy(WEI).toFixed() } { currencyUnits.ether } </Text>
+                <Text variant="secondary" whiteSpace="pre">
+                  { space }({ BigNumber(data.max_priority_fee_per_gas).dividedBy(WEI_IN_GWEI).toFixed() } { currencyUnits.gwei })
+                </Text>
+              </DetailsInfoItem>
+            </>
+          ) }
+
+          <DetailsInfoItemDivider/>
+
+          { data.aggregator && (
+            <DetailsInfoItem
+              title="Aggregator"
+              hint="Helper contract to validate an aggregated signature"
+            >
+              <AddressStringOrParam address={ data.aggregator }/>
+            </DetailsInfoItem>
+          ) }
+          { data.aggregator_signature && (
+            <DetailsInfoItem
+              title="Aggregator signature"
+              hint="Aggregator signature"
+            >
+              { data.aggregator_signature }
+            </DetailsInfoItem>
+          ) }
+          <DetailsInfoItem
+            title="Bundler"
+            hint="A node (block builder) that handles User operations"
+          >
+            <AddressStringOrParam address={ data.bundler }/>
+          </DetailsInfoItem>
+          { data.factory && (
+            <DetailsInfoItem
+              title="Factory"
+              hint="Smart contract that deploys new smart contract wallets for users"
+            >
+              <AddressStringOrParam address={ data.factory }/>
+            </DetailsInfoItem>
+          ) }
+          { data.paymaster && (
+            <DetailsInfoItem
+              title="Paymaster"
+              hint="Contract to sponsor the gas fees for User operations"
+            >
+              <AddressStringOrParam address={ data.paymaster }/>
+            </DetailsInfoItem>
+          ) }
+          <DetailsInfoItem
+            title="Sponsor type"
+            hint="Type of the gas fees sponsor"
+          >
+            <UserOpSponsorType sponsorType={ data.sponsor_type }/>
+          </DetailsInfoItem>
+
+          <DetailsInfoItemDivider/>
+
+          <DetailsInfoItem
+            title="Signature"
+            hint="Used to validate a User operation along with the nonce during verification"
+            wordBreak="break-all"
+            whiteSpace="normal"
+
+          >
+            { data.signature }
+          </DetailsInfoItem>
+          <DetailsInfoItem
+            title="Nonce"
+            hint="Anti-replay protection; also used as the salt for first-time account creation"
+            wordBreak="break-all"
+            whiteSpace="normal"
+          >
+            { data.nonce }
+          </DetailsInfoItem>
+          <DetailsInfoItem
+            title="Call data"
+            hint="Data that’s passed to the sender for execution"
+          >
+            <RawInputData hex={ data.call_data }/>
+          </DetailsInfoItem>
+        </>
+      ) }
+    </Grid>
+  );
+};
+
+export default UserOpDetails;
diff --git a/ui/userOp/UserOpDetailsActions.tsx b/ui/userOp/UserOpDetailsActions.tsx
new file mode 100644
index 0000000000..8a08e8f1c7
--- /dev/null
+++ b/ui/userOp/UserOpDetailsActions.tsx
@@ -0,0 +1,47 @@
+import React from 'react';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import { TX_INTERPRETATION } from 'stubs/txInterpretation';
+import DetailsActionsWrapper from 'ui/shared/DetailsActionsWrapper';
+import DetailsInfoItemDivider from 'ui/shared/DetailsInfoItemDivider';
+import TxInterpretation from 'ui/shared/tx/interpretation/TxInterpretation';
+
+interface Props {
+  hash?: string;
+  isUserOpDataLoading: boolean;
+}
+
+const TxDetailsActionsInterpretation = ({ hash, isUserOpDataLoading }: Props) => {
+  const interpretationQuery = useApiQuery('user_op_interpretation', {
+    pathParams: { hash },
+    queryOptions: {
+      enabled: Boolean(hash) && !isUserOpDataLoading,
+      placeholderData: TX_INTERPRETATION,
+      refetchOnMount: false,
+    },
+  });
+
+  const actions = interpretationQuery.data?.data.summaries;
+
+  if (!actions || actions.length < 2) {
+    return null;
+  }
+
+  return (
+    <>
+      <DetailsActionsWrapper isLoading={ isUserOpDataLoading || interpretationQuery.isPlaceholderData } type="user_op">
+        { actions.map((action, index: number) => (
+          <TxInterpretation
+            key={ index }
+            summary={ action }
+            isLoading={ isUserOpDataLoading || interpretationQuery.isPlaceholderData }
+          />
+        ),
+        ) }
+      </DetailsActionsWrapper>
+      <DetailsInfoItemDivider/>
+    </>
+  );
+};
+
+export default TxDetailsActionsInterpretation;
diff --git a/ui/userOp/UserOpRaw.tsx b/ui/userOp/UserOpRaw.tsx
new file mode 100644
index 0000000000..b47b6c05f7
--- /dev/null
+++ b/ui/userOp/UserOpRaw.tsx
@@ -0,0 +1,33 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { UserOp } from 'types/api/userOps';
+
+import RawDataSnippet from 'ui/shared/RawDataSnippet';
+
+// order is taken from the ERC-4337 standard
+// eslint-disable-next-line max-len
+const KEYS_ORDER: Array<keyof UserOp['raw']> = [ 'sender', 'nonce', 'init_code', 'call_data', 'account_gas_limits', 'call_gas_limit', 'verification_gas_limit', 'pre_verification_gas', 'gas_fees', 'max_fee_per_gas', 'max_priority_fee_per_gas', 'paymaster_and_data', 'signature' ];
+
+interface Props {
+  rawData?: UserOp['raw'];
+  isLoading?: boolean;
+}
+
+const UserOpRaw = ({ rawData, isLoading }: Props) => {
+  if (!rawData) {
+    return null;
+  }
+
+  const text = JSON.stringify(KEYS_ORDER.reduce((res: UserOp['raw'], key: keyof UserOp['raw']) => {
+    const value = rawData[key];
+    if (value !== undefined) {
+      res[key] = value;
+    }
+    return res;
+  }, {} as UserOp['raw']), undefined, 4);
+
+  return <Skeleton isLoaded={ !isLoading }><RawDataSnippet data={ text }/></Skeleton>;
+};
+
+export default UserOpRaw;
diff --git a/ui/userOp/UserOpSubHeading.tsx b/ui/userOp/UserOpSubHeading.tsx
new file mode 100644
index 0000000000..230f946bb3
--- /dev/null
+++ b/ui/userOp/UserOpSubHeading.tsx
@@ -0,0 +1,81 @@
+import { Flex, Link } from '@chakra-ui/react';
+// import type { UseQueryResult } from '@tanstack/react-query';
+import React from 'react';
+
+// import type { UserOp } from 'types/api/userOps';
+
+import config from 'configs/app';
+// import type { ResourceError } from 'lib/api/resources';
+import useApiQuery from 'lib/api/useApiQuery';
+import { TX_INTERPRETATION } from 'stubs/txInterpretation';
+import { TX_ACTIONS_BLOCK_ID } from 'ui/shared/DetailsActionsWrapper';
+import UserOpEntity from 'ui/shared/entities/userOp/UserOpEntity';
+import TxInterpretation from 'ui/shared/tx/interpretation/TxInterpretation';
+
+type Props = {
+  hash?: string;
+  // userOpQuery: UseQueryResult<UserOp, ResourceError<unknown>>;
+}
+
+const UserOpSubHeading = ({ hash }: Props) => {
+  const hasInterpretationFeature = config.features.txInterpretation.isEnabled;
+
+  const txInterpretationQuery = useApiQuery('user_op_interpretation', {
+    pathParams: { hash },
+    queryOptions: {
+      enabled: Boolean(hash) && hasInterpretationFeature,
+      placeholderData: TX_INTERPRETATION,
+    },
+  });
+
+  const hasInterpretation = hasInterpretationFeature &&
+    (txInterpretationQuery.isPlaceholderData || Boolean(txInterpretationQuery.data?.data.summaries.length));
+
+  const hasViewAllInterpretationsLink =
+      !txInterpretationQuery.isPlaceholderData && txInterpretationQuery.data?.data.summaries && txInterpretationQuery.data?.data.summaries.length > 1;
+
+  if (hasInterpretation) {
+    return (
+      <Flex mr={{ base: 0, lg: 6 }} flexWrap="wrap" alignItems="center">
+        <TxInterpretation
+          summary={ txInterpretationQuery.data?.data.summaries[0] }
+          isLoading={ txInterpretationQuery.isPlaceholderData }
+          fontSize="lg"
+          mr={ hasViewAllInterpretationsLink ? 3 : 0 }
+        />
+        { hasViewAllInterpretationsLink &&
+          <Link href={ `#${ TX_ACTIONS_BLOCK_ID }` }>View all</Link> }
+      </Flex>
+    );
+    // fallback will be added later
+
+    // } else if (hasInterpretationFeature && userOpQuery.data?.decoded_call_data.method_call && userOpQuery.data?.sender && userOpQuery.data?.to) {
+    //   return (
+    //     <TxInterpretation
+    //       summary={{
+    //         summary_template: `{sender_hash} called {method} on {receiver_hash}`,
+    //         summary_template_variables: {
+    //           sender_hash: {
+    //             type: 'address',
+    //             value: txQuery.data.from,
+    //           },
+    //           method: {
+    //             type: 'method',
+    //             value: txQuery.data.method,
+    //           },
+    //           receiver_hash: {
+    //             type: 'address',
+    //             value: txQuery.data.to,
+    //           },
+    //         },
+    //       }}
+    //       isLoading={ txQuery.isPlaceholderData }
+    //       fontSize="lg"
+    //     />
+    //   );
+  } else {
+    return <UserOpEntity hash={ hash } noLink noCopy={ false } fontWeight={ 500 } fontFamily="heading"/>;
+  }
+};
+
+export default UserOpSubHeading;
diff --git a/ui/userOps/UserOpsContent.tsx b/ui/userOps/UserOpsContent.tsx
new file mode 100644
index 0000000000..8d2b8c756c
--- /dev/null
+++ b/ui/userOps/UserOpsContent.tsx
@@ -0,0 +1,66 @@
+import { Hide, Show } from '@chakra-ui/react';
+import React from 'react';
+
+import ActionBar from 'ui/shared/ActionBar';
+import DataFetchAlert from 'ui/shared/DataFetchAlert';
+import DataListDisplay from 'ui/shared/DataListDisplay';
+import Pagination from 'ui/shared/pagination/Pagination';
+import type { QueryWithPagesResult } from 'ui/shared/pagination/useQueryWithPages';
+import UserOpsListItem from 'ui/userOps/UserOpsListItem';
+import UserOpsTable from 'ui/userOps/UserOpsTable';
+
+ type Props = {
+   query: QueryWithPagesResult<'user_ops'>;
+   showTx?: boolean;
+   showSender?: boolean;
+ };
+
+const UserOpsContent = ({ query, showTx = true, showSender = true }: Props) => {
+
+  if (query.isError) {
+    return <DataFetchAlert/>;
+  }
+
+  const content = query.data?.items ? (
+    <>
+      <Hide below="lg" ssr={ false }>
+        <UserOpsTable
+          items={ query.data.items }
+          top={ query.pagination.isVisible ? 80 : 0 }
+          isLoading={ query.isPlaceholderData }
+          showTx={ showTx }
+          showSender={ showSender }
+        />
+      </Hide>
+      <Show below="lg" ssr={ false }>
+        { query.data.items.map((item, index) => (
+          <UserOpsListItem
+            key={ item.hash + (query.isPlaceholderData ? String(index) : '') }
+            item={ item }
+            isLoading={ query.isPlaceholderData }
+            showTx={ showTx }
+            showSender={ showSender }
+          />
+        )) }
+      </Show>
+    </>
+  ) : null;
+
+  const actionBar = query.pagination.isVisible ? (
+    <ActionBar mt={ -6 }>
+      <Pagination ml="auto" { ...query.pagination }/>
+    </ActionBar>
+  ) : null;
+
+  return (
+    <DataListDisplay
+      isError={ query.isError }
+      items={ query.data?.items }
+      emptyText="There are no user operations."
+      content={ content }
+      actionBar={ actionBar }
+    />
+  );
+};
+
+export default UserOpsContent;
diff --git a/ui/userOps/UserOpsListItem.tsx b/ui/userOps/UserOpsListItem.tsx
new file mode 100644
index 0000000000..e43fcbea7a
--- /dev/null
+++ b/ui/userOps/UserOpsListItem.tsx
@@ -0,0 +1,97 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { UserOpsItem } from 'types/api/userOps';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import CurrencyValue from 'ui/shared/CurrencyValue';
+import AddressStringOrParam from 'ui/shared/entities/address/AddressStringOrParam';
+import BlockEntity from 'ui/shared/entities/block/BlockEntity';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+import UserOpEntity from 'ui/shared/entities/userOp/UserOpEntity';
+import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
+import UserOpStatus from 'ui/shared/userOps/UserOpStatus';
+
+type Props = {
+  item: UserOpsItem;
+  isLoading?: boolean;
+  showTx: boolean;
+  showSender: boolean;
+};
+
+const UserOpsListItem = ({ item, isLoading, showTx, showSender }: Props) => {
+  const timeAgo = dayjs(item.timestamp).fromNow();
+
+  return (
+    <ListItemMobileGrid.Container gridTemplateColumns="100px auto">
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>User op hash</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <UserOpEntity hash={ item.hash } isLoading={ isLoading } fontWeight="700" noIcon truncation="constant_long"/>
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Age</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <Skeleton isLoaded={ !isLoading } color="text_secondary" display="inline-block"><span>{ timeAgo }</span></Skeleton>
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Status</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <UserOpStatus status={ item.status } isLoading={ isLoading }/>
+      </ListItemMobileGrid.Value>
+
+      { showSender && (
+        <>
+          <ListItemMobileGrid.Label isLoading={ isLoading }>Sender</ListItemMobileGrid.Label>
+          <ListItemMobileGrid.Value>
+            <AddressStringOrParam
+              address={ item.address }
+              isLoading={ isLoading }
+              truncation="constant"
+            />
+          </ListItemMobileGrid.Value>
+        </>
+      ) }
+
+      { showTx && (
+        <>
+          <ListItemMobileGrid.Label isLoading={ isLoading }>Tx hash</ListItemMobileGrid.Label>
+          <ListItemMobileGrid.Value>
+            <TxEntity
+              hash={ item.transaction_hash }
+              isLoading={ isLoading }
+              noIcon
+              truncation="constant_long"
+            />
+          </ListItemMobileGrid.Value>
+        </>
+      ) }
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Block</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <BlockEntity
+          number={ item.block_number }
+          isLoading={ isLoading }
+          fontSize="sm"
+          lineHeight={ 5 }
+          noIcon
+        />
+      </ListItemMobileGrid.Value>
+
+      { !config.UI.views.tx.hiddenFields?.tx_fee && (
+        <>
+          <ListItemMobileGrid.Label isLoading={ isLoading }>Fee</ListItemMobileGrid.Label>
+          <ListItemMobileGrid.Value>
+            <Skeleton isLoaded={ !isLoading }>
+              <CurrencyValue value={ item.fee } isLoading={ isLoading } accuracy={ 8 } currency={ config.chain.currency.symbol }/>
+            </Skeleton>
+          </ListItemMobileGrid.Value>
+        </>
+      ) }
+
+    </ListItemMobileGrid.Container>
+  );
+};
+
+export default UserOpsListItem;
diff --git a/ui/userOps/UserOpsTable.tsx b/ui/userOps/UserOpsTable.tsx
new file mode 100644
index 0000000000..f887cfaf7d
--- /dev/null
+++ b/ui/userOps/UserOpsTable.tsx
@@ -0,0 +1,50 @@
+import { Table, Tbody, Th, Tr } from '@chakra-ui/react';
+import React from 'react';
+
+import type { UserOpsItem } from 'types/api/userOps';
+
+import config from 'configs/app';
+import { default as Thead } from 'ui/shared/TheadSticky';
+
+import UserOpsTableItem from './UserOpsTableItem';
+
+ type Props = {
+   items: Array<UserOpsItem>;
+   isLoading?: boolean;
+   top: number;
+   showTx: boolean;
+   showSender: boolean;
+ };
+
+const UserOpsTable = ({ items, isLoading, top, showTx, showSender }: Props) => {
+  return (
+    <Table variant="simple" size="sm" minW="1000px">
+      <Thead top={ top }>
+        <Tr>
+          <Th w="60%">User op hash</Th>
+          <Th w="110px">Age</Th>
+          <Th w="140px">Status</Th>
+          { showSender && <Th w="160px">Sender</Th> }
+          { showTx && <Th w="160px">Tx hash</Th> }
+          <Th w="40%">Block</Th>
+          { !config.UI.views.tx.hiddenFields?.tx_fee && <Th w="120px" isNumeric>{ `Fee ${ config.chain.currency.symbol }` }</Th> }
+        </Tr>
+      </Thead>
+      <Tbody>
+        { items.map((item, index) => {
+          return (
+            <UserOpsTableItem
+              key={ item.hash + (isLoading ? String(index) : '') }
+              item={ item }
+              isLoading={ isLoading }
+              showSender={ showSender }
+              showTx={ showTx }
+            />
+          );
+        }) }
+      </Tbody>
+    </Table>
+  );
+};
+
+export default UserOpsTable;
diff --git a/ui/userOps/UserOpsTableItem.tsx b/ui/userOps/UserOpsTableItem.tsx
new file mode 100644
index 0000000000..476e931fc2
--- /dev/null
+++ b/ui/userOps/UserOpsTableItem.tsx
@@ -0,0 +1,73 @@
+import { Td, Tr, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { UserOpsItem } from 'types/api/userOps';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import CurrencyValue from 'ui/shared/CurrencyValue';
+import AddressStringOrParam from 'ui/shared/entities/address/AddressStringOrParam';
+import BlockEntity from 'ui/shared/entities/block/BlockEntity';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+import UserOpEntity from 'ui/shared/entities/userOp/UserOpEntity';
+import UserOpStatus from 'ui/shared/userOps/UserOpStatus';
+
+ type Props = {
+   item: UserOpsItem;
+   isLoading?: boolean;
+   showTx: boolean;
+   showSender: boolean;
+ };
+
+const UserOpsTableItem = ({ item, isLoading, showTx, showSender }: Props) => {
+  const timeAgo = dayjs(item.timestamp).fromNow();
+
+  return (
+    <Tr>
+      <Td verticalAlign="middle">
+        <UserOpEntity hash={ item.hash } isLoading={ isLoading } noIcon fontWeight={ 700 } truncation="constant_long"/>
+      </Td>
+      <Td verticalAlign="middle">
+        <Skeleton isLoaded={ !isLoading } color="text_secondary" display="inline-block"><span>{ timeAgo }</span></Skeleton>
+      </Td>
+      <Td verticalAlign="middle">
+        <UserOpStatus status={ item.status } isLoading={ isLoading }/>
+      </Td>
+      { showSender && (
+        <Td verticalAlign="middle">
+          <AddressStringOrParam
+            address={ item.address }
+            isLoading={ isLoading }
+            truncation="constant"
+          />
+        </Td>
+      ) }
+      { showTx && (
+        <Td verticalAlign="middle">
+          <TxEntity
+            hash={ item.transaction_hash }
+            isLoading={ isLoading }
+            truncation="constant"
+            noIcon
+          />
+        </Td>
+      ) }
+      <Td verticalAlign="middle">
+        <BlockEntity
+          number={ item.block_number }
+          isLoading={ isLoading }
+          fontSize="sm"
+          lineHeight={ 5 }
+          noIcon
+        />
+      </Td>
+      { !config.UI.views.tx.hiddenFields?.tx_fee && (
+        <Td verticalAlign="middle" isNumeric>
+          <CurrencyValue value={ item.fee } isLoading={ isLoading } accuracy={ 8 }/>
+        </Td>
+      ) }
+    </Tr>
+  );
+};
+
+export default UserOpsTableItem;
diff --git a/ui/validators/ValidatorsCounters.tsx b/ui/validators/ValidatorsCounters.tsx
new file mode 100644
index 0000000000..2e056ff1aa
--- /dev/null
+++ b/ui/validators/ValidatorsCounters.tsx
@@ -0,0 +1,41 @@
+import { Box } from '@chakra-ui/react';
+import React from 'react';
+
+import { getFeaturePayload } from 'configs/app/features/types';
+
+import config from 'configs/app';
+import useApiQuery from 'lib/api/useApiQuery';
+import { VALIDATORS_COUNTERS } from 'stubs/validators';
+import StatsWidget from 'ui/shared/stats/StatsWidget';
+
+const ValidatorsCounters = () => {
+  const countersQuery = useApiQuery('validators_counters', {
+    pathParams: { chainType: getFeaturePayload(config.features.validators)?.chainType },
+    queryOptions: {
+      enabled: config.features.validators.isEnabled,
+      placeholderData: VALIDATORS_COUNTERS,
+    },
+  });
+
+  if (!countersQuery.data) {
+    return null;
+  }
+
+  return (
+    <Box columnGap={ 3 } rowGap={ 3 } mb={ 6 } display="grid" gridTemplateColumns={{ base: '1fr', lg: 'repeat(2, 1fr)' }}>
+      <StatsWidget
+        label="Total validators"
+        value={ Number(countersQuery.data.validators_counter).toLocaleString() }
+        diff={ Number(countersQuery.data.new_validators_counter_24h).toLocaleString() }
+        isLoading={ countersQuery.isPlaceholderData }
+      />
+      <StatsWidget
+        label="Active validators"
+        value={ `${ Number(countersQuery.data.active_validators_percentage).toLocaleString() }%` }
+        isLoading={ countersQuery.isPlaceholderData }
+      />
+    </Box>
+  );
+};
+
+export default React.memo(ValidatorsCounters);
diff --git a/ui/validators/ValidatorsFilter.tsx b/ui/validators/ValidatorsFilter.tsx
new file mode 100644
index 0000000000..08ca7dce94
--- /dev/null
+++ b/ui/validators/ValidatorsFilter.tsx
@@ -0,0 +1,46 @@
+import {
+  Menu,
+  MenuButton,
+  MenuList,
+  MenuOptionGroup,
+  MenuItemOption,
+  useDisclosure,
+} from '@chakra-ui/react';
+import React from 'react';
+
+import type { ValidatorsFilters } from 'types/api/validators';
+
+import FilterButton from 'ui/shared/filters/FilterButton';
+
+interface Props {
+  isActive: boolean;
+  defaultValue: ValidatorsFilters['state_filter'] | undefined;
+  onChange: (nextValue: string | Array<string>) => void;
+}
+
+const ValidatorsFilter = ({ onChange, defaultValue, isActive }: Props) => {
+  const { isOpen, onToggle } = useDisclosure();
+
+  return (
+    <Menu>
+      <MenuButton>
+        <FilterButton
+          isActive={ isOpen || isActive }
+          appliedFiltersNum={ isActive ? 1 : 0 }
+          onClick={ onToggle }
+          as="div"
+        />
+      </MenuButton>
+      <MenuList zIndex="popover">
+        <MenuOptionGroup defaultValue={ defaultValue || 'all' } title="Status" type="radio" onChange={ onChange }>
+          <MenuItemOption value="all">All</MenuItemOption>
+          <MenuItemOption value="active">Active</MenuItemOption>
+          <MenuItemOption value="probation">Probation</MenuItemOption>
+          <MenuItemOption value="inactive">Inactive</MenuItemOption>
+        </MenuOptionGroup>
+      </MenuList>
+    </Menu>
+  );
+};
+
+export default React.memo(ValidatorsFilter);
diff --git a/ui/validators/ValidatorsList.tsx b/ui/validators/ValidatorsList.tsx
new file mode 100644
index 0000000000..abb7305ca0
--- /dev/null
+++ b/ui/validators/ValidatorsList.tsx
@@ -0,0 +1,22 @@
+import { Box } from '@chakra-ui/react';
+import React from 'react';
+
+import type { Validator } from 'types/api/validators';
+
+import ValidatorsListItem from './ValidatorsListItem';
+
+const ValidatorsList = ({ data, isLoading }: { data: Array<Validator>; isLoading: boolean }) => {
+  return (
+    <Box>
+      { data.map((item, index) => (
+        <ValidatorsListItem
+          key={ item.address.hash + (isLoading ? index : '') }
+          data={ item }
+          isLoading={ isLoading }
+        />
+      )) }
+    </Box>
+  );
+};
+
+export default React.memo(ValidatorsList);
diff --git a/ui/validators/ValidatorsListItem.tsx b/ui/validators/ValidatorsListItem.tsx
new file mode 100644
index 0000000000..35c97654d6
--- /dev/null
+++ b/ui/validators/ValidatorsListItem.tsx
@@ -0,0 +1,44 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { Validator } from 'types/api/validators';
+
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
+import ValidatorStatus from 'ui/shared/statusTag/ValidatorStatus';
+
+interface Props {
+  data: Validator;
+  isLoading?: boolean;
+}
+
+const ValidatorsListItem = ({ data, isLoading }: Props) => {
+
+  return (
+    <ListItemMobileGrid.Container>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Address</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <AddressEntity
+          isLoading={ isLoading }
+          address={ data.address }
+          truncation="constant"
+        />
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Status</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <ValidatorStatus state={ data.state } isLoading={ isLoading }/>
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Blocks</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <Skeleton isLoaded={ !isLoading } display="inline-block">
+          { data.blocks_validated_count.toLocaleString() }
+        </Skeleton>
+      </ListItemMobileGrid.Value>
+    </ListItemMobileGrid.Container>
+  );
+};
+
+export default React.memo(ValidatorsListItem);
diff --git a/ui/validators/ValidatorsTable.tsx b/ui/validators/ValidatorsTable.tsx
new file mode 100644
index 0000000000..2c36cf1987
--- /dev/null
+++ b/ui/validators/ValidatorsTable.tsx
@@ -0,0 +1,70 @@
+import { Table, Tbody, Tr, Th, Link } from '@chakra-ui/react';
+import React from 'react';
+
+import type { Validator, ValidatorsSorting, ValidatorsSortingField, ValidatorsSortingValue } from 'types/api/validators';
+
+import IconSvg from 'ui/shared/IconSvg';
+import getNextSortValue from 'ui/shared/sort/getNextSortValue';
+import { default as Thead } from 'ui/shared/TheadSticky';
+
+import { SORT_SEQUENCE } from './utils';
+import ValidatorsTableItem from './ValidatorsTableItem';
+
+interface Props {
+  data: Array<Validator>;
+  sort: ValidatorsSortingValue | undefined;
+  setSorting: (val: ValidatorsSortingValue | undefined) => void;
+  isLoading?: boolean;
+}
+
+const ValidatorsTable = ({ data, sort, setSorting, isLoading }: Props) => {
+  const sortIconTransform = sort?.includes('asc' as ValidatorsSorting['order']) ? 'rotate(-90deg)' : 'rotate(90deg)';
+
+  const onSortToggle = React.useCallback((field: ValidatorsSortingField) => () => {
+    const value = getNextSortValue<ValidatorsSortingField, ValidatorsSortingValue>(SORT_SEQUENCE, field)(sort);
+    setSorting(value);
+  }, [ sort, setSorting ]);
+
+  return (
+    <Table variant="simple" size="sm">
+      <Thead top={ 80 }>
+        <Tr>
+          <Th width="50%">Validator’s address</Th>
+          <Th width="25%">
+            <Link
+              display="flex"
+              alignItems="center"
+              onClick={ isLoading ? undefined : onSortToggle('state') }
+              columnGap={ 1 }
+            >
+              { sort?.includes('state') && <IconSvg name="arrows/east" boxSize={ 4 } transform={ sortIconTransform }/> }
+              Status
+            </Link>
+          </Th>
+          <Th width="25%" isNumeric>
+            <Link
+              display="flex"
+              alignItems="center"
+              justifyContent="flex-end"
+              onClick={ isLoading ? undefined : onSortToggle('blocks_validated') }
+              columnGap={ 1 }
+            >
+              { sort?.includes('blocks_validated') && <IconSvg name="arrows/east" boxSize={ 4 } transform={ sortIconTransform }/> }
+              Blocks
+            </Link>
+          </Th>
+        </Tr>
+      </Thead>
+      <Tbody>
+        { data.map((item, index) => (
+          <ValidatorsTableItem
+            key={ item.address.hash + (isLoading ? index : '') }
+            data={ item }
+            isLoading={ isLoading }/>
+        )) }
+      </Tbody>
+    </Table>
+  );
+};
+
+export default React.memo(ValidatorsTable);
diff --git a/ui/validators/ValidatorsTableItem.tsx b/ui/validators/ValidatorsTableItem.tsx
new file mode 100644
index 0000000000..e4c600357c
--- /dev/null
+++ b/ui/validators/ValidatorsTableItem.tsx
@@ -0,0 +1,36 @@
+import { Tr, Td, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { Validator } from 'types/api/validators';
+
+import AddressEntity from 'ui/shared/entities/address/AddressEntity';
+import ValidatorStatus from 'ui/shared/statusTag/ValidatorStatus';
+
+interface Props {
+  data: Validator;
+  isLoading?: boolean;
+}
+
+const ValidatorsTableItem = ({ data, isLoading }: Props) => {
+  return (
+    <Tr>
+      <Td verticalAlign="middle">
+        <AddressEntity
+          address={ data.address }
+          isLoading={ isLoading }
+          truncation="constant"
+        />
+      </Td>
+      <Td verticalAlign="middle">
+        <ValidatorStatus state={ data.state } isLoading={ isLoading }/>
+      </Td>
+      <Td verticalAlign="middle" isNumeric>
+        <Skeleton isLoaded={ !isLoading } display="inline-block">
+          { data.blocks_validated_count.toLocaleString() }
+        </Skeleton>
+      </Td>
+    </Tr>
+  );
+};
+
+export default React.memo(ValidatorsTableItem);
diff --git a/ui/validators/utils.ts b/ui/validators/utils.ts
new file mode 100644
index 0000000000..d35b6dce11
--- /dev/null
+++ b/ui/validators/utils.ts
@@ -0,0 +1,16 @@
+import type { ValidatorsSortingValue, ValidatorsSortingField } from 'types/api/validators';
+
+import type { Option } from 'ui/shared/sort/Sort';
+
+export const SORT_OPTIONS: Array<Option<ValidatorsSortingValue>> = [
+  { title: 'Default', id: undefined },
+  { title: 'Status descending', id: 'state-desc' },
+  { title: 'Status ascending', id: 'state-asc' },
+  { title: 'Blocks validated descending', id: 'blocks_validated-desc' },
+  { title: 'Blocks validated ascending', id: 'blocks_validated-asc' },
+];
+
+export const SORT_SEQUENCE: Record<ValidatorsSortingField, Array<ValidatorsSortingValue | undefined>> = {
+  state: [ 'state-desc', 'state-asc', undefined ],
+  blocks_validated: [ 'blocks_validated-desc', 'blocks_validated-asc', undefined ],
+};
diff --git a/ui/verifiedContracts/VerifiedContractsCounters.tsx b/ui/verifiedContracts/VerifiedContractsCounters.tsx
index 474d568a25..4d7dcd562f 100644
--- a/ui/verifiedContracts/VerifiedContractsCounters.tsx
+++ b/ui/verifiedContracts/VerifiedContractsCounters.tsx
@@ -1,48 +1,38 @@
-import { Flex, Skeleton } from '@chakra-ui/react';
+import { Box } from '@chakra-ui/react';
 import React from 'react';
 
 import useApiQuery from 'lib/api/useApiQuery';
-
-import VerifiedContractsCountersItem from './VerifiedContractsCountersItem';
+import { VERIFIED_CONTRACTS_COUNTERS } from 'stubs/contract';
+import StatsWidget from 'ui/shared/stats/StatsWidget';
 
 const VerifiedContractsCounters = () => {
-  const countersQuery = useApiQuery('verified_contracts_counters');
+  const countersQuery = useApiQuery('verified_contracts_counters', {
+    queryOptions: {
+      placeholderData: VERIFIED_CONTRACTS_COUNTERS,
+    },
+  });
 
-  if (countersQuery.isError) {
+  if (!countersQuery.data) {
     return null;
   }
 
-  const content = (() => {
-    if (countersQuery.isPending) {
-      const item = <Skeleton w={{ base: '100%', lg: 'calc((100% - 12px)/2)' }} h="69px" borderRadius="12px"/>;
-      return (
-        <>
-          { item }
-          { item }
-        </>
-      );
-    }
-
-    return (
-      <>
-        <VerifiedContractsCountersItem
-          name="Total contracts"
-          total={ countersQuery.data.smart_contracts }
-          new24={ countersQuery.data.new_smart_contracts_24h }
-        />
-        <VerifiedContractsCountersItem
-          name="Verified contracts"
-          total={ countersQuery.data.verified_smart_contracts }
-          new24={ countersQuery.data.new_verified_smart_contracts_24h }
-        />
-      </>
-    );
-  })();
-
   return (
-    <Flex columnGap={ 3 } rowGap={ 3 } flexDirection={{ base: 'column', lg: 'row' }} mb={ 6 }>
-      { content }
-    </Flex>
+    <Box columnGap={ 3 } rowGap={ 3 } mb={ 6 } display="grid" gridTemplateColumns={{ base: '1fr', lg: 'repeat(2, 1fr)' }}>
+      <StatsWidget
+        label="Total contracts"
+        value={ Number(countersQuery.data.smart_contracts).toLocaleString() }
+        diff={ countersQuery.data.new_smart_contracts_24h }
+        diffFormatted={ Number(countersQuery.data.new_smart_contracts_24h).toLocaleString() }
+        isLoading={ countersQuery.isPlaceholderData }
+      />
+      <StatsWidget
+        label="Verified contracts"
+        value={ Number(countersQuery.data.verified_smart_contracts).toLocaleString() }
+        diff={ countersQuery.data.new_verified_smart_contracts_24h }
+        diffFormatted={ Number(countersQuery.data.new_verified_smart_contracts_24h).toLocaleString() }
+        isLoading={ countersQuery.isPlaceholderData }
+      />
+    </Box>
   );
 };
 
diff --git a/ui/verifiedContracts/VerifiedContractsCountersItem.tsx b/ui/verifiedContracts/VerifiedContractsCountersItem.tsx
deleted file mode 100644
index 5f64f511da..0000000000
--- a/ui/verifiedContracts/VerifiedContractsCountersItem.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import { Box, Flex, Text, useColorModeValue } from '@chakra-ui/react';
-import React from 'react';
-
-type Props = {
-  name: string;
-  total: string;
-  new24: string;
-}
-
-const VerifiedContractsCountersItem = ({ name, total, new24 }: Props) => {
-  const itemBgColor = useColorModeValue('blue.50', 'blue.800');
-  return (
-    <Box
-      w={{ base: '100%', lg: 'calc((100% - 12px)/2)' }}
-      borderRadius="12px"
-      backgroundColor={ itemBgColor }
-      p={ 3 }
-    >
-      <Text variant="secondary" fontSize="xs">{ name }</Text>
-      <Flex alignItems="baseline">
-        <Text fontWeight={ 600 } mr={ 2 } fontSize="lg">{ Number(total).toLocaleString() }</Text>
-        { Number(new24) > 0 && (
-          <>
-            <Text fontWeight={ 600 } mr={ 1 } fontSize="lg" color="green.500">+{ Number(new24).toLocaleString() }</Text>
-            <Text variant="secondary" fontSize="sm">(24h)</Text>
-          </>
-        ) }
-      </Flex>
-    </Box>
-  );
-};
-
-export default VerifiedContractsCountersItem;
diff --git a/ui/verifiedContracts/VerifiedContractsListItem.tsx b/ui/verifiedContracts/VerifiedContractsListItem.tsx
index ec8931c286..04765654a5 100644
--- a/ui/verifiedContracts/VerifiedContractsListItem.tsx
+++ b/ui/verifiedContracts/VerifiedContractsListItem.tsx
@@ -5,7 +5,9 @@ import React from 'react';
 import type { VerifiedContract } from 'types/api/contracts';
 
 import config from 'configs/app';
+import { CONTRACT_LICENSES } from 'lib/contracts/licenses';
 import dayjs from 'lib/date/dayjs';
+import { currencyUnits } from 'lib/units';
 import CopyToClipboard from 'ui/shared/CopyToClipboard';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import HashStringShorten from 'ui/shared/HashStringShorten';
@@ -22,6 +24,15 @@ const VerifiedContractsListItem = ({ data, isLoading }: Props) => {
     BigNumber(data.coin_balance).div(10 ** config.chain.currency.decimals).dp(6).toFormat() :
     '0';
 
+  const license = (() => {
+    const license = CONTRACT_LICENSES.find((license) => license.type === data.license_type);
+    if (!license || license.type === 'none') {
+      return '-';
+    }
+
+    return license.label;
+  })();
+
   return (
     <ListItemMobile rowGap={ 3 }>
       <Flex w="100%">
@@ -37,7 +48,7 @@ const VerifiedContractsListItem = ({ data, isLoading }: Props) => {
         <CopyToClipboard text={ data.address.hash } isLoading={ isLoading }/>
       </Flex>
       <Flex columnGap={ 3 }>
-        <Skeleton isLoaded={ !isLoading } fontWeight={ 500 }>Balance { config.chain.currency.symbol }</Skeleton>
+        <Skeleton isLoaded={ !isLoading } fontWeight={ 500 }>Balance { currencyUnits.ether }</Skeleton>
         <Skeleton isLoaded={ !isLoading } color="text_secondary">
           <span>{ balance }</span>
         </Skeleton>
@@ -76,12 +87,12 @@ const VerifiedContractsListItem = ({ data, isLoading }: Props) => {
           </Skeleton>
         </Flex>
       </Flex>
-      { /* <Flex columnGap={ 3 }>
-        <Box fontWeight={ 500 }>Market cap</Box>
-        <Box color="text_secondary">
-          N/A
-        </Box>
-      </Flex> */ }
+      <Flex columnGap={ 3 }>
+        <Skeleton isLoaded={ !isLoading } fontWeight={ 500 }>License</Skeleton>
+        <Skeleton isLoaded={ !isLoading } color="text_secondary">
+          <span>{ license }</span>
+        </Skeleton>
+      </Flex>
     </ListItemMobile>
   );
 };
diff --git a/ui/verifiedContracts/VerifiedContractsTable.tsx b/ui/verifiedContracts/VerifiedContractsTable.tsx
index 8d19f5af6b..5032b78603 100644
--- a/ui/verifiedContracts/VerifiedContractsTable.tsx
+++ b/ui/verifiedContracts/VerifiedContractsTable.tsx
@@ -4,7 +4,7 @@ import React from 'react';
 import type { VerifiedContract } from 'types/api/contracts';
 import type { VerifiedContractsSorting, VerifiedContractsSortingField, VerifiedContractsSortingValue } from 'types/api/verifiedContracts';
 
-import config from 'configs/app';
+import { currencyUnits } from 'lib/units';
 import IconSvg from 'ui/shared/IconSvg';
 import getNextSortValue from 'ui/shared/sort/getNextSortValue';
 import { default as Thead } from 'ui/shared/TheadSticky';
@@ -35,7 +35,7 @@ const VerifiedContractsTable = ({ data, sort, setSorting, isLoading }: Props) =>
           <Th width="130px" isNumeric>
             <Link display="flex" alignItems="center" justifyContent="flex-end" onClick={ isLoading ? undefined : onSortToggle('balance') } columnGap={ 1 }>
               { sort?.includes('balance') && <IconSvg name="arrows/east" boxSize={ 4 } transform={ sortIconTransform }/> }
-                Balance { config.chain.currency.symbol }
+                Balance { currencyUnits.ether }
             </Link>
           </Th>
           <Th width="130px" isNumeric>
@@ -47,7 +47,7 @@ const VerifiedContractsTable = ({ data, sort, setSorting, isLoading }: Props) =>
           <Th width="50%">Compiler / version</Th>
           <Th width="80px">Settings</Th>
           <Th width="150px">Verified</Th>
-          { /* <Th width="120px">Market cap</Th> */ }
+          <Th width="130px">License</Th>
         </Tr>
       </Thead>
       <Tbody>
diff --git a/ui/verifiedContracts/VerifiedContractsTableItem.tsx b/ui/verifiedContracts/VerifiedContractsTableItem.tsx
index 3a528dd6b9..3bafd4446e 100644
--- a/ui/verifiedContracts/VerifiedContractsTableItem.tsx
+++ b/ui/verifiedContracts/VerifiedContractsTableItem.tsx
@@ -5,6 +5,7 @@ import React from 'react';
 import type { VerifiedContract } from 'types/api/contracts';
 
 import config from 'configs/app';
+import { CONTRACT_LICENSES } from 'lib/contracts/licenses';
 import dayjs from 'lib/date/dayjs';
 import CopyToClipboard from 'ui/shared/CopyToClipboard';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
@@ -21,6 +22,15 @@ const VerifiedContractsTableItem = ({ data, isLoading }: Props) => {
     BigNumber(data.coin_balance).div(10 ** config.chain.currency.decimals).dp(6).toFormat() :
     '0';
 
+  const license = (() => {
+    const license = CONTRACT_LICENSES.find((license) => license.type === data.license_type);
+    if (!license || license.type === 'none') {
+      return '-';
+    }
+
+    return license.label;
+  })();
+
   return (
     <Tr>
       <Td>
@@ -51,8 +61,10 @@ const VerifiedContractsTableItem = ({ data, isLoading }: Props) => {
       <Td>
         <Flex flexWrap="wrap" columnGap={ 2 }>
           <Skeleton isLoaded={ !isLoading } textTransform="capitalize" my={ 1 }>{ data.language }</Skeleton>
-          <Skeleton isLoaded={ !isLoading } color="text_secondary" wordBreak="break-all" my={ 1 }>
-            <span>{ data.compiler_version }</span>
+          <Skeleton isLoaded={ !isLoading } color="text_secondary" wordBreak="break-all" my={ 1 } cursor="pointer">
+            <Tooltip label={ data.compiler_version }>
+              <span>{ data.compiler_version.split('+')[0] }</span>
+            </Tooltip>
           </Skeleton>
         </Flex>
       </Td>
@@ -80,9 +92,11 @@ const VerifiedContractsTableItem = ({ data, isLoading }: Props) => {
           </Skeleton>
         </Flex>
       </Td>
-      { /* <Td>
-        N/A
-      </Td> */ }
+      <Td>
+        <Skeleton isLoaded={ !isLoading } my={ 1 } display="inline-block">
+          { license }
+        </Skeleton>
+      </Td>
     </Tr>
   );
 };
diff --git a/ui/watchlist/AddressModal/AddressFormNotifications.tsx b/ui/watchlist/AddressModal/AddressFormNotifications.tsx
index 6b3b94d329..f8db8b18a7 100644
--- a/ui/watchlist/AddressModal/AddressFormNotifications.tsx
+++ b/ui/watchlist/AddressModal/AddressFormNotifications.tsx
@@ -8,7 +8,7 @@ import CheckboxInput from 'ui/shared/CheckboxInput';
 
 // does it depend on the network?
 const NOTIFICATIONS = [ 'native', 'ERC-20', 'ERC-721' ] as const;
-const NOTIFICATIONS_NAMES = [ config.chain.currency.symbol, 'ERC-20', 'ERC-721, ERC-1155 (NFT)' ];
+const NOTIFICATIONS_NAMES = [ config.chain.currency.symbol, 'ERC-20', 'ERC-721, ERC-1155, ERC-404 (NFT)' ];
 
 type Props<Inputs extends FieldValues> = {
   control: Control<Inputs>;
diff --git a/ui/watchlist/WatchlistTable/WatchListAddressItem.tsx b/ui/watchlist/WatchlistTable/WatchListAddressItem.tsx
index b5194082da..bd847e12b6 100644
--- a/ui/watchlist/WatchlistTable/WatchListAddressItem.tsx
+++ b/ui/watchlist/WatchlistTable/WatchListAddressItem.tsx
@@ -7,6 +7,7 @@ import type { WatchlistAddress } from 'types/api/account';
 import config from 'configs/app';
 import getCurrencyValue from 'lib/getCurrencyValue';
 import { nbsp } from 'lib/html-entities';
+import { currencyUnits } from 'lib/units';
 import CurrencyValue from 'ui/shared/CurrencyValue';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import * as TokenEntity from 'ui/shared/entities/token/TokenEntity';
@@ -37,7 +38,7 @@ const WatchListAddressItem = ({ item, isLoading }: { item: WatchlistAddress; isL
           isLoading={ isLoading }
         />
         <Skeleton isLoaded={ !isLoading } whiteSpace="pre" display="inline-flex">
-          <span>{ config.chain.currency.symbol } balance: </span>
+          <span>{ currencyUnits.ether } balance: </span>
           <CurrencyValue
             value={ item.address_balance }
             exchangeRate={ item.exchange_rate }
diff --git a/ui/withdrawals/beaconChain/BeaconChainWithdrawalsList.tsx b/ui/withdrawals/beaconChain/BeaconChainWithdrawalsList.tsx
new file mode 100644
index 0000000000..0a262b18fe
--- /dev/null
+++ b/ui/withdrawals/beaconChain/BeaconChainWithdrawalsList.tsx
@@ -0,0 +1,72 @@
+import { Box } from '@chakra-ui/react';
+import React from 'react';
+
+import type { AddressWithdrawalsItem } from 'types/api/address';
+import type { BlockWithdrawalsItem } from 'types/api/block';
+import type { WithdrawalsItem } from 'types/api/withdrawals';
+
+import useLazyRenderedList from 'lib/hooks/useLazyRenderedList';
+
+import BeaconChainWithdrawalsListItem from './BeaconChainWithdrawalsListItem';
+
+type Props = {
+  isLoading?: boolean;
+} & ({
+  items: Array<WithdrawalsItem>;
+  view: 'list';
+} | {
+  items: Array<AddressWithdrawalsItem>;
+  view: 'address';
+} | {
+  items: Array<BlockWithdrawalsItem>;
+  view: 'block';
+});
+
+const WithdrawalsList = ({ items, view, isLoading }: Props) => {
+  const { cutRef, renderedItemsNum } = useLazyRenderedList(items, !isLoading);
+
+  return (
+    <Box>
+      { items.slice(0, renderedItemsNum).map((item, index) => {
+
+        const key = item.index + (isLoading ? String(index) : '');
+
+        switch (view) {
+          case 'address': {
+            return (
+              <BeaconChainWithdrawalsListItem
+                key={ key }
+                item={ item as AddressWithdrawalsItem }
+                view={ view }
+                isLoading={ isLoading }
+              />
+            );
+          }
+          case 'block': {
+            return (
+              <BeaconChainWithdrawalsListItem
+                key={ key }
+                item={ item as BlockWithdrawalsItem }
+                view={ view }
+                isLoading={ isLoading }
+              />
+            );
+          }
+          case 'list': {
+            return (
+              <BeaconChainWithdrawalsListItem
+                key={ key }
+                item={ item as WithdrawalsItem }
+                view={ view }
+                isLoading={ isLoading }
+              />
+            );
+          }
+        }
+      }) }
+      <div ref={ cutRef }/>
+    </Box>
+  );
+};
+
+export default React.memo(WithdrawalsList);
diff --git a/ui/withdrawals/WithdrawalsListItem.tsx b/ui/withdrawals/beaconChain/BeaconChainWithdrawalsListItem.tsx
similarity index 89%
rename from ui/withdrawals/WithdrawalsListItem.tsx
rename to ui/withdrawals/beaconChain/BeaconChainWithdrawalsListItem.tsx
index cf22035ac5..9b97b53e75 100644
--- a/ui/withdrawals/WithdrawalsListItem.tsx
+++ b/ui/withdrawals/beaconChain/BeaconChainWithdrawalsListItem.tsx
@@ -7,6 +7,7 @@ import type { WithdrawalsItem } from 'types/api/withdrawals';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
+import { currencyUnits } from 'lib/units';
 import CurrencyValue from 'ui/shared/CurrencyValue';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
@@ -25,7 +26,7 @@ type Props = ({
   view: 'block';
 }) & { isLoading?: boolean };
 
-const WithdrawalsListItem = ({ item, isLoading, view }: Props) => {
+const BeaconChainWithdrawalsListItem = ({ item, isLoading, view }: Props) => {
   if (!feature.isEnabled) {
     return null;
   }
@@ -63,6 +64,7 @@ const WithdrawalsListItem = ({ item, isLoading, view }: Props) => {
             <AddressEntity
               address={ item.receiver }
               isLoading={ isLoading }
+              truncation="constant"
             />
           </ListItemMobileGrid.Value>
         </>
@@ -77,7 +79,7 @@ const WithdrawalsListItem = ({ item, isLoading, view }: Props) => {
 
           <ListItemMobileGrid.Label isLoading={ isLoading }>Value</ListItemMobileGrid.Label>
           <ListItemMobileGrid.Value>
-            <CurrencyValue value={ item.amount } currency={ feature.currency.symbol } isLoading={ isLoading }/>
+            <CurrencyValue value={ item.amount } currency={ currencyUnits.ether } isLoading={ isLoading }/>
           </ListItemMobileGrid.Value>
         </>
       ) }
@@ -86,4 +88,4 @@ const WithdrawalsListItem = ({ item, isLoading, view }: Props) => {
   );
 };
 
-export default WithdrawalsListItem;
+export default BeaconChainWithdrawalsListItem;
diff --git a/ui/withdrawals/WithdrawalsTable.tsx b/ui/withdrawals/beaconChain/BeaconChainWithdrawalsTable.tsx
similarity index 57%
rename from ui/withdrawals/WithdrawalsTable.tsx
rename to ui/withdrawals/beaconChain/BeaconChainWithdrawalsTable.tsx
index a6b91793e6..e3848a56ad 100644
--- a/ui/withdrawals/WithdrawalsTable.tsx
+++ b/ui/withdrawals/beaconChain/BeaconChainWithdrawalsTable.tsx
@@ -6,9 +6,10 @@ import type { BlockWithdrawalsItem } from 'types/api/block';
 import type { WithdrawalsItem } from 'types/api/withdrawals';
 
 import config from 'configs/app';
+import useLazyRenderedList from 'lib/hooks/useLazyRenderedList';
 import { default as Thead } from 'ui/shared/TheadSticky';
 
-import WithdrawalsTableItem from './WithdrawalsTableItem';
+import BeaconChainWithdrawalsTableItem from './BeaconChainWithdrawalsTableItem';
 
 const feature = config.features.beaconChain;
 
@@ -26,7 +27,9 @@ const feature = config.features.beaconChain;
    view: 'block';
  });
 
-const WithdrawalsTable = ({ items, isLoading, top, view = 'list' }: Props) => {
+const BeaconChainWithdrawalsTable = ({ items, isLoading, top, view }: Props) => {
+  const { cutRef, renderedItemsNum } = useLazyRenderedList(items, !isLoading);
+
   if (!feature.isEnabled) {
     return null;
   }
@@ -44,18 +47,19 @@ const WithdrawalsTable = ({ items, isLoading, top, view = 'list' }: Props) => {
         </Tr>
       </Thead>
       <Tbody>
-        { view === 'list' && (items as Array<WithdrawalsItem>).map((item, index) => (
-          <WithdrawalsTableItem key={ item.index + (isLoading ? String(index) : '') } item={ item } view="list" isLoading={ isLoading }/>
+        { view === 'list' && (items as Array<WithdrawalsItem>).slice(0, renderedItemsNum).map((item, index) => (
+          <BeaconChainWithdrawalsTableItem key={ item.index + (isLoading ? String(index) : '') } item={ item } view="list" isLoading={ isLoading }/>
         )) }
-        { view === 'address' && (items as Array<AddressWithdrawalsItem>).map((item, index) => (
-          <WithdrawalsTableItem key={ item.index + (isLoading ? String(index) : '') } item={ item } view="address" isLoading={ isLoading }/>
+        { view === 'address' && (items as Array<AddressWithdrawalsItem>).slice(0, renderedItemsNum).map((item, index) => (
+          <BeaconChainWithdrawalsTableItem key={ item.index + (isLoading ? String(index) : '') } item={ item } view="address" isLoading={ isLoading }/>
         )) }
-        { view === 'block' && (items as Array<BlockWithdrawalsItem>).map((item, index) => (
-          <WithdrawalsTableItem key={ item.index + (isLoading ? String(index) : '') } item={ item } view="block" isLoading={ isLoading }/>
+        { view === 'block' && (items as Array<BlockWithdrawalsItem>).slice(0, renderedItemsNum).map((item, index) => (
+          <BeaconChainWithdrawalsTableItem key={ item.index + (isLoading ? String(index) : '') } item={ item } view="block" isLoading={ isLoading }/>
         )) }
+        <tr ref={ cutRef }/>
       </Tbody>
     </Table>
   );
 };
 
-export default WithdrawalsTable;
+export default BeaconChainWithdrawalsTable;
diff --git a/ui/withdrawals/WithdrawalsTableItem.tsx b/ui/withdrawals/beaconChain/BeaconChainWithdrawalsTableItem.tsx
similarity index 83%
rename from ui/withdrawals/WithdrawalsTableItem.tsx
rename to ui/withdrawals/beaconChain/BeaconChainWithdrawalsTableItem.tsx
index b479d0a1d0..f7c509e555 100644
--- a/ui/withdrawals/WithdrawalsTableItem.tsx
+++ b/ui/withdrawals/beaconChain/BeaconChainWithdrawalsTableItem.tsx
@@ -10,18 +10,18 @@ import CurrencyValue from 'ui/shared/CurrencyValue';
 import AddressEntity from 'ui/shared/entities/address/AddressEntity';
 import BlockEntity from 'ui/shared/entities/block/BlockEntity';
 
- type Props = ({
-   item: WithdrawalsItem;
-   view: 'list';
- } | {
-   item: AddressWithdrawalsItem;
-   view: 'address';
- } | {
-   item: BlockWithdrawalsItem;
-   view: 'block';
- }) & { isLoading?: boolean };
+type Props = ({
+  item: WithdrawalsItem;
+  view: 'list';
+} | {
+  item: AddressWithdrawalsItem;
+  view: 'address';
+} | {
+  item: BlockWithdrawalsItem;
+  view: 'block';
+}) & { isLoading?: boolean };
 
-const WithdrawalsTableItem = ({ item, view, isLoading }: Props) => {
+const BeaconChainWithdrawalsTableItem = ({ item, view, isLoading }: Props) => {
   return (
     <Tr>
       <Td verticalAlign="middle">
@@ -37,6 +37,7 @@ const WithdrawalsTableItem = ({ item, view, isLoading }: Props) => {
             isLoading={ isLoading }
             fontSize="sm"
             lineHeight={ 5 }
+            noIcon
           />
         </Td>
       ) }
@@ -63,4 +64,4 @@ const WithdrawalsTableItem = ({ item, view, isLoading }: Props) => {
   );
 };
 
-export default WithdrawalsTableItem;
+export default BeaconChainWithdrawalsTableItem;
diff --git a/ui/l2Withdrawals/WithdrawalsListItem.tsx b/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsListItem.tsx
similarity index 81%
rename from ui/l2Withdrawals/WithdrawalsListItem.tsx
rename to ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsListItem.tsx
index 585b3f7688..af58d02600 100644
--- a/ui/l2Withdrawals/WithdrawalsListItem.tsx
+++ b/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsListItem.tsx
@@ -1,7 +1,7 @@
 import { Skeleton } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2WithdrawalsItem } from 'types/api/l2Withdrawals';
+import type { OptimisticL2WithdrawalsItem } from 'types/api/optimisticL2';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
@@ -11,15 +11,15 @@ import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 import LinkExternal from 'ui/shared/LinkExternal';
 import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
-type Props = { item: L2WithdrawalsItem; isLoading?: boolean };
+type Props = { item: OptimisticL2WithdrawalsItem; isLoading?: boolean };
 
-const WithdrawalsListItem = ({ item, isLoading }: Props) => {
+const OptimisticL2WithdrawalsListItem = ({ item, isLoading }: Props) => {
   const timeAgo = item.l2_timestamp ? dayjs(item.l2_timestamp).fromNow() : null;
   const timeToEnd = item.challenge_period_end ? dayjs(item.challenge_period_end).fromNow(true) + ' left' : null;
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'optimistic') {
     return null;
   }
 
@@ -40,6 +40,7 @@ const WithdrawalsListItem = ({ item, isLoading }: Props) => {
             <AddressEntity
               address={ item.from }
               isLoading={ isLoading }
+              truncation="constant"
             />
           </ListItemMobileGrid.Value>
         </>
@@ -52,6 +53,7 @@ const WithdrawalsListItem = ({ item, isLoading }: Props) => {
           hash={ item.l2_tx_hash }
           fontSize="sm"
           lineHeight={ 5 }
+          truncation="constant_long"
         />
       </ListItemMobileGrid.Value>
 
@@ -68,8 +70,8 @@ const WithdrawalsListItem = ({ item, isLoading }: Props) => {
 
       <ListItemMobileGrid.Label isLoading={ isLoading }>Status</ListItemMobileGrid.Label>
       <ListItemMobileGrid.Value>
-        { item.status === 'Ready for relay' ?
-          <LinkExternal href={ feature.withdrawalUrl }>{ item.status }</LinkExternal> :
+        { item.status === 'Ready for relay' && rollupFeature.L2WithdrawalUrl ?
+          <LinkExternal href={ rollupFeature.L2WithdrawalUrl }>{ item.status }</LinkExternal> :
           <Skeleton isLoaded={ !isLoading } display="inline-block">{ item.status }</Skeleton> }
       </ListItemMobileGrid.Value>
 
@@ -82,6 +84,7 @@ const WithdrawalsListItem = ({ item, isLoading }: Props) => {
               hash={ item.l1_tx_hash }
               fontSize="sm"
               lineHeight={ 5 }
+              truncation="constant_long"
             />
           </ListItemMobileGrid.Value>
         </>
@@ -98,4 +101,4 @@ const WithdrawalsListItem = ({ item, isLoading }: Props) => {
   );
 };
 
-export default WithdrawalsListItem;
+export default OptimisticL2WithdrawalsListItem;
diff --git a/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsTable.tsx b/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsTable.tsx
new file mode 100644
index 0000000000..0198858bb1
--- /dev/null
+++ b/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsTable.tsx
@@ -0,0 +1,43 @@
+import { Table, Tbody, Th, Tr } from '@chakra-ui/react';
+import React from 'react';
+
+import type { OptimisticL2WithdrawalsItem } from 'types/api/optimisticL2';
+
+import { default as Thead } from 'ui/shared/TheadSticky';
+
+import OptimisticL2WithdrawalsTableItem from './OptimisticL2WithdrawalsTableItem';
+
+ type Props = {
+   items: Array<OptimisticL2WithdrawalsItem>;
+   top: number;
+   isLoading?: boolean;
+ }
+
+const OptimisticL2WithdrawalsTable = ({ items, top, isLoading }: Props) => {
+  return (
+    <Table variant="simple" size="sm" style={{ tableLayout: 'auto' }} minW="950px">
+      <Thead top={ top }>
+        <Tr>
+          <Th>Msg nonce</Th>
+          <Th>From</Th>
+          <Th>L2 txn hash</Th>
+          <Th>Age</Th>
+          <Th>Status</Th>
+          <Th>L1 txn hash</Th>
+          <Th>Time left</Th>
+        </Tr>
+      </Thead>
+      <Tbody>
+        { items.map((item, index) => (
+          <OptimisticL2WithdrawalsTableItem
+            key={ String(item.msg_nonce_version) + item.msg_nonce + (isLoading ? index : '') }
+            item={ item }
+            isLoading={ isLoading }
+          />
+        )) }
+      </Tbody>
+    </Table>
+  );
+};
+
+export default OptimisticL2WithdrawalsTable;
diff --git a/ui/l2Withdrawals/WithdrawalsTableItem.tsx b/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsTableItem.tsx
similarity index 75%
rename from ui/l2Withdrawals/WithdrawalsTableItem.tsx
rename to ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsTableItem.tsx
index 6df6254116..ea6104c1fd 100644
--- a/ui/l2Withdrawals/WithdrawalsTableItem.tsx
+++ b/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsTableItem.tsx
@@ -1,7 +1,7 @@
 import { Td, Tr, Skeleton } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2WithdrawalsItem } from 'types/api/l2Withdrawals';
+import type { OptimisticL2WithdrawalsItem } from 'types/api/optimisticL2';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';
@@ -10,15 +10,15 @@ import TxEntity from 'ui/shared/entities/tx/TxEntity';
 import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
 import LinkExternal from 'ui/shared/LinkExternal';
 
-const feature = config.features.optimisticRollup;
+const rollupFeature = config.features.rollup;
 
- type Props = { item: L2WithdrawalsItem; isLoading?: boolean };
+ type Props = { item: OptimisticL2WithdrawalsItem; isLoading?: boolean };
 
-const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
+const OptimisticL2WithdrawalsTableItem = ({ item, isLoading }: Props) => {
   const timeAgo = item.l2_timestamp ? dayjs(item.l2_timestamp).fromNow() : 'N/A';
   const timeToEnd = item.challenge_period_end ? dayjs(item.challenge_period_end).fromNow(true) + ' left' : '';
 
-  if (!feature.isEnabled) {
+  if (!rollupFeature.isEnabled || rollupFeature.type !== 'optimistic') {
     return null;
   }
 
@@ -40,9 +40,10 @@ const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
         <TxEntity
           isLoading={ isLoading }
           hash={ item.l2_tx_hash }
-          truncation="constant"
           fontSize="sm"
           lineHeight={ 5 }
+          truncation="constant_long"
+          noIcon
         />
       </Td>
       <Td verticalAlign="middle" pr={ 12 }>
@@ -51,8 +52,8 @@ const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
         </Skeleton>
       </Td>
       <Td verticalAlign="middle">
-        { item.status === 'Ready for relay' ?
-          <LinkExternal href={ feature.withdrawalUrl }>{ item.status }</LinkExternal> :
+        { item.status === 'Ready for relay' && rollupFeature.L2WithdrawalUrl ?
+          <LinkExternal href={ rollupFeature.L2WithdrawalUrl }>{ item.status }</LinkExternal> :
           <Skeleton isLoaded={ !isLoading } display="inline-block">{ item.status }</Skeleton>
         }
       </Td>
@@ -61,7 +62,8 @@ const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
           <TxEntityL1
             isLoading={ isLoading }
             hash={ item.l1_tx_hash }
-            truncation="constant"
+            truncation="constant_long"
+            noIcon
             fontSize="sm"
             lineHeight={ 5 }
           />
@@ -76,4 +78,4 @@ const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
   );
 };
 
-export default WithdrawalsTableItem;
+export default OptimisticL2WithdrawalsTableItem;
diff --git a/ui/withdrawals/shibarium/WithdrawalsListItem.tsx b/ui/withdrawals/shibarium/WithdrawalsListItem.tsx
new file mode 100644
index 0000000000..bf34e0365c
--- /dev/null
+++ b/ui/withdrawals/shibarium/WithdrawalsListItem.tsx
@@ -0,0 +1,79 @@
+import { Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { ShibariumWithdrawalsItem } from 'types/api/shibarium';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import AddressStringOrParam from 'ui/shared/entities/address/AddressStringOrParam';
+import BlockEntity from 'ui/shared/entities/block/BlockEntity';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
+import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid';
+
+const feature = config.features.rollup;
+
+type Props = { item: ShibariumWithdrawalsItem; isLoading?: boolean };
+
+const WithdrawalsListItem = ({ item, isLoading }: Props) => {
+  const timeAgo = item.timestamp ? dayjs(item.timestamp).fromNow() : null;
+
+  if (!(feature.isEnabled && feature.type === 'shibarium')) {
+    return null;
+  }
+
+  return (
+    <ListItemMobileGrid.Container>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>L2 block No</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <BlockEntity
+          number={ item.l2_block_number }
+          isLoading={ isLoading }
+          fontSize="sm"
+          lineHeight={ 5 }
+          fontWeight={ 600 }
+        />
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>L2 txn hash</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <TxEntity
+          isLoading={ isLoading }
+          hash={ item.l2_transaction_hash }
+          fontSize="sm"
+          lineHeight={ 5 }
+          truncation="constant_long"
+        />
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>L1 txn hash</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <TxEntityL1
+          isLoading={ isLoading }
+          hash={ item.l1_transaction_hash }
+          fontSize="sm"
+          lineHeight={ 5 }
+          truncation="constant_long"
+        />
+      </ListItemMobileGrid.Value>
+
+      <ListItemMobileGrid.Label isLoading={ isLoading }>User</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <AddressStringOrParam
+          address={ item.user }
+          isLoading={ isLoading }
+          noCopy
+          truncation="constant"
+        />
+      </ListItemMobileGrid.Value>
+      <ListItemMobileGrid.Label isLoading={ isLoading }>Age</ListItemMobileGrid.Label>
+      <ListItemMobileGrid.Value>
+        <Skeleton isLoaded={ !isLoading } display="inline-block">{ timeAgo }</Skeleton>
+      </ListItemMobileGrid.Value>
+
+    </ListItemMobileGrid.Container>
+  );
+};
+
+export default WithdrawalsListItem;
diff --git a/ui/l2Withdrawals/WithdrawalsTable.tsx b/ui/withdrawals/shibarium/WithdrawalsTable.tsx
similarity index 68%
rename from ui/l2Withdrawals/WithdrawalsTable.tsx
rename to ui/withdrawals/shibarium/WithdrawalsTable.tsx
index 603d52ef5b..37d0760e1d 100644
--- a/ui/l2Withdrawals/WithdrawalsTable.tsx
+++ b/ui/withdrawals/shibarium/WithdrawalsTable.tsx
@@ -1,14 +1,14 @@
 import { Table, Tbody, Th, Tr } from '@chakra-ui/react';
 import React from 'react';
 
-import type { L2WithdrawalsItem } from 'types/api/l2Withdrawals';
+import type { ShibariumWithdrawalsItem } from 'types/api/shibarium';
 
 import { default as Thead } from 'ui/shared/TheadSticky';
 
 import WithdrawalsTableItem from './WithdrawalsTableItem';
 
  type Props = {
-   items: Array<L2WithdrawalsItem>;
+   items: Array<ShibariumWithdrawalsItem>;
    top: number;
    isLoading?: boolean;
  }
@@ -18,18 +18,16 @@ const WithdrawalsTable = ({ items, top, isLoading }: Props) => {
     <Table variant="simple" size="sm" style={{ tableLayout: 'auto' }} minW="950px">
       <Thead top={ top }>
         <Tr>
-          <Th>Msg nonce</Th>
-          <Th>From</Th>
+          <Th>L2 block No</Th>
           <Th>L2 txn hash</Th>
-          <Th>Age</Th>
-          <Th>Status</Th>
           <Th>L1 txn hash</Th>
-          <Th>Time left</Th>
+          <Th>User</Th>
+          <Th>Age</Th>
         </Tr>
       </Thead>
       <Tbody>
         { items.map((item, index) => (
-          <WithdrawalsTableItem key={ item.l2_tx_hash + (isLoading ? index : '') } item={ item } isLoading={ isLoading }/>
+          <WithdrawalsTableItem key={ item.l2_transaction_hash + (isLoading ? index : '') } item={ item } isLoading={ isLoading }/>
         )) }
       </Tbody>
     </Table>
diff --git a/ui/withdrawals/shibarium/WithdrawalsTableItem.tsx b/ui/withdrawals/shibarium/WithdrawalsTableItem.tsx
new file mode 100644
index 0000000000..13d564b061
--- /dev/null
+++ b/ui/withdrawals/shibarium/WithdrawalsTableItem.tsx
@@ -0,0 +1,68 @@
+import { Td, Tr, Skeleton } from '@chakra-ui/react';
+import React from 'react';
+
+import type { ShibariumWithdrawalsItem } from 'types/api/shibarium';
+
+import config from 'configs/app';
+import dayjs from 'lib/date/dayjs';
+import AddressStringOrParam from 'ui/shared/entities/address/AddressStringOrParam';
+import BlockEntity from 'ui/shared/entities/block/BlockEntity';
+import TxEntity from 'ui/shared/entities/tx/TxEntity';
+import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1';
+
+const feature = config.features.rollup;
+
+ type Props = { item: ShibariumWithdrawalsItem; isLoading?: boolean };
+
+const WithdrawalsTableItem = ({ item, isLoading }: Props) => {
+  const timeAgo = dayjs(item.timestamp).fromNow();
+
+  if (!(feature.isEnabled && feature.type === 'shibarium')) {
+    return null;
+  }
+
+  return (
+    <Tr>
+      <Td verticalAlign="middle">
+        <BlockEntity
+          number={ item.l2_block_number }
+          isLoading={ isLoading }
+          fontSize="sm"
+          lineHeight={ 5 }
+          fontWeight={ 600 }
+        />
+      </Td>
+      <Td verticalAlign="middle">
+        <TxEntity
+          isLoading={ isLoading }
+          hash={ item.l2_transaction_hash }
+          fontSize="sm"
+          lineHeight={ 5 }
+          truncation="constant_long"
+        />
+      </Td>
+      <Td verticalAlign="middle">
+        <TxEntityL1
+          isLoading={ isLoading }
+          hash={ item.l1_transaction_hash }
+          truncation="constant_long"
+          fontSize="sm"
+          lineHeight={ 5 }
+        />
+      </Td>
+      <Td verticalAlign="middle">
+        <AddressStringOrParam
+          address={ item.user }
+          isLoading={ isLoading }
+          truncation="constant"
+          noCopy
+        />
+      </Td>
+      <Td verticalAlign="middle" pr={ 12 }>
+        <Skeleton isLoaded={ !isLoading } color="text_secondary" display="inline-block"><span>{ timeAgo }</span></Skeleton>
+      </Td>
+    </Tr>
+  );
+};
+
+export default WithdrawalsTableItem;
diff --git a/yarn.lock b/yarn.lock
index 49299ca07f..3c676c28d5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1320,12 +1320,12 @@
   dependencies:
     regenerator-runtime "^0.13.11"
 
-"@babel/runtime@^7.17.2", "@babel/runtime@^7.5.5":
-  version "7.20.7"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.20.7.tgz#fcb41a5a70550e04a7b708037c7c32f7f356d8fd"
-  integrity sha512-UF0tvkUtxwAgZ5W/KrkHf0Rn0fdnLDU9ScxBrEVNUprE/MzirjK4MJUX1/BVDv00Sv8cljtukVK1aky++X1SjQ==
+"@babel/runtime@^7.20.6", "@babel/runtime@^7.21.0", "@babel/runtime@^7.22.5", "@babel/runtime@^7.23.2":
+  version "7.24.0"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.24.0.tgz#584c450063ffda59697021430cb47101b085951e"
+  integrity sha512-Chk32uHMg6TnQdvw2e9IlqPpFX/6NLuK0Ys2PqLb7/gL5uFn9mXvK715FGLlOLQrcO4qIkNHkvPGktzzXexsFw==
   dependencies:
-    regenerator-runtime "^0.13.11"
+    regenerator-runtime "^0.14.0"
 
 "@babel/runtime@^7.23.5":
   version "7.23.6"
@@ -1334,6 +1334,13 @@
   dependencies:
     regenerator-runtime "^0.14.0"
 
+"@babel/runtime@^7.5.5":
+  version "7.20.7"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.20.7.tgz#fcb41a5a70550e04a7b708037c7c32f7f356d8fd"
+  integrity sha512-UF0tvkUtxwAgZ5W/KrkHf0Rn0fdnLDU9ScxBrEVNUprE/MzirjK4MJUX1/BVDv00Sv8cljtukVK1aky++X1SjQ==
+  dependencies:
+    regenerator-runtime "^0.13.11"
+
 "@babel/runtime@^7.8.4":
   version "7.20.1"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.20.1.tgz#1148bb33ab252b165a06698fde7576092a78b4a9"
@@ -2253,28 +2260,20 @@
     picocolors "^1.0.0"
     sisteransi "^1.0.5"
 
-"@coinbase/wallet-sdk@^3.6.6":
-  version "3.6.6"
-  resolved "https://registry.yarnpkg.com/@coinbase/wallet-sdk/-/wallet-sdk-3.6.6.tgz#4a0758fe0fe0ba3ed7e33b5bb6eb094ff8bd6c98"
-  integrity sha512-vX+epj/Ttjo7XRwlr3TFUUfW5GTRMvORpERPwiu7z2jl3DSVL4rXLmHt5y6LDPlUVreas2gumdcFbu0fLRG9Jg==
+"@coinbase/wallet-sdk@3.9.1":
+  version "3.9.1"
+  resolved "https://registry.yarnpkg.com/@coinbase/wallet-sdk/-/wallet-sdk-3.9.1.tgz#503a14671bb392d653623ef2340934e213ac971f"
+  integrity sha512-cGUE8wm1/cMI8irRMVOqbFWYcnNugqCtuy2lnnHfgloBg+GRLs9RsrkOUDMdv/StfUeeKhCDyYudsXXvcL1xIA==
   dependencies:
-    "@metamask/safe-event-emitter" "2.0.0"
-    "@solana/web3.js" "^1.70.1"
-    bind-decorator "^1.0.11"
-    bn.js "^5.1.1"
+    bn.js "^5.2.1"
     buffer "^6.0.3"
-    clsx "^1.1.0"
-    eth-block-tracker "6.1.0"
-    eth-json-rpc-filters "5.1.0"
-    eth-rpc-errors "4.0.2"
-    json-rpc-engine "6.1.0"
-    keccak "^3.0.1"
-    preact "^10.5.9"
-    qs "^6.10.3"
-    rxjs "^6.6.3"
+    clsx "^1.2.1"
+    eth-block-tracker "^7.1.0"
+    eth-json-rpc-filters "^6.0.0"
+    eventemitter3 "^5.0.1"
+    keccak "^3.0.3"
+    preact "^10.16.0"
     sha.js "^2.4.11"
-    stream-browserify "^3.0.0"
-    util "^0.12.4"
 
 "@cspotcode/source-map-support@^0.8.0":
   version "0.8.1"
@@ -2306,6 +2305,23 @@
     source-map "^0.5.7"
     stylis "4.1.3"
 
+"@emotion/babel-plugin@^11.11.0":
+  version "11.11.0"
+  resolved "https://registry.yarnpkg.com/@emotion/babel-plugin/-/babel-plugin-11.11.0.tgz#c2d872b6a7767a9d176d007f5b31f7d504bb5d6c"
+  integrity sha512-m4HEDZleaaCH+XgDDsPF15Ht6wTLsgDTeR3WYj9Q/k76JtWhrJjcP4+/XlG8LGT/Rol9qUfOIztXeA84ATpqPQ==
+  dependencies:
+    "@babel/helper-module-imports" "^7.16.7"
+    "@babel/runtime" "^7.18.3"
+    "@emotion/hash" "^0.9.1"
+    "@emotion/memoize" "^0.8.1"
+    "@emotion/serialize" "^1.1.2"
+    babel-plugin-macros "^3.1.0"
+    convert-source-map "^1.5.0"
+    escape-string-regexp "^4.0.0"
+    find-root "^1.1.0"
+    source-map "^0.5.7"
+    stylis "4.2.0"
+
 "@emotion/cache@^11.10.5", "@emotion/cache@^11.4.0":
   version "11.10.5"
   resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-11.10.5.tgz#c142da9351f94e47527ed458f7bbbbe40bb13c12"
@@ -2317,11 +2333,27 @@
     "@emotion/weak-memoize" "^0.3.0"
     stylis "4.1.3"
 
+"@emotion/cache@^11.11.0":
+  version "11.11.0"
+  resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-11.11.0.tgz#809b33ee6b1cb1a625fef7a45bc568ccd9b8f3ff"
+  integrity sha512-P34z9ssTCBi3e9EI1ZsWpNHcfY1r09ZO0rZbRO2ob3ZQMnFI35jB536qoXbkdesr5EUhYi22anuEJuyxifaqAQ==
+  dependencies:
+    "@emotion/memoize" "^0.8.1"
+    "@emotion/sheet" "^1.2.2"
+    "@emotion/utils" "^1.2.1"
+    "@emotion/weak-memoize" "^0.3.1"
+    stylis "4.2.0"
+
 "@emotion/hash@^0.9.0":
   version "0.9.0"
   resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.9.0.tgz#c5153d50401ee3c027a57a177bc269b16d889cb7"
   integrity sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ==
 
+"@emotion/hash@^0.9.1":
+  version "0.9.1"
+  resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.9.1.tgz#4ffb0055f7ef676ebc3a5a91fb621393294e2f43"
+  integrity sha512-gJB6HLm5rYwSLI6PQa+X1t5CFGrv1J1TWG+sOyMCeKz2ojaj6Fnl/rZEspogG+cvqbt4AE/2eIyD2QfLKTBNlQ==
+
 "@emotion/is-prop-valid@^0.8.2":
   version "0.8.8"
   resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz#db28b1c4368a259b60a97311d6a952d4fd01ac1a"
@@ -2336,6 +2368,13 @@
   dependencies:
     "@emotion/memoize" "^0.8.0"
 
+"@emotion/is-prop-valid@^1.2.1":
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-1.2.2.tgz#d4175076679c6a26faa92b03bb786f9e52612337"
+  integrity sha512-uNsoYd37AFmaCdXlg6EYD1KaPOaRWRByMCYzbKUX4+hhMfrxdVSelShywL4JVaAeM/eHUOSprYBQls+/neX3pw==
+  dependencies:
+    "@emotion/memoize" "^0.8.1"
+
 "@emotion/memoize@0.7.4":
   version "0.7.4"
   resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb"
@@ -2346,6 +2385,11 @@
   resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.8.0.tgz#f580f9beb67176fa57aae70b08ed510e1b18980f"
   integrity sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA==
 
+"@emotion/memoize@^0.8.1":
+  version "0.8.1"
+  resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.8.1.tgz#c1ddb040429c6d21d38cc945fe75c818cfb68e17"
+  integrity sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==
+
 "@emotion/react@^11.10.4", "@emotion/react@^11.8.1":
   version "11.10.5"
   resolved "https://registry.yarnpkg.com/@emotion/react/-/react-11.10.5.tgz#95fff612a5de1efa9c0d535384d3cfa115fe175d"
@@ -2360,6 +2404,20 @@
     "@emotion/weak-memoize" "^0.3.0"
     hoist-non-react-statics "^3.3.1"
 
+"@emotion/react@^11.10.6":
+  version "11.11.4"
+  resolved "https://registry.yarnpkg.com/@emotion/react/-/react-11.11.4.tgz#3a829cac25c1f00e126408fab7f891f00ecc3c1d"
+  integrity sha512-t8AjMlF0gHpvvxk5mAtCqR4vmxiGHCeJBaQO6gncUSdklELOgtwjerNY2yuJNfwnc6vi16U/+uMF+afIawJ9iw==
+  dependencies:
+    "@babel/runtime" "^7.18.3"
+    "@emotion/babel-plugin" "^11.11.0"
+    "@emotion/cache" "^11.11.0"
+    "@emotion/serialize" "^1.1.3"
+    "@emotion/use-insertion-effect-with-fallbacks" "^1.0.1"
+    "@emotion/utils" "^1.2.1"
+    "@emotion/weak-memoize" "^0.3.1"
+    hoist-non-react-statics "^3.3.1"
+
 "@emotion/serialize@^1.1.1":
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-1.1.1.tgz#0595701b1902feded8a96d293b26be3f5c1a5cf0"
@@ -2371,11 +2429,27 @@
     "@emotion/utils" "^1.2.0"
     csstype "^3.0.2"
 
+"@emotion/serialize@^1.1.2", "@emotion/serialize@^1.1.3":
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-1.1.3.tgz#84b77bfcfe3b7bb47d326602f640ccfcacd5ffb0"
+  integrity sha512-iD4D6QVZFDhcbH0RAG1uVu1CwVLMWUkCvAqqlewO/rxf8+87yIBAlt4+AxMiiKPLs5hFc0owNk/sLLAOROw3cA==
+  dependencies:
+    "@emotion/hash" "^0.9.1"
+    "@emotion/memoize" "^0.8.1"
+    "@emotion/unitless" "^0.8.1"
+    "@emotion/utils" "^1.2.1"
+    csstype "^3.0.2"
+
 "@emotion/sheet@^1.2.1":
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-1.2.1.tgz#0767e0305230e894897cadb6c8df2c51e61a6c2c"
   integrity sha512-zxRBwl93sHMsOj4zs+OslQKg/uhF38MB+OMKoCrVuS0nyTkqnau+BM3WGEoOptg9Oz45T/aIGs1qbVAsEFo3nA==
 
+"@emotion/sheet@^1.2.2":
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-1.2.2.tgz#d58e788ee27267a14342303e1abb3d508b6d0fec"
+  integrity sha512-0QBtGvaqtWi+nx6doRwDdBIzhNdZrXUppvTM4dtZZWEGTXL/XE/yJxLMGlDT1Gt+UHH5IX1n+jkXyytE/av7OA==
+
 "@emotion/styled@^11.10.4":
   version "11.10.5"
   resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-11.10.5.tgz#1fe7bf941b0909802cb826457e362444e7e96a79"
@@ -2388,135 +2462,167 @@
     "@emotion/use-insertion-effect-with-fallbacks" "^1.0.0"
     "@emotion/utils" "^1.2.0"
 
+"@emotion/styled@^11.10.6":
+  version "11.11.0"
+  resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-11.11.0.tgz#26b75e1b5a1b7a629d7c0a8b708fbf5a9cdce346"
+  integrity sha512-hM5Nnvu9P3midq5aaXj4I+lnSfNi7Pmd4EWk1fOZ3pxookaQTNew6bp4JaCBYM4HVFZF9g7UjJmsUmC2JlxOng==
+  dependencies:
+    "@babel/runtime" "^7.18.3"
+    "@emotion/babel-plugin" "^11.11.0"
+    "@emotion/is-prop-valid" "^1.2.1"
+    "@emotion/serialize" "^1.1.2"
+    "@emotion/use-insertion-effect-with-fallbacks" "^1.0.1"
+    "@emotion/utils" "^1.2.1"
+
 "@emotion/unitless@^0.8.0":
   version "0.8.0"
   resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.8.0.tgz#a4a36e9cbdc6903737cd20d38033241e1b8833db"
   integrity sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw==
 
+"@emotion/unitless@^0.8.1":
+  version "0.8.1"
+  resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.8.1.tgz#182b5a4704ef8ad91bde93f7a860a88fd92c79a3"
+  integrity sha512-KOEGMu6dmJZtpadb476IsZBclKvILjopjUii3V+7MnXIQCYh8W3NgNcgwo21n9LXZX6EDIKvqfjYxXebDwxKmQ==
+
 "@emotion/use-insertion-effect-with-fallbacks@^1.0.0":
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.0.0.tgz#ffadaec35dbb7885bd54de3fa267ab2f860294df"
   integrity sha512-1eEgUGmkaljiBnRMTdksDV1W4kUnmwgp7X9G8B++9GYwl1lUdqSndSriIrTJ0N7LQaoauY9JJ2yhiOYK5+NI4A==
 
+"@emotion/use-insertion-effect-with-fallbacks@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.0.1.tgz#08de79f54eb3406f9daaf77c76e35313da963963"
+  integrity sha512-jT/qyKZ9rzLErtrjGgdkMBn2OP8wl0G3sQlBb3YPryvKHsjvINUhVaPFfP+fpBcOkmrVOVEEHQFJ7nbj2TH2gw==
+
 "@emotion/utils@^1.2.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-1.2.0.tgz#9716eaccbc6b5ded2ea5a90d65562609aab0f561"
   integrity sha512-sn3WH53Kzpw8oQ5mgMmIzzyAaH2ZqFEbozVVBSYp538E06OSE6ytOp7pRAjNQR+Q/orwqdQYJSe2m3hCOeznkw==
 
+"@emotion/utils@^1.2.1":
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-1.2.1.tgz#bbab58465738d31ae4cb3dbb6fc00a5991f755e4"
+  integrity sha512-Y2tGf3I+XVnajdItskUCn6LX+VUDmP6lTL4fcqsXAv43dnlbZiuW4MWQW38rW/BVWSE7Q/7+XQocmpnRYILUmg==
+
 "@emotion/weak-memoize@^0.3.0":
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.3.0.tgz#ea89004119dc42db2e1dba0f97d553f7372f6fcb"
   integrity sha512-AHPmaAx+RYfZz0eYu6Gviiagpmiyw98ySSlQvCUhVGDRtDFe4DBS0x1bSjdF3gqUDYOczB+yYvBTtEylYSdRhg==
 
-"@esbuild/android-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.17.19.tgz#bafb75234a5d3d1b690e7c2956a599345e84a2fd"
-  integrity sha512-KBMWvEZooR7+kzY0BtbTQn0OAYY7CsiydT63pVEaPtVYF0hXbUaOyZog37DKxK7NF3XacBJOpYT4adIJh+avxA==
-
-"@esbuild/android-arm@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.17.19.tgz#5898f7832c2298bc7d0ab53701c57beb74d78b4d"
-  integrity sha512-rIKddzqhmav7MSmoFCmDIb6e2W57geRsM94gV2l38fzhXMwq7hZoClug9USI2pFRGL06f4IOPHHpFNOkWieR8A==
-
-"@esbuild/android-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.17.19.tgz#658368ef92067866d95fb268719f98f363d13ae1"
-  integrity sha512-uUTTc4xGNDT7YSArp/zbtmbhO0uEEK9/ETW29Wk1thYUJBz3IVnvgEiEwEa9IeLyvnpKrWK64Utw2bgUmDveww==
-
-"@esbuild/darwin-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.17.19.tgz#584c34c5991b95d4d48d333300b1a4e2ff7be276"
-  integrity sha512-80wEoCfF/hFKM6WE1FyBHc9SfUblloAWx6FJkFWTWiCoht9Mc0ARGEM47e67W9rI09YoUxJL68WHfDRYEAvOhg==
-
-"@esbuild/darwin-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.17.19.tgz#7751d236dfe6ce136cce343dce69f52d76b7f6cb"
-  integrity sha512-IJM4JJsLhRYr9xdtLytPLSH9k/oxR3boaUIYiHkAawtwNOXKE8KoU8tMvryogdcT8AU+Bflmh81Xn6Q0vTZbQw==
-
-"@esbuild/freebsd-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.17.19.tgz#cacd171665dd1d500f45c167d50c6b7e539d5fd2"
-  integrity sha512-pBwbc7DufluUeGdjSU5Si+P3SoMF5DQ/F/UmTSb8HXO80ZEAJmrykPyzo1IfNbAoaqw48YRpv8shwd1NoI0jcQ==
-
-"@esbuild/freebsd-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.17.19.tgz#0769456eee2a08b8d925d7c00b79e861cb3162e4"
-  integrity sha512-4lu+n8Wk0XlajEhbEffdy2xy53dpR06SlzvhGByyg36qJw6Kpfk7cp45DR/62aPH9mtJRmIyrXAS5UWBrJT6TQ==
-
-"@esbuild/linux-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.17.19.tgz#38e162ecb723862c6be1c27d6389f48960b68edb"
-  integrity sha512-ct1Tg3WGwd3P+oZYqic+YZF4snNl2bsnMKRkb3ozHmnM0dGWuxcPTTntAF6bOP0Sp4x0PjSF+4uHQ1xvxfRKqg==
-
-"@esbuild/linux-arm@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.17.19.tgz#1a2cd399c50040184a805174a6d89097d9d1559a"
-  integrity sha512-cdmT3KxjlOQ/gZ2cjfrQOtmhG4HJs6hhvm3mWSRDPtZ/lP5oe8FWceS10JaSJC13GBd4eH/haHnqf7hhGNLerA==
-
-"@esbuild/linux-ia32@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.17.19.tgz#e28c25266b036ce1cabca3c30155222841dc035a"
-  integrity sha512-w4IRhSy1VbsNxHRQpeGCHEmibqdTUx61Vc38APcsRbuVgK0OPEnQ0YD39Brymn96mOx48Y2laBQGqgZ0j9w6SQ==
-
-"@esbuild/linux-loong64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.17.19.tgz#0f887b8bb3f90658d1a0117283e55dbd4c9dcf72"
-  integrity sha512-2iAngUbBPMq439a+z//gE+9WBldoMp1s5GWsUSgqHLzLJ9WoZLZhpwWuym0u0u/4XmZ3gpHmzV84PonE+9IIdQ==
-
-"@esbuild/linux-mips64el@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.17.19.tgz#f5d2a0b8047ea9a5d9f592a178ea054053a70289"
-  integrity sha512-LKJltc4LVdMKHsrFe4MGNPp0hqDFA1Wpt3jE1gEyM3nKUvOiO//9PheZZHfYRfYl6AwdTH4aTcXSqBerX0ml4A==
-
-"@esbuild/linux-ppc64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.17.19.tgz#876590e3acbd9fa7f57a2c7d86f83717dbbac8c7"
-  integrity sha512-/c/DGybs95WXNS8y3Ti/ytqETiW7EU44MEKuCAcpPto3YjQbyK3IQVKfF6nbghD7EcLUGl0NbiL5Rt5DMhn5tg==
-
-"@esbuild/linux-riscv64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.17.19.tgz#7f49373df463cd9f41dc34f9b2262d771688bf09"
-  integrity sha512-FC3nUAWhvFoutlhAkgHf8f5HwFWUL6bYdvLc/TTuxKlvLi3+pPzdZiFKSWz/PF30TB1K19SuCxDTI5KcqASJqA==
-
-"@esbuild/linux-s390x@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.17.19.tgz#e2afd1afcaf63afe2c7d9ceacd28ec57c77f8829"
-  integrity sha512-IbFsFbxMWLuKEbH+7sTkKzL6NJmG2vRyy6K7JJo55w+8xDk7RElYn6xvXtDW8HCfoKBFK69f3pgBJSUSQPr+4Q==
-
-"@esbuild/linux-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.17.19.tgz#8a0e9738b1635f0c53389e515ae83826dec22aa4"
-  integrity sha512-68ngA9lg2H6zkZcyp22tsVt38mlhWde8l3eJLWkyLrp4HwMUr3c1s/M2t7+kHIhvMjglIBrFpncX1SzMckomGw==
-
-"@esbuild/netbsd-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.17.19.tgz#c29fb2453c6b7ddef9a35e2c18b37bda1ae5c462"
-  integrity sha512-CwFq42rXCR8TYIjIfpXCbRX0rp1jo6cPIUPSaWwzbVI4aOfX96OXY8M6KNmtPcg7QjYeDmN+DD0Wp3LaBOLf4Q==
-
-"@esbuild/openbsd-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.17.19.tgz#95e75a391403cb10297280d524d66ce04c920691"
-  integrity sha512-cnq5brJYrSZ2CF6c35eCmviIN3k3RczmHz8eYaVlNasVqsNY+JKohZU5MKmaOI+KkllCdzOKKdPs762VCPC20g==
-
-"@esbuild/sunos-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.17.19.tgz#722eaf057b83c2575937d3ffe5aeb16540da7273"
-  integrity sha512-vCRT7yP3zX+bKWFeP/zdS6SqdWB8OIpaRq/mbXQxTGHnIxspRtigpkUcDMlSCOejlHowLqII7K2JKevwyRP2rg==
-
-"@esbuild/win32-arm64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.17.19.tgz#9aa9dc074399288bdcdd283443e9aeb6b9552b6f"
-  integrity sha512-yYx+8jwowUstVdorcMdNlzklLYhPxjniHWFKgRqH7IFlUEa0Umu3KuYplf1HUZZ422e3NU9F4LGb+4O0Kdcaag==
-
-"@esbuild/win32-ia32@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.17.19.tgz#95ad43c62ad62485e210f6299c7b2571e48d2b03"
-  integrity sha512-eggDKanJszUtCdlVs0RB+h35wNlb5v4TWEkq4vZcmVt5u/HiDZrTXe2bWFQUez3RgNHwx/x4sk5++4NSSicKkw==
-
-"@esbuild/win32-x64@0.17.19":
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.17.19.tgz#8cfaf2ff603e9aabb910e9c0558c26cf32744061"
-  integrity sha512-lAhycmKnVOuRYNtRtatQR1LPQf2oYCkRGkSFnseDAKPl8lu5SOsK/e1sXe5a0Pc5kHIHe6P2I/ilntNv2xf3cA==
+"@emotion/weak-memoize@^0.3.1":
+  version "0.3.1"
+  resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.3.1.tgz#d0fce5d07b0620caa282b5131c297bb60f9d87e6"
+  integrity sha512-EsBwpc7hBUJWAsNPBmJy4hxWx12v6bshQsldrVmjxJoc3isbxhOrF2IcCpaXxfvq03NwkI7sbsOLXbYuqF/8Ww==
+
+"@esbuild/android-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.18.20.tgz#984b4f9c8d0377443cc2dfcef266d02244593622"
+  integrity sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ==
+
+"@esbuild/android-arm@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.18.20.tgz#fedb265bc3a589c84cc11f810804f234947c3682"
+  integrity sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw==
+
+"@esbuild/android-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.18.20.tgz#35cf419c4cfc8babe8893d296cd990e9e9f756f2"
+  integrity sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg==
+
+"@esbuild/darwin-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.18.20.tgz#08172cbeccf95fbc383399a7f39cfbddaeb0d7c1"
+  integrity sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA==
+
+"@esbuild/darwin-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.18.20.tgz#d70d5790d8bf475556b67d0f8b7c5bdff053d85d"
+  integrity sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ==
+
+"@esbuild/freebsd-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.18.20.tgz#98755cd12707f93f210e2494d6a4b51b96977f54"
+  integrity sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw==
+
+"@esbuild/freebsd-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.18.20.tgz#c1eb2bff03915f87c29cece4c1a7fa1f423b066e"
+  integrity sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ==
+
+"@esbuild/linux-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.18.20.tgz#bad4238bd8f4fc25b5a021280c770ab5fc3a02a0"
+  integrity sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA==
+
+"@esbuild/linux-arm@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.18.20.tgz#3e617c61f33508a27150ee417543c8ab5acc73b0"
+  integrity sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg==
+
+"@esbuild/linux-ia32@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.18.20.tgz#699391cccba9aee6019b7f9892eb99219f1570a7"
+  integrity sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA==
+
+"@esbuild/linux-loong64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.18.20.tgz#e6fccb7aac178dd2ffb9860465ac89d7f23b977d"
+  integrity sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg==
+
+"@esbuild/linux-mips64el@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.18.20.tgz#eeff3a937de9c2310de30622a957ad1bd9183231"
+  integrity sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ==
+
+"@esbuild/linux-ppc64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.18.20.tgz#2f7156bde20b01527993e6881435ad79ba9599fb"
+  integrity sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA==
+
+"@esbuild/linux-riscv64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.18.20.tgz#6628389f210123d8b4743045af8caa7d4ddfc7a6"
+  integrity sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A==
+
+"@esbuild/linux-s390x@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.18.20.tgz#255e81fb289b101026131858ab99fba63dcf0071"
+  integrity sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ==
+
+"@esbuild/linux-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.18.20.tgz#c7690b3417af318a9b6f96df3031a8865176d338"
+  integrity sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w==
+
+"@esbuild/netbsd-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.18.20.tgz#30e8cd8a3dded63975e2df2438ca109601ebe0d1"
+  integrity sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A==
+
+"@esbuild/openbsd-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.18.20.tgz#7812af31b205055874c8082ea9cf9ab0da6217ae"
+  integrity sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg==
+
+"@esbuild/sunos-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.18.20.tgz#d5c275c3b4e73c9b0ecd38d1ca62c020f887ab9d"
+  integrity sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ==
+
+"@esbuild/win32-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.18.20.tgz#73bc7f5a9f8a77805f357fab97f290d0e4820ac9"
+  integrity sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg==
+
+"@esbuild/win32-ia32@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.18.20.tgz#ec93cbf0ef1085cc12e71e0d661d20569ff42102"
+  integrity sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g==
+
+"@esbuild/win32-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.18.20.tgz#786c5f41f043b07afb1af37683d7c33668858f6d"
+  integrity sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ==
 
 "@eslint-community/eslint-utils@^4.2.0":
   version "4.4.0"
@@ -2558,7 +2664,7 @@
   resolved "https://registry.yarnpkg.com/@ethereumjs/rlp/-/rlp-4.0.1.tgz#626fabfd9081baab3d0a3074b0c7ecaf674aaa41"
   integrity sha512-tqsQiBQDQdmPWE1xkkBq4rlSW5QZpLOUJ5RJh2/9fug+q9tnUhuZoVLk7s0scUIKTOzEtR72DFBXI4WiZcMpvw==
 
-"@ethereumjs/tx@^4.1.2":
+"@ethereumjs/tx@^4.1.2", "@ethereumjs/tx@^4.2.0":
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/@ethereumjs/tx/-/tx-4.2.0.tgz#5988ae15daf5a3b3c815493bc6b495e76009e853"
   integrity sha512-1nc6VO4jtFd172BbSnTnDQVr9IYBFl1y4xPzZdtkrkKIncBCkdbgfdRV+MiTkJYAtTxvV12GRZLqBFT1PNK6Yw==
@@ -2577,348 +2683,6 @@
     ethereum-cryptography "^2.0.0"
     micro-ftch "^0.3.1"
 
-"@ethersproject/abi@5.7.0", "@ethersproject/abi@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/abi/-/abi-5.7.0.tgz#b3f3e045bbbeed1af3947335c247ad625a44e449"
-  integrity sha512-351ktp42TiRcYB3H1OP8yajPeAQstMW/yCFokj/AthP9bLHzQFPlOrxOcwYEDkUAICmOHljvN4K39OMTMUa9RA==
-  dependencies:
-    "@ethersproject/address" "^5.7.0"
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/constants" "^5.7.0"
-    "@ethersproject/hash" "^5.7.0"
-    "@ethersproject/keccak256" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/strings" "^5.7.0"
-
-"@ethersproject/abstract-provider@5.7.0", "@ethersproject/abstract-provider@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/abstract-provider/-/abstract-provider-5.7.0.tgz#b0a8550f88b6bf9d51f90e4795d48294630cb9ef"
-  integrity sha512-R41c9UkchKCpAqStMYUpdunjo3pkEvZC3FAwZn5S5MGbXoMQOHIdHItezTETxAO5bevtMApSyEhn9+CHcDsWBw==
-  dependencies:
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/networks" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/transactions" "^5.7.0"
-    "@ethersproject/web" "^5.7.0"
-
-"@ethersproject/abstract-signer@5.7.0", "@ethersproject/abstract-signer@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/abstract-signer/-/abstract-signer-5.7.0.tgz#13f4f32117868452191a4649723cb086d2b596b2"
-  integrity sha512-a16V8bq1/Cz+TGCkE2OPMTOUDLS3grCpdjoJCYNnVBbdYEMSgKrU0+B90s8b6H+ByYTBZN7a3g76jdIJi7UfKQ==
-  dependencies:
-    "@ethersproject/abstract-provider" "^5.7.0"
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-
-"@ethersproject/address@5.7.0", "@ethersproject/address@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/address/-/address-5.7.0.tgz#19b56c4d74a3b0a46bfdbb6cfcc0a153fc697f37"
-  integrity sha512-9wYhYt7aghVGo758POM5nqcOMaE168Q6aRLJZwUmiqSrAungkG74gSSeKEIR7ukixesdRZGPgVqme6vmxs1fkA==
-  dependencies:
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/keccak256" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/rlp" "^5.7.0"
-
-"@ethersproject/base64@5.7.0", "@ethersproject/base64@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/base64/-/base64-5.7.0.tgz#ac4ee92aa36c1628173e221d0d01f53692059e1c"
-  integrity sha512-Dr8tcHt2mEbsZr/mwTPIQAf3Ai0Bks/7gTw9dSqk1mQvhW3XvRlmDJr/4n+wg1JmCl16NZue17CDh8xb/vZ0sQ==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-
-"@ethersproject/basex@5.7.0", "@ethersproject/basex@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/basex/-/basex-5.7.0.tgz#97034dc7e8938a8ca943ab20f8a5e492ece4020b"
-  integrity sha512-ywlh43GwZLv2Voc2gQVTKBoVQ1mti3d8HK5aMxsfu/nRDnMmNqaSJ3r3n85HBByT8OpoY96SXM1FogC533T4zw==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-
-"@ethersproject/bignumber@5.7.0", "@ethersproject/bignumber@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/bignumber/-/bignumber-5.7.0.tgz#e2f03837f268ba655ffba03a57853e18a18dc9c2"
-  integrity sha512-n1CAdIHRWjSucQO3MC1zPSVgV/6dy/fjL9pMrPP9peL+QxEg9wOsVqwD4+818B6LUEtaXzVHQiuivzRoxPxUGw==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    bn.js "^5.2.1"
-
-"@ethersproject/bytes@5.7.0", "@ethersproject/bytes@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/bytes/-/bytes-5.7.0.tgz#a00f6ea8d7e7534d6d87f47188af1148d71f155d"
-  integrity sha512-nsbxwgFXWh9NyYWo+U8atvmMsSdKJprTcICAkvbBffT75qDocbuggBU0SJiVK2MuTrp0q+xvLkTnGMPK1+uA9A==
-  dependencies:
-    "@ethersproject/logger" "^5.7.0"
-
-"@ethersproject/constants@5.7.0", "@ethersproject/constants@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/constants/-/constants-5.7.0.tgz#df80a9705a7e08984161f09014ea012d1c75295e"
-  integrity sha512-DHI+y5dBNvkpYUMiRQyxRBYBefZkJfo70VUkUAsRjcPs47muV9evftfZ0PJVCXYbAiCgght0DtcF9srFQmIgWA==
-  dependencies:
-    "@ethersproject/bignumber" "^5.7.0"
-
-"@ethersproject/contracts@5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/contracts/-/contracts-5.7.0.tgz#c305e775abd07e48aa590e1a877ed5c316f8bd1e"
-  integrity sha512-5GJbzEU3X+d33CdfPhcyS+z8MzsTrBGk/sc+G+59+tPa9yFkl6HQ9D6L0QMgNTA9q8dT0XKxxkyp883XsQvbbg==
-  dependencies:
-    "@ethersproject/abi" "^5.7.0"
-    "@ethersproject/abstract-provider" "^5.7.0"
-    "@ethersproject/abstract-signer" "^5.7.0"
-    "@ethersproject/address" "^5.7.0"
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/constants" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/transactions" "^5.7.0"
-
-"@ethersproject/hash@5.7.0", "@ethersproject/hash@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/hash/-/hash-5.7.0.tgz#eb7aca84a588508369562e16e514b539ba5240a7"
-  integrity sha512-qX5WrQfnah1EFnO5zJv1v46a8HW0+E5xuBBDTwMFZLuVTx0tbU2kkx15NqdjxecrLGatQN9FGQKpb1FKdHCt+g==
-  dependencies:
-    "@ethersproject/abstract-signer" "^5.7.0"
-    "@ethersproject/address" "^5.7.0"
-    "@ethersproject/base64" "^5.7.0"
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/keccak256" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/strings" "^5.7.0"
-
-"@ethersproject/hdnode@5.7.0", "@ethersproject/hdnode@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/hdnode/-/hdnode-5.7.0.tgz#e627ddc6b466bc77aebf1a6b9e47405ca5aef9cf"
-  integrity sha512-OmyYo9EENBPPf4ERhR7oj6uAtUAhYGqOnIS+jE5pTXvdKBS99ikzq1E7Iv0ZQZ5V36Lqx1qZLeak0Ra16qpeOg==
-  dependencies:
-    "@ethersproject/abstract-signer" "^5.7.0"
-    "@ethersproject/basex" "^5.7.0"
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/pbkdf2" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/sha2" "^5.7.0"
-    "@ethersproject/signing-key" "^5.7.0"
-    "@ethersproject/strings" "^5.7.0"
-    "@ethersproject/transactions" "^5.7.0"
-    "@ethersproject/wordlists" "^5.7.0"
-
-"@ethersproject/json-wallets@5.7.0", "@ethersproject/json-wallets@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/json-wallets/-/json-wallets-5.7.0.tgz#5e3355287b548c32b368d91014919ebebddd5360"
-  integrity sha512-8oee5Xgu6+RKgJTkvEMl2wDgSPSAQ9MB/3JYjFV9jlKvcYHUXZC+cQp0njgmxdHkYWn8s6/IqIZYm0YWCjO/0g==
-  dependencies:
-    "@ethersproject/abstract-signer" "^5.7.0"
-    "@ethersproject/address" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/hdnode" "^5.7.0"
-    "@ethersproject/keccak256" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/pbkdf2" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/random" "^5.7.0"
-    "@ethersproject/strings" "^5.7.0"
-    "@ethersproject/transactions" "^5.7.0"
-    aes-js "3.0.0"
-    scrypt-js "3.0.1"
-
-"@ethersproject/keccak256@5.7.0", "@ethersproject/keccak256@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/keccak256/-/keccak256-5.7.0.tgz#3186350c6e1cd6aba7940384ec7d6d9db01f335a"
-  integrity sha512-2UcPboeL/iW+pSg6vZ6ydF8tCnv3Iu/8tUmLLzWWGzxWKFFqOBQFLo6uLUv6BDrLgCDfN28RJ/wtByx+jZ4KBg==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    js-sha3 "0.8.0"
-
-"@ethersproject/logger@5.7.0", "@ethersproject/logger@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/logger/-/logger-5.7.0.tgz#6ce9ae168e74fecf287be17062b590852c311892"
-  integrity sha512-0odtFdXu/XHtjQXJYA3u9G0G8btm0ND5Cu8M7i5vhEcE8/HmF4Lbdqanwyv4uQTr2tx6b7fQRmgLrsnpQlmnig==
-
-"@ethersproject/networks@5.7.1", "@ethersproject/networks@^5.7.0":
-  version "5.7.1"
-  resolved "https://registry.yarnpkg.com/@ethersproject/networks/-/networks-5.7.1.tgz#118e1a981d757d45ccea6bb58d9fd3d9db14ead6"
-  integrity sha512-n/MufjFYv3yFcUyfhnXotyDlNdFb7onmkSy8aQERi2PjNcnWQ66xXxa3XlS8nCcA8aJKJjIIMNJTC7tu80GwpQ==
-  dependencies:
-    "@ethersproject/logger" "^5.7.0"
-
-"@ethersproject/pbkdf2@5.7.0", "@ethersproject/pbkdf2@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/pbkdf2/-/pbkdf2-5.7.0.tgz#d2267d0a1f6e123f3771007338c47cccd83d3102"
-  integrity sha512-oR/dBRZR6GTyaofd86DehG72hY6NpAjhabkhxgr3X2FpJtJuodEl2auADWBZfhDHgVCbu3/H/Ocq2uC6dpNjjw==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/sha2" "^5.7.0"
-
-"@ethersproject/properties@5.7.0", "@ethersproject/properties@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/properties/-/properties-5.7.0.tgz#a6e12cb0439b878aaf470f1902a176033067ed30"
-  integrity sha512-J87jy8suntrAkIZtecpxEPxY//szqr1mlBaYlQ0r4RCaiD2hjheqF9s1LVE8vVuJCXisjIP+JgtK/Do54ej4Sw==
-  dependencies:
-    "@ethersproject/logger" "^5.7.0"
-
-"@ethersproject/providers@5.7.2":
-  version "5.7.2"
-  resolved "https://registry.yarnpkg.com/@ethersproject/providers/-/providers-5.7.2.tgz#f8b1a4f275d7ce58cf0a2eec222269a08beb18cb"
-  integrity sha512-g34EWZ1WWAVgr4aptGlVBF8mhl3VWjv+8hoAnzStu8Ah22VHBsuGzP17eb6xDVRzw895G4W7vvx60lFFur/1Rg==
-  dependencies:
-    "@ethersproject/abstract-provider" "^5.7.0"
-    "@ethersproject/abstract-signer" "^5.7.0"
-    "@ethersproject/address" "^5.7.0"
-    "@ethersproject/base64" "^5.7.0"
-    "@ethersproject/basex" "^5.7.0"
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/constants" "^5.7.0"
-    "@ethersproject/hash" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/networks" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/random" "^5.7.0"
-    "@ethersproject/rlp" "^5.7.0"
-    "@ethersproject/sha2" "^5.7.0"
-    "@ethersproject/strings" "^5.7.0"
-    "@ethersproject/transactions" "^5.7.0"
-    "@ethersproject/web" "^5.7.0"
-    bech32 "1.1.4"
-    ws "7.4.6"
-
-"@ethersproject/random@5.7.0", "@ethersproject/random@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/random/-/random-5.7.0.tgz#af19dcbc2484aae078bb03656ec05df66253280c"
-  integrity sha512-19WjScqRA8IIeWclFme75VMXSBvi4e6InrUNuaR4s5pTF2qNhcGdCUwdxUVGtDDqC00sDLCO93jPQoDUH4HVmQ==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-
-"@ethersproject/rlp@5.7.0", "@ethersproject/rlp@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/rlp/-/rlp-5.7.0.tgz#de39e4d5918b9d74d46de93af80b7685a9c21304"
-  integrity sha512-rBxzX2vK8mVF7b0Tol44t5Tb8gomOHkj5guL+HhzQ1yBh/ydjGnpw6at+X6Iw0Kp3OzzzkcKp8N9r0W4kYSs9w==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-
-"@ethersproject/sha2@5.7.0", "@ethersproject/sha2@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/sha2/-/sha2-5.7.0.tgz#9a5f7a7824ef784f7f7680984e593a800480c9fb"
-  integrity sha512-gKlH42riwb3KYp0reLsFTokByAKoJdgFCwI+CCiX/k+Jm2mbNs6oOaCjYQSlI1+XBVejwH2KrmCbMAT/GnRDQw==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    hash.js "1.1.7"
-
-"@ethersproject/signing-key@5.7.0", "@ethersproject/signing-key@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/signing-key/-/signing-key-5.7.0.tgz#06b2df39411b00bc57c7c09b01d1e41cf1b16ab3"
-  integrity sha512-MZdy2nL3wO0u7gkB4nA/pEf8lu1TlFswPNmy8AiYkfKTdO6eXBJyUdmHO/ehm/htHw9K/qF8ujnTyUAD+Ry54Q==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    bn.js "^5.2.1"
-    elliptic "6.5.4"
-    hash.js "1.1.7"
-
-"@ethersproject/solidity@5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/solidity/-/solidity-5.7.0.tgz#5e9c911d8a2acce2a5ebb48a5e2e0af20b631cb8"
-  integrity sha512-HmabMd2Dt/raavyaGukF4XxizWKhKQ24DoLtdNbBmNKUOPqwjsKQSdV9GQtj9CBEea9DlzETlVER1gYeXXBGaA==
-  dependencies:
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/keccak256" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/sha2" "^5.7.0"
-    "@ethersproject/strings" "^5.7.0"
-
-"@ethersproject/strings@5.7.0", "@ethersproject/strings@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/strings/-/strings-5.7.0.tgz#54c9d2a7c57ae8f1205c88a9d3a56471e14d5ed2"
-  integrity sha512-/9nu+lj0YswRNSH0NXYqrh8775XNyEdUQAuf3f+SmOrnVewcJ5SBNAjF7lpgehKi4abvNNXyf+HX86czCdJ8Mg==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/constants" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-
-"@ethersproject/transactions@5.7.0", "@ethersproject/transactions@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/transactions/-/transactions-5.7.0.tgz#91318fc24063e057885a6af13fdb703e1f993d3b"
-  integrity sha512-kmcNicCp1lp8qanMTC3RIikGgoJ80ztTyvtsFvCYpSCfkjhD0jZ2LOrnbcuxuToLIUYYf+4XwD1rP+B/erDIhQ==
-  dependencies:
-    "@ethersproject/address" "^5.7.0"
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/constants" "^5.7.0"
-    "@ethersproject/keccak256" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/rlp" "^5.7.0"
-    "@ethersproject/signing-key" "^5.7.0"
-
-"@ethersproject/units@5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/units/-/units-5.7.0.tgz#637b563d7e14f42deeee39245275d477aae1d8b1"
-  integrity sha512-pD3xLMy3SJu9kG5xDGI7+xhTEmGXlEqXU4OfNapmfnxLVY4EMSSRp7j1k7eezutBPH7RBN/7QPnwR7hzNlEFeg==
-  dependencies:
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/constants" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-
-"@ethersproject/wallet@5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/wallet/-/wallet-5.7.0.tgz#4e5d0790d96fe21d61d38fb40324e6c7ef350b2d"
-  integrity sha512-MhmXlJXEJFBFVKrDLB4ZdDzxcBxQ3rLyCkhNqVu3CDYvR97E+8r01UgrI+TI99Le+aYm/in/0vp86guJuM7FCA==
-  dependencies:
-    "@ethersproject/abstract-provider" "^5.7.0"
-    "@ethersproject/abstract-signer" "^5.7.0"
-    "@ethersproject/address" "^5.7.0"
-    "@ethersproject/bignumber" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/hash" "^5.7.0"
-    "@ethersproject/hdnode" "^5.7.0"
-    "@ethersproject/json-wallets" "^5.7.0"
-    "@ethersproject/keccak256" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/random" "^5.7.0"
-    "@ethersproject/signing-key" "^5.7.0"
-    "@ethersproject/transactions" "^5.7.0"
-    "@ethersproject/wordlists" "^5.7.0"
-
-"@ethersproject/web@5.7.1", "@ethersproject/web@^5.7.0":
-  version "5.7.1"
-  resolved "https://registry.yarnpkg.com/@ethersproject/web/-/web-5.7.1.tgz#de1f285b373149bee5928f4eb7bcb87ee5fbb4ae"
-  integrity sha512-Gueu8lSvyjBWL4cYsWsjh6MtMwM0+H4HvqFPZfB6dV8ctbP9zFAO73VG1cMWae0FLPCtz0peKPpZY8/ugJJX2w==
-  dependencies:
-    "@ethersproject/base64" "^5.7.0"
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/strings" "^5.7.0"
-
-"@ethersproject/wordlists@5.7.0", "@ethersproject/wordlists@^5.7.0":
-  version "5.7.0"
-  resolved "https://registry.yarnpkg.com/@ethersproject/wordlists/-/wordlists-5.7.0.tgz#8fb2c07185d68c3e09eb3bfd6e779ba2774627f5"
-  integrity sha512-S2TFNJNfHWVHNE6cNDjbVlZ6MgE17MIxMbMg2zv3wn+3XSJGosL1m9ZVv3GXCf/2ymSsQ+hRI5IzoMJTG6aoVA==
-  dependencies:
-    "@ethersproject/bytes" "^5.7.0"
-    "@ethersproject/hash" "^5.7.0"
-    "@ethersproject/logger" "^5.7.0"
-    "@ethersproject/properties" "^5.7.0"
-    "@ethersproject/strings" "^5.7.0"
-
 "@fastify/busboy@^2.0.0":
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/@fastify/busboy/-/busboy-2.0.0.tgz#f22824caff3ae506b18207bad4126dbc6ccdb6b8"
@@ -2963,6 +2727,20 @@
     "@n1ru4l/push-pull-async-iterable-iterator" "^3.1.0"
     meros "^1.1.4"
 
+"@growthbook/growthbook-react@0.21.0":
+  version "0.21.0"
+  resolved "https://registry.yarnpkg.com/@growthbook/growthbook-react/-/growthbook-react-0.21.0.tgz#e3aee1bda7faf3ea036badfbca09e2230884b7f7"
+  integrity sha512-LM4jG9xThSYCMfRQECeLtTr8sYyiAxC5NLmT4U3uxKyvVUCB+s0k/vdKrvHcv3YXNJ37mW3VtK9XkNSuW16mcw==
+  dependencies:
+    "@growthbook/growthbook" "^0.31.0"
+
+"@growthbook/growthbook@^0.31.0":
+  version "0.31.0"
+  resolved "https://registry.yarnpkg.com/@growthbook/growthbook/-/growthbook-0.31.0.tgz#66273344805c45dc406940ab719856385afa4750"
+  integrity sha512-VtI5IibZHhvtrlZhfopGYhVXZ++FewgY0BtQQyEqFSrhCYFvEEtq+GkuSm4GcC0JxNuHiYJr9/R3GpffJV/T4Q==
+  dependencies:
+    dom-mutator "^0.6.0"
+
 "@grpc/grpc-js@^1.7.1":
   version "1.9.9"
   resolved "https://registry.yarnpkg.com/@grpc/grpc-js/-/grpc-js-1.9.9.tgz#ce3a05439b1c957ec64c2ecdc6f1e4f54e8af797"
@@ -3071,6 +2849,11 @@
   resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
   integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
 
+"@hypelab/sdk-react@^1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@hypelab/sdk-react/-/sdk-react-1.0.0.tgz#399058576422a7a715edfd6c55b946950a26ba39"
+  integrity sha512-d8eJOqgocXvfMae/JbFXZdK/Q79oYYXScto1wJ7uTDHxrPZTIpgVNhuJM7UKmVJAKRSHnniRcZCjh2+pZCW5ww==
+
 "@ioredis/commands@^1.1.1":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@ioredis/commands/-/commands-1.2.0.tgz#6d61b3097470af1fdbbe622795b8921d42018e11"
@@ -3397,6 +3180,24 @@
     tailwind-variants "^0.1.18"
     tippy.js "^6.3.7"
 
+"@metamask/eth-json-rpc-provider@^1.0.0":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@metamask/eth-json-rpc-provider/-/eth-json-rpc-provider-1.0.1.tgz#3fd5316c767847f4ca107518b611b15396a5a32c"
+  integrity sha512-whiUMPlAOrVGmX8aKYVPvlKyG4CpQXiNNyt74vE1xb5sPvmx5oA7B/kOi/JdBvhGQq97U1/AVdXEdk2zkP8qyA==
+  dependencies:
+    "@metamask/json-rpc-engine" "^7.0.0"
+    "@metamask/safe-event-emitter" "^3.0.0"
+    "@metamask/utils" "^5.0.1"
+
+"@metamask/json-rpc-engine@^7.0.0":
+  version "7.3.3"
+  resolved "https://registry.yarnpkg.com/@metamask/json-rpc-engine/-/json-rpc-engine-7.3.3.tgz#f2b30a2164558014bfcca45db10f5af291d989af"
+  integrity sha512-dwZPq8wx9yV3IX2caLi9q9xZBw2XeIoYqdyihDDDpuHVCEiqadJLwqM3zy+uwf6F1QYQ65A8aOMQg1Uw7LMLNg==
+  dependencies:
+    "@metamask/rpc-errors" "^6.2.1"
+    "@metamask/safe-event-emitter" "^3.0.0"
+    "@metamask/utils" "^8.3.0"
+
 "@metamask/object-multiplex@^1.1.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@metamask/object-multiplex/-/object-multiplex-1.2.0.tgz#38fc15c142f61939391e1b9a8eed679696c7e4f4"
@@ -3406,6 +3207,21 @@
     once "^1.4.0"
     readable-stream "^2.3.3"
 
+"@metamask/onboarding@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@metamask/onboarding/-/onboarding-1.0.1.tgz#14a36e1e175e2f69f09598e2008ab6dc1b3297e6"
+  integrity sha512-FqHhAsCI+Vacx2qa5mAFcWNSrTcVGMNjzxVgaX8ECSny/BJ9/vgXP9V7WF/8vb9DltPeQkxr+Fnfmm6GHfmdTQ==
+  dependencies:
+    bowser "^2.9.0"
+
+"@metamask/post-message-stream@^6.1.0":
+  version "6.2.0"
+  resolved "https://registry.yarnpkg.com/@metamask/post-message-stream/-/post-message-stream-6.2.0.tgz#3db0a50adc2b2206d1bb95739e7fff49e36e0324"
+  integrity sha512-WunZ0bruClF862mvbKQGETn5SM0XKGmocPMQR1Ew6sYix9/FDzeoZnoI8RkXk01E+70FCdxhTE/r8kk5SFOuTw==
+  dependencies:
+    "@metamask/utils" "^5.0.0"
+    readable-stream "2.3.3"
+
 "@metamask/post-message-stream@^7.0.0":
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/@metamask/post-message-stream/-/post-message-stream-7.0.0.tgz#b7698909ec54923b6a6990b8d46cc15c2810d840"
@@ -3432,22 +3248,83 @@
     pump "^3.0.0"
     webextension-polyfill-ts "^0.25.0"
 
-"@metamask/safe-event-emitter@2.0.0", "@metamask/safe-event-emitter@^2.0.0":
+"@metamask/rpc-errors@^6.2.1":
+  version "6.2.1"
+  resolved "https://registry.yarnpkg.com/@metamask/rpc-errors/-/rpc-errors-6.2.1.tgz#f5daf429ededa7cb83069dc621bd5738fe2a1d80"
+  integrity sha512-VTgWkjWLzb0nupkFl1duQi9Mk8TGT9rsdnQg6DeRrYEFxtFOh0IF8nAwxM/4GWqDl6uIB06lqUBgUrAVWl62Bw==
+  dependencies:
+    "@metamask/utils" "^8.3.0"
+    fast-safe-stringify "^2.0.6"
+
+"@metamask/safe-event-emitter@^2.0.0":
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/@metamask/safe-event-emitter/-/safe-event-emitter-2.0.0.tgz#af577b477c683fad17c619a78208cede06f9605c"
   integrity sha512-/kSXhY692qiV1MXu6EeOZvg5nECLclxNXcKCxJ3cXQgYuRymRHpdx/t7JXfsK+JLjwA1e1c1/SBrlQYpusC29Q==
 
-"@metamask/utils@^3.0.1":
-  version "3.6.0"
-  resolved "https://registry.yarnpkg.com/@metamask/utils/-/utils-3.6.0.tgz#b218b969a05ca7a8093b5d1670f6625061de707d"
-  integrity sha512-9cIRrfkWvHblSiNDVXsjivqa9Ak0RYo/1H6tqTqTbAx+oBK2Sva0lWDHxGchOqA7bySGUJKAWSNJvH6gdHZ0gQ==
+"@metamask/safe-event-emitter@^3.0.0":
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/@metamask/safe-event-emitter/-/safe-event-emitter-3.0.0.tgz#8c2b9073fe0722d48693143b0dc8448840daa3bd"
+  integrity sha512-j6Z47VOmVyGMlnKXZmL0fyvWfEYtKWCA9yGZkU3FCsGZUT5lHGmvaV9JA5F2Y+010y7+ROtR3WMXIkvl/nVzqQ==
+
+"@metamask/sdk-communication-layer@0.14.3":
+  version "0.14.3"
+  resolved "https://registry.yarnpkg.com/@metamask/sdk-communication-layer/-/sdk-communication-layer-0.14.3.tgz#0e7ec8e472641273da5802f3b357687ce12369c3"
+  integrity sha512-yjSbj8y7fFbQXv2HBzUX6D9C8BimkCYP6BDV7hdw53W8b/GlYCtXVxUFajQ9tuO1xPTRjR/xt/dkdr2aCi6WGw==
   dependencies:
-    "@types/debug" "^4.1.7"
-    debug "^4.3.4"
-    semver "^7.3.8"
-    superstruct "^1.0.3"
+    bufferutil "^4.0.8"
+    cross-fetch "^3.1.5"
+    date-fns "^2.29.3"
+    eciesjs "^0.3.16"
+    eventemitter2 "^6.4.5"
+    socket.io-client "^4.5.1"
+    utf-8-validate "^6.0.3"
+    uuid "^8.3.2"
+
+"@metamask/sdk-install-modal-web@0.14.1":
+  version "0.14.1"
+  resolved "https://registry.yarnpkg.com/@metamask/sdk-install-modal-web/-/sdk-install-modal-web-0.14.1.tgz#c8e64b4f7d2dac262c2ec28025c541b258478c31"
+  integrity sha512-emT8HKbnfVwGhPxyUfMja6DWzvtJvDEBQxqCVx93H0HsyrrOzOC43iGCAosslw6o5h7gOfRKLqWmK8V7jQAS2Q==
+  dependencies:
+    "@emotion/react" "^11.10.6"
+    "@emotion/styled" "^11.10.6"
+    i18next "22.5.1"
+    qr-code-styling "^1.6.0-rc.1"
+    react "^18.2.0"
+    react-dom "^18.2.0"
+    react-i18next "^13.2.2"
+
+"@metamask/sdk@0.14.3":
+  version "0.14.3"
+  resolved "https://registry.yarnpkg.com/@metamask/sdk/-/sdk-0.14.3.tgz#ec1ecf00edef981fd17e2c5cf4ec40ce0a43a55c"
+  integrity sha512-BYLs//nY2wioVSih78gOQI6sLIYY3vWkwVqXGYUgkBV+bi49bv+9S0m+hZ2cwiRaxfMYtKs0KvhAQ8weiYwDrg==
+  dependencies:
+    "@metamask/onboarding" "^1.0.1"
+    "@metamask/post-message-stream" "^6.1.0"
+    "@metamask/providers" "^10.2.1"
+    "@metamask/sdk-communication-layer" "0.14.3"
+    "@metamask/sdk-install-modal-web" "0.14.1"
+    "@react-native-async-storage/async-storage" "^1.17.11"
+    "@types/dom-screen-wake-lock" "^1.0.0"
+    bowser "^2.9.0"
+    cross-fetch "^4.0.0"
+    eciesjs "^0.3.15"
+    eth-rpc-errors "^4.0.3"
+    eventemitter2 "^6.4.7"
+    extension-port-stream "^2.0.1"
+    i18next "22.5.1"
+    i18next-browser-languagedetector "^7.1.0"
+    obj-multiplex "^1.0.0"
+    pump "^3.0.0"
+    qrcode-terminal-nooctal "^0.12.1"
+    react-i18next "^13.2.2"
+    react-native-webview "^11.26.0"
+    readable-stream "^2.3.7"
+    rollup-plugin-visualizer "^5.9.2"
+    socket.io-client "^4.5.1"
+    util "^0.12.4"
+    uuid "^8.3.2"
 
-"@metamask/utils@^5.0.0":
+"@metamask/utils@^5.0.0", "@metamask/utils@^5.0.1":
   version "5.0.2"
   resolved "https://registry.yarnpkg.com/@metamask/utils/-/utils-5.0.2.tgz#140ba5061d90d9dac0280c19cab101bc18c8857c"
   integrity sha512-yfmE79bRQtnMzarnKfX7AEJBwFTxvTyw3nBQlu/5rmGXrjAeAMltoGxO62TFurxrQAFMNa/fEjIHNvungZp0+g==
@@ -3458,6 +3335,20 @@
     semver "^7.3.8"
     superstruct "^1.0.3"
 
+"@metamask/utils@^8.3.0":
+  version "8.3.0"
+  resolved "https://registry.yarnpkg.com/@metamask/utils/-/utils-8.3.0.tgz#a20de447aeb9ffb75924d822a186a597033984b6"
+  integrity sha512-WFVcMPEkKKRCJ8DDkZUTVbLlpwgRn98F4VM/WzN89HM8PmHMnCyk/oG0AmK/seOxtik7uC7Bbi2YBC5Z5XB2zw==
+  dependencies:
+    "@ethereumjs/tx" "^4.2.0"
+    "@noble/hashes" "^1.3.1"
+    "@scure/base" "^1.1.3"
+    "@types/debug" "^4.1.7"
+    debug "^4.3.4"
+    pony-cause "^2.1.10"
+    semver "^7.5.4"
+    superstruct "^1.0.3"
+
 "@monaco-editor/loader@^1.3.2":
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/@monaco-editor/loader/-/loader-1.3.2.tgz#04effbb87052d19cd7d3c9d81c0635490f9bb6d8"
@@ -3685,11 +3576,6 @@
   dependencies:
     "@noble/hashes" "1.3.2"
 
-"@noble/ed25519@^1.7.0":
-  version "1.7.1"
-  resolved "https://registry.yarnpkg.com/@noble/ed25519/-/ed25519-1.7.1.tgz#6899660f6fbb97798a6fbd227227c4589a454724"
-  integrity sha512-Rk4SkJFaXZiznFyC/t77Q0NKS4FL7TLJJsVG2V2oiEq3kJVeTdxysEe/yRWSpnWMe808XRDJ+VFh5pt/FN5plw==
-
 "@noble/hashes@1.3.0", "@noble/hashes@~1.3.0":
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.3.0.tgz#085fd70f6d7d9d109671090ccae1d3bec62554a1"
@@ -3705,21 +3591,11 @@
   resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.3.2.tgz#6f26dbc8fbc7205873ce3cee2f690eba0d421b39"
   integrity sha512-MVC8EAQp7MvEcm30KWENFjgR+Mkmf+D189XJTkFIlwohU5hcBbn1ZkKq7KVTi2Hme3PMGF390DaL52beVrIihQ==
 
-"@noble/hashes@^1.1.2":
-  version "1.1.5"
-  resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.1.5.tgz#1a0377f3b9020efe2fae03290bd2a12140c95c11"
-  integrity sha512-LTMZiiLc+V4v1Yi16TD6aX2gmtKszNye0pQgbaLqkvhIqP7nVsSaJsWloGQjJfJ8offaoP5GtX3yY5swbcJxxQ==
-
-"@noble/hashes@~1.3.2":
+"@noble/hashes@^1.3.1", "@noble/hashes@~1.3.2":
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.3.3.tgz#39908da56a4adc270147bb07968bf3b16cfe1699"
   integrity sha512-V7/fPHgl+jsVPXqqeOzT8egNj2iBIVt+ECeMMG8TdcnTikP3oaBtUVqpT/gYCR68aEBJSF+XbYUxStjbFMqIIA==
 
-"@noble/secp256k1@^1.6.3":
-  version "1.7.1"
-  resolved "https://registry.yarnpkg.com/@noble/secp256k1/-/secp256k1-1.7.1.tgz#b251c70f824ce3ca7f8dc3df08d58f005cc0507c"
-  integrity sha512-hOUk6AyBFmqVrv7k5WAw/LpszxVbj9gGN4JRkIX52fdFAj1UA61KXmZDvqVEm+pOyec3+fIeZB02LYa/pWOArw==
-
 "@nodelib/fs.scandir@2.1.5":
   version "2.1.5"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5"
@@ -4800,31 +4676,29 @@
     tiny-glob "^0.2.9"
     tslib "^2.4.0"
 
-"@playwright/experimental-ct-core@1.35.1":
-  version "1.35.1"
-  resolved "https://registry.yarnpkg.com/@playwright/experimental-ct-core/-/experimental-ct-core-1.35.1.tgz#21cf2b7c60006099f9de38fce7dbd4ff1d7a566c"
-  integrity sha512-NSoUf6JDLeZFy0HiENwA1GkIwZHvg5KrygnZknwWs7O8yksYLsmiuMb09sf2zsZmfYgVen401SNgf3KfekbweA==
+"@playwright/experimental-ct-core@1.41.1":
+  version "1.41.1"
+  resolved "https://registry.yarnpkg.com/@playwright/experimental-ct-core/-/experimental-ct-core-1.41.1.tgz#9bad5adb0a048c687a596bd832a258c8ced24ec8"
+  integrity sha512-d7PxESV29x6W9RYs0mhkXmxr+6FfTbg2Tm/WJZlhgbIP+OLv79uJ8hl8ERsiBBFtH88sR+WmxHBMiZRpfpa6Fw==
   dependencies:
-    "@playwright/test" "1.35.1"
-    vite "^4.3.9"
+    playwright "1.41.1"
+    playwright-core "1.41.1"
+    vite "^4.4.12"
 
-"@playwright/experimental-ct-react@1.35.1":
-  version "1.35.1"
-  resolved "https://registry.yarnpkg.com/@playwright/experimental-ct-react/-/experimental-ct-react-1.35.1.tgz#4dd050987c9b7663ceb045fe8b61b9c024d77146"
-  integrity sha512-QXbjAJRr0eJkEsPyC5Q+nQyeVpVE/vrKUbo8yy5uZwHSy7KRsvyGkGPnOV5JMoeyEfK66Sx43I363tgzNByySw==
+"@playwright/experimental-ct-react@1.41.1":
+  version "1.41.1"
+  resolved "https://registry.yarnpkg.com/@playwright/experimental-ct-react/-/experimental-ct-react-1.41.1.tgz#4711881caf1ab47acbc3f7c121b87e17f165a46c"
+  integrity sha512-Ht04RKD/4J69EPHOR4iAWtsOkkqswxonkcEEhniTNflGn30SoPyNww72LJECDrls+7AJayflJf4qe/cK1Ao/ug==
   dependencies:
-    "@playwright/experimental-ct-core" "1.35.1"
+    "@playwright/experimental-ct-core" "1.41.1"
     "@vitejs/plugin-react" "^4.0.0"
 
-"@playwright/test@1.35.1", "@playwright/test@^1.35.1":
-  version "1.35.1"
-  resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.35.1.tgz#a596b61e15b980716696f149cc7a2002f003580c"
-  integrity sha512-b5YoFe6J9exsMYg0pQAobNDR85T1nLumUYgUTtKm4d21iX2L7WqKq9dW8NGJ+2vX0etZd+Y7UeuqsxDXm9+5ZA==
+"@playwright/test@1.41.1":
+  version "1.41.1"
+  resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.41.1.tgz#6954139ed4a67999f1b17460aa3d184f4b334f18"
+  integrity sha512-9g8EWTjiQ9yFBXc6HjCWe41msLpxEX0KhmfmPl9RPLJdfzL4F0lg2BdJ91O9azFdl11y1pmpwdjBiSxvqc+btw==
   dependencies:
-    "@types/node" "*"
-    playwright-core "1.35.1"
-  optionalDependencies:
-    fsevents "2.3.2"
+    playwright "1.41.1"
 
 "@polka/url@^1.0.0-next.20":
   version "1.0.0-next.23"
@@ -5046,6 +4920,13 @@
     prop-types "^15.7.2"
     tslib "^2.3.0"
 
+"@react-native-async-storage/async-storage@^1.17.11":
+  version "1.22.3"
+  resolved "https://registry.yarnpkg.com/@react-native-async-storage/async-storage/-/async-storage-1.22.3.tgz#ad490236a9eda8ac68cffc12c738f20b1815464e"
+  integrity sha512-Ov3wjuqxHd62tLYfgTjxj77YRYWra3A4Fi8uICIPcePgNO2WkS5B0ADXt9e/JLzSCNqVlXCq4Fir/gHmZTU9ww==
+  dependencies:
+    merge-options "^3.0.4"
+
 "@rollup/pluginutils@^5.0.0":
   version "5.0.2"
   resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-5.0.2.tgz#012b8f53c71e4f6f9cb317e311df1404f56e7a33"
@@ -5060,7 +4941,7 @@
   resolved "https://registry.yarnpkg.com/@rushstack/eslint-patch/-/eslint-patch-1.2.0.tgz#8be36a1f66f3265389e90b5f9c9962146758f728"
   integrity sha512-sXo/qW2/pAcmT43VoRKOJbDOfV3cYpq3szSVfIThQXNt+E4DfKj361vaAt3c88U5tPUxzEswam7GW48PJqtKAg==
 
-"@safe-global/safe-apps-provider@^0.18.1":
+"@safe-global/safe-apps-provider@0.18.1":
   version "0.18.1"
   resolved "https://registry.yarnpkg.com/@safe-global/safe-apps-provider/-/safe-apps-provider-0.18.1.tgz#287b5a1e2ef3be630dacde54279409df3ced8202"
   integrity sha512-V4a05A3EgJcriqtDoJklDz1BOinWhC6P0hjUSxshA4KOZM7rGPCTto/usXs09zr1vvL28evl/NldSTv97j2bmg==
@@ -5068,7 +4949,7 @@
     "@safe-global/safe-apps-sdk" "^8.1.0"
     events "^3.3.0"
 
-"@safe-global/safe-apps-sdk@^8.1.0":
+"@safe-global/safe-apps-sdk@8.1.0", "@safe-global/safe-apps-sdk@^8.1.0":
   version "8.1.0"
   resolved "https://registry.yarnpkg.com/@safe-global/safe-apps-sdk/-/safe-apps-sdk-8.1.0.tgz#d1d0c69cd2bf4eef8a79c5d677d16971926aa64a"
   integrity sha512-XJbEPuaVc7b9n23MqlF6c+ToYIS3f7P2Sel8f3cSBQ9WORE4xrSuvhMpK9fDSFqJ7by/brc+rmJR/5HViRr0/w==
@@ -5083,16 +4964,16 @@
   dependencies:
     cross-fetch "^3.1.5"
 
+"@scure/base@^1.1.3", "@scure/base@~1.1.2":
+  version "1.1.5"
+  resolved "https://registry.yarnpkg.com/@scure/base/-/base-1.1.5.tgz#1d85d17269fe97694b9c592552dd9e5e33552157"
+  integrity sha512-Brj9FiG2W1MRQSTB212YVPRrcbjkv48FoZi/u4l/zds/ieRrqsh7aUf6CLwkAq61oKXr/ZlTzlY66gLIj3TFTQ==
+
 "@scure/base@~1.1.0":
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/@scure/base/-/base-1.1.1.tgz#ebb651ee52ff84f420097055f4bf46cfba403938"
   integrity sha512-ZxOhsSyxYwLJj3pLZCefNitxsj093tb2vq90mp2txoYeBqbcjDjqFhyM8eUjq/uFm6zJ+mUuqxlS2FkuSY1MTA==
 
-"@scure/base@~1.1.2":
-  version "1.1.5"
-  resolved "https://registry.yarnpkg.com/@scure/base/-/base-1.1.5.tgz#1d85d17269fe97694b9c592552dd9e5e33552157"
-  integrity sha512-Brj9FiG2W1MRQSTB212YVPRrcbjkv48FoZi/u4l/zds/ieRrqsh7aUf6CLwkAq61oKXr/ZlTzlY66gLIj3TFTQ==
-
 "@scure/bip32@1.3.0":
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/@scure/bip32/-/bip32-1.3.0.tgz#6c8d980ef3f290987736acd0ee2e0f0d50068d87"
@@ -5243,34 +5124,10 @@
   dependencies:
     react-script-hook "^1.7.2"
 
-"@solana/buffer-layout@^4.0.0":
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/@solana/buffer-layout/-/buffer-layout-4.0.1.tgz#b996235eaec15b1e0b5092a8ed6028df77fa6c15"
-  integrity sha512-E1ImOIAD1tBZFRdjeM4/pzTiTApC0AOBGwyAMS4fwIodCWArzJ3DWdoh8cKxeFM2fElkxBh2Aqts1BPC373rHA==
-  dependencies:
-    buffer "~6.0.3"
-
-"@solana/web3.js@^1.70.1":
-  version "1.73.0"
-  resolved "https://registry.yarnpkg.com/@solana/web3.js/-/web3.js-1.73.0.tgz#c65f9f954ac80fca6952765c931dd72e57e1b572"
-  integrity sha512-YrgX3Py7ylh8NYkbanoINUPCj//bWUjYZ5/WPy9nQ9SK3Cl7QWCR+NmbDjmC/fTspZGR+VO9LTQslM++jr5PRw==
-  dependencies:
-    "@babel/runtime" "^7.12.5"
-    "@noble/ed25519" "^1.7.0"
-    "@noble/hashes" "^1.1.2"
-    "@noble/secp256k1" "^1.6.3"
-    "@solana/buffer-layout" "^4.0.0"
-    agentkeepalive "^4.2.1"
-    bigint-buffer "^1.1.5"
-    bn.js "^5.0.0"
-    borsh "^0.7.0"
-    bs58 "^4.0.1"
-    buffer "6.0.1"
-    fast-stable-stringify "^1.0.0"
-    jayson "^3.4.4"
-    node-fetch "2"
-    rpc-websockets "^7.5.0"
-    superstruct "^0.14.2"
+"@socket.io/component-emitter@~3.1.0":
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz#96116f2a912e0c02817345b3c10751069920d553"
+  integrity sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg==
 
 "@stablelib/aead@^1.0.1":
   version "1.0.1"
@@ -5840,35 +5697,16 @@
   dependencies:
     "@typescript-eslint/utils" "^5.54.0"
 
-"@tanstack/query-core@4.29.11":
-  version "4.29.11"
-  resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-4.29.11.tgz#fa338f7d6897c6be5de6d8dabd603d9b78ee48c7"
-  integrity sha512-8C+hF6SFAb/TlFZyS9FItgNwrw4PMa7YeX+KQYe2ZAiEz6uzg6yIr+QBzPkUwZ/L0bXvGd1sufTm3wotoz+GwQ==
-
-"@tanstack/query-core@5.4.3":
-  version "5.4.3"
-  resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-5.4.3.tgz#fbdd36ccf1acf70579980f2e7cf16d2c2aa2a5e9"
-  integrity sha512-fnI9ORjcuLGm1sNrKatKIosRQUpuqcD4SV7RqRSVmj8JSicX2aoMyKryHEBpVQvf6N4PaBVgBxQomjsbsGPssQ==
+"@tanstack/query-core@5.25.0":
+  version "5.25.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-5.25.0.tgz#e08ed0a9fad34c8005d1a282e57280031ac50cdc"
+  integrity sha512-vlobHP64HTuSE68lWF1mEhwSRC5Q7gaT+a/m9S+ItuN+ruSOxe1rFnR9j0ACWQ314BPhBEVKfBQ6mHL0OWfdbQ==
 
 "@tanstack/query-devtools@5.4.2":
   version "5.4.2"
   resolved "https://registry.yarnpkg.com/@tanstack/query-devtools/-/query-devtools-5.4.2.tgz#1687645ba1b9ffc76c55ac7759461d331d0776bf"
   integrity sha512-EXdaMXi8CxZuMp97J5mq6wy1RduOfoWFv5vtA1U+hyqb8Wst6M8kkkjDSdFvGZIRpYY4K8mKLlEFHNUZDG5dtw==
 
-"@tanstack/query-persist-client-core@4.29.11":
-  version "4.29.11"
-  resolved "https://registry.yarnpkg.com/@tanstack/query-persist-client-core/-/query-persist-client-core-4.29.11.tgz#96b4b83bead480eb37e024a59fd59bfd84b0545e"
-  integrity sha512-CSmMZchr+446r79NJ/pjD2yfjqNqFV7k8BnqOq4yTZvXsaQLEIn3tsaU45IsPgs4N7g9OBfPUPDdapSQvck2WQ==
-  dependencies:
-    "@tanstack/query-core" "4.29.11"
-
-"@tanstack/query-sync-storage-persister@^4.27.1":
-  version "4.29.11"
-  resolved "https://registry.yarnpkg.com/@tanstack/query-sync-storage-persister/-/query-sync-storage-persister-4.29.11.tgz#577ead9d08588a420a24ff0a8b77de427a2e6ca8"
-  integrity sha512-JP9U3m9YPkUelcE9+7D6fAEsNEp2ysKsH6qrd0WJtqsuhe5Zwr407NxaQ5uB2ow/MmhPOm8bxzMZw00Y7RagoQ==
-  dependencies:
-    "@tanstack/query-persist-client-core" "4.29.11"
-
 "@tanstack/react-query-devtools@^5.4.3":
   version "5.4.3"
   resolved "https://registry.yarnpkg.com/@tanstack/react-query-devtools/-/react-query-devtools-5.4.3.tgz#7df56de0454104c229f25393cf57a957f6245186"
@@ -5876,27 +5714,12 @@
   dependencies:
     "@tanstack/query-devtools" "5.4.2"
 
-"@tanstack/react-query-persist-client@^4.28.0":
-  version "4.29.12"
-  resolved "https://registry.yarnpkg.com/@tanstack/react-query-persist-client/-/react-query-persist-client-4.29.12.tgz#a3d3dc8dc4318689b275f7329db3619b710401e1"
-  integrity sha512-rh6zZJB+3j8lr+YsEkVadnqmUELmqNFZQzGGsHS5col/YOjYsMe9ppqaUjIMJ2aXnFXye50sbe4KxHhSGoaNVw==
-  dependencies:
-    "@tanstack/query-persist-client-core" "4.29.11"
-
-"@tanstack/react-query@^4.28.0":
-  version "4.29.12"
-  resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-4.29.12.tgz#de111cf1d6c389b86acacfaf972302914cfa1208"
-  integrity sha512-zhcN6+zF6cxprxhTHQajHGlvxgK8npnp9uLe9yaWhGc6sYcPWXzyO4raL4HomUzQOPzu3jLvkriJQ7BOrDM8vA==
-  dependencies:
-    "@tanstack/query-core" "4.29.11"
-    use-sync-external-store "^1.2.0"
-
 "@tanstack/react-query@^5.4.3":
-  version "5.4.3"
-  resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-5.4.3.tgz#cf59120690032e44b8c1c4c463cfb43aaad2fc5f"
-  integrity sha512-4aSOrRNa6yEmf7mws5QPTVMn8Lp7L38tFoTZ0c1ZmhIvbr8GIA0WT7X5N3yz/nuK8hUtjw9cAzBr4BPDZZ+tzA==
+  version "5.25.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-5.25.0.tgz#f4dac794cf10dd956aa56dbbdf67049a5ba2669d"
+  integrity sha512-u+n5R7mLO7RmeiIonpaCRVXNRWtZEef/aVZ/XGWRPa7trBIvGtzlfo0Ah7ZtnTYfrKEVwnZ/tzRCBcoiqJ/tFw==
   dependencies:
-    "@tanstack/query-core" "5.4.3"
+    "@tanstack/query-core" "5.25.0"
 
 "@testing-library/dom@^9.0.0":
   version "9.3.0"
@@ -6043,13 +5866,6 @@
   dependencies:
     "@types/node" "*"
 
-"@types/connect@^3.4.33":
-  version "3.4.35"
-  resolved "https://registry.yarnpkg.com/@types/connect/-/connect-3.4.35.tgz#5fcf6ae445e4021d1fc2219a4873cc73a3bb2ad1"
-  integrity sha512-cdeYyv4KWoEgpBISTxWvqYsVy444DOqehiF3fM3ne10AmJ62RSyNkUnxMJXHQWRQQX2eR94m5y1IZyDwBjV9FQ==
-  dependencies:
-    "@types/node" "*"
-
 "@types/content-disposition@*":
   version "0.5.8"
   resolved "https://registry.yarnpkg.com/@types/content-disposition/-/content-disposition-0.5.8.tgz#6742a5971f490dc41e59d277eee71361fea0b537"
@@ -6292,6 +6108,11 @@
   dependencies:
     "@types/ms" "*"
 
+"@types/dom-screen-wake-lock@^1.0.0":
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/@types/dom-screen-wake-lock/-/dom-screen-wake-lock-1.0.3.tgz#c3588a5f6f40fae957f9ce5be9bc4927a61bb9a0"
+  integrity sha512-3Iten7X3Zgwvk6kh6/NRdwN7WbZ760YgFCsF5AxDifltUQzW1RaW+WRmcVtgwFzLjaNu64H+0MPJ13yRa8g3Dw==
+
 "@types/dom-to-image@^2.6.4":
   version "2.6.4"
   resolved "https://registry.yarnpkg.com/@types/dom-to-image/-/dom-to-image-2.6.4.tgz#008411e23903cb0ee9e51a42ab8358c609541ee8"
@@ -6580,10 +6401,12 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-18.8.4.tgz#54be907698f40de8a45770b48486aa3cbd3adff7"
   integrity sha512-WdlVphvfR/GJCLEMbNA8lJ0lhFNBj4SW3O+O5/cEGw9oYrv0al9zTwuQsq+myDUXgNx2jgBynoVgZ2MMJ6pbow==
 
-"@types/node@18.11.18":
-  version "18.11.18"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-18.11.18.tgz#8dfb97f0da23c2293e554c5a50d61ef134d7697f"
-  integrity sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==
+"@types/node@20.11.0":
+  version "20.11.0"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-20.11.0.tgz#8e0b99e70c0c1ade1a86c4a282f7b7ef87c9552f"
+  integrity sha512-o9bjXmDNcF7GbM4CNQpmi+TutCgap/K3w1JyKgxAjqx41zp9qlIAVFi0IhCNsJcXolEqLWhbFbEeL0PvYm4pcQ==
+  dependencies:
+    undici-types "~5.26.4"
 
 "@types/node@>=12.12.47", "@types/node@>=13.7.0":
   version "20.9.0"
@@ -6592,11 +6415,6 @@
   dependencies:
     undici-types "~5.26.4"
 
-"@types/node@^12.12.54":
-  version "12.20.55"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-12.20.55.tgz#c329cbd434c42164f846b909bd6f85b5537f6240"
-  integrity sha512-J8xLz7q2OFulZ2cyGTLE1TbbZcjpno7FaN6zdJNrgAdrJ+DZzh/uFR6YrTb4C+nXakvud8Q4+rbhoIWlYQbUFQ==
-
 "@types/papaparse@^5.3.5":
   version "5.3.5"
   resolved "https://registry.yarnpkg.com/@types/papaparse/-/papaparse-5.3.5.tgz#e5ad94b1fe98e2a8ea0b03284b83d2cb252bbf39"
@@ -6731,6 +6549,13 @@
   resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.3.tgz#cef09e3ec9af1d63d2a6cc5b383a737e24e6dcf5"
   integrity sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==
 
+"@types/secp256k1@^4.0.4":
+  version "4.0.6"
+  resolved "https://registry.yarnpkg.com/@types/secp256k1/-/secp256k1-4.0.6.tgz#d60ba2349a51c2cbc5e816dcd831a42029d376bf"
+  integrity sha512-hHxJU6PAEUn0TP4S/ZOzuTUvJWuZ6eIKeNKb5RBpODvSl6hp1Wrw4s7ATY50rklRCScUDpHzVA/DQdSjJ3UoYQ==
+  dependencies:
+    "@types/node" "*"
+
 "@types/semver@^7.3.12":
   version "7.3.13"
   resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.3.13.tgz#da4bfd73f49bd541d28920ab0e2bf0ee80f71c91"
@@ -6797,13 +6622,6 @@
   resolved "https://registry.yarnpkg.com/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz#b6725d5f4af24ace33b36fafd295136e75509f43"
   integrity sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA==
 
-"@types/ws@^7.4.4":
-  version "7.4.7"
-  resolved "https://registry.yarnpkg.com/@types/ws/-/ws-7.4.7.tgz#f7c390a36f7a0679aa69de2d501319f4f8d9b702"
-  integrity sha512-JQbbmxZTZehdc2iszGKs5oC3NFnjeay7mtAWrdt7qNtAVK0g19muApzAy4bm9byz79xa2ZnO/BOBC2R8RC5Lww==
-  dependencies:
-    "@types/node" "*"
-
 "@types/ws@^8.5.3":
   version "8.5.3"
   resolved "https://registry.yarnpkg.com/@types/ws/-/ws-8.5.3.tgz#7d25a1ffbecd3c4f2d35068d0b283c037003274d"
@@ -7142,35 +6960,31 @@
   resolved "https://registry.yarnpkg.com/@wagmi/chains/-/chains-1.2.0.tgz#d59eaa70ec51a5fdcd113975926992acfb17ab12"
   integrity sha512-dmDRipsE54JfyudOBkuhEexqQWcrZqxn/qiujG8SBzMh/az/AH5xlJSA+j1CPWTx9+QofSMF3B7A4gb6XRmSaQ==
 
-"@wagmi/connectors@3.1.10":
-  version "3.1.10"
-  resolved "https://registry.yarnpkg.com/@wagmi/connectors/-/connectors-3.1.10.tgz#830cd788579ef56a2526574914481f2d3aabc9f7"
-  integrity sha512-ZLJC1QaeiZarkF07Cr9mOlVjPO1Lf5TBx+JKBms2y5fUIXlKrxCfQgO/gDCureboI+Us2X3IRI659+XacSGpbA==
+"@wagmi/connectors@4.1.22":
+  version "4.1.22"
+  resolved "https://registry.yarnpkg.com/@wagmi/connectors/-/connectors-4.1.22.tgz#6e2b253a5e08ff8a145cfc2beb943a375a073414"
+  integrity sha512-9t14G28awyeWTjGS/OfEd/DhdeX5t4Pio3SJHw4M4aTexIfN5DHGmmtfUtSu6DP1r+LD2vSI4ShT7vH0dgtZwA==
   dependencies:
-    "@coinbase/wallet-sdk" "^3.6.6"
-    "@safe-global/safe-apps-provider" "^0.18.1"
-    "@safe-global/safe-apps-sdk" "^8.1.0"
-    "@walletconnect/ethereum-provider" "2.10.6"
-    "@walletconnect/legacy-provider" "^2.0.0"
+    "@coinbase/wallet-sdk" "3.9.1"
+    "@metamask/sdk" "0.14.3"
+    "@safe-global/safe-apps-provider" "0.18.1"
+    "@safe-global/safe-apps-sdk" "8.1.0"
+    "@walletconnect/ethereum-provider" "2.11.2"
     "@walletconnect/modal" "2.6.2"
-    "@walletconnect/utils" "2.10.2"
-    abitype "0.8.7"
-    eventemitter3 "^4.0.7"
 
-"@wagmi/core@1.4.12":
-  version "1.4.12"
-  resolved "https://registry.yarnpkg.com/@wagmi/core/-/core-1.4.12.tgz#84558d1af746b2bcef02337dc3c46108242b1dd7"
-  integrity sha512-bLcYmmGgjtl3jAGo8X3Sm6oUwsdjbVxFMu9SWnwHdE4S9JdYeWM57dEhQgq8SYul2yQ7yY2/gimBf1Or0Ky3dQ==
+"@wagmi/core@2.6.13":
+  version "2.6.13"
+  resolved "https://registry.yarnpkg.com/@wagmi/core/-/core-2.6.13.tgz#eaca669b6b4283ec69412a206e66182a11d926c6"
+  integrity sha512-RZQ0mBXMH5oe7uvFkNh0e/gPWWLsbkDv/6/SeTY2H7fsH4I/T62ID6eNYUtyOoz7FgQTdAyPdSEt9lst1ZXxkQ==
   dependencies:
-    "@wagmi/connectors" "3.1.10"
-    abitype "0.8.7"
-    eventemitter3 "^4.0.7"
-    zustand "^4.3.1"
+    eventemitter3 "5.0.1"
+    mipd "0.0.5"
+    zustand "4.4.1"
 
-"@walletconnect/core@2.10.6":
-  version "2.10.6"
-  resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-2.10.6.tgz#786b0d2e2045c210c917e29bfa0498bbc210be20"
-  integrity sha512-Z4vh4ZdfcoQjgPEOxeuF9HUZCVLtV3MgRbS/awLIj/omDrFnOwlBhxi5Syr4Y8muVGC0ocRetQYHae0/gX5crQ==
+"@walletconnect/core@2.11.2":
+  version "2.11.2"
+  resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-2.11.2.tgz#35286be92c645fa461fecc0dfe25de9f076fca8f"
+  integrity sha512-bB4SiXX8hX3/hyBfVPC5gwZCXCl+OPj+/EDVM71iAO3TDsh78KPbrVAbDnnsbHzZVHlsMohtXX3j5XVsheN3+g==
   dependencies:
     "@walletconnect/heartbeat" "1.2.1"
     "@walletconnect/jsonrpc-provider" "1.0.13"
@@ -7183,33 +6997,13 @@
     "@walletconnect/relay-auth" "^1.0.4"
     "@walletconnect/safe-json" "^1.0.2"
     "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.10.6"
-    "@walletconnect/utils" "2.10.6"
+    "@walletconnect/types" "2.11.2"
+    "@walletconnect/utils" "2.11.2"
     events "^3.3.0"
+    isomorphic-unfetch "3.1.0"
     lodash.isequal "4.5.0"
     uint8arrays "^3.1.0"
 
-"@walletconnect/crypto@^1.0.3":
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/@walletconnect/crypto/-/crypto-1.0.3.tgz#7b8dd4d7e2884fe3543c7c07aea425eef5ef9dd4"
-  integrity sha512-+2jdORD7XQs76I2Odgr3wwrtyuLUXD/kprNVsjWRhhhdO9Mt6WqVzOPu0/t7OHSmgal8k7SoBQzUc5hu/8zL/g==
-  dependencies:
-    "@walletconnect/encoding" "^1.0.2"
-    "@walletconnect/environment" "^1.0.1"
-    "@walletconnect/randombytes" "^1.0.3"
-    aes-js "^3.1.2"
-    hash.js "^1.1.7"
-    tslib "1.14.1"
-
-"@walletconnect/encoding@^1.0.2":
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/@walletconnect/encoding/-/encoding-1.0.2.tgz#cb3942ad038d6a6bf01158f66773062dd25724da"
-  integrity sha512-CrwSBrjqJ7rpGQcTL3kU+Ief+Bcuu9PH6JLOb+wM6NITX1GTxR/MfNwnQfhLKK6xpRAyj2/nM04OOH6wS8Imag==
-  dependencies:
-    is-typedarray "1.0.0"
-    tslib "1.14.1"
-    typedarray-to-buffer "3.1.5"
-
 "@walletconnect/environment@^1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@walletconnect/environment/-/environment-1.0.1.tgz#1d7f82f0009ab821a2ba5ad5e5a7b8ae3b214cd7"
@@ -7217,20 +7011,20 @@
   dependencies:
     tslib "1.14.1"
 
-"@walletconnect/ethereum-provider@2.10.6":
-  version "2.10.6"
-  resolved "https://registry.yarnpkg.com/@walletconnect/ethereum-provider/-/ethereum-provider-2.10.6.tgz#53720771cc2d6accd452916a853ac927f26acbaa"
-  integrity sha512-bBQ+yUfxLv8VxNttgNKY7nED35gSVayO/BnLHbNKvyV1gpvSCla5mWB9MsXuQs70MK0g+/qtgRVSrOtdSubaNQ==
+"@walletconnect/ethereum-provider@2.11.2":
+  version "2.11.2"
+  resolved "https://registry.yarnpkg.com/@walletconnect/ethereum-provider/-/ethereum-provider-2.11.2.tgz#914f773e37a879bc00cf367437c4e98a826247b1"
+  integrity sha512-BUDqee0Uy2rCZVkW5Ao3q6Ado/3fePYnFdryVF+YL6bPhj+xQZ5OfKodl+uvs7Rwq++O5wTX2RqOTzpW7+v+Mg==
   dependencies:
     "@walletconnect/jsonrpc-http-connection" "^1.0.7"
     "@walletconnect/jsonrpc-provider" "^1.0.13"
     "@walletconnect/jsonrpc-types" "^1.0.3"
     "@walletconnect/jsonrpc-utils" "^1.0.8"
-    "@walletconnect/modal" "^2.4.3"
-    "@walletconnect/sign-client" "2.10.6"
-    "@walletconnect/types" "2.10.6"
-    "@walletconnect/universal-provider" "2.10.6"
-    "@walletconnect/utils" "2.10.6"
+    "@walletconnect/modal" "^2.6.2"
+    "@walletconnect/sign-client" "2.11.2"
+    "@walletconnect/types" "2.11.2"
+    "@walletconnect/universal-provider" "2.11.2"
+    "@walletconnect/utils" "2.11.2"
     events "^3.3.0"
 
 "@walletconnect/events@^1.0.1":
@@ -7250,16 +7044,6 @@
     "@walletconnect/time" "^1.0.2"
     tslib "1.14.1"
 
-"@walletconnect/jsonrpc-http-connection@^1.0.4":
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/@walletconnect/jsonrpc-http-connection/-/jsonrpc-http-connection-1.0.4.tgz#aeb0f7eae6565dd031f01d650ee73d358d760ee2"
-  integrity sha512-ji79pspdBhmIbTwve383tMaDu5Le9plW+oj5GE2aqzxIl3ib8JvRBZRn5lGEBGqVCvqB3MBJL7gBlEwpyRtoxQ==
-  dependencies:
-    "@walletconnect/jsonrpc-utils" "^1.0.4"
-    "@walletconnect/safe-json" "^1.0.1"
-    cross-fetch "^3.1.4"
-    tslib "1.14.1"
-
 "@walletconnect/jsonrpc-http-connection@^1.0.7":
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/@walletconnect/jsonrpc-http-connection/-/jsonrpc-http-connection-1.0.7.tgz#a6973569b8854c22da707a759d241e4f5c2d5a98"
@@ -7279,15 +7063,6 @@
     "@walletconnect/safe-json" "^1.0.2"
     tslib "1.14.1"
 
-"@walletconnect/jsonrpc-provider@^1.0.6":
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/@walletconnect/jsonrpc-provider/-/jsonrpc-provider-1.0.6.tgz#e91321ef523f1904e6634e7866a0f3c6f056d2cd"
-  integrity sha512-f5vQxr53vUVQ51/9mRLb1OiNciT/546XZ68Byn9OYnDBGeGJXK2kQWDHp8sPWZbN5x0p7B6asdCWMVFJ6danlw==
-  dependencies:
-    "@walletconnect/jsonrpc-utils" "^1.0.4"
-    "@walletconnect/safe-json" "^1.0.1"
-    tslib "1.14.1"
-
 "@walletconnect/jsonrpc-types@1.0.3", "@walletconnect/jsonrpc-types@^1.0.3":
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/@walletconnect/jsonrpc-types/-/jsonrpc-types-1.0.3.tgz#65e3b77046f1a7fa8347ae02bc1b841abe6f290c"
@@ -7313,15 +7088,6 @@
     "@walletconnect/jsonrpc-types" "^1.0.3"
     tslib "1.14.1"
 
-"@walletconnect/jsonrpc-utils@^1.0.4":
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/@walletconnect/jsonrpc-utils/-/jsonrpc-utils-1.0.4.tgz#2009ba3907b02516f2caacd2fb871ff0d472b2cb"
-  integrity sha512-y0+tDxcTZ9BHBBKBJbjZxLUXb+zQZCylf7y/jTvDPNx76J0hYYc+F9zHzyqBLeorSKepLTk6yI8hw3NXbAQB3g==
-  dependencies:
-    "@walletconnect/environment" "^1.0.1"
-    "@walletconnect/jsonrpc-types" "^1.0.2"
-    tslib "1.14.1"
-
 "@walletconnect/jsonrpc-ws-connection@1.0.14":
   version "1.0.14"
   resolved "https://registry.yarnpkg.com/@walletconnect/jsonrpc-ws-connection/-/jsonrpc-ws-connection-1.0.14.tgz#eec700e74766c7887de2bd76c91a0206628732aa"
@@ -7332,14 +7098,6 @@
     events "^3.3.0"
     ws "^7.5.1"
 
-"@walletconnect/keyvaluestorage@^1.0.2":
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/@walletconnect/keyvaluestorage/-/keyvaluestorage-1.0.2.tgz#92f5ca0f54c1a88a093778842ce0c874d86369c8"
-  integrity sha512-U/nNG+VLWoPFdwwKx0oliT4ziKQCEoQ27L5Hhw8YOFGA2Po9A9pULUYNWhDgHkrb0gYDNt//X7wABcEWWBd3FQ==
-  dependencies:
-    safe-json-utils "^1.1.1"
-    tslib "1.14.1"
-
 "@walletconnect/keyvaluestorage@^1.1.1":
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/@walletconnect/keyvaluestorage/-/keyvaluestorage-1.1.1.tgz#dd2caddabfbaf80f6b8993a0704d8b83115a1842"
@@ -7349,66 +7107,6 @@
     idb-keyval "^6.2.1"
     unstorage "^1.9.0"
 
-"@walletconnect/legacy-client@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/legacy-client/-/legacy-client-2.0.0.tgz#9f2c09694789fd4b6c5d68d6423b44bac55aed30"
-  integrity sha512-v5L7rYk9loVnfvUf0mF+76bUPFaU5/Vh7mzL6/950CD/yoGdzYZ3Kj+L7mkC6HPMEGeQsBP1+sqBuiVGZ/aODA==
-  dependencies:
-    "@walletconnect/crypto" "^1.0.3"
-    "@walletconnect/encoding" "^1.0.2"
-    "@walletconnect/jsonrpc-utils" "^1.0.4"
-    "@walletconnect/legacy-types" "^2.0.0"
-    "@walletconnect/legacy-utils" "^2.0.0"
-    "@walletconnect/safe-json" "^1.0.1"
-    "@walletconnect/window-getters" "^1.0.1"
-    "@walletconnect/window-metadata" "^1.0.1"
-    detect-browser "^5.3.0"
-    query-string "^6.13.5"
-
-"@walletconnect/legacy-modal@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/legacy-modal/-/legacy-modal-2.0.0.tgz#d0fab01a1337a8f5d88cdb1430cbef2d46072bbf"
-  integrity sha512-jckNd8lMhm4X7dX9TDdxM3bXKJnaqkRs6K2Mo5j6GmbIF9Eyx40jZ5+q457RVxvM6ciZEDT5s1wBHWdWoOo+9Q==
-  dependencies:
-    "@walletconnect/legacy-types" "^2.0.0"
-    "@walletconnect/legacy-utils" "^2.0.0"
-    copy-to-clipboard "^3.3.3"
-    preact "^10.12.0"
-    qrcode "^1.5.1"
-
-"@walletconnect/legacy-provider@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/legacy-provider/-/legacy-provider-2.0.0.tgz#08e2db1e4c234743b2f30422bc8100bc42e8fc44"
-  integrity sha512-A8xPebMI1A+50HbWwTpFCbwP7G+1NGKdTKyg8BUUg3h3Y9JucpC1W6w/x0v1Xw7qFEqQnz74LoIN/A3ytH9xrQ==
-  dependencies:
-    "@walletconnect/jsonrpc-http-connection" "^1.0.4"
-    "@walletconnect/jsonrpc-provider" "^1.0.6"
-    "@walletconnect/legacy-client" "^2.0.0"
-    "@walletconnect/legacy-modal" "^2.0.0"
-    "@walletconnect/legacy-types" "^2.0.0"
-    "@walletconnect/legacy-utils" "^2.0.0"
-
-"@walletconnect/legacy-types@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/legacy-types/-/legacy-types-2.0.0.tgz#224278ae2874c6a2ca805c2d1d062a511dcf7227"
-  integrity sha512-sOVrA7HUdbI1OwKyPOQU0/DdvTSVFlsXWpAk2K2WvP2erTkBWPMTJq6cv2BmKdoJ3p6gLApT7sd+jHi3OF71uw==
-  dependencies:
-    "@walletconnect/jsonrpc-types" "^1.0.2"
-
-"@walletconnect/legacy-utils@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@walletconnect/legacy-utils/-/legacy-utils-2.0.0.tgz#e3a637c00783f9cd2ae139b640f82223ab78ed9d"
-  integrity sha512-CPWxSVVXw0kgNCxvU126g4GiV3mzXmC8IPJ15twE46aJ1FX+RHEIfAzFMFz2F2+fEhBxL63A7dwNQKDXorRPcQ==
-  dependencies:
-    "@walletconnect/encoding" "^1.0.2"
-    "@walletconnect/jsonrpc-utils" "^1.0.4"
-    "@walletconnect/legacy-types" "^2.0.0"
-    "@walletconnect/safe-json" "^1.0.1"
-    "@walletconnect/window-getters" "^1.0.1"
-    "@walletconnect/window-metadata" "^1.0.1"
-    detect-browser "^5.3.0"
-    query-string "^6.13.5"
-
 "@walletconnect/logger@^2.0.1":
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/@walletconnect/logger/-/logger-2.0.1.tgz#7f489b96e9a1ff6bf3e58f0fbd6d69718bf844a8"
@@ -7434,7 +7132,7 @@
     motion "10.16.2"
     qrcode "1.5.3"
 
-"@walletconnect/modal@2.6.2", "@walletconnect/modal@^2.4.3":
+"@walletconnect/modal@2.6.2", "@walletconnect/modal@^2.6.2":
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/@walletconnect/modal/-/modal-2.6.2.tgz#4b534a836f5039eeb3268b80be7217a94dd12651"
   integrity sha512-eFopgKi8AjKf/0U4SemvcYw9zlLpx9njVN8sf6DAkowC2Md0gPU/UNEbH1Wwj407pEKnEds98pKWib1NN1ACoA==
@@ -7442,16 +7140,6 @@
     "@walletconnect/modal-core" "2.6.2"
     "@walletconnect/modal-ui" "2.6.2"
 
-"@walletconnect/randombytes@^1.0.3":
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/@walletconnect/randombytes/-/randombytes-1.0.3.tgz#e795e4918367fd1e6a2215e075e64ab93e23985b"
-  integrity sha512-35lpzxcHFbTN3ABefC9W+uBpNZl1GC4Wpx0ed30gibfO/y9oLdy1NznbV96HARQKSBV9J9M/rrtIvf6a23jfYw==
-  dependencies:
-    "@walletconnect/encoding" "^1.0.2"
-    "@walletconnect/environment" "^1.0.1"
-    randombytes "^2.1.0"
-    tslib "1.14.1"
-
 "@walletconnect/relay-api@^1.0.9":
   version "1.0.9"
   resolved "https://registry.yarnpkg.com/@walletconnect/relay-api/-/relay-api-1.0.9.tgz#f8c2c3993dddaa9f33ed42197fc9bfebd790ecaf"
@@ -7486,19 +7174,19 @@
   dependencies:
     tslib "1.14.1"
 
-"@walletconnect/sign-client@2.10.6":
-  version "2.10.6"
-  resolved "https://registry.yarnpkg.com/@walletconnect/sign-client/-/sign-client-2.10.6.tgz#722d2c2844565e2826dce6a6d3a36c9b3ca1ea91"
-  integrity sha512-EvUWjaZBQu2yKnH5/5F2qzbuiIuUN9ZgrNKgvXkw5z1Dq5RJCks0S9/MFlKH/ZSGqXnLl7uAzBXtoX4sMgbCMA==
+"@walletconnect/sign-client@2.11.2":
+  version "2.11.2"
+  resolved "https://registry.yarnpkg.com/@walletconnect/sign-client/-/sign-client-2.11.2.tgz#855609653855f0d23b0502cdbdcf43402e34c459"
+  integrity sha512-MfBcuSz2GmMH+P7MrCP46mVE5qhP0ZyWA0FyIH6/WuxQ6G+MgKsGfaITqakpRPsykWOJq8tXMs3XvUPDU413OQ==
   dependencies:
-    "@walletconnect/core" "2.10.6"
+    "@walletconnect/core" "2.11.2"
     "@walletconnect/events" "^1.0.1"
     "@walletconnect/heartbeat" "1.2.1"
     "@walletconnect/jsonrpc-utils" "1.0.8"
     "@walletconnect/logger" "^2.0.1"
     "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.10.6"
-    "@walletconnect/utils" "2.10.6"
+    "@walletconnect/types" "2.11.2"
+    "@walletconnect/utils" "2.11.2"
     events "^3.3.0"
 
 "@walletconnect/time@^1.0.2":
@@ -7508,22 +7196,10 @@
   dependencies:
     tslib "1.14.1"
 
-"@walletconnect/types@2.10.2":
-  version "2.10.2"
-  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-2.10.2.tgz#68e433a29ec2cf42d79d8b50c77bd5c1d91db721"
-  integrity sha512-luNV+07Wdla4STi9AejseCQY31tzWKQ5a7C3zZZaRK/di+rFaAAb7YW04OP4klE7tw/mJRGPTlekZElmHxO8kQ==
-  dependencies:
-    "@walletconnect/events" "^1.0.1"
-    "@walletconnect/heartbeat" "1.2.1"
-    "@walletconnect/jsonrpc-types" "1.0.3"
-    "@walletconnect/keyvaluestorage" "^1.0.2"
-    "@walletconnect/logger" "^2.0.1"
-    events "^3.3.0"
-
-"@walletconnect/types@2.10.6":
-  version "2.10.6"
-  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-2.10.6.tgz#d9920ed4fd0113e0addbda8e7e73a5176a3163fd"
-  integrity sha512-WgHfiTG1yakmxheaBRiXhUdEmgxwrvsAdOIWaMf/spvrzVKYh6sHI3oyEEky5qj5jjiMiyQBeB57QamzCotbcQ==
+"@walletconnect/types@2.11.2":
+  version "2.11.2"
+  resolved "https://registry.yarnpkg.com/@walletconnect/types/-/types-2.11.2.tgz#d0359dd4106fcaa1634241a00428d3ea08d0d3c7"
+  integrity sha512-p632MFB+lJbip2cvtXPBQslpUdiw1sDtQ5y855bOlAGquay+6fZ4h1DcDePeKQDQM3P77ax2a9aNPZxV6y/h1Q==
   dependencies:
     "@walletconnect/events" "^1.0.1"
     "@walletconnect/heartbeat" "1.2.1"
@@ -7532,45 +7208,25 @@
     "@walletconnect/logger" "^2.0.1"
     events "^3.3.0"
 
-"@walletconnect/universal-provider@2.10.6":
-  version "2.10.6"
-  resolved "https://registry.yarnpkg.com/@walletconnect/universal-provider/-/universal-provider-2.10.6.tgz#1a6c42517581f11ce275474bc70d0eb4f1044525"
-  integrity sha512-CEivusqqoD31BhCTKp08DnrccfGjwD9MFjZs5BNRorDteRFE8zVm9LmP6DSiNJCw82ZajGlZThggLQ/BAATfwA==
+"@walletconnect/universal-provider@2.11.2":
+  version "2.11.2"
+  resolved "https://registry.yarnpkg.com/@walletconnect/universal-provider/-/universal-provider-2.11.2.tgz#bec3038f51445d707bbec75f0cb8af0a1f1e04db"
+  integrity sha512-cNtIn5AVoDxKAJ4PmB8m5adnf5mYQMUamEUPKMVvOPscfGtIMQEh9peKsh2AN5xcRVDbgluC01Id545evFyymw==
   dependencies:
     "@walletconnect/jsonrpc-http-connection" "^1.0.7"
     "@walletconnect/jsonrpc-provider" "1.0.13"
     "@walletconnect/jsonrpc-types" "^1.0.2"
     "@walletconnect/jsonrpc-utils" "^1.0.7"
     "@walletconnect/logger" "^2.0.1"
-    "@walletconnect/sign-client" "2.10.6"
-    "@walletconnect/types" "2.10.6"
-    "@walletconnect/utils" "2.10.6"
+    "@walletconnect/sign-client" "2.11.2"
+    "@walletconnect/types" "2.11.2"
+    "@walletconnect/utils" "2.11.2"
     events "^3.3.0"
 
-"@walletconnect/utils@2.10.2":
-  version "2.10.2"
-  resolved "https://registry.yarnpkg.com/@walletconnect/utils/-/utils-2.10.2.tgz#1f2c6a2f1bb95bcc4517b1e94aa7164c9286eb46"
-  integrity sha512-syxXRpc2yhSknMu3IfiBGobxOY7fLfLTJuw+ppKaeO6WUdZpIit3wfuGOcc0Ms3ZPFCrGfyGOoZsCvgdXtptRg==
-  dependencies:
-    "@stablelib/chacha20poly1305" "1.0.1"
-    "@stablelib/hkdf" "1.0.1"
-    "@stablelib/random" "^1.0.2"
-    "@stablelib/sha256" "1.0.1"
-    "@stablelib/x25519" "^1.0.3"
-    "@walletconnect/relay-api" "^1.0.9"
-    "@walletconnect/safe-json" "^1.0.2"
-    "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.10.2"
-    "@walletconnect/window-getters" "^1.0.1"
-    "@walletconnect/window-metadata" "^1.0.1"
-    detect-browser "5.3.0"
-    query-string "7.1.3"
-    uint8arrays "^3.1.0"
-
-"@walletconnect/utils@2.10.6":
-  version "2.10.6"
-  resolved "https://registry.yarnpkg.com/@walletconnect/utils/-/utils-2.10.6.tgz#749b37d14e291e346862e7027ec7548463350226"
-  integrity sha512-oRsWWhN2+hi3aiDXrQEOfysz6FHQJGXLsNQPVt+WIBJplO6Szmdau9dbleD88u1iiT4GKPqE0R9FOYvvPm1H/w==
+"@walletconnect/utils@2.11.2":
+  version "2.11.2"
+  resolved "https://registry.yarnpkg.com/@walletconnect/utils/-/utils-2.11.2.tgz#dee0f19adf5e38543612cbe9fa4de7ed28eb7e85"
+  integrity sha512-LyfdmrnZY6dWqlF4eDrx5jpUwsB2bEPjoqR5Z6rXPiHJKUOdJt7az+mNOn5KTSOlRpd1DmozrBrWr+G9fFLYVw==
   dependencies:
     "@stablelib/chacha20poly1305" "1.0.1"
     "@stablelib/hkdf" "1.0.1"
@@ -7580,7 +7236,7 @@
     "@walletconnect/relay-api" "^1.0.9"
     "@walletconnect/safe-json" "^1.0.2"
     "@walletconnect/time" "^1.0.2"
-    "@walletconnect/types" "2.10.6"
+    "@walletconnect/types" "2.11.2"
     "@walletconnect/window-getters" "^1.0.1"
     "@walletconnect/window-metadata" "^1.0.1"
     detect-browser "5.3.0"
@@ -7602,130 +7258,102 @@
     "@walletconnect/window-getters" "^1.0.1"
     tslib "1.14.1"
 
-"@web3modal/common@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/common/-/common-3.5.0.tgz#010f24c7170c70fbad15fae9500ede8a18b43e0d"
-  integrity sha512-cpNFf6TiPYXEozYtIzLH9PcWSlFeoeDM6hTiXEVNutJeFRppFICLOAsyFoa7MszexFJaZ21cAxj/PzI2GIKGjA==
+"@web3modal/common@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/common/-/common-4.1.3.tgz#b31a60dbfb2b02708ddef7b896bd2992534ede09"
+  integrity sha512-xxNS0+J88TQHNKxHk57uEIb1J03OI9n9CulaOexHv7oPp2x6D+vb5FYdJj/Oxskq6osYKg+LVupCSEaJEr6bQw==
   dependencies:
     dayjs "1.11.10"
 
-"@web3modal/core@2.7.1":
-  version "2.7.1"
-  resolved "https://registry.yarnpkg.com/@web3modal/core/-/core-2.7.1.tgz#257534d45f7b5d6bddbc667f787c094eb91dd281"
-  integrity sha512-eFWR1tK1qN4FguhaZq2VW0AVr8DC/Fox2eJnK1eTfk32hxSgUtl8wr5fVM8EoLeoapQ7Zcc0SNg/QLuLQ9t2tA==
-  dependencies:
-    valtio "1.11.0"
-
-"@web3modal/core@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/core/-/core-3.5.0.tgz#089c47c8dc9a41f1f3c50374d682860b7c34e81c"
-  integrity sha512-yZFk4YZDcmOhRyKkQYP0xdxK3JfdVwayive6UyBRY1bOxl4V4PAs+vRNLNY/3LulMMpqaHZGuD1zty1GXJ7INA==
+"@web3modal/core@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/core/-/core-4.1.3.tgz#92a1a2a7c00b4f9d8221c20adce3a1ce908fb662"
+  integrity sha512-T8J9vfxiDrnRQxuqRQtfE1siBSf7WQxgyfvgPfUmAtnzAYVpQ5eAL4JEUTp6KrOyB070ujT5fmfBjz8di8agQg==
   dependencies:
-    "@web3modal/common" "3.5.0"
-    valtio "1.12.1"
-
-"@web3modal/ethereum@^2.6.2":
-  version "2.7.1"
-  resolved "https://registry.yarnpkg.com/@web3modal/ethereum/-/ethereum-2.7.1.tgz#464dbc1d00d075c16961b77e9a353b1966538653"
-  integrity sha512-1x3qhYh9qgtvw1MDQD4VeDf2ZOsVANKRPtUty4lF+N4L8xnAIwvNKUAMA4j6T5xSsjqUfq5Tdy5mYsNxLmsWMA==
+    "@web3modal/common" "4.1.3"
+    "@web3modal/wallet" "4.1.3"
+    valtio "1.11.2"
 
-"@web3modal/polyfills@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/polyfills/-/polyfills-3.5.0.tgz#e3ee329a14de924ba796dccaa58dfafe42ac5819"
-  integrity sha512-QxVgUd+GKENGLo84bNTXjHk78l61Yr65LLvq5GPQWwrIPWFDqP2Nf7ixtaI36tTx29VN2SVyzBXGMhtrL73ZTg==
+"@web3modal/polyfills@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/polyfills/-/polyfills-4.1.3.tgz#444fd1d7a942ba91592533d34cee6dcf16f19ef9"
+  integrity sha512-CTT1A0B43Ae4uSm8GW4F6Qamhx3tcIC0/yyOSW40BaRvd10K2Imm50K3I8jLFS8HG1ZzqZe+pOV2P/OyOwPU4g==
   dependencies:
     buffer "6.0.3"
 
-"@web3modal/react@^2.6.2":
-  version "2.7.1"
-  resolved "https://registry.yarnpkg.com/@web3modal/react/-/react-2.7.1.tgz#c768aae41bfe15abe379f8b6489d69d153fc7a46"
-  integrity sha512-+zvP5Q7Q3ozW2hyA1NvS8giVDeZWA6PWgVhKA6656dCnOutonPUpWYuFPJahsFBYCrhLO8ApPmomgb6Dx/mh5A==
-  dependencies:
-    "@web3modal/core" "2.7.1"
-    "@web3modal/ui" "2.7.1"
-
-"@web3modal/scaffold-react@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/scaffold-react/-/scaffold-react-3.5.0.tgz#3054b1a9d95a69dbf32d91c539b9bb475bf7e8db"
-  integrity sha512-4F4QkUMa3VFcmbP2gYOQ+h4x23EFa13BcWEZepQ47q9HbW/sL3zLmS7k44EpyhLMSEX4HrPHXiUlGTr9rK038g==
+"@web3modal/scaffold-react@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/scaffold-react/-/scaffold-react-4.1.3.tgz#72b82927f1c6756bf83daa456187da090b549d65"
+  integrity sha512-zx/jVqY6MFjOZWj/X9RUpSaTZ5Kz+dmH6wuOGSdlyUSYvUV5hJgUGEKGjCr5AVBk67n67lHKFUy1nxS9GXvVdg==
   dependencies:
-    "@web3modal/scaffold" "3.5.0"
+    "@web3modal/scaffold" "4.1.3"
 
-"@web3modal/scaffold-utils@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/scaffold-utils/-/scaffold-utils-3.5.0.tgz#c05d136538277899d4c6deb76993a5e4ade94767"
-  integrity sha512-RpNp5N+c8oaPyy48u9pOj65uuZDmMAluj2ZUWRoh3FqoN+gshpQsCbbPwtuTug4MsGc84i8RJorTEargzrKthg==
+"@web3modal/scaffold-utils@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/scaffold-utils/-/scaffold-utils-4.1.3.tgz#c751ce47babfef98d53d1c46aaae5b50a0d28537"
+  integrity sha512-1rNZkTjhpvVRPXm8RKz51E/T9Ujhjh8DPxT3oQFnTNlws98yU+RLDJYrR8rQoqJfmDK3E5dViLmxjIbrLKh/dw==
   dependencies:
-    "@web3modal/polyfills" "3.5.0"
-    "@web3modal/scaffold" "3.5.0"
+    "@web3modal/core" "4.1.3"
+    "@web3modal/polyfills" "4.1.3"
+    valtio "1.11.2"
 
-"@web3modal/scaffold-vue@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/scaffold-vue/-/scaffold-vue-3.5.0.tgz#04222fd36a4421a860c9662f73accb3bd51b6f94"
-  integrity sha512-babm6SpuOeYxyTfdg9v603lYCrOFbFg1Y8KHTCAISu3Tk4GEnJ99wQVUE1ujX2CHoLU8GvAeyVKszJniKyPaJQ==
+"@web3modal/scaffold-vue@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/scaffold-vue/-/scaffold-vue-4.1.3.tgz#d8e827c8431526a86cc6fbb7430e3fb7d560b9b0"
+  integrity sha512-xHySyt2A01VYGtQ3qHKEyv5n+JGOnZ41/ZM8glK6yfe4nDNS0c9X/psPoeVwWvLhOYPKWCikkgGvB1TmoyjNiQ==
   dependencies:
-    "@web3modal/scaffold" "3.5.0"
+    "@web3modal/scaffold" "4.1.3"
 
-"@web3modal/scaffold@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/scaffold/-/scaffold-3.5.0.tgz#808def7fe15c729e85a7f7ff59689eebd4ba5b52"
-  integrity sha512-wBiOeFdpANOiXqf2o0bi1cd+P427oBf5p3hb5nRJ4abBOPtjr6g0rEQgdLwtalBRt4K4qLAElOwem6toRVViig==
+"@web3modal/scaffold@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/scaffold/-/scaffold-4.1.3.tgz#2a51ad18d6522233af71b3c4e8994ac3d9905a14"
+  integrity sha512-daOCaa8h4AT9BGqbsBAAU0CQL/hFWt9Bs6CK9zjesvhwxK2qQZ2O/t8tU2c68Gsj6VRDim7CcWCKjNYAqtGNyQ==
   dependencies:
-    "@web3modal/core" "3.5.0"
-    "@web3modal/ui" "3.5.0"
+    "@web3modal/common" "4.1.3"
+    "@web3modal/core" "4.1.3"
+    "@web3modal/ui" "4.1.3"
     lit "3.1.0"
-
-"@web3modal/siwe@*":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/siwe/-/siwe-3.5.0.tgz#5f7fa6a7209c6ddddcd008ad47bb4dc3815d4a37"
-  integrity sha512-i9AvSH3uA93lu7z79d90aMaHx3Kn/EhblRJa2NOykADuAZX3UeXkX9KX7pkLVEYD1TkQN4mOHTFRQ6LeXq9EcA==
-  dependencies:
-    "@web3modal/core" "3.5.0"
-    "@web3modal/scaffold-utils" "3.5.0"
   optionalDependencies:
-    react ">=17"
-    react-dom ">=17"
-    vue ">=3"
+    "@web3modal/siwe" "4.1.3"
 
-"@web3modal/ui@2.7.1":
-  version "2.7.1"
-  resolved "https://registry.yarnpkg.com/@web3modal/ui/-/ui-2.7.1.tgz#9c2cb0f66623fcf41084f50e63acff33f26b0635"
-  integrity sha512-JpGJbLAl/Wmuyyn+JwuwtlPD8mUW2HV/gsSxKWZoElgjbfDY4vjHo9PH2G++2HhugISfzjawp43r8lP/hWgWOQ==
+"@web3modal/siwe@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/siwe/-/siwe-4.1.3.tgz#e00438a688617cf4a65f6ec62437b4e7178b7ec8"
+  integrity sha512-YjCFvoUyjjkTmRLyaDuhCaWpz9/gqQNZRIXwkDg/0AZY92WeVq0jJQJIWmFv6Ag16nakqo73vtHjUGfPC4bbFQ==
   dependencies:
-    "@web3modal/core" "2.7.1"
-    lit "2.7.6"
-    motion "10.16.2"
-    qrcode "1.5.3"
+    "@web3modal/core" "4.1.3"
+    "@web3modal/scaffold-utils" "4.1.3"
+    lit "3.1.0"
+    valtio "1.11.2"
 
-"@web3modal/ui@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/ui/-/ui-3.5.0.tgz#e925cf829d5b0904c5693094db1c3a95c4ee5c1a"
-  integrity sha512-1H8pHCxcMDPxx1jKYMycSqilVGKDnKEGqVUa+NBhu9YeebIqB9WB5wWhyROLADsX/XzKwXUqhQndHDpcLyMyFw==
+"@web3modal/ui@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/ui/-/ui-4.1.3.tgz#b7ca4a28afc8e8b2910e47d2501eafe92a5a1173"
+  integrity sha512-gZBkpq186iPC05jYBi58MXYH4b3qxo+LIYBdXz++qvaZRiSV894hvHpVLTjJgJivUiP0Lzt/I+u63/G4dkwSgA==
   dependencies:
     lit "3.1.0"
     qrcode "1.5.3"
 
-"@web3modal/wagmi@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/wagmi/-/wagmi-3.5.0.tgz#c0f6e92ff4c5e16febac74eddc180333bb039a98"
-  integrity sha512-bQoytNkcVbjWfZsePKAv+XF9KDtDx1iqitoC4RPold9oB5RukEgGNHFQ7AcDKTwjkmiE3JqwyubQyvupZ2Z/Yg==
-  dependencies:
-    "@web3modal/polyfills" "3.5.0"
-    "@web3modal/scaffold" "3.5.0"
-    "@web3modal/scaffold-react" "3.5.0"
-    "@web3modal/scaffold-utils" "3.5.0"
-    "@web3modal/scaffold-vue" "3.5.0"
-    "@web3modal/wallet" "3.5.0"
+"@web3modal/wagmi@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/wagmi/-/wagmi-4.1.3.tgz#fe3f7dacdf2057ef33ee0272452c533edbcf2567"
+  integrity sha512-YFYYFmp2HoXIo7mfL/eWc//F9cqIyHdKgUZmSYArDWxNze/MOuCrShnZWarXa1fVl7kY3Cq+bZpExM8TcttQCw==
+  dependencies:
+    "@web3modal/polyfills" "4.1.3"
+    "@web3modal/scaffold" "4.1.3"
+    "@web3modal/scaffold-react" "4.1.3"
+    "@web3modal/scaffold-utils" "4.1.3"
+    "@web3modal/scaffold-vue" "4.1.3"
   optionalDependencies:
-    "@web3modal/siwe" "*"
+    "@web3modal/siwe" "4.1.3"
     react ">=17"
     react-dom ">=17"
     vue ">=3"
 
-"@web3modal/wallet@3.5.0":
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/@web3modal/wallet/-/wallet-3.5.0.tgz#1123e84d6dad20957de2223eeab5bb70a9d27fc4"
-  integrity sha512-uNAOZS94Dfzp1ha3X1MztFS4R6XuOZ/Nfe0oiSvLAbeXb2pbV/JDJR1g0LjYiNU/XsDWYEW9WYeRUyg9ZLdUdg==
+"@web3modal/wallet@4.1.3":
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/@web3modal/wallet/-/wallet-4.1.3.tgz#b38a1e96ff3f87b555075a2581154152de7ac41f"
+  integrity sha512-wcfljBc2c+0VF5d1hfVWRDrnRdlNGGTPz0iky6tjQW57sam9Yg5IKAbrEqyDZZs0zrAz8K03yHgKnP1BbQHc5A==
   dependencies:
     zod "3.22.4"
 
@@ -7749,14 +7377,6 @@
   resolved "https://registry.yarnpkg.com/@zag-js/focus-visible/-/focus-visible-0.2.2.tgz#56233480ca1275d3218fb2e10696a33d1a6b9e64"
   integrity sha512-0j2gZq8HiZ51z4zNnSkF1iSkqlwRDvdH+son3wHdoz+7IUdMN/5Exd4TxMJ+gq2Of1DiXReYLL9qqh2PdQ4wgA==
 
-JSONStream@^1.3.5:
-  version "1.3.5"
-  resolved "https://registry.yarnpkg.com/JSONStream/-/JSONStream-1.3.5.tgz#3208c1f08d3a4d99261ab64f92302bc15e111ca0"
-  integrity sha512-E+iruNOY8VV9s4JEbe1aNEm6MiszPRr/UfcHMz0TQh1BXSxHK+ASV1R6W4HpjBhSeS+54PIsAMCBmwD06LLsqQ==
-  dependencies:
-    jsonparse "^1.2.0"
-    through ">=2.2.7 <3"
-
 abab@^2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.6.tgz#41b80f2c871d19686216b82309231cfd3cb3d291"
@@ -7767,16 +7387,16 @@ abitype@0.8.11:
   resolved "https://registry.yarnpkg.com/abitype/-/abitype-0.8.11.tgz#66e1cf2cbf46f48d0e57132d7c1c392447536cc1"
   integrity sha512-bM4v2dKvX08sZ9IU38IN5BKmN+ZkOSd2oI4a9f0ejHYZQYV6cDr7j+d95ga0z2XHG36Y4jzoG5Z7qDqxp7fi/A==
 
-abitype@0.8.7:
-  version "0.8.7"
-  resolved "https://registry.yarnpkg.com/abitype/-/abitype-0.8.7.tgz#e4b3f051febd08111f486c0cc6a98fa72d033622"
-  integrity sha512-wQ7hV8Yg/yKmGyFpqrNZufCxbszDe5es4AZGYPBitocfSqXtjrTG9JMWFcc4N30ukl2ve48aBTwt7NJxVQdU3w==
-
 abitype@0.9.8:
   version "0.9.8"
   resolved "https://registry.yarnpkg.com/abitype/-/abitype-0.9.8.tgz#1f120b6b717459deafd213dfbf3a3dd1bf10ae8c"
   integrity sha512-puLifILdm+8sjyss4S+fsUN09obiT1g2YW6CtcQF+QDzxR0euzgEB29MZujC6zMk2a6SVmtttq1fc6+YFA7WYQ==
 
+abitype@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/abitype/-/abitype-1.0.0.tgz#237176dace81d90d018bebf3a45cb42f2a2d9e97"
+  integrity sha512-NMeMah//6bJ56H5XRj8QCV4AwuW6hB6zqz2LnhhLdcWVQOsXki6/Pn3APeqxCma62nXIcmZWdu1DlHWS74umVQ==
+
 abort-controller@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/abort-controller/-/abort-controller-3.0.0.tgz#eaf54d53b62bae4138e809ca225c8439a6efb392"
@@ -7827,16 +7447,6 @@ acorn@^8.8.0:
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.8.0.tgz#88c0187620435c7f6015803f5539dae05a9dbea8"
   integrity sha512-QOxyigPVrpZ2GXT+PFyZTl6TtOFc5egxHIP9IlQ+RbupQuX4RkT/Bee4/kQuC02Xkzg84JcT7oLYtDIQxp+v7w==
 
-aes-js@3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/aes-js/-/aes-js-3.0.0.tgz#e21df10ad6c2053295bcbb8dab40b09dbea87e4d"
-  integrity sha512-H7wUZRn8WpTq9jocdxQ2c8x2sKo9ZVmzfRE13GiNJXfp7NcKYEdvl3vspKjXox6RIG2VtaRe4JFvxG4rqp2Zuw==
-
-aes-js@^3.1.2:
-  version "3.1.2"
-  resolved "https://registry.yarnpkg.com/aes-js/-/aes-js-3.1.2.tgz#db9aabde85d5caabbfc0d4f2a4446960f627146a"
-  integrity sha512-e5pEa2kBnBOgR4Y/p20pskXI74UEz7de8ZGVo58asOtvSVG5YAbJeELPZxOmt+Bnz3rX753YKhfIn4X4l1PPRQ==
-
 agent-base@6:
   version "6.0.2"
   resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-6.0.2.tgz#49fff58577cfee3f37176feab4c22e00f86d7f77"
@@ -7844,15 +7454,6 @@ agent-base@6:
   dependencies:
     debug "4"
 
-agentkeepalive@^4.2.1:
-  version "4.2.1"
-  resolved "https://registry.yarnpkg.com/agentkeepalive/-/agentkeepalive-4.2.1.tgz#a7975cbb9f83b367f06c90cc51ff28fe7d499717"
-  integrity sha512-Zn4cw2NEqd+9fiSVWMscnjyQ1a8Yfoc5oBajLeo5w+YBHgDUcEBY2hS4YpTz6iN5f/2zQiktcuM6tS8x1p9dpA==
-  dependencies:
-    debug "^4.1.0"
-    depd "^1.1.2"
-    humanize-ms "^1.2.1"
-
 aggregate-error@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/aggregate-error/-/aggregate-error-3.1.0.tgz#92670ff50f5359bdb7a3e0d40d0ec30c5737687a"
@@ -8133,6 +7734,15 @@ axios@^1.4.0:
     form-data "^4.0.0"
     proxy-from-env "^1.1.0"
 
+axios@^1.6.2:
+  version "1.6.7"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-1.6.7.tgz#7b48c2e27c96f9c68a2f8f31e2ab19f59b06b0a7"
+  integrity sha512-/hDJGff6/c7u0hDkvkGxR/oy6CbCs8ziCsC7SqmhjfozqiJGc8Z11wrv9z9lYfY4K8l+H9TpjcMDX0xOZmx+RA==
+  dependencies:
+    follow-redirects "^1.15.4"
+    form-data "^4.0.0"
+    proxy-from-env "^1.1.0"
+
 axobject-query@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be"
@@ -8236,30 +7846,11 @@ balanced-match@^1.0.0:
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
   integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==
 
-base-x@^3.0.2:
-  version "3.0.9"
-  resolved "https://registry.yarnpkg.com/base-x/-/base-x-3.0.9.tgz#6349aaabb58526332de9f60995e548a53fe21320"
-  integrity sha512-H7JU6iBHTal1gp56aKoaa//YUxEaAOUiydvrV/pILqIHXTtqxSkATOnDA2u+jZ/61sD+L/412+7kzXRtWukhpQ==
-  dependencies:
-    safe-buffer "^5.0.1"
-
 base64-js@^1.3.1, base64-js@^1.5.1:
   version "1.5.1"
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a"
   integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
 
-bech32@1.1.4:
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/bech32/-/bech32-1.1.4.tgz#e38c9f37bf179b8eb16ae3a772b40c356d4832e9"
-  integrity sha512-s0IrSOzLlbvX7yp4WBfPITzpAU8sqQcpsmwXDiKwrG4r491vwCO/XpejasRNl0piBMe/DvP4Tz0mIS/X1DPJBQ==
-
-bigint-buffer@^1.1.5:
-  version "1.1.5"
-  resolved "https://registry.yarnpkg.com/bigint-buffer/-/bigint-buffer-1.1.5.tgz#d038f31c8e4534c1f8d0015209bf34b4fa6dd442"
-  integrity sha512-trfYco6AoZ+rKhKnxA0hgX0HAbVP/s808/EuDSe2JDzUnCp/xAsli35Orvk67UrTEcwuxZqYZDmfA2RXJgxVvA==
-  dependencies:
-    bindings "^1.3.0"
-
 bignumber.js@^9.0.0:
   version "9.1.2"
   resolved "https://registry.yarnpkg.com/bignumber.js/-/bignumber.js-9.1.2.tgz#b7c4242259c008903b13707983b5f4bbd31eda0c"
@@ -8275,18 +7866,6 @@ binary-extensions@^2.0.0:
   resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d"
   integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==
 
-bind-decorator@^1.0.11:
-  version "1.0.11"
-  resolved "https://registry.yarnpkg.com/bind-decorator/-/bind-decorator-1.0.11.tgz#e41bc06a1f65dd9cec476c91c5daf3978488252f"
-  integrity sha512-yzkH0uog6Vv/vQ9+rhSKxecnqGUZHYncg7qS7voz3Q76+TAi1SGiOKk2mlOvusQnFz9Dc4BC/NMkeXu11YgjJg==
-
-bindings@^1.3.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/bindings/-/bindings-1.5.0.tgz#10353c9e945334bc0511a6d90b38fbc7c9c504df"
-  integrity sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==
-  dependencies:
-    file-uri-to-path "1.0.0"
-
 bl@^4.0.3:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/bl/-/bl-4.1.0.tgz#451535264182bec2fbbc83a62ab98cf11d9f7b3a"
@@ -8306,7 +7885,7 @@ bn.js@^4.11.9:
   resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.12.0.tgz#775b3f278efbb9718eec7361f483fb36fbbfea88"
   integrity sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==
 
-bn.js@^5.0.0, bn.js@^5.1.1, bn.js@^5.2.0, bn.js@^5.2.1:
+bn.js@^5.2.1:
   version "5.2.1"
   resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-5.2.1.tgz#0bc527a6a0d18d0aa8d5b0538ce4a77dccfa7b70"
   integrity sha512-eXRvHzWyYPBuB4NBy0cmYQjGitUrtqwbvlzP3G6VFnNRbsZQIxQ10PbKKHt8gZ/HW/D/747aDl+QkDqg3KQLMQ==
@@ -8316,14 +7895,10 @@ boolbase@^1.0.0:
   resolved "https://registry.yarnpkg.com/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e"
   integrity sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==
 
-borsh@^0.7.0:
-  version "0.7.0"
-  resolved "https://registry.yarnpkg.com/borsh/-/borsh-0.7.0.tgz#6e9560d719d86d90dc589bca60ffc8a6c51fec2a"
-  integrity sha512-CLCsZGIBCFnPtkNnieW/a8wmreDmfUtjU2m9yHrzPXIlNbqVs0AQrSatSG6vdNYUqdc83tkQi2eHfF98ubzQLA==
-  dependencies:
-    bn.js "^5.2.0"
-    bs58 "^4.0.0"
-    text-encoding-utf-8 "^1.0.2"
+bowser@^2.9.0:
+  version "2.11.0"
+  resolved "https://registry.yarnpkg.com/bowser/-/bowser-2.11.0.tgz#5ca3c35757a7aa5771500c70a73a9f91ef420a8f"
+  integrity sha512-AlcaJBi/pqqJBIQ8U9Mcpc9i8Aqxn88Skv5d+xBX006BY5u8N3mGLHa5Lgppa7L/HfwgwLgZ6NYs+Ag6uUmJRA==
 
 brace-expansion@^1.1.7:
   version "1.1.11"
@@ -8369,13 +7944,6 @@ bs-logger@0.x:
   dependencies:
     fast-json-stable-stringify "2.x"
 
-bs58@^4.0.0, bs58@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/bs58/-/bs58-4.0.1.tgz#be161e76c354f6f788ae4071f63f34e8c4f0a42a"
-  integrity sha512-Ok3Wdf5vOIlBrgCvTq96gBkJw+JUEzdBgyaza5HLtPm7yTHkjRy8+JzNyHF7BHa0bNWOQIp3m5YF0nnFcOIKLw==
-  dependencies:
-    base-x "^3.0.2"
-
 bser@2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/bser/-/bser-2.1.1.tgz#e6787da20ece9d07998533cfd9de6f5c38f4bc05"
@@ -8388,15 +7956,7 @@ buffer-from@^1.0.0:
   resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.2.tgz#2b146a6fd72e80b4f55d255f35ed59a3a9a41bd5"
   integrity sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==
 
-buffer@6.0.1:
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/buffer/-/buffer-6.0.1.tgz#3cbea8c1463e5a0779e30b66d4c88c6ffa182ac2"
-  integrity sha512-rVAXBwEcEoYtxnHSO5iWyhzV/O1WMtkUYWlfdLS7FjU4PnSJJHEfHXi/uHPI5EwltmOA794gN3bm3/pzuctWjQ==
-  dependencies:
-    base64-js "^1.3.1"
-    ieee754 "^1.2.1"
-
-buffer@6.0.3, buffer@^6.0.3, buffer@~6.0.3:
+buffer@6.0.3, buffer@^6.0.3:
   version "6.0.3"
   resolved "https://registry.yarnpkg.com/buffer/-/buffer-6.0.3.tgz#2ace578459cc8fbe2a70aaa8f52ee63b6a74c6c6"
   integrity sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==
@@ -8412,10 +7972,10 @@ buffer@^5.5.0:
     base64-js "^1.3.1"
     ieee754 "^1.1.13"
 
-bufferutil@^4.0.1:
-  version "4.0.7"
-  resolved "https://registry.yarnpkg.com/bufferutil/-/bufferutil-4.0.7.tgz#60c0d19ba2c992dd8273d3f73772ffc894c153ad"
-  integrity sha512-kukuqc39WOHtdxtw4UScxF/WVnMFVSQVKhtx3AjZJzhd0RGZZldcrfSEbVsWWe6KNH253574cq5F+wpv0G9pJw==
+bufferutil@^4.0.8:
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/bufferutil/-/bufferutil-4.0.8.tgz#1de6a71092d65d7766c4d8a522b261a6e787e8ea"
+  integrity sha512-4T53u4PdgsXqKaIctwF8ifXlRTTmEPJ8iEPWFdGZvcf7sbwYo6FKFEX9eNNAnzFZ7EzJAQ3CJeOtCRA4rDp7Pw==
   dependencies:
     node-gyp-build "^4.3.0"
 
@@ -8625,7 +8185,7 @@ cliui@^8.0.1:
     strip-ansi "^6.0.1"
     wrap-ansi "^7.0.0"
 
-clsx@^1.1.0:
+clsx@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/clsx/-/clsx-1.2.1.tgz#0ddc4a20a549b59c93a4116bb26f5294ca17dc12"
   integrity sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==
@@ -8733,6 +8293,11 @@ comment-parser@^1.1.2:
   resolved "https://registry.yarnpkg.com/comment-parser/-/comment-parser-1.3.1.tgz#3d7ea3adaf9345594aedee6563f422348f165c1b"
   integrity sha512-B52sN2VNghyq5ofvUsqZjmk6YkihBX5vMSChmSK9v4ShjKf3Vk5Xcmgpw4o+iIgtrnM/u5FiMpz9VKb8lpBveA==
 
+common-tags@1.8.2:
+  version "1.8.2"
+  resolved "https://registry.yarnpkg.com/common-tags/-/common-tags-1.8.2.tgz#94ebb3c076d26032745fd54face7f688ef5ac9c6"
+  integrity sha512-gk/Z852D2Wtb//0I+kRFNKKE9dIIVirjoqPoA1wJU+XePVXZfGeBpk45+A1rKO4Q43prqWBNY/MiIeRLbPWUaA==
+
 compute-scroll-into-view@1.0.20:
   version "1.0.20"
   resolved "https://registry.yarnpkg.com/compute-scroll-into-view/-/compute-scroll-into-view-1.0.20.tgz#1768b5522d1172754f5d0c9b02de3af6be506a43"
@@ -8768,7 +8333,7 @@ cookie@~0.5.0:
   resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.5.0.tgz#d1f5d71adec6558c58f389987c366aa47e994f8b"
   integrity sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==
 
-copy-to-clipboard@3.3.3, copy-to-clipboard@^3.2.0, copy-to-clipboard@^3.3.1, copy-to-clipboard@^3.3.3:
+copy-to-clipboard@3.3.3, copy-to-clipboard@^3.2.0, copy-to-clipboard@^3.3.1:
   version "3.3.3"
   resolved "https://registry.yarnpkg.com/copy-to-clipboard/-/copy-to-clipboard-3.3.3.tgz#55ac43a1db8ae639a4bd99511c148cdd1b83a1b0"
   integrity sha512-2KV8NhB5JqC3ky0r9PMCAZKbUHSwtEo4CwCs0KXgruG43gX5PMqDEBbVU4OUzw2MuAWUfsuFmWvEKG5QRfSnJA==
@@ -8832,7 +8397,14 @@ cross-fetch@^3.1.4, cross-fetch@^3.1.5:
   dependencies:
     node-fetch "2.6.7"
 
-cross-spawn@^7.0.0, cross-spawn@^7.0.2, cross-spawn@^7.0.3:
+cross-fetch@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/cross-fetch/-/cross-fetch-4.0.0.tgz#f037aef1580bb3a1a35164ea2a848ba81b445983"
+  integrity sha512-e4a5N8lVvuLgAWgnCrLr2PP0YyDOTHa9H/Rj54dirp61qXnNq46m82bRhNqIA5VccJtWBvPTFRV3TtvHUKPB1g==
+  dependencies:
+    node-fetch "^2.6.12"
+
+cross-spawn@7.0.3, cross-spawn@^7.0.0, cross-spawn@^7.0.2, cross-spawn@^7.0.3:
   version "7.0.3"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
   integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
@@ -9228,14 +8800,14 @@ damerau-levenshtein@^1.0.8:
   resolved "https://registry.yarnpkg.com/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz#b43d286ccbd36bc5b2f7ed41caf2d0aba1f8a6e7"
   integrity sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==
 
-dappscout-iframe@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/dappscout-iframe/-/dappscout-iframe-0.1.0.tgz#c971d8a8aa4fb3d64ca357700d3ac809dcdecb0d"
-  integrity sha512-nL65Uuv2+r2ujELyBtw+VL6PYkUtleCvKi2XaeMiroZz6tieeUw338PEOc6cZaIfwXk59rFwNR0FZki2HnOrIA==
+dappscout-iframe@0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/dappscout-iframe/-/dappscout-iframe-0.2.1.tgz#b4718515ee4f00022af3912fac6ca1a321c156f9"
+  integrity sha512-EsiAAEk2I6hN+/E8o45WUn4BFd7aN8UvBwsIcOH79WOly0GOOHkPEO/puPkBCV0EcdxBsZIfssx3X0fSWVz5Bw==
   dependencies:
-    ethers "^5.7.2"
     react "^18.2.0"
     react-dom "^18.2.0"
+    viem "^1.20.3"
 
 data-uri-to-buffer@^4.0.0:
   version "4.0.0"
@@ -9251,6 +8823,13 @@ data-urls@^3.0.2:
     whatwg-mimetype "^3.0.0"
     whatwg-url "^11.0.0"
 
+date-fns@^2.29.3:
+  version "2.30.0"
+  resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.30.0.tgz#f367e644839ff57894ec6ac480de40cae4b0f4d0"
+  integrity sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==
+  dependencies:
+    "@babel/runtime" "^7.21.0"
+
 dateformat@^4.6.3:
   version "4.6.3"
   resolved "https://registry.yarnpkg.com/dateformat/-/dateformat-4.6.3.tgz#556fa6497e5217fedb78821424f8a1c22fa3f4b5"
@@ -9266,7 +8845,7 @@ dayjs@^1.11.5:
   resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.11.5.tgz#00e8cc627f231f9499c19b38af49f56dc0ac5e93"
   integrity sha512-CAdX5Q3YW3Gclyo5Vpqkgpj8fSdLQcRuzfX6mC6Phy0nfJ0eGYOeS7m4mt2plDWLAtA4TqTakvbboHvUxfe4iA==
 
-debug@4, debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4:
+debug@4, debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.1, debug@~4.3.2:
   version "4.3.4"
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
   integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
@@ -9297,7 +8876,7 @@ decimal.js@^10.4.1:
   resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.4.2.tgz#0341651d1d997d86065a2ce3a441fbd0d8e8b98e"
   integrity sha512-ic1yEvwT6GuvaYwBLLY6/aFFgjZdySKTE8en/fkU3QICTmRtgtSlFn0u0BXN06InZwtfCelR7j8LRiDI/02iGA==
 
-decode-uri-component@^0.2.0, decode-uri-component@^0.2.2:
+decode-uri-component@^0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.2.tgz#e69dbe25d37941171dd540e024c444cd5188e1e9"
   integrity sha512-FqUYQ+8o158GyGTrMFJms9qh3CqTKvAqgqsTnkLI8sKu0028orqBhxNMFkFen0zGyg6epACD32pjVk58ngIErQ==
@@ -9380,11 +8959,6 @@ delaunator@5:
   dependencies:
     robust-predicates "^3.0.0"
 
-delay@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/delay/-/delay-5.0.0.tgz#137045ef1b96e5071060dd5be60bf9334436bd1d"
-  integrity sha512-ReEBKkIfe4ya47wlPYf/gu5ib6yUG0/Aez0JQZQz94kiWtRQvZIQbTiehsnwHvLSWJnQdhVeqYue7Id1dKr0qw==
-
 delayed-stream@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619"
@@ -9395,22 +8969,12 @@ denque@^2.1.0:
   resolved "https://registry.yarnpkg.com/denque/-/denque-2.1.0.tgz#e93e1a6569fb5e66f16a3c2a2964617d349d6ab1"
   integrity sha512-HVQE3AAb/pxF8fQAoiqpvg9i3evqug3hoiwakOyZAwJm+6vZehbkYXZ0l4JxS+I3QxM97v5aaRNhj8v5oBhekw==
 
-depd@^1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/depd/-/depd-1.1.2.tgz#9bcd52e14c097763e749b274c4346ed2e560b5a9"
-  integrity sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ==
-
-derive-valtio@0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/derive-valtio/-/derive-valtio-0.1.0.tgz#4b9fb393dfefccfef15fcbbddd745dd22d5d63d7"
-  integrity sha512-OCg2UsLbXK7GmmpzMXhYkdO64vhJ1ROUUGaTFyHjVwEdMEcTTRj7W1TxLbSBxdY8QLBPCcp66MTyaSy0RpO17A==
-
 destr@^2.0.1, destr@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/destr/-/destr-2.0.2.tgz#8d3c0ee4ec0a76df54bc8b819bca215592a8c218"
   integrity sha512-65AlobnZMiCET00KaFFjUefxDX0khFA/E4myqZ7a6Sq1yZtR8+FVIvilVX66vF2uobSumxooYZChiRPCKNqhmg==
 
-detect-browser@5.3.0, detect-browser@^5.2.0, detect-browser@^5.3.0:
+detect-browser@5.3.0, detect-browser@^5.2.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/detect-browser/-/detect-browser-5.3.0.tgz#9705ef2bddf46072d0f7265a1fe300e36fe7ceca"
   integrity sha512-53rsFbGdwMwlF7qvCt0ypLM5V5/Mbl0szB7GPN8y9NCcbknYOeVVXdrXEq+90IwAfrrzt6Hd+u2E2ntakICU8w==
@@ -9484,6 +9048,11 @@ dom-helpers@^5.0.1:
     "@babel/runtime" "^7.8.7"
     csstype "^3.0.2"
 
+dom-mutator@^0.6.0:
+  version "0.6.0"
+  resolved "https://registry.yarnpkg.com/dom-mutator/-/dom-mutator-0.6.0.tgz#079d7a4b3e8981a562cd777548b99baab51d65c5"
+  integrity sha512-iCt9o0aYfXMUkz/43ZOAUFQYotjGB+GNbYJiJdz4TgXkyToXbbRy5S6FbTp72lRBtfpUMwEc1KmpFEU4CZeoNg==
+
 dom-serializer@^1.0.1:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-1.4.1.tgz#de5d41b1aea290215dc45a6dae8adcf1d32e2d30"
@@ -9601,15 +9170,24 @@ eastasianwidth@^0.2.0:
   resolved "https://registry.yarnpkg.com/eastasianwidth/-/eastasianwidth-0.2.0.tgz#696ce2ec0aa0e6ea93a397ffcf24aa7840c827cb"
   integrity sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==
 
+eciesjs@^0.3.15, eciesjs@^0.3.16:
+  version "0.3.18"
+  resolved "https://registry.yarnpkg.com/eciesjs/-/eciesjs-0.3.18.tgz#67b5d73a8466e40a45bbc2f2a3177e71e9c0643d"
+  integrity sha512-RQhegEtLSyIiGJmFTZfvCTHER/fymipXFVx6OwSRYD6hOuy+6Kjpk0dGvIfP9kxn/smBpxQy71uxpGO406ITCw==
+  dependencies:
+    "@types/secp256k1" "^4.0.4"
+    futoin-hkdf "^1.5.3"
+    secp256k1 "^5.0.0"
+
 electron-to-chromium@^1.4.251:
   version "1.4.276"
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.276.tgz#17837b19dafcc43aba885c4689358b298c19b520"
   integrity sha512-EpuHPqu8YhonqLBXHoU6hDJCD98FCe6KDoet3/gY1qsQ6usjJoHqBH2YIVs8FXaAtHwVL8Uqa/fsYao/vq9VWQ==
 
-elliptic@6.5.4:
-  version "6.5.4"
-  resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.4.tgz#da37cebd31e79a1367e941b592ed1fbebd58abbb"
-  integrity sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==
+elliptic@^6.5.4:
+  version "6.5.5"
+  resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.5.tgz#c715e09f78b6923977610d4c2346d6ce22e6dded"
+  integrity sha512-7EjbcmUm17NQFu4Pmgmq2olYMj8nwMnpcddByChSUjArp8F5DQWcIcpriwO4ZToLNAJig0yiyjswfyGNje/ixw==
   dependencies:
     bn.js "^4.11.9"
     brorand "^1.1.0"
@@ -9639,13 +9217,29 @@ encode-utf8@^1.0.3:
   resolved "https://registry.yarnpkg.com/encode-utf8/-/encode-utf8-1.0.3.tgz#f30fdd31da07fb596f281beb2f6b027851994cda"
   integrity sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw==
 
-end-of-stream@^1.1.0, end-of-stream@^1.4.1, end-of-stream@^1.4.4:
+end-of-stream@^1.1.0, end-of-stream@^1.4.0, end-of-stream@^1.4.1, end-of-stream@^1.4.4:
   version "1.4.4"
   resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-1.4.4.tgz#5ae64a5f45057baf3626ec14da0ca5e4b2431eb0"
   integrity sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==
   dependencies:
     once "^1.4.0"
 
+engine.io-client@~6.5.2:
+  version "6.5.3"
+  resolved "https://registry.yarnpkg.com/engine.io-client/-/engine.io-client-6.5.3.tgz#4cf6fa24845029b238f83c628916d9149c399bc5"
+  integrity sha512-9Z0qLB0NIisTRt1DZ/8U2k12RJn8yls/nXMZLn+/N8hANT3TcYjKFKcwbw5zFQiN4NTde3TSY9zb79e1ij6j9Q==
+  dependencies:
+    "@socket.io/component-emitter" "~3.1.0"
+    debug "~4.3.1"
+    engine.io-parser "~5.2.1"
+    ws "~8.11.0"
+    xmlhttprequest-ssl "~2.0.0"
+
+engine.io-parser@~5.2.1:
+  version "5.2.2"
+  resolved "https://registry.yarnpkg.com/engine.io-parser/-/engine.io-parser-5.2.2.tgz#37b48e2d23116919a3453738c5720455e64e1c49"
+  integrity sha512-RcyUFKA93/CXH20l4SoVvzZfrSDMOTUS3bWVpTt2FuFP+XYrL8i8oonHP7WInRyVHXh0n/ORtoeiE1os+8qkSw==
+
 enhanced-resolve@^5.12.0:
   version "5.12.0"
   resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.12.0.tgz#300e1c90228f5b570c4d35babf263f6da7155634"
@@ -9804,61 +9398,49 @@ es-to-primitive@^1.2.1:
     is-date-object "^1.0.1"
     is-symbol "^1.0.2"
 
-es6-promise@^4.0.3:
-  version "4.2.8"
-  resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.8.tgz#4eb21594c972bc40553d276e510539143db53e0a"
-  integrity sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w==
-
-es6-promisify@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/es6-promisify/-/es6-promisify-5.0.0.tgz#5109d62f3e56ea967c4b63505aef08291c8a5203"
-  integrity sha512-C+d6UdsYDk0lMebHNR4S2NybQMMngAOnOwYBQjTOiv0MkoJMP0Myw2mgpDLBcpfCmRLxyFqYhS/CfOENq4SJhQ==
-  dependencies:
-    es6-promise "^4.0.3"
-
-esbuild@^0.17.5:
-  version "0.17.19"
-  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.17.19.tgz#087a727e98299f0462a3d0bcdd9cd7ff100bd955"
-  integrity sha512-XQ0jAPFkK/u3LcVRcvVHQcTIqD6E2H1fvZMA5dQPSOWb3suUbWbfbRf94pjc0bNzRYLfIrDRQXr7X+LHIm5oHw==
+esbuild@^0.18.10:
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.18.20.tgz#4709f5a34801b43b799ab7d6d82f7284a9b7a7a6"
+  integrity sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA==
   optionalDependencies:
-    "@esbuild/android-arm" "0.17.19"
-    "@esbuild/android-arm64" "0.17.19"
-    "@esbuild/android-x64" "0.17.19"
-    "@esbuild/darwin-arm64" "0.17.19"
-    "@esbuild/darwin-x64" "0.17.19"
-    "@esbuild/freebsd-arm64" "0.17.19"
-    "@esbuild/freebsd-x64" "0.17.19"
-    "@esbuild/linux-arm" "0.17.19"
-    "@esbuild/linux-arm64" "0.17.19"
-    "@esbuild/linux-ia32" "0.17.19"
-    "@esbuild/linux-loong64" "0.17.19"
-    "@esbuild/linux-mips64el" "0.17.19"
-    "@esbuild/linux-ppc64" "0.17.19"
-    "@esbuild/linux-riscv64" "0.17.19"
-    "@esbuild/linux-s390x" "0.17.19"
-    "@esbuild/linux-x64" "0.17.19"
-    "@esbuild/netbsd-x64" "0.17.19"
-    "@esbuild/openbsd-x64" "0.17.19"
-    "@esbuild/sunos-x64" "0.17.19"
-    "@esbuild/win32-arm64" "0.17.19"
-    "@esbuild/win32-ia32" "0.17.19"
-    "@esbuild/win32-x64" "0.17.19"
+    "@esbuild/android-arm" "0.18.20"
+    "@esbuild/android-arm64" "0.18.20"
+    "@esbuild/android-x64" "0.18.20"
+    "@esbuild/darwin-arm64" "0.18.20"
+    "@esbuild/darwin-x64" "0.18.20"
+    "@esbuild/freebsd-arm64" "0.18.20"
+    "@esbuild/freebsd-x64" "0.18.20"
+    "@esbuild/linux-arm" "0.18.20"
+    "@esbuild/linux-arm64" "0.18.20"
+    "@esbuild/linux-ia32" "0.18.20"
+    "@esbuild/linux-loong64" "0.18.20"
+    "@esbuild/linux-mips64el" "0.18.20"
+    "@esbuild/linux-ppc64" "0.18.20"
+    "@esbuild/linux-riscv64" "0.18.20"
+    "@esbuild/linux-s390x" "0.18.20"
+    "@esbuild/linux-x64" "0.18.20"
+    "@esbuild/netbsd-x64" "0.18.20"
+    "@esbuild/openbsd-x64" "0.18.20"
+    "@esbuild/sunos-x64" "0.18.20"
+    "@esbuild/win32-arm64" "0.18.20"
+    "@esbuild/win32-ia32" "0.18.20"
+    "@esbuild/win32-x64" "0.18.20"
 
 escalade@^3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/escalade/-/escalade-3.1.1.tgz#d8cfdc7000965c5a0174b4a82eaa5c0552742e40"
   integrity sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==
 
+escape-string-regexp@2.0.0, escape-string-regexp@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz#a30304e99daa32e23b2fd20f51babd07cffca344"
+  integrity sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==
+
 escape-string-regexp@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
   integrity sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==
 
-escape-string-regexp@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz#a30304e99daa32e23b2fd20f51babd07cffca344"
-  integrity sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==
-
 escape-string-regexp@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34"
@@ -10180,22 +9762,23 @@ esutils@^2.0.2:
   resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64"
   integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==
 
-eth-block-tracker@6.1.0:
-  version "6.1.0"
-  resolved "https://registry.yarnpkg.com/eth-block-tracker/-/eth-block-tracker-6.1.0.tgz#0481f97bbb88a100b9d45806fe7e37af741cbefc"
-  integrity sha512-K9SY8+/xMBi4M5HHTDdxnpEqEEGjbNpzHFqvxyjMZej8InV/B+CkFRKM6W+uvrFJ7m8Zd1E0qUkseU3vdIDFYQ==
+eth-block-tracker@^7.1.0:
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/eth-block-tracker/-/eth-block-tracker-7.1.0.tgz#dfc16085c6817cc30caabba381deb8d204c1c766"
+  integrity sha512-8YdplnuE1IK4xfqpf4iU7oBxnOYAc35934o083G8ao+8WM8QQtt/mVlAY6yIAdY1eMeLqg4Z//PZjJGmWGPMRg==
   dependencies:
-    "@metamask/safe-event-emitter" "^2.0.0"
-    "@metamask/utils" "^3.0.1"
+    "@metamask/eth-json-rpc-provider" "^1.0.0"
+    "@metamask/safe-event-emitter" "^3.0.0"
+    "@metamask/utils" "^5.0.1"
     json-rpc-random-id "^1.0.1"
     pify "^3.0.0"
 
-eth-json-rpc-filters@5.1.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/eth-json-rpc-filters/-/eth-json-rpc-filters-5.1.0.tgz#f0c2aeaec2a45e2dc6ca1b9843d8e85447821427"
-  integrity sha512-fos+9xmoa1A2Ytsc9eYof17r81BjdJOUcGcgZn4K/tKdCCTb+a8ytEtwlu1op5qsXFDlgGmstTELFrDEc89qEQ==
+eth-json-rpc-filters@^6.0.0:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/eth-json-rpc-filters/-/eth-json-rpc-filters-6.0.1.tgz#0b3e370f017f5c6f58d3e7bd0756d8099ed85c56"
+  integrity sha512-ITJTvqoCw6OVMLs7pI8f4gG92n/St6x80ACtHodeS+IXmO0w+t1T5OOzfSt7KLSMLRkVUoexV7tztLgDxg+iig==
   dependencies:
-    "@metamask/safe-event-emitter" "^2.0.0"
+    "@metamask/safe-event-emitter" "^3.0.0"
     async-mutex "^0.2.6"
     eth-query "^2.1.2"
     json-rpc-engine "^6.1.0"
@@ -10209,14 +9792,7 @@ eth-query@^2.1.2:
     json-rpc-random-id "^1.0.0"
     xtend "^4.0.1"
 
-eth-rpc-errors@4.0.2:
-  version "4.0.2"
-  resolved "https://registry.yarnpkg.com/eth-rpc-errors/-/eth-rpc-errors-4.0.2.tgz#11bc164e25237a679061ac05b7da7537b673d3b7"
-  integrity sha512-n+Re6Gu8XGyfFy1it0AwbD1x0MUzspQs0D5UiPs1fFPCr6WAwZM+vbIhXheBFrpgosqN9bs5PqlB4Q61U/QytQ==
-  dependencies:
-    fast-safe-stringify "^2.0.6"
-
-eth-rpc-errors@^4.0.2:
+eth-rpc-errors@^4.0.2, eth-rpc-errors@^4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/eth-rpc-errors/-/eth-rpc-errors-4.0.3.tgz#6ddb6190a4bf360afda82790bb7d9d5e724f423a"
   integrity sha512-Z3ymjopaoft7JDoxZcEb3pwdGh7yiYMhOwm2doUt6ASXlMavpNlK6Cre0+IMl2VSGyEU9rkiperQhp5iRxn5Pg==
@@ -10240,51 +9816,20 @@ ethereum-cryptography@^2.0.0:
     "@scure/bip32" "1.3.1"
     "@scure/bip39" "1.2.1"
 
-ethers@^5.7.2:
-  version "5.7.2"
-  resolved "https://registry.yarnpkg.com/ethers/-/ethers-5.7.2.tgz#3a7deeabbb8c030d4126b24f84e525466145872e"
-  integrity sha512-wswUsmWo1aOK8rR7DIKiWSw9DbLWe6x98Jrn8wcTflTVvaXhAMaB5zGAXy0GYQEQp9iO1iSHWVyARQm11zUtyg==
-  dependencies:
-    "@ethersproject/abi" "5.7.0"
-    "@ethersproject/abstract-provider" "5.7.0"
-    "@ethersproject/abstract-signer" "5.7.0"
-    "@ethersproject/address" "5.7.0"
-    "@ethersproject/base64" "5.7.0"
-    "@ethersproject/basex" "5.7.0"
-    "@ethersproject/bignumber" "5.7.0"
-    "@ethersproject/bytes" "5.7.0"
-    "@ethersproject/constants" "5.7.0"
-    "@ethersproject/contracts" "5.7.0"
-    "@ethersproject/hash" "5.7.0"
-    "@ethersproject/hdnode" "5.7.0"
-    "@ethersproject/json-wallets" "5.7.0"
-    "@ethersproject/keccak256" "5.7.0"
-    "@ethersproject/logger" "5.7.0"
-    "@ethersproject/networks" "5.7.1"
-    "@ethersproject/pbkdf2" "5.7.0"
-    "@ethersproject/properties" "5.7.0"
-    "@ethersproject/providers" "5.7.2"
-    "@ethersproject/random" "5.7.0"
-    "@ethersproject/rlp" "5.7.0"
-    "@ethersproject/sha2" "5.7.0"
-    "@ethersproject/signing-key" "5.7.0"
-    "@ethersproject/solidity" "5.7.0"
-    "@ethersproject/strings" "5.7.0"
-    "@ethersproject/transactions" "5.7.0"
-    "@ethersproject/units" "5.7.0"
-    "@ethersproject/wallet" "5.7.0"
-    "@ethersproject/web" "5.7.1"
-    "@ethersproject/wordlists" "5.7.0"
-
 event-target-shim@^5.0.0:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/event-target-shim/-/event-target-shim-5.0.1.tgz#5d4d3ebdf9583d63a5333ce2deb7480ab2b05789"
   integrity sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==
 
-eventemitter3@^4.0.7:
-  version "4.0.7"
-  resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-4.0.7.tgz#2de9b68f6528d5644ef5c59526a1b4a07306169f"
-  integrity sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==
+eventemitter2@^6.4.5, eventemitter2@^6.4.7:
+  version "6.4.9"
+  resolved "https://registry.yarnpkg.com/eventemitter2/-/eventemitter2-6.4.9.tgz#41f2750781b4230ed58827bc119d293471ecb125"
+  integrity sha512-JEPTiaOt9f04oa6NOkc4aH+nVp5I3wEjpHbIPqfgCdD5v5bUzy7xQqwcVO2aDQgOWhI28da57HksMrzK9HlRxg==
+
+eventemitter3@5.0.1, eventemitter3@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-5.0.1.tgz#53f5ffd0a492ac800721bb42c66b841de96423c4"
+  integrity sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==
 
 events@^3.3.0:
   version "3.3.0"
@@ -10354,11 +9899,6 @@ extension-port-stream@^2.0.1:
   dependencies:
     webextension-polyfill-ts "^0.22.0"
 
-eyes@^0.1.8:
-  version "0.1.8"
-  resolved "https://registry.yarnpkg.com/eyes/-/eyes-0.1.8.tgz#62cf120234c683785d902348a800ef3e0cc20bc0"
-  integrity sha512-GipyPsXO1anza0AOZdy69Im7hGFCNB7Y/NGjDlZGJ3GJJLtwNSb2vrzYrTYJRrRloVx7pl+bhUaTB8yiccPvFQ==
-
 fast-copy@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/fast-copy/-/fast-copy-3.0.0.tgz#875ebf33b13948ae012b6e51d33da5e6e7571ab8"
@@ -10410,11 +9950,6 @@ fast-safe-stringify@^2.0.6, fast-safe-stringify@^2.1.1:
   resolved "https://registry.yarnpkg.com/fast-safe-stringify/-/fast-safe-stringify-2.1.1.tgz#c406a83b6e70d9e35ce3b30a81141df30aeba884"
   integrity sha512-W+KJc2dmILlPplD/H4K9l9LcAHAfPtP6BY84uVLXQ6Evcz9Lcg33Y2z1IVblT6xdY54PXYVHEv+0Wpq8Io6zkA==
 
-fast-stable-stringify@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/fast-stable-stringify/-/fast-stable-stringify-1.0.0.tgz#5c5543462b22aeeefd36d05b34e51c78cb86d313"
-  integrity sha512-wpYMUmFu5f00Sm0cj2pfivpmawLZ0NKdviQ4w9zJeR8JVtOpOxHmLaJuj0vxvGqMJQWyP/COUkF75/57OKyRag==
-
 fast-url-parser@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/fast-url-parser/-/fast-url-parser-1.1.3.tgz#f4af3ea9f34d8a271cf58ad2b3759f431f0b318d"
@@ -10458,11 +9993,6 @@ file-entry-cache@^6.0.1:
   dependencies:
     flat-cache "^3.0.4"
 
-file-uri-to-path@1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz#553a7b8446ff6f684359c445f1e37a05dacc33dd"
-  integrity sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==
-
 fill-range@^7.0.1:
   version "7.0.1"
   resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40"
@@ -10523,11 +10053,21 @@ focus-lock@^0.11.6:
   dependencies:
     tslib "^2.0.3"
 
+focus-visible@^5.2.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/focus-visible/-/focus-visible-5.2.0.tgz#3a9e41fccf587bd25dcc2ef045508284f0a4d6b3"
+  integrity sha512-Rwix9pBtC1Nuy5wysTmKy+UjbDJpIfg8eHjw0rjZ1mX4GNLz1Bmd16uDpI3Gk1i70Fgcs8Csg2lPm8HULFg9DQ==
+
 follow-redirects@^1.15.0:
   version "1.15.2"
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.2.tgz#b460864144ba63f2681096f274c4e57026da2c13"
   integrity sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==
 
+follow-redirects@^1.15.4:
+  version "1.15.5"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.5.tgz#54d4d6d062c0fa7d9d17feb008461550e3ba8020"
+  integrity sha512-vSFWUON1B+yAw1VN4xMfxgn5fTUiaOzAJCKBwIIgT/+7CuGy9+r+5gITvP62j3RmaD5Ph65UaERdOSRGUzZtgw==
+
 fontfaceobserver@2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/fontfaceobserver/-/fontfaceobserver-2.1.0.tgz#e2705d293e2c585a6531c2a722905657317a2991"
@@ -10647,6 +10187,11 @@ functions-have-names@^1.2.2:
   resolved "https://registry.yarnpkg.com/functions-have-names/-/functions-have-names-1.2.3.tgz#0404fe4ee2ba2f607f0e0ec3c80bae994133b834"
   integrity sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==
 
+futoin-hkdf@^1.5.3:
+  version "1.5.3"
+  resolved "https://registry.yarnpkg.com/futoin-hkdf/-/futoin-hkdf-1.5.3.tgz#6c8024f2e1429da086d4e18289ef2239ad33ee35"
+  integrity sha512-SewY5KdMpaoCeh7jachEWFsh1nNlaDjNHZXWqL5IGwtpEYHTgkr2+AMCgNwKWkcc0wpSYrZfR7he4WdmHFtDxQ==
+
 gaxios@^5.0.0:
   version "5.1.3"
   resolved "https://registry.yarnpkg.com/gaxios/-/gaxios-5.1.3.tgz#f7fa92da0fe197c846441e5ead2573d4979e9013"
@@ -10665,6 +10210,13 @@ gcp-metadata@^5.0.0:
     gaxios "^5.0.0"
     json-bigint "^1.0.0"
 
+generic-names@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/generic-names/-/generic-names-4.0.0.tgz#0bd8a2fd23fe8ea16cbd0a279acd69c06933d9a3"
+  integrity sha512-ySFolZQfw9FoDb3ed9d80Cm9f0+r7qj+HJkWjeD9RBfpxEVTlVhol+gvaQB/78WbwYfbnNh8nWHHBSlg072y6A==
+  dependencies:
+    loader-utils "^3.2.0"
+
 gensync@^1.0.0-beta.2:
   version "1.0.0-beta.2"
   resolved "https://registry.yarnpkg.com/gensync/-/gensync-1.0.0-beta.2.tgz#32a6ee76c3d7f52d46b2b1ae5d93fea8580a25e0"
@@ -10726,6 +10278,15 @@ get-tsconfig@^4.5.0:
   resolved "https://registry.yarnpkg.com/get-tsconfig/-/get-tsconfig-4.5.0.tgz#6d52d1c7b299bd3ee9cd7638561653399ac77b0f"
   integrity sha512-MjhiaIWCJ1sAU4pIQ5i5OfOuHHxVo1oYeNsWTON7jxYkod8pHocXeh+SSbmu5OZZZK73B6cbJ2XADzXehLyovQ==
 
+getit-sdk@^1.0.4:
+  version "1.0.13"
+  resolved "https://registry.yarnpkg.com/getit-sdk/-/getit-sdk-1.0.13.tgz#702cd2e8dfeb42884deed6d8d7fbac9af413c73a"
+  integrity sha512-gWDJZNMoy7Uw9S3qOvQ+gVFdmrHuI17ePGhJYbP25DGOzgCwD5n7KDy9JWxGpLqEnf+V3v3aoyTvP8TtZheEaA==
+  dependencies:
+    axios "^1.6.2"
+    jest-transform-css "^6.0.1"
+    tslib "^2.6.2"
+
 github-from-package@0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/github-from-package/-/github-from-package-0.0.0.tgz#97fb5d96bfde8973313f20e8288ef9a167fa64ce"
@@ -10992,7 +10553,7 @@ has@^1.0.3:
   dependencies:
     function-bind "^1.1.1"
 
-hash.js@1.1.7, hash.js@^1.0.0, hash.js@^1.0.3, hash.js@^1.1.7:
+hash.js@^1.0.0, hash.js@^1.0.3:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/hash.js/-/hash.js-1.1.7.tgz#0babca538e8d4ee4a0f8988d68866537a003cf42"
   integrity sha512-taOaskGt4z4SOANNseOviYDvjEJinIkRgmp7LbKP2YTTmVxWBl87s/uzK9r+44BclBSp2X7K1hqeNfz9JbBeXA==
@@ -11094,6 +10655,13 @@ html-escaper@^2.0.0:
   resolved "https://registry.yarnpkg.com/html-escaper/-/html-escaper-2.0.2.tgz#dfd60027da36a36dfcbe236262c00a5822681453"
   integrity sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==
 
+html-parse-stringify@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz#dfc1017347ce9f77c8141a507f233040c59c55d2"
+  integrity sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==
+  dependencies:
+    void-elements "3.1.0"
+
 http-proxy-agent@^5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/http-proxy-agent/-/http-proxy-agent-5.0.0.tgz#5129800203520d434f142bc78ff3c170800f2b43"
@@ -11126,18 +10694,25 @@ human-signals@^3.0.1:
   resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-3.0.1.tgz#c740920859dafa50e5a3222da9d3bf4bb0e5eef5"
   integrity sha512-rQLskxnM/5OCldHo+wNXbpVgDn5A17CUoKX+7Sokwaknlq7CdSnphy0W39GU8dw59XiCXmFXDg4fRuckQRKewQ==
 
-humanize-ms@^1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/humanize-ms/-/humanize-ms-1.2.1.tgz#c46e3159a293f6b896da29316d8b6fe8bb79bbed"
-  integrity sha512-Fl70vYtsAFb/C06PTS9dZBo7ihau+Tu/DNCk/OyHhea07S+aeMWpFFkUaXRa8fI+ScZbEI8dfSxwY7gxZ9SAVQ==
-  dependencies:
-    ms "^2.0.0"
-
 husky@^8.0.0:
   version "8.0.1"
   resolved "https://registry.yarnpkg.com/husky/-/husky-8.0.1.tgz#511cb3e57de3e3190514ae49ed50f6bc3f50b3e9"
   integrity sha512-xs7/chUH/CKdOCs7Zy0Aev9e/dKOMZf3K1Az1nar3tzlv0jfqnYtu235bstsWTmXOR0EfINrPa97yy4Lz6RiKw==
 
+i18next-browser-languagedetector@^7.1.0:
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/i18next-browser-languagedetector/-/i18next-browser-languagedetector-7.2.0.tgz#de0321cba6881be37d82e20e4d6f05aa75f6e37f"
+  integrity sha512-U00DbDtFIYD3wkWsr2aVGfXGAj2TgnELzOX9qv8bT0aJtvPV9CRO77h+vgmHFBMe7LAxdwvT/7VkCWGya6L3tA==
+  dependencies:
+    "@babel/runtime" "^7.23.2"
+
+i18next@22.5.1:
+  version "22.5.1"
+  resolved "https://registry.yarnpkg.com/i18next/-/i18next-22.5.1.tgz#99df0b318741a506000c243429a7352e5f44d424"
+  integrity sha512-8TGPgM3pAD+VRsMtUMNknRz3kzqwp/gPALrWMsDnmC1mKqJwpWyooQRLMcbTwq8z8YwSmuj+ZYvc+xCuEpkssA==
+  dependencies:
+    "@babel/runtime" "^7.20.6"
+
 iconv-lite@0.6, iconv-lite@0.6.3:
   version "0.6.3"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.6.3.tgz#a52f80bf38da1952eb5c681790719871a1a72501"
@@ -11145,6 +10720,11 @@ iconv-lite@0.6, iconv-lite@0.6.3:
   dependencies:
     safer-buffer ">= 2.1.2 < 3.0.0"
 
+icss-replace-symbols@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz#06ea6f83679a7749e386cfe1fe812ae5db223ded"
+  integrity sha512-chIaY3Vh2mh2Q3RGXttaDIzeiPvaVXJ+C4DAh/w3c37SKZ/U6PGMmuicR2EQQp9bKG8zLMCl7I+PtIoOOPp8Gg==
+
 icss-utils@^5.0.0, icss-utils@^5.1.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-5.1.0.tgz#c6be6858abd013d768e98366ae47e25d5887b1ae"
@@ -11214,7 +10794,7 @@ inflight@^1.0.4:
     once "^1.3.0"
     wrappy "1"
 
-inherits@2, inherits@^2.0.1, inherits@^2.0.3, inherits@^2.0.4, inherits@~2.0.3, inherits@~2.0.4:
+inherits@2, inherits@^2.0.1, inherits@^2.0.3, inherits@^2.0.4, inherits@~2.0.3:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
   integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
@@ -11247,7 +10827,7 @@ internal-slot@^1.0.4:
   resolved "https://registry.yarnpkg.com/internmap/-/internmap-2.0.3.tgz#6685f23755e43c524e251d29cbc97248e3061009"
   integrity sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==
 
-invariant@^2.2.2, invariant@^2.2.4:
+invariant@2.2.4, invariant@^2.2.2, invariant@^2.2.4:
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
   integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
@@ -11440,6 +11020,11 @@ is-path-inside@^3.0.3:
   resolved "https://registry.yarnpkg.com/is-path-inside/-/is-path-inside-3.0.3.tgz#d231362e53a07ff2b0e0ea7fed049161ffd16283"
   integrity sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==
 
+is-plain-obj@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-2.1.0.tgz#45e42e37fccf1f40da8e5f76ee21515840c09287"
+  integrity sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA==
+
 is-plain-object@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-2.0.4.tgz#2c163b3fafb1b606d9d17928f05c2a1c38e07677"
@@ -11517,11 +11102,6 @@ is-typed-array@^1.1.10, is-typed-array@^1.1.3, is-typed-array@^1.1.9:
     gopd "^1.0.1"
     has-tostringtag "^1.0.0"
 
-is-typedarray@1.0.0, is-typedarray@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a"
-  integrity sha512-cyA56iCMHAh5CdzjJIa4aohJyeO1YbwLi3Jc35MmRU6poroFjIGZzUzupGiRPOjgHg9TLu43xbpwXk523fMxKA==
-
 is-weakmap@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/is-weakmap/-/is-weakmap-2.0.1.tgz#5008b59bdc43b698201d18f62b37b2ca243e8cf2"
@@ -11569,16 +11149,19 @@ isobject@^3.0.1:
   resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
   integrity sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==
 
+isomorphic-unfetch@3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/isomorphic-unfetch/-/isomorphic-unfetch-3.1.0.tgz#87341d5f4f7b63843d468438128cb087b7c3e98f"
+  integrity sha512-geDJjpoZ8N0kWexiwkX8F9NkTsXhetLPVbZFQ+JTW239QNOwvB0gniuR1Wc6f0AMTn7/mFGyXvHTifrCp/GH8Q==
+  dependencies:
+    node-fetch "^2.6.1"
+    unfetch "^4.2.0"
+
 isomorphic-ws@5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/isomorphic-ws/-/isomorphic-ws-5.0.0.tgz#e5529148912ecb9b451b46ed44d53dae1ce04bbf"
   integrity sha512-muId7Zzn9ywDsyXgTIafTry2sV3nySZeUDe6YedVd1Hvuuep5AsIlqK+XefWpYTyJG5e503F2xIuT2lcU6rCSw==
 
-isomorphic-ws@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/isomorphic-ws/-/isomorphic-ws-4.0.1.tgz#55fd4cd6c5e6491e76dc125938dd863f5cd4f2dc"
-  integrity sha512-BhBvN2MBpWTaSHdWRb/bwdZJ1WaehQ2L1KngkCkfLUGF0mAWAT1sQUQacEmQ0jXkFw/czDXPNQSL5u2/Krsz1w==
-
 isows@1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/isows/-/isows-1.0.3.tgz#93c1cf0575daf56e7120bab5c8c448b0809d0d74"
@@ -11646,25 +11229,6 @@ jaeger-client@^3.15.0:
     uuid "^8.3.2"
     xorshift "^1.1.1"
 
-jayson@^3.4.4:
-  version "3.7.0"
-  resolved "https://registry.yarnpkg.com/jayson/-/jayson-3.7.0.tgz#b735b12d06d348639ae8230d7a1e2916cb078f25"
-  integrity sha512-tfy39KJMrrXJ+mFcMpxwBvFDetS8LAID93+rycFglIQM4kl3uNR3W4lBLE/FFhsoUCEox5Dt2adVpDm/XtebbQ==
-  dependencies:
-    "@types/connect" "^3.4.33"
-    "@types/node" "^12.12.54"
-    "@types/ws" "^7.4.4"
-    JSONStream "^1.3.5"
-    commander "^2.20.3"
-    delay "^5.0.0"
-    es6-promisify "^5.0.0"
-    eyes "^0.1.8"
-    isomorphic-ws "^4.0.1"
-    json-stringify-safe "^5.0.1"
-    lodash "^4.17.20"
-    uuid "^8.3.2"
-    ws "^7.4.5"
-
 jest-changed-files@^29.2.0:
   version "29.2.0"
   resolved "https://registry.yarnpkg.com/jest-changed-files/-/jest-changed-files-29.2.0.tgz#b6598daa9803ea6a4dce7968e20ab380ddbee289"
@@ -11990,6 +11554,17 @@ jest-snapshot@^29.3.1:
     pretty-format "^29.3.1"
     semver "^7.3.5"
 
+jest-transform-css@^6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/jest-transform-css/-/jest-transform-css-6.0.1.tgz#95c579c98945734439c1f243b9843d5f477a9c60"
+  integrity sha512-i78Pi2MW6vcdsUFSRx1kPbjbEIO0pBWwh1Y+PcDrLwTv/6e5p7fzsV/gxFW/SYMHS8DUvMdRVTwVCkA/y+t0iQ==
+  dependencies:
+    common-tags "1.8.2"
+    cross-spawn "7.0.3"
+    postcss-load-config "4.0.1"
+    postcss-modules "4.3.1"
+    style-inject "0.3.0"
+
 jest-util@^29.0.0, jest-util@^29.3.1:
   version "29.3.1"
   resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-29.3.1.tgz#1dda51e378bbcb7e3bc9d8ab651445591ed373e1"
@@ -12084,11 +11659,6 @@ js-sdsl@^4.1.4:
   resolved "https://registry.yarnpkg.com/js-sdsl/-/js-sdsl-4.2.0.tgz#278e98b7bea589b8baaf048c20aeb19eb7ad09d0"
   integrity sha512-dyBIzQBDkCqCu+0upx25Y2jGdbTGxE9fshMsCdK0ViOongpV+n5tXRcZY9v7CaVQ79AGS9KA1KHtojxiM7aXSQ==
 
-js-sha3@0.8.0:
-  version "0.8.0"
-  resolved "https://registry.yarnpkg.com/js-sha3/-/js-sha3-0.8.0.tgz#b9b7a5da73afad7dedd0f8c463954cbde6818840"
-  integrity sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q==
-
 "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
@@ -12168,7 +11738,7 @@ json-parse-even-better-errors@^2.3.0:
   resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d"
   integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==
 
-json-rpc-engine@6.1.0, json-rpc-engine@^6.1.0:
+json-rpc-engine@^6.1.0:
   version "6.1.0"
   resolved "https://registry.yarnpkg.com/json-rpc-engine/-/json-rpc-engine-6.1.0.tgz#bf5ff7d029e1c1bf20cb6c0e9f348dcd8be5a393"
   integrity sha512-NEdLrtrq1jUZyfjkr9OCz9EzCNhnRyWtt1PAnvnhwy6e8XETS0Dtc+ZNCO2gvuAoKsIn2+vCSowXTYE4CkgnAQ==
@@ -12206,11 +11776,6 @@ json-stable-stringify@^1.0.2:
   dependencies:
     jsonify "^0.0.1"
 
-json-stringify-safe@^5.0.1:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb"
-  integrity sha512-ZClg6AaYvamvYEE82d3Iyd3vSSIjQ+odgjaTzRuO3s7toCdFKczob2i0zCh7JE8kWn17yvAWhUVxvqGwUalsRA==
-
 json5@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.2.tgz#63d98d60f21b313b77c4d6da18bfa69d80e1d593"
@@ -12247,11 +11812,6 @@ jsonify@^0.0.1:
   resolved "https://registry.yarnpkg.com/jsonify/-/jsonify-0.0.1.tgz#2aa3111dae3d34a0f151c63f3a45d995d9420978"
   integrity sha512-2/Ki0GcmuqSrgFyelQq9M05y7PS0mEwuIzrf3f1fPqkVDVRvZrPZtVSMHxdgo8Aq0sxAOb/cr2aqqA3LeWHVPg==
 
-jsonparse@^1.2.0:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/jsonparse/-/jsonparse-1.3.1.tgz#3f4dae4a91fac315f71062f8521cc239f1366280"
-  integrity sha512-POQXvpdL69+CluYsillJ7SUhKvytYjW9vG/GKpnf+xP8UWgYEM/RaMzHHofbALDiKbbP1W8UEYmgGl39WkPZsg==
-
 "jsx-ast-utils@^2.4.1 || ^3.0.0", jsx-ast-utils@^3.3.2:
   version "3.3.3"
   resolved "https://registry.yarnpkg.com/jsx-ast-utils/-/jsx-ast-utils-3.3.3.tgz#76b3e6e6cece5c69d49a5792c3d01bd1a0cdc7ea"
@@ -12260,10 +11820,10 @@ jsonparse@^1.2.0:
     array-includes "^3.1.5"
     object.assign "^4.1.3"
 
-keccak@^3.0.1:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/keccak/-/keccak-3.0.3.tgz#4bc35ad917be1ef54ff246f904c2bbbf9ac61276"
-  integrity sha512-JZrLIAJWuZxKbCilMpNz5Vj7Vtb4scDG3dMXLOsbzBmQGyjwE61BbW7bJkfKKCShXiQZt3T6sBgALRtmd+nZaQ==
+keccak@^3.0.3:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/keccak/-/keccak-3.0.4.tgz#edc09b89e633c0549da444432ecf062ffadee86d"
+  integrity sha512-3vKuW0jV8J3XNTzvfyicFR5qvxrSAGl7KIhvgOu5cmWwM7tZRj3fMbj/pfIf4be7aznbc+prBWGjywox/g2Y6Q==
   dependencies:
     node-addon-api "^2.0.0"
     node-gyp-build "^4.2.0"
@@ -12324,6 +11884,11 @@ lilconfig@2.0.5:
   resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.0.5.tgz#19e57fd06ccc3848fd1891655b5a447092225b25"
   integrity sha512-xaYmXZtTHPAw5m+xLN8ab9C+3a8YmV3asNSPOATITbtwrfbwaLJj8h66H1WMIpALCkqsIzK3h7oQ+PdX+LQ9Eg==
 
+lilconfig@^2.0.5:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.1.0.tgz#78e23ac89ebb7e1bfbf25b18043de756548e7f52"
+  integrity sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==
+
 lines-and-columns@^1.1.6:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
@@ -12431,15 +11996,6 @@ lit-html@^3.1.0:
   dependencies:
     "@types/trusted-types" "^2.0.2"
 
-lit@2.7.6:
-  version "2.7.6"
-  resolved "https://registry.yarnpkg.com/lit/-/lit-2.7.6.tgz#810007b876ed43e0c70124de91831921598b1665"
-  integrity sha512-1amFHA7t4VaaDe+vdQejSVBklwtH9svGoG6/dZi9JhxtJBBlqY5D1RV7iLUYY0trCqQc4NfhYYZilZiVHt7Hxg==
-  dependencies:
-    "@lit/reactive-element" "^1.6.0"
-    lit-element "^3.3.0"
-    lit-html "^2.7.0"
-
 lit@2.8.0:
   version "2.8.0"
   resolved "https://registry.yarnpkg.com/lit/-/lit-2.8.0.tgz#4d838ae03059bf9cafa06e5c61d8acc0081e974e"
@@ -12458,6 +12014,11 @@ lit@3.1.0:
     lit-element "^4.0.0"
     lit-html "^3.1.0"
 
+loader-utils@^3.2.0:
+  version "3.2.1"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-3.2.1.tgz#4fb104b599daafd82ef3e1a41fb9265f87e1f576"
+  integrity sha512-ZvFw1KWS3GVyYBYb7qkmRM/WwL2TQQBxgCK62rlvm4WpVQ23Nb4tYjApUlfjrEGvOs7KHEsmyUn75OHZrJMWPw==
+
 locate-path@^5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-5.0.0.tgz#1afba396afd676a6d42504d0a67a3a7eb9f62aa0"
@@ -12581,6 +12142,11 @@ lz-string@^1.5.0:
   resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.5.0.tgz#c1ab50f77887b712621201ba9fd4e3a6ed099941"
   integrity sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==
 
+magic-bytes.js@1.8.0:
+  version "1.8.0"
+  resolved "https://registry.yarnpkg.com/magic-bytes.js/-/magic-bytes.js-1.8.0.tgz#8362793c60cd77c2dd77db6420be727192df68e2"
+  integrity sha512-lyWpfvNGVb5lu8YUAbER0+UMBTdR63w2mcSUlhhBTyVbxJvjgqwyAf3AZD6MprgK0uHuBoWXSDAMWLupX83o3Q==
+
 magic-string@^0.30.5:
   version "0.30.5"
   resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.30.5.tgz#1994d980bd1c8835dc6e78db7cbd4ae4f24746f9"
@@ -12643,6 +12209,13 @@ memoize-one@^6.0.0:
   resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-6.0.0.tgz#b2591b871ed82948aee4727dc6abceeeac8c1045"
   integrity sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==
 
+merge-options@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/merge-options/-/merge-options-3.0.4.tgz#84709c2aa2a4b24c1981f66c179fe5565cc6dbb7"
+  integrity sha512-2Sug1+knBjkaMsMgf1ctR1Ujx+Ayku4EdJN4Z+C2+JzoeF7A3OZ9KM2GY0CpQS51NR61LTurMJrRKPhSs3ZRTQ==
+  dependencies:
+    is-plain-obj "^2.1.0"
+
 merge-stream@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"
@@ -12768,6 +12341,13 @@ minimist@^1.2.0, minimist@^1.2.5:
   resolved "https://registry.yarnpkg.com/minipass/-/minipass-7.0.4.tgz#dbce03740f50a4786ba994c1fb908844d27b038c"
   integrity sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==
 
+mipd@0.0.5:
+  version "0.0.5"
+  resolved "https://registry.yarnpkg.com/mipd/-/mipd-0.0.5.tgz#367ee796531c23f0631f129038700b1406663aec"
+  integrity sha512-gbKA784D2WKb5H/GtqEv+Ofd1S9Zj+Z/PGDIl1u1QAbswkxD28BQ5bSXQxkeBzPBABg1iDSbiwGG1XqlOxRspA==
+  dependencies:
+    viem "^1.1.4"
+
 mixpanel-browser@^2.47.0:
   version "2.47.0"
   resolved "https://registry.yarnpkg.com/mixpanel-browser/-/mixpanel-browser-2.47.0.tgz#4e7fd3bb660c6f63443efbd169d1cd327db71ed4"
@@ -12835,7 +12415,7 @@ ms@2.1.2:
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"
   integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
 
-ms@^2.0.0, ms@^2.1.1:
+ms@^2.1.1:
   version "2.1.3"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2"
   integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==
@@ -12936,6 +12516,11 @@ node-addon-api@^2.0.0:
   resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-2.0.2.tgz#432cfa82962ce494b132e9d72a15b29f71ff5d32"
   integrity sha512-Ntyt4AIXyaLIuMHF6IOoTakB3K+RWxwtsHNRxllEoA6vPwP9o4866g6YWDLUdnucilZhmkxiHwHr11gAENw+QA==
 
+node-addon-api@^5.0.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-5.1.0.tgz#49da1ca055e109a23d537e9de43c09cca21eb762"
+  integrity sha512-eh0GgfEkpnoWDq+VY8OyvYhFEzBk6jIYbRKdIlyTiAXIVJ8PyBaKb0rp7oDtoddbdoHWhq8wwr+XZ81F1rpNdA==
+
 node-addon-api@^7.0.0:
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-7.0.0.tgz#8136add2f510997b3b94814f4af1cce0b0e3962e"
@@ -12959,13 +12544,20 @@ node-fetch-native@^1.4.0, node-fetch-native@^1.4.1:
   resolved "https://registry.yarnpkg.com/node-fetch-native/-/node-fetch-native-1.4.1.tgz#5a336e55b4e1b1e72b9927da09fecd2b374c9be5"
   integrity sha512-NsXBU0UgBxo2rQLOeWNZqS3fvflWePMECr8CoSWoSTqCqGbVVsvl9vZu1HfQicYN0g5piV9Gh8RTEvo/uP752w==
 
-node-fetch@2, node-fetch@2.6.7:
+node-fetch@2.6.7:
   version "2.6.7"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.7.tgz#24de9fba827e3b4ae44dc8b20256a379160052ad"
   integrity sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==
   dependencies:
     whatwg-url "^5.0.0"
 
+node-fetch@^2.6.1, node-fetch@^2.6.12, node-fetch@^2.6.7, node-fetch@^2.6.9:
+  version "2.7.0"
+  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.7.0.tgz#d0f0fa6e3e2dc1d27efcd8ad99d550bda94d187d"
+  integrity sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==
+  dependencies:
+    whatwg-url "^5.0.0"
+
 node-fetch@^2.6.11:
   version "2.6.11"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.11.tgz#cde7fc71deef3131ef80a738919f999e6edfff25"
@@ -12973,13 +12565,6 @@ node-fetch@^2.6.11:
   dependencies:
     whatwg-url "^5.0.0"
 
-node-fetch@^2.6.7, node-fetch@^2.6.9:
-  version "2.7.0"
-  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.7.0.tgz#d0f0fa6e3e2dc1d27efcd8ad99d550bda94d187d"
-  integrity sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==
-  dependencies:
-    whatwg-url "^5.0.0"
-
 node-fetch@^3.2.9:
   version "3.2.10"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-3.2.10.tgz#e8347f94b54ae18b57c9c049ef641cef398a85c8"
@@ -13053,6 +12638,15 @@ nwsapi@^2.2.2:
   resolved "https://registry.yarnpkg.com/nwsapi/-/nwsapi-2.2.2.tgz#e5418863e7905df67d51ec95938d67bf801f0bb0"
   integrity sha512-90yv+6538zuvUMnN+zCr8LuV6bPFdq50304114vJYJ8RDyK8D5O9Phpbd6SZWgI7PwzmmfN1upeOJlvybDSgCw==
 
+obj-multiplex@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/obj-multiplex/-/obj-multiplex-1.0.0.tgz#2f2ae6bfd4ae11befe742ea9ea5b36636eabffc1"
+  integrity sha512-0GNJAOsHoBHeNTvl5Vt6IWnpUEcc3uSRxzBri7EDyIcMgYvnY2JL2qdeV5zTMjWQX5OHcD5amcW2HFfDh0gjIA==
+  dependencies:
+    end-of-stream "^1.4.0"
+    once "^1.4.0"
+    readable-stream "^2.3.3"
+
 object-assign@^4.0.1, object-assign@^4.1.1:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
@@ -13593,10 +13187,19 @@ pkg-types@^1.0.3:
     mlly "^1.2.0"
     pathe "^1.1.0"
 
-playwright-core@1.35.1:
-  version "1.35.1"
-  resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.35.1.tgz#52c1e6ffaa6a8c29de1a5bdf8cce0ce290ffb81d"
-  integrity sha512-pNXb6CQ7OqmGDRspEjlxE49w+4YtR6a3X6mT1hZXeJHWmsEz7SunmvZeiG/+y1yyMZdHnnn73WKYdtV1er0Xyg==
+playwright-core@1.41.1:
+  version "1.41.1"
+  resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.41.1.tgz#9c152670010d9d6f970f34b68e3e935d3c487431"
+  integrity sha512-/KPO5DzXSMlxSX77wy+HihKGOunh3hqndhqeo/nMxfigiKzogn8kfL0ZBDu0L1RKgan5XHCPmn6zXd2NUJgjhg==
+
+playwright@1.41.1:
+  version "1.41.1"
+  resolved "https://registry.yarnpkg.com/playwright/-/playwright-1.41.1.tgz#83325f34165840d019355c2a78a50f21ed9b9c85"
+  integrity sha512-gdZAWG97oUnbBdRL3GuBvX3nDDmUOuqzV/D24dytqlKt+eI5KbwusluZRGljx1YoJKZ2NRPaeWiFTeGZO7SosQ==
+  dependencies:
+    playwright-core "1.41.1"
+  optionalDependencies:
+    fsevents "2.3.2"
 
 pngjs@^5.0.0:
   version "5.0.0"
@@ -13608,6 +13211,11 @@ pnglib@0.0.1:
   resolved "https://registry.yarnpkg.com/pnglib/-/pnglib-0.0.1.tgz#f9ab6f9c688f4a9d579ad8be28878a716e30c096"
   integrity sha512-95ChzOoYLOPIyVmL+Y6X+abKGXUJlvOVLkB1QQkyXl7Uczc6FElUy/x01NS7r2GX6GRezloO/ecCX9h4U9KadA==
 
+pony-cause@^2.1.10:
+  version "2.1.10"
+  resolved "https://registry.yarnpkg.com/pony-cause/-/pony-cause-2.1.10.tgz#828457ad6f13be401a075dbf14107a9057945174"
+  integrity sha512-3IKLNXclQgkU++2fSi93sQ6BznFuxSLB11HdvZQ6JW/spahf/P1pAHBQEahr20rs0htZW0UDkM1HmA+nZkXKsw==
+
 popmotion@11.0.3:
   version "11.0.3"
   resolved "https://registry.yarnpkg.com/popmotion/-/popmotion-11.0.3.tgz#565c5f6590bbcddab7a33a074bb2ba97e24b0cc9"
@@ -13618,24 +13226,32 @@ popmotion@11.0.3:
     style-value-types "5.0.0"
     tslib "^2.1.0"
 
+postcss-load-config@4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-4.0.1.tgz#152383f481c2758274404e4962743191d73875bd"
+  integrity sha512-vEJIc8RdiBRu3oRAI0ymerOn+7rPuMvRXslTvZUKZonDHFIczxztIyJ1urxM1x9JXEikvpWWTUUqal5j/8QgvA==
+  dependencies:
+    lilconfig "^2.0.5"
+    yaml "^2.1.1"
+
 postcss-modules-extract-imports@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz#cda1f047c0ae80c97dbe28c3e76a43b88025741d"
   integrity sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==
 
 postcss-modules-local-by-default@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.0.tgz#ebbb54fae1598eecfdf691a02b3ff3b390a5a51c"
-  integrity sha512-sT7ihtmGSF9yhm6ggikHdV0hlziDTX7oFoXtuVWeDd3hHObNkcHRo9V3yg7vCAY7cONyxJC/XXCmmiHHcvX7bQ==
+  version "4.0.4"
+  resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.4.tgz#7cbed92abd312b94aaea85b68226d3dec39a14e6"
+  integrity sha512-L4QzMnOdVwRm1Qb8m4x8jsZzKAaPAgrUF1r/hjDR2Xj7R+8Zsf97jAlSQzWtKx5YNiNGN8QxmPFIc/sh+RQl+Q==
   dependencies:
     icss-utils "^5.0.0"
     postcss-selector-parser "^6.0.2"
     postcss-value-parser "^4.1.0"
 
 postcss-modules-scope@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-3.0.0.tgz#9ef3151456d3bbfa120ca44898dfca6f2fa01f06"
-  integrity sha512-hncihwFA2yPath8oZ15PZqvWGkWf+XUfQgUGamS4LqoP1anQLOsOJw0vr7J7IwLpoY9fatA2qiGUGmuZL0Iqlg==
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-3.1.1.tgz#32cfab55e84887c079a19bbb215e721d683ef134"
+  integrity sha512-uZgqzdTleelWjzJY+Fhti6F3C9iF1JR/dODLs/JDefozYcKTBCdD8BIl6nNPbTbcLnGrk56hzwZC2DaGNvYjzA==
   dependencies:
     postcss-selector-parser "^6.0.4"
 
@@ -13646,10 +13262,24 @@ postcss-modules-values@^4.0.0:
   dependencies:
     icss-utils "^5.0.0"
 
+postcss-modules@4.3.1:
+  version "4.3.1"
+  resolved "https://registry.yarnpkg.com/postcss-modules/-/postcss-modules-4.3.1.tgz#517c06c09eab07d133ae0effca2c510abba18048"
+  integrity sha512-ItUhSUxBBdNamkT3KzIZwYNNRFKmkJrofvC2nWab3CPKhYBQ1f27XXh1PAPE27Psx58jeelPsxWB/+og+KEH0Q==
+  dependencies:
+    generic-names "^4.0.0"
+    icss-replace-symbols "^1.1.0"
+    lodash.camelcase "^4.3.0"
+    postcss-modules-extract-imports "^3.0.0"
+    postcss-modules-local-by-default "^4.0.0"
+    postcss-modules-scope "^3.0.0"
+    postcss-modules-values "^4.0.0"
+    string-hash "^1.1.1"
+
 postcss-selector-parser@^6.0.2, postcss-selector-parser@^6.0.4:
-  version "6.0.11"
-  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz#2e41dc39b7ad74046e1615185185cd0b17d0c8dc"
-  integrity sha512-zbARubNdogI9j7WY4nQJBiNqQf3sLS3wCP4WfOidu+p28LofJqDH1tcXypGrcmMHhDk2t9wGhCsYe/+szLTy1g==
+  version "6.0.15"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.15.tgz#11cc2b21eebc0b99ea374ffb9887174855a01535"
+  integrity sha512-rEYkQOMUCEMhsKbK66tbEU9QVIxbhN18YiniAwA7XQYTVBqrBy+P2p5JcdqsHgKM2zWylp8d7J6eszocfds5Sw==
   dependencies:
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
@@ -13668,7 +13298,7 @@ postcss@8.4.31:
     picocolors "^1.0.0"
     source-map-js "^1.0.2"
 
-postcss@^8.4.19, postcss@^8.4.23, postcss@^8.4.32:
+postcss@^8.4.19, postcss@^8.4.27, postcss@^8.4.32:
   version "8.4.32"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.32.tgz#1dac6ac51ab19adb21b8b34fd2d93a86440ef6c9"
   integrity sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==
@@ -13726,15 +13356,10 @@ postgres-range@^1.1.1:
   resolved "https://registry.yarnpkg.com/postgres-range/-/postgres-range-1.1.3.tgz#9ccd7b01ca2789eb3c2e0888b3184225fa859f76"
   integrity sha512-VdlZoocy5lCP0c/t66xAfclglEapXPCIVhqqJRncYpvbCgImF0w67aPKfbqUMr72tO2k5q0TdTZwCLjPTI6C9g==
 
-preact@^10.12.0:
-  version "10.15.1"
-  resolved "https://registry.yarnpkg.com/preact/-/preact-10.15.1.tgz#a1de60c9fc0c79a522d969c65dcaddc5d994eede"
-  integrity sha512-qs2ansoQEwzNiV5eAcRT1p1EC/dmEzaATVDJNiB3g2sRDWdA7b7MurXdJjB2+/WQktGWZwxvDrnuRFbWuIr64g==
-
-preact@^10.5.9:
-  version "10.11.3"
-  resolved "https://registry.yarnpkg.com/preact/-/preact-10.11.3.tgz#8a7e4ba19d3992c488b0785afcc0f8aa13c78d19"
-  integrity sha512-eY93IVpod/zG3uMF22Unl8h9KkrcKIRs2EGar8hwLZZDU1lkjph303V9HZBwufh2s736U6VXuhD109LYqPoffg==
+preact@^10.16.0:
+  version "10.19.6"
+  resolved "https://registry.yarnpkg.com/preact/-/preact-10.19.6.tgz#66007b67aad4d11899f583df1b0116d94a89b8f5"
+  integrity sha512-gympg+T2Z1fG1unB8NH29yHJwnEaCH37Z32diPDku316OTnRPeMbiRV9kTrfZpocXjdfnWuFUl/Mj4BHaf6gnw==
 
 prebuild-install@^7.1.1:
   version "7.1.1"
@@ -13792,6 +13417,11 @@ prismjs@~1.27.0:
   resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.27.0.tgz#bb6ee3138a0b438a3653dd4d6ce0cc6510a45057"
   integrity sha512-t13BGPUlFDR7wRB5kQDG4jjl7XeuH6jbJGt11JHPL96qwsEHNX2+68tFXqc1/k+/jALsbSWJKUOT/hcYAZ5LkA==
 
+process-nextick-args@~1.0.6:
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-1.0.7.tgz#150e20b756590ad3f91093f25a4f2ad8bff30ba3"
+  integrity sha512-yN0WQmuCX63LP/TMvAg31nvT6m4vDqJEiiv2CAZqWOGNWutc9DfDk1NPYYmKUFmaVM2UwDowH4u5AHWYP/jxKw==
+
 process-nextick-args@~2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
@@ -13902,6 +13532,23 @@ punycode@^2.1.0, punycode@^2.1.1:
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
   integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==
 
+qr-code-styling@^1.6.0-rc.1:
+  version "1.6.0-rc.1"
+  resolved "https://registry.yarnpkg.com/qr-code-styling/-/qr-code-styling-1.6.0-rc.1.tgz#6c89e185fa50cc9135101085c12ae95b06f1b290"
+  integrity sha512-ModRIiW6oUnsP18QzrRYZSc/CFKFKIdj7pUs57AEVH20ajlglRpN3HukjHk0UbNMTlKGuaYl7Gt6/O5Gg2NU2Q==
+  dependencies:
+    qrcode-generator "^1.4.3"
+
+qrcode-generator@^1.4.3:
+  version "1.4.4"
+  resolved "https://registry.yarnpkg.com/qrcode-generator/-/qrcode-generator-1.4.4.tgz#63f771224854759329a99048806a53ed278740e7"
+  integrity sha512-HM7yY8O2ilqhmULxGMpcHSF1EhJJ9yBj8gvDEuZ6M+KGJ0YY2hKpnXvRD+hZPLrDVck3ExIGhmPtSdcjC+guuw==
+
+qrcode-terminal-nooctal@^0.12.1:
+  version "0.12.1"
+  resolved "https://registry.yarnpkg.com/qrcode-terminal-nooctal/-/qrcode-terminal-nooctal-0.12.1.tgz#45016aca0d82b2818de7af0a06d072ad671fbe2e"
+  integrity sha512-jy/kkD0iIMDjTucB+5T6KBsnirlhegDH47vHgrj5MejchSQmi/EAMM0xMFeePgV9CJkkAapNakpVUWYgHvtdKg==
+
 qrcode@1.5.3:
   version "1.5.3"
   resolved "https://registry.yarnpkg.com/qrcode/-/qrcode-1.5.3.tgz#03afa80912c0dccf12bc93f615a535aad1066170"
@@ -13929,13 +13576,6 @@ qs@^6.10.2:
   dependencies:
     side-channel "^1.0.4"
 
-qs@^6.10.3:
-  version "6.11.0"
-  resolved "https://registry.yarnpkg.com/qs/-/qs-6.11.0.tgz#fd0d963446f7a65e1367e01abd85429453f0c37a"
-  integrity sha512-MvjoMCJwEarSbUYk5O+nmoSzSutSsTwF85zcHPQ9OrlFoZOYIjaqBAJIqIXjptyD5vThxGq52Xu/MaJzRkIk4Q==
-  dependencies:
-    side-channel "^1.0.4"
-
 query-string@7.1.3:
   version "7.1.3"
   resolved "https://registry.yarnpkg.com/query-string/-/query-string-7.1.3.tgz#a1cf90e994abb113a325804a972d98276fe02328"
@@ -13946,16 +13586,6 @@ query-string@7.1.3:
     split-on-first "^1.0.0"
     strict-uri-encode "^2.0.0"
 
-query-string@^6.13.5:
-  version "6.14.1"
-  resolved "https://registry.yarnpkg.com/query-string/-/query-string-6.14.1.tgz#7ac2dca46da7f309449ba0f86b1fd28255b0c86a"
-  integrity sha512-XDxAeVmpfu1/6IjyT/gXHOl+S0vQ9owggJ30hhWKdHAsNPOcasn5o9BW0eejZqL2e4vMjhAxoW3jVHcD6mbcYw==
-  dependencies:
-    decode-uri-component "^0.2.0"
-    filter-obj "^1.1.0"
-    split-on-first "^1.0.0"
-    strict-uri-encode "^2.0.0"
-
 querystringify@^2.1.1:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.2.0.tgz#3345941b4153cb9d082d8eee4cda2016a9aef7f6"
@@ -14092,6 +13722,14 @@ react-hook-form@^7.33.1:
   resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-7.37.0.tgz#4d1738f092d3d8a3ade34ee892d97350b1032b19"
   integrity sha512-6NFTxsnw+EXSpNNvLr5nFMjPdYKRryQcelTHg7zwBB6vAzfPIcZq4AExP4heVlwdzntepQgwiOQW4z7Mr99Lsg==
 
+react-i18next@^13.2.2:
+  version "13.5.0"
+  resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-13.5.0.tgz#44198f747628267a115c565f0c736a50a76b1ab0"
+  integrity sha512-CFJ5NDGJ2MUyBohEHxljOq/39NQ972rh1ajnadG9BjTk+UXbHLq4z5DKEbEQBDoIhUmmbuS/fIMJKo6VOax1HA==
+  dependencies:
+    "@babel/runtime" "^7.22.5"
+    html-parse-stringify "^3.0.1"
+
 react-identicons@^1.2.5:
   version "1.2.5"
   resolved "https://registry.yarnpkg.com/react-identicons/-/react-identicons-1.2.5.tgz#3502249e49d88f4e3500092694410a984bb102fa"
@@ -14141,6 +13779,14 @@ react-jazzicon@^1.0.4:
   dependencies:
     mersenne-twister "^1.1.0"
 
+react-native-webview@^11.26.0:
+  version "11.26.1"
+  resolved "https://registry.yarnpkg.com/react-native-webview/-/react-native-webview-11.26.1.tgz#658c09ed5162dc170b361e48c2dd26c9712879da"
+  integrity sha512-hC7BkxOpf+z0UKhxFSFTPAM4shQzYmZHoELa6/8a/MspcjEP7ukYKpuSUTLDywQditT8yI9idfcKvfZDKQExGw==
+  dependencies:
+    escape-string-regexp "2.0.0"
+    invariant "2.2.4"
+
 react-number-format@^5.3.1:
   version "5.3.1"
   resolved "https://registry.yarnpkg.com/react-number-format/-/react-number-format-5.3.1.tgz#840c257da9cb4b248990d8db46e4d23e8bac67ff"
@@ -14257,6 +13903,19 @@ react@18.2.0, react@>=17, react@^18.2.0:
   dependencies:
     loose-envify "^1.1.0"
 
+readable-stream@2.3.3:
+  version "2.3.3"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.3.tgz#368f2512d79f9d46fdfc71349ae7878bbc1eb95c"
+  integrity sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ==
+  dependencies:
+    core-util-is "~1.0.0"
+    inherits "~2.0.3"
+    isarray "~1.0.0"
+    process-nextick-args "~1.0.6"
+    safe-buffer "~5.1.1"
+    string_decoder "~1.0.3"
+    util-deprecate "~1.0.1"
+
 readable-stream@3.6.2, readable-stream@^3.4.0:
   version "3.6.2"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.6.2.tgz#56a9b36ea965c00c5a93ef31eb111a0f11056967"
@@ -14279,7 +13938,20 @@ readable-stream@^2.3.3:
     string_decoder "~1.1.1"
     util-deprecate "~1.0.1"
 
-readable-stream@^3.1.1, readable-stream@^3.5.0, readable-stream@^3.6.0:
+readable-stream@^2.3.7:
+  version "2.3.8"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.8.tgz#91125e8042bba1b9887f49345f6277027ce8be9b"
+  integrity sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==
+  dependencies:
+    core-util-is "~1.0.0"
+    inherits "~2.0.3"
+    isarray "~1.0.0"
+    process-nextick-args "~2.0.0"
+    safe-buffer "~5.1.1"
+    string_decoder "~1.1.1"
+    util-deprecate "~1.0.1"
+
+readable-stream@^3.1.1, readable-stream@^3.6.0:
   version "3.6.0"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-3.6.0.tgz#337bbda3adc0706bd3e024426a286d4b4b2c9198"
   integrity sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==
@@ -14592,25 +14264,22 @@ robust-predicates@^3.0.0:
   resolved "https://registry.yarnpkg.com/robust-predicates/-/robust-predicates-3.0.1.tgz#ecde075044f7f30118682bd9fb3f123109577f9a"
   integrity sha512-ndEIpszUHiG4HtDsQLeIuMvRsDnn8c8rYStabochtUeCvfuvNptb5TUbVD68LRAILPX7p9nqQGh4xJgn3EHS/g==
 
-rollup@^3.21.0:
-  version "3.25.1"
-  resolved "https://registry.yarnpkg.com/rollup/-/rollup-3.25.1.tgz#9fff79d22ff1a904b2b595a2fb9bc3793cb987d8"
-  integrity sha512-tywOR+rwIt5m2ZAWSe5AIJcTat8vGlnPFAv15ycCrw33t6iFsXZ6mzHVFh2psSjxQPmI+xgzMZZizUAukBI4aQ==
-  optionalDependencies:
-    fsevents "~2.3.2"
-
-rpc-websockets@^7.5.0:
-  version "7.5.0"
-  resolved "https://registry.yarnpkg.com/rpc-websockets/-/rpc-websockets-7.5.0.tgz#bbeb87572e66703ff151e50af1658f98098e2748"
-  integrity sha512-9tIRi1uZGy7YmDjErf1Ax3wtqdSSLIlnmL5OtOzgd5eqPKbsPpwDP5whUDO2LQay3Xp0CcHlcNSGzacNRluBaQ==
+rollup-plugin-visualizer@^5.9.2:
+  version "5.12.0"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-visualizer/-/rollup-plugin-visualizer-5.12.0.tgz#661542191ce78ee4f378995297260d0c1efb1302"
+  integrity sha512-8/NU9jXcHRs7Nnj07PF2o4gjxmm9lXIrZ8r175bT9dK8qoLlvKTwRMArRCMgpMGlq8CTLugRvEmyMeMXIU2pNQ==
   dependencies:
-    "@babel/runtime" "^7.17.2"
-    eventemitter3 "^4.0.7"
-    uuid "^8.3.2"
-    ws "^8.5.0"
+    open "^8.4.0"
+    picomatch "^2.3.1"
+    source-map "^0.7.4"
+    yargs "^17.5.1"
+
+rollup@^3.27.1:
+  version "3.29.4"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-3.29.4.tgz#4d70c0f9834146df8705bfb69a9a19c9e1109981"
+  integrity sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==
   optionalDependencies:
-    bufferutil "^4.0.1"
-    utf-8-validate "^5.0.2"
+    fsevents "~2.3.2"
 
 run-parallel@^1.1.9:
   version "1.2.0"
@@ -14624,13 +14293,6 @@ rw@1:
   resolved "https://registry.yarnpkg.com/rw/-/rw-1.3.3.tgz#3f862dfa91ab766b14885ef4d01124bfda074fb4"
   integrity sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==
 
-rxjs@^6.6.3:
-  version "6.6.7"
-  resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-6.6.7.tgz#90ac018acabf491bf65044235d5863c4dab804c9"
-  integrity sha512-hTdwr+7yYNIT5n4AMYp85KA6yw2Va0FLa3Rguvbpa4W3I5xynaBZo41cM3XM+4Q6fRMj3sBYIR1VAmZMXYJvRQ==
-  dependencies:
-    tslib "^1.9.0"
-
 rxjs@^7.5.5:
   version "7.5.7"
   resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-7.5.7.tgz#2ec0d57fdc89ece220d2e702730ae8f1e49def39"
@@ -14648,11 +14310,6 @@ safe-buffer@~5.1.0, safe-buffer@~5.1.1:
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
   integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==
 
-safe-json-utils@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/safe-json-utils/-/safe-json-utils-1.1.1.tgz#0e883874467d95ab914c3f511096b89bfb3e63b1"
-  integrity sha512-SAJWGKDs50tAbiDXLf89PDwt9XYkWyANFWVzn4dTXl5QyI8t2o/bW5/OJl3lvc2WVU4MEpTo9Yz5NVFNsp+OJQ==
-
 safe-regex-test@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/safe-regex-test/-/safe-regex-test-1.0.0.tgz#793b874d524eb3640d1873aad03596db2d4f2295"
@@ -14691,11 +14348,6 @@ scheduler@^0.23.0:
   dependencies:
     loose-envify "^1.1.0"
 
-scrypt-js@3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/scrypt-js/-/scrypt-js-3.0.1.tgz#d314a57c2aef69d1ad98a138a21fe9eafa9ee312"
-  integrity sha512-cdwTTnqPu0Hyvf5in5asVdZocVDTNRmR7XEcJuIzMjJeSHybHl7vpB66AzwTaIg6CLSbtjcxc8fqcySfnTkccA==
-
 scslre@^0.1.6:
   version "0.1.6"
   resolved "https://registry.yarnpkg.com/scslre/-/scslre-0.1.6.tgz#71a2832e4bf3a9254973a04fbed90aec94f75757"
@@ -14705,6 +14357,15 @@ scslre@^0.1.6:
     regexp-ast-analysis "^0.2.3"
     regexpp "^3.2.0"
 
+secp256k1@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/secp256k1/-/secp256k1-5.0.0.tgz#be6f0c8c7722e2481e9773336d351de8cddd12f7"
+  integrity sha512-TKWX8xvoGHrxVdqbYeZM9w+izTF4b9z3NhSaDkdn81btvuh+ivbIMGT/zQvDtTFWhRlThpoz6LEYTr7n8A5GcA==
+  dependencies:
+    elliptic "^6.5.4"
+    node-addon-api "^5.0.0"
+    node-gyp-build "^4.2.0"
+
 secure-json-parse@^2.4.0:
   version "2.5.0"
   resolved "https://registry.yarnpkg.com/secure-json-parse/-/secure-json-parse-2.5.0.tgz#f929829df2adc7ccfb53703569894d051493a6ac"
@@ -14860,6 +14521,24 @@ slice-ansi@^5.0.0:
     ansi-styles "^6.0.0"
     is-fullwidth-code-point "^4.0.0"
 
+socket.io-client@^4.5.1:
+  version "4.7.4"
+  resolved "https://registry.yarnpkg.com/socket.io-client/-/socket.io-client-4.7.4.tgz#5f0e060ff34ac0a4b4c5abaaa88e0d1d928c64c8"
+  integrity sha512-wh+OkeF0rAVCrABWQBaEjLfb7DVPotMbu0cgWgyR0v6eA4EoVnAwcIeIbcdTE3GT/H3kbdLl7OoH2+asoDRIIg==
+  dependencies:
+    "@socket.io/component-emitter" "~3.1.0"
+    debug "~4.3.2"
+    engine.io-client "~6.5.2"
+    socket.io-parser "~4.2.4"
+
+socket.io-parser@~4.2.4:
+  version "4.2.4"
+  resolved "https://registry.yarnpkg.com/socket.io-parser/-/socket.io-parser-4.2.4.tgz#c806966cf7270601e47469ddeec30fbdfda44c83"
+  integrity sha512-/GbIKmo8ioc+NIWIhwdecY0ge+qVBSMdgxGygevmdHj24bsfgtCmcUUcQ5ZzcylGFHsN3k4HB4Cgkl96KVnuew==
+  dependencies:
+    "@socket.io/component-emitter" "~3.1.0"
+    debug "~4.3.1"
+
 sonic-boom@^2.2.1:
   version "2.8.0"
   resolved "https://registry.yarnpkg.com/sonic-boom/-/sonic-boom-2.8.0.tgz#c1def62a77425090e6ad7516aad8eb402e047611"
@@ -14897,6 +14576,11 @@ source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1:
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
   integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
 
+source-map@^0.7.4:
+  version "0.7.4"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.4.tgz#a9bbe705c9d8846f4e08ff6765acf0f1b0898656"
+  integrity sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==
+
 space-separated-tokens@^1.0.0:
   version "1.1.5"
   resolved "https://registry.yarnpkg.com/space-separated-tokens/-/space-separated-tokens-1.1.5.tgz#85f32c3d10d9682007e917414ddc5c26d1aa6899"
@@ -14949,14 +14633,6 @@ std-env@^3.4.3:
   resolved "https://registry.yarnpkg.com/std-env/-/std-env-3.6.0.tgz#94807562bddc68fa90f2e02c5fd5b6865bb4e98e"
   integrity sha512-aFZ19IgVmhdB2uX599ve2kE6BIE3YMnQ6Gp6BURhW/oIzpXGKr878TQfAQZn1+i0Flcc/UKUy1gOlcfaUBCryg==
 
-stream-browserify@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/stream-browserify/-/stream-browserify-3.0.0.tgz#22b0a2850cdf6503e73085da1fc7b7d0c2122f2f"
-  integrity sha512-H73RAHsVBapbim0tU2JwwOiXUj+fikfiaoYAKHF3VJfA0pe2BCzkhAHBlLG6REzE+2WNZcxOXjK7lkso+9euLA==
-  dependencies:
-    inherits "~2.0.4"
-    readable-stream "^3.5.0"
-
 stream-shift@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/stream-shift/-/stream-shift-1.0.1.tgz#d7088281559ab2778424279b0877da3c392d5a3d"
@@ -14977,7 +14653,7 @@ string-argv@^0.3.1:
   resolved "https://registry.yarnpkg.com/string-argv/-/string-argv-0.3.1.tgz#95e2fbec0427ae19184935f816d74aaa4c5c19da"
   integrity sha512-a1uQGz7IyVy9YwhqjZIZu1c8JO8dNIe20xBmSS6qu9kv++k3JGzCVmprbNN5Kn+BgzD5E7YYwg1CcjuJMRNsvg==
 
-string-hash@^1.1.3:
+string-hash@^1.1.1, string-hash@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/string-hash/-/string-hash-1.1.3.tgz#e8aafc0ac1855b4666929ed7dd1275df5d6c811b"
   integrity sha512-kJUvRUFK49aub+a7T1nNE66EJbZBMnBgoC1UbCZ5n6bsZKBRga4KgBRTMn/pFkeCZSYtNeSyMxPDM0AXWELk2A==
@@ -15084,6 +14760,13 @@ string_decoder@^1.1.1:
   dependencies:
     safe-buffer "~5.2.0"
 
+string_decoder@~1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.0.3.tgz#0fc67d7c141825de94282dd536bec6b9bce860ab"
+  integrity sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==
+  dependencies:
+    safe-buffer "~5.1.0"
+
 string_decoder@~1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.1.1.tgz#9cf1611ba62685d7030ae9e4ba34149c3af03fc8"
@@ -15135,6 +14818,11 @@ strip-json-comments@~2.0.1:
   resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
   integrity sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==
 
+style-inject@0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/style-inject/-/style-inject-0.3.0.tgz#d21c477affec91811cc82355832a700d22bf8dd3"
+  integrity sha512-IezA2qp+vcdlhJaVm5SOdPPTUu0FCEqfNSli2vRuSIBbu5Nq5UvygTk/VzeCqfLz2Atj3dVII5QBKGZRZ0edzw==
+
 style-loader@^3.3.1:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/style-loader/-/style-loader-3.3.1.tgz#057dfa6b3d4d7c7064462830f9113ed417d38575"
@@ -15160,6 +14848,11 @@ stylis@4.1.3:
   resolved "https://registry.yarnpkg.com/stylis/-/stylis-4.1.3.tgz#fd2fbe79f5fed17c55269e16ed8da14c84d069f7"
   integrity sha512-GP6WDNWf+o403jrEp9c5jibKavrtLW+/qYGhFxFrG8maXhwTBI7gLLhiBb0o7uFccWN+EOS9aMO6cGHWAO07OA==
 
+stylis@4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/stylis/-/stylis-4.2.0.tgz#79daee0208964c8fe695a42fcffcac633a211a51"
+  integrity sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==
+
 sucrase@^3.20.3:
   version "3.29.0"
   resolved "https://registry.yarnpkg.com/sucrase/-/sucrase-3.29.0.tgz#3207c5bc1b980fdae1e539df3f8a8a518236da7d"
@@ -15172,11 +14865,6 @@ sucrase@^3.20.3:
     pirates "^4.0.1"
     ts-interface-checker "^0.1.9"
 
-superstruct@^0.14.2:
-  version "0.14.2"
-  resolved "https://registry.yarnpkg.com/superstruct/-/superstruct-0.14.2.tgz#0dbcdf3d83676588828f1cf5ed35cda02f59025b"
-  integrity sha512-nPewA6m9mR3d6k7WkZ8N8zpTWfenFH3q9pA2PkuiZxINr9DKB2+40wEQf0ixn8VaGuJ78AB6iWOtStI+/4FKZQ==
-
 superstruct@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/superstruct/-/superstruct-1.0.3.tgz#de626a5b49c6641ff4d37da3c7598e7a87697046"
@@ -15386,11 +15074,6 @@ test-exclude@^6.0.0:
     glob "^7.1.4"
     minimatch "^3.0.4"
 
-text-encoding-utf-8@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/text-encoding-utf-8/-/text-encoding-utf-8-1.0.2.tgz#585b62197b0ae437e3c7b5d0af27ac1021e10d13"
-  integrity sha512-8bw4MY9WjdsD2aMtO0OzOCY3pXGYNx2d2FfHRVUKkiCPDWjKuOlhLVASS+pD7VkLTVjW268LYJHwsnPFlBpbAg==
-
 text-table@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
@@ -15433,7 +15116,7 @@ thriftrw@^3.5.0:
     error "7.0.2"
     long "^2.4.0"
 
-"through@>=2.2.7 <3", through@^2.3.8:
+through@^2.3.8:
   version "2.3.8"
   resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5"
   integrity sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==
@@ -15613,7 +15296,7 @@ tsconfig-paths@^4.0.0:
     minimist "^1.2.6"
     strip-bom "^3.0.0"
 
-tslib@1.14.1, tslib@^1.8.1, tslib@^1.9.0, tslib@^1.9.3:
+tslib@1.14.1, tslib@^1.8.1, tslib@^1.9.3:
   version "1.14.1"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
@@ -15628,6 +15311,11 @@ tslib@^2.3.0, tslib@^2.5.0:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.5.0.tgz#42bfed86f5787aeb41d031866c8f402429e0fddf"
   integrity sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==
 
+tslib@^2.6.2:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
+  integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==
+
 tsutils@^3.21.0:
   version "3.21.0"
   resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.21.0.tgz#b48717d394cea6c1e096983eed58e9d61715b623"
@@ -15680,13 +15368,6 @@ typed-array-length@^1.0.4:
     for-each "^0.3.3"
     is-typed-array "^1.1.9"
 
-typedarray-to-buffer@3.1.5:
-  version "3.1.5"
-  resolved "https://registry.yarnpkg.com/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz#a97ee7a9ff42691b9f783ff1bc5112fe3fca9080"
-  integrity sha512-zdu8XMNEDepKKR+XYOXAVPtWui0ly0NtohUscw+UmaHiAWT8hrV1rr//H6V+0DvJ3OQ19S979M0laLfX8rm82Q==
-  dependencies:
-    is-typedarray "^1.0.0"
-
 types-ramda@^0.29.5:
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/types-ramda/-/types-ramda-0.29.5.tgz#1cb0488d39eb72723a8f95af9b6dfe483e4f34a7"
@@ -15694,10 +15375,10 @@ types-ramda@^0.29.5:
   dependencies:
     ts-toolbelt "^9.6.0"
 
-typescript@^5.1.0:
-  version "5.1.6"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.1.6.tgz#02f8ac202b6dad2c0dd5e0913745b47a37998274"
-  integrity sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA==
+typescript@5.4.2:
+  version "5.4.2"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.4.2.tgz#0ae9cebcfae970718474fe0da2c090cad6577372"
+  integrity sha512-+2/g0Fds1ERlP6JsakQQDXjZdZMM+rqpamFZJEKh4kwTIn3iDkgKtby0CeNd5ATNZ4Ry1ax15TMx0W2V+miizQ==
 
 typescript@^5.2.2:
   version "5.3.3"
@@ -15764,6 +15445,11 @@ unenv@^1.7.4:
     node-fetch-native "^1.4.1"
     pathe "^1.1.1"
 
+unfetch@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/unfetch/-/unfetch-4.2.0.tgz#7e21b0ef7d363d8d9af0fb929a5555f6ef97a3be"
+  integrity sha512-F9p7yYCn6cIW9El1zi0HI6vqpeIvBsr3dSuRO6Xuppb1u5rXpCPmMvLSyECLhybr9isec8Ohl0hPekMVrEinDA==
+
 unicode-canonical-property-names-ecmascript@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz#301acdc525631670d39f6146e0e77ff6bbdebddc"
@@ -15884,15 +15570,15 @@ use-sidecar@^1.1.2:
     detect-node-es "^1.1.0"
     tslib "^2.0.0"
 
-use-sync-external-store@1.2.0, use-sync-external-store@^1.0.0, use-sync-external-store@^1.2.0:
+use-sync-external-store@1.2.0, use-sync-external-store@^1.0.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a"
   integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==
 
-utf-8-validate@^5.0.2:
-  version "5.0.10"
-  resolved "https://registry.yarnpkg.com/utf-8-validate/-/utf-8-validate-5.0.10.tgz#d7d10ea39318171ca982718b6b96a8d2442571a2"
-  integrity sha512-Z6czzLq4u8fPOyx7TU6X3dvUZVvoJmxSQ+IcrlmagKhilxlhZgxPK6C5Jqbkw1IDUmFTM+cz9QDnnLTwDz/2gQ==
+utf-8-validate@^6.0.3:
+  version "6.0.3"
+  resolved "https://registry.yarnpkg.com/utf-8-validate/-/utf-8-validate-6.0.3.tgz#7d8c936d854e86b24d1d655f138ee27d2636d777"
+  integrity sha512-uIuGf9TWQ/y+0Lp+KGZCMuJWc3N9BHA+l/UmHd/oUHwJJDeysyTRxNQVkbzsIWfGFbRe3OcgML/i0mvVRPOyDA==
   dependencies:
     node-gyp-build "^4.3.0"
 
@@ -15931,14 +15617,6 @@ v8-to-istanbul@^9.0.1:
     "@types/istanbul-lib-coverage" "^2.0.1"
     convert-source-map "^1.6.0"
 
-valtio@1.11.0:
-  version "1.11.0"
-  resolved "https://registry.yarnpkg.com/valtio/-/valtio-1.11.0.tgz#c029dcd17a0f99d2fbec933721fe64cfd32a31ed"
-  integrity sha512-65Yd0yU5qs86b5lN1eu/nzcTgQ9/6YnD6iO+DDaDbQLn1Zv2w12Gwk43WkPlUBxk5wL/6cD5YMFf7kj6HZ1Kpg==
-  dependencies:
-    proxy-compare "2.5.1"
-    use-sync-external-store "1.2.0"
-
 valtio@1.11.2:
   version "1.11.2"
   resolved "https://registry.yarnpkg.com/valtio/-/valtio-1.11.2.tgz#b8049c02dfe65620635d23ebae9121a741bb6530"
@@ -15947,26 +15625,17 @@ valtio@1.11.2:
     proxy-compare "2.5.1"
     use-sync-external-store "1.2.0"
 
-valtio@1.12.1:
-  version "1.12.1"
-  resolved "https://registry.yarnpkg.com/valtio/-/valtio-1.12.1.tgz#741f8bd46586f8c4b1a7639b1348252a052b746e"
-  integrity sha512-R0V4H86Xi2Pp7pmxN/EtV4Q6jr6PMN3t1IwxEvKUp6160r8FimvPh941oWyeK1iec/DTsh9Jb3Q+GputMS8SYg==
-  dependencies:
-    derive-valtio "0.1.0"
-    proxy-compare "2.5.1"
-    use-sync-external-store "1.2.0"
-
-viem@1.20.1:
-  version "1.20.1"
-  resolved "https://registry.yarnpkg.com/viem/-/viem-1.20.1.tgz#ea92f9bab2fded4be556be4d4be724805d11780e"
-  integrity sha512-PaYyfuCVkNFzdaVoV8HefMIt5YtjIG6UPqxOz0rYchN52cD05YcRJlO0h/XrehQfo8ib2RSOkZ0ChJ6Adlh1Jg==
+viem@2.9.6:
+  version "2.9.6"
+  resolved "https://registry.yarnpkg.com/viem/-/viem-2.9.6.tgz#66819684e878b6ea659ad9c49a0a864512859190"
+  integrity sha512-VVFWjGQei2wnWTvAB/xrIf22m6flCwxeBr8LnwejXMTSSi1EORWEswrw2lfKTmw3TlRPSG4uSiQMa/d0l0DKRg==
   dependencies:
     "@adraffy/ens-normalize" "1.10.0"
     "@noble/curves" "1.2.0"
     "@noble/hashes" "1.3.2"
     "@scure/bip32" "1.3.2"
     "@scure/bip39" "1.2.1"
-    abitype "0.9.8"
+    abitype "1.0.0"
     isows "1.0.3"
     ws "8.13.0"
 
@@ -15985,6 +15654,20 @@ viem@^1.0.0:
     isomorphic-ws "5.0.0"
     ws "8.12.0"
 
+viem@^1.1.4, viem@^1.20.3:
+  version "1.21.4"
+  resolved "https://registry.yarnpkg.com/viem/-/viem-1.21.4.tgz#883760e9222540a5a7e0339809202b45fe6a842d"
+  integrity sha512-BNVYdSaUjeS2zKQgPs+49e5JKocfo60Ib2yiXOWBT6LuVxY1I/6fFX3waEtpXvL1Xn4qu+BVitVtMh9lyThyhQ==
+  dependencies:
+    "@adraffy/ens-normalize" "1.10.0"
+    "@noble/curves" "1.2.0"
+    "@noble/hashes" "1.3.2"
+    "@scure/bip32" "1.3.2"
+    "@scure/bip39" "1.2.1"
+    abitype "0.9.8"
+    isows "1.0.3"
+    ws "8.13.0"
+
 vite-plugin-svgr@^2.2.2:
   version "2.2.2"
   resolved "https://registry.yarnpkg.com/vite-plugin-svgr/-/vite-plugin-svgr-2.2.2.tgz#c5c9cb573bf455bb079550531847ddc5d2e122af"
@@ -16003,17 +15686,22 @@ vite-tsconfig-paths@^3.5.2:
     recrawl-sync "^2.0.3"
     tsconfig-paths "^4.0.0"
 
-vite@^4.3.9:
-  version "4.3.9"
-  resolved "https://registry.yarnpkg.com/vite/-/vite-4.3.9.tgz#db896200c0b1aa13b37cdc35c9e99ee2fdd5f96d"
-  integrity sha512-qsTNZjO9NoJNW7KnOrgYwczm0WctJ8m/yqYAMAK9Lxt4SoySUfS5S8ia9K7JHpa3KEeMfyF8LoJ3c5NeBJy6pg==
+vite@^4.4.12:
+  version "4.5.2"
+  resolved "https://registry.yarnpkg.com/vite/-/vite-4.5.2.tgz#d6ea8610e099851dad8c7371599969e0f8b97e82"
+  integrity sha512-tBCZBNSBbHQkaGyhGCDUGqeo2ph8Fstyp6FMSvTtsXeZSPpSMGlviAOav2hxVTqFcx8Hj/twtWKsMJXNY0xI8w==
   dependencies:
-    esbuild "^0.17.5"
-    postcss "^8.4.23"
-    rollup "^3.21.0"
+    esbuild "^0.18.10"
+    postcss "^8.4.27"
+    rollup "^3.27.1"
   optionalDependencies:
     fsevents "~2.3.2"
 
+void-elements@3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-3.1.0.tgz#614f7fbf8d801f0bb5f0661f5b2f5785750e4f09"
+  integrity sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==
+
 vscode-languageserver-types@^3.17.1:
   version "3.17.3"
   resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.17.3.tgz#72d05e47b73be93acb84d6e311b5786390f13f64"
@@ -16037,17 +15725,14 @@ w3c-xmlserializer@^3.0.0:
   dependencies:
     xml-name-validator "^4.0.0"
 
-wagmi@1.4.12:
-  version "1.4.12"
-  resolved "https://registry.yarnpkg.com/wagmi/-/wagmi-1.4.12.tgz#e5d31c6d7621ecd9e32eded6c7b1041201223127"
-  integrity sha512-QRxpjhdMlZmbYTfn9VQkQMKq+l3kwA1O7tF10vaykPrjbGX+IIlyn72ib9oqW9BfQO7n/Sf/mnVz1zbxRhGPWA==
+wagmi@2.5.16:
+  version "2.5.16"
+  resolved "https://registry.yarnpkg.com/wagmi/-/wagmi-2.5.16.tgz#42e4be44dd8e96deda10d953b91d13ee3a512758"
+  integrity sha512-nVSx65kGYcjvELJKoe+l1E78zHqtYwfg0nf2HuZkt1gVvqguo+hIQe534hSf1m+ivdtb0MPlwNCvj6K4QJ7FTw==
   dependencies:
-    "@tanstack/query-sync-storage-persister" "^4.27.1"
-    "@tanstack/react-query" "^4.28.0"
-    "@tanstack/react-query-persist-client" "^4.28.0"
-    "@wagmi/core" "1.4.12"
-    abitype "0.8.7"
-    use-sync-external-store "^1.2.0"
+    "@wagmi/connectors" "4.1.22"
+    "@wagmi/core" "2.6.13"
+    use-sync-external-store "1.2.0"
 
 walker@^1.0.8:
   version "1.0.8"
@@ -16236,12 +15921,7 @@ write-file-atomic@^4.0.1:
     imurmurhash "^0.1.4"
     signal-exit "^3.0.7"
 
-ws@7.4.6:
-  version "7.4.6"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-7.4.6.tgz#5654ca8ecdeee47c33a9a4bf6d28e2be2980377c"
-  integrity sha512-YmhHDO4MzaDLB+M9ym/mDA5z0naX8j7SIlT8f8z+I0VtzsRbekxEutHSme7NPS2qE8StCYQNUnfWdXta/Yu85A==
-
-ws@8.12.0, ws@^8.5.0:
+ws@8.12.0:
   version "8.12.0"
   resolved "https://registry.yarnpkg.com/ws/-/ws-8.12.0.tgz#485074cc392689da78e1828a9ff23585e06cddd8"
   integrity sha512-kU62emKIdKVeEIOIKVegvqpXMSTAMLJozpHZaJNDYqBjzlSYXQGviYwN1osDLJ9av68qHd4a2oSjd7yD4pacig==
@@ -16251,12 +15931,12 @@ ws@8.13.0:
   resolved "https://registry.yarnpkg.com/ws/-/ws-8.13.0.tgz#9a9fb92f93cf41512a0735c8f4dd09b8a1211cd0"
   integrity sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==
 
-ws@^7.3.1, ws@^7.4.5, ws@^7.5.1:
+ws@^7.3.1, ws@^7.5.1:
   version "7.5.9"
   resolved "https://registry.yarnpkg.com/ws/-/ws-7.5.9.tgz#54fa7db29f4c7cec68b1ddd3a89de099942bb591"
   integrity sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==
 
-ws@^8.11.0, ws@^8.9.0:
+ws@^8.11.0, ws@^8.9.0, ws@~8.11.0:
   version "8.11.0"
   resolved "https://registry.yarnpkg.com/ws/-/ws-8.11.0.tgz#6a0d36b8edfd9f96d8b25683db2f8d7de6e8e143"
   integrity sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==
@@ -16283,6 +15963,11 @@ xmlchars@^2.2.0:
   resolved "https://registry.yarnpkg.com/xmlchars/-/xmlchars-2.2.0.tgz#060fe1bcb7f9c76fe2a17db86a9bc3ab894210cb"
   integrity sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==
 
+xmlhttprequest-ssl@~2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.0.0.tgz#91360c86b914e67f44dce769180027c0da618c67"
+  integrity sha512-QKxVRxiRACQcVuQEYFsI1hhkrMlrXHPegbbd1yn9UHOmRxY+si12nQYzri3vbzt8VdTTRviqcKxcyllFas5z2A==
+
 xorshift@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/xorshift/-/xorshift-1.2.0.tgz#30a4cdd8e9f8d09d959ed2a88c42a09c660e8148"
@@ -16327,9 +16012,9 @@ yaml@^1.10.0:
   integrity sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==
 
 yaml@^2.1.1:
-  version "2.1.3"
-  resolved "https://registry.yarnpkg.com/yaml/-/yaml-2.1.3.tgz#9b3a4c8aff9821b696275c79a8bee8399d945207"
-  integrity sha512-AacA8nRULjKMX2DvWvOAdBZMOfQlypSFkjcOcu9FalllIDJ1kvlREzcdIZmidQUqqeMv7jorHjq2HlLv/+c2lg==
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/yaml/-/yaml-2.4.1.tgz#2e57e0b5e995292c25c75d2658f0664765210eed"
+  integrity sha512-pIXzoImaqmfOrL7teGUBt/T7ZDnyeGBWyXQBvOVhLkWLN37GXv8NMLK406UY6dS51JfcQHsmcW5cJ441bHg6Lg==
 
 yaml@^2.2.2:
   version "2.3.1"
@@ -16379,7 +16064,7 @@ yargs@^17.3.1:
     y18n "^5.0.5"
     yargs-parser "^21.1.1"
 
-yargs@^17.7.2:
+yargs@^17.5.1, yargs@^17.7.2:
   version "17.7.2"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-17.7.2.tgz#991df39aca675a192b816e1e0363f9d75d2aa269"
   integrity sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==
@@ -16412,9 +16097,9 @@ zod@3.22.4:
   resolved "https://registry.yarnpkg.com/zod/-/zod-3.22.4.tgz#f31c3a9386f61b1f228af56faa9255e845cf3fff"
   integrity sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==
 
-zustand@^4.3.1:
-  version "4.3.8"
-  resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.3.8.tgz#37113df8e9e1421b0be1b2dca02b49b76210e7c4"
-  integrity sha512-4h28KCkHg5ii/wcFFJ5Fp+k1J3gJoasaIbppdgZFO4BPJnsNxL0mQXBSFgOgAdCdBj35aDTPvdAJReTMntFPGg==
+zustand@4.4.1:
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.4.1.tgz#0cd3a3e4756f21811bd956418fdc686877e8b3b0"
+  integrity sha512-QCPfstAS4EBiTQzlaGP1gmorkh/UL1Leaj2tdj+zZCZ/9bm0WS7sI2wnfD5lpOszFqWJ1DcPnGoY8RDL61uokw==
   dependencies:
     use-sync-external-store "1.2.0"