Merge branch 'main' of github.com:blockscout/frontend into address-entity

.github/workflows/release.yml

@@ -68,3 +68,63 @@ jobs:
             field_value: Released
             issues: ${{ needs.label_released_issues.outputs.issues }}
         secrets: inherit
+
+    # TODO @tom2drum refactor to reusable workflow
+    publish_image:
+        name: Publish Docker image
+        runs-on: ubuntu-latest
+        outputs:
+            shortSha: ${{ steps.output-step.outputs.short-sha }}
+            tags: ${{ steps.meta.outputs.tags }}
+        steps:
+            -   name: Check out the repo
+                uses: actions/checkout@v3
+    
+            -   name: Inject slug/short variables
+                uses: rlespinasse/github-slug-action@v4.4.1
+    
+            -   name: Set up Docker Buildx
+                uses: docker/setup-buildx-action@v2
+    
+            # 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
+                with:
+                    images: ghcr.io/blockscout/frontend
+    
+            -   name: Login to GitHub Container Registry
+                uses: docker/login-action@v2
+                with:
+                    registry: ghcr.io
+                    username: ${{ github.actor }}
+                    password: ${{ secrets.GITHUB_TOKEN }}
+    
+            -   name: Add SHORT_SHA env property with commit short sha
+                run: echo "SHORT_SHA=`echo ${GITHUB_SHA} | cut -c1-8`" >> $GITHUB_ENV
+
+            -   name: Debug
+                env:
+                    REF_TYPE: ${{ github.ref_type }}
+                    REF_NAME: ${{ github.ref_name }}
+                run: |
+                    echo "ref_type: $REF_TYPE"
+                    echo "ref_name: $REF_NAME"
+    
+            -   name: Add outputs
+                run: |
+                    echo "::set-output name=short-sha::${{ env.GITHUB_EVENT_PULL_REQUEST_HEAD_SHA_SHORT }}"
+                id: output-step
+    
+            -   name: Build and push
+                uses: docker/build-push-action@v3
+                with:
+                    context: .
+                    file: ./Dockerfile
+                    push: true
+                    cache-from: type=gha
+                    tags: ${{ steps.meta.outputs.tags }}
+                    labels: ${{ steps.meta.outputs.labels }}
+                    build-args: |
+                        GIT_COMMIT_SHA=${{ env.SHORT_SHA }}
+                        GIT_TAG=${{ github.ref_type == 'tag' && github.ref_name || '' }}

.vscode/tasks.json

@@ -320,6 +320,7 @@
               "eth_goerli",
               "eth",
               "rootstock",
+              "polygon",
               "localhost",
             ],
             "default": "main"

configs/app/ui/views/block.ts

@@ -5,6 +5,7 @@ import { getEnvValue, parseEnvJson } from 'configs/app/utils';
 export const BLOCK_FIELDS_IDS = [
   'burnt_fees',
   'total_reward',
+  'nonce',
 ] as const;
 
 export type BlockFieldId = ArrayElement<typeof BLOCK_FIELDS_IDS>;

configs/envs/.env.polygon

+# Set of ENVs for Ethereum network explorer
+# https://polygon.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=Polygon
+NEXT_PUBLIC_NETWORK_SHORT_NAME=Polygon
+NEXT_PUBLIC_NETWORK_ID=137
+NEXT_PUBLIC_NETWORK_CURRENCY_NAME=MATIC
+NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=MATIC
+NEXT_PUBLIC_NETWORK_CURRENCY_DECIMALS=18
+NEXT_PUBLIC_NETWORK_VERIFICATION_TYPE=validation
+NEXT_PUBLIC_NETWORK_RPC_URL=https://polygon.blockpi.network/v1/rpc/public
+
+# api configuration
+NEXT_PUBLIC_API_HOST=polygon.blockscout.com
+NEXT_PUBLIC_API_BASE_PATH=/
+
+# ui config
+## homepage
+NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs']
+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)"
+## 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/polygon.svg
+NEXT_PUBLIC_NETWORK_ICON=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/polygon-short.svg
+## footer
+## views
+## misc
+
+# app features
+NEXT_PUBLIC_APP_INSTANCE=local
+NEXT_PUBLIC_APP_ENV=development
+# NEXT_PUBLIC_GRAPHIQL_TRANSACTION=0x97fa753626b8d44011d0b9f9a947c735f20b6e895efdee49d7cda76a50001017
+NEXT_PUBLIC_API_SPEC_URL=https://raw.githubusercontent.com/blockscout/blockscout-api-v2-swagger/main/swagger.yaml
+NEXT_PUBLIC_HAS_BEACON_CHAIN=false
+# NEXT_PUBLIC_STATS_API_HOST=https://stats-rsk-testnet.k8s.blockscout.com
+NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.services.blockscout.com
+NEXT_PUBLIC_WEB3_WALLETS=['token_pocket','metamask']
\ No newline at end of file

configs/envs/.env.rootstock

@@ -31,7 +31,7 @@ NEXT_PUBLIC_NETWORK_ICON=https://raw.githubusercontent.com/blockscout/frontend-c
 ## footer
 NEXT_PUBLIC_FOOTER_LINKS=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/footer-links/rootstock.json
 ## views
-NEXT_PUBLIC_VIEWS_BLOCK_HIDDEN_FIELDS=['burnt_fees','total_reward']
+NEXT_PUBLIC_VIEWS_BLOCK_HIDDEN_FIELDS=['burnt_fees','total_reward','nonce']
 ## misc
 
 # app features

docs/ENVS.md

@@ -146,6 +146,7 @@ The app version shown in the footer is derived from build-time ENV variables `NE
 | --- | --- |
 | `burnt_fees` | Burnt fees |
 | `total_reward` | Total block reward |
+| `nonce` | Block nonce |
 
  
 

icons/block_slim.svg

 <svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path d="M9.83 0 1 5.03v10.267l6.825 3.976-.034-1.67-5.421-3.175V6.8l6.757 3.818V19.6L9.84 20l.736-.401v-8.98L17.323 6.8v7.628l-5.388 3.108v1.67l6.858-3.834V5.029L9.829 0Zm0 9.415L3.238 5.531l6.59-3.877 6.75 3.877-6.75 3.884Zm-5.082 3.767 1.32-.752-.112-.196-1.32.752.112.196ZM7.06 11.86l1.32-.752-.113-.196-1.32.752.113.196Zm2.868-3.527V6.821h-.226v1.512h.226Zm0-2.636v-1.52h-.226v1.52h.226Zm0-2.534v-1.52h-.226v1.52h.226Zm2.854 8.51-1.31-.76-.114.195 1.311.76.114-.196Zm2.287 1.322-1.32-.76-.113.195 1.32.76.113-.195Zm-12.654 1.52 1.311-.751-.112-.196-1.311.751.112.196Zm14.979-.198-1.311-.76-.114.195 1.311.76.114-.195Z" fill="currentColor"/>
+  <path d="M9.83 0 1 5.03v10.267l6.825 3.976-.034-1.67-5.421-3.175V6.8l6.757 3.818V19.6l.713.4.736-.401v-8.98L17.323 6.8v7.628l-5.388 3.108v1.67l6.858-3.834V5.029L9.829 0Zm0 9.415L3.238 5.531l6.59-3.877 6.75 3.877-6.75 3.884Zm-5.082 3.767 1.32-.752-.112-.196-1.32.752.112.196ZM7.06 11.86l1.32-.752-.113-.196-1.32.752.113.196Zm2.868-3.527V6.821h-.226v1.512h.226Zm0-2.636v-1.52h-.226v1.52h.226Zm0-2.534v-1.52h-.226v1.52h.226Zm2.854 8.51-1.31-.76-.114.195 1.311.76.114-.196Zm2.287 1.322-1.32-.76-.113.195 1.32.76.113-.195Zm-12.654 1.52 1.311-.751-.112-.196-1.311.751.112.196Zm14.979-.198-1.311-.76-.114.195 1.311.76.114-.195Z" fill="currentColor"/>
 </svg>

icons/contract.svg

 <svg viewBox="0 0 20 22" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path fill-rule="evenodd" clip-rule="evenodd" d="M3.392 1.45c.252-.288.592-.45.948-.45h8.038a.63.63 0 0 1 .474.225L17.54 6.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 19.461V2.538c0-.408.141-.799.392-1.087Zm.948 1.088h6.87v4.497c0 .388.315.702.702.702h4.485v11.725H4.34V2.538Zm8.274.59 2.791 3.205h-2.791V3.128ZM6.5 11a.5.5 0 0 0 0 1h7.2a.5.5 0 0 0 0-1H6.5ZM6 13.9a.5.5 0 0 1 .5-.5h7.2a.5.5 0 1 1 0 1H6.5a.5.5 0 0 1-.5-.5Zm4.5 2.1a.5.5 0 0 0 0 1h3.2a.5.5 0 0 0 0-1h-3.2Z" fill="currentColor"/>
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M3.28 1.352A1.408 1.408 0 0 1 4.34.85h8.038a.78.78 0 0 1 .587.276l4.689 5.385a.98.98 0 0 1 .233.642v12.308c0 .442-.153.869-.43 1.187a1.408 1.408 0 0 1-1.06.502H4.34c-.403 0-.783-.184-1.06-.502a1.811 1.811 0 0 1-.43-1.187V2.538c0-.442.153-.869.43-1.186Zm1.06-.202c-.308 0-.61.14-.834.399-.226.259-.356.615-.356.99V19.46c0 .375.13.73.356.99.225.258.526.399.834.399h12.057c.309 0 .61-.14.834-.4.226-.259.356-.614.356-.989V7.153a.68.68 0 0 0-.16-.445L12.74 1.323a.48.48 0 0 0-.36-.173h-8.04Zm7.02 1.238v4.647c0 .304.248.551.552.551h4.635v12.025H4.19V2.388h7.17Zm-6.87.3v16.623h11.757V7.886h-4.335a.852.852 0 0 1-.852-.851V2.688H4.49Zm7.974.039 3.27 3.756h-3.27V2.727Zm.3.801v2.655h2.312l-2.312-2.655ZM6.5 11.15a.35.35 0 1 0 0 .7h7.2a.35.35 0 1 0 0-.7H6.5Zm-.65.35a.65.65 0 0 1 .65-.65h7.2a.65.65 0 1 1 0 1.3H6.5a.65.65 0 0 1-.65-.65Zm0 2.4a.65.65 0 0 1 .65-.65h7.2a.65.65 0 1 1 0 1.3H6.5a.65.65 0 0 1-.65-.65Zm.65-.35a.35.35 0 1 0 0 .7h7.2a.35.35 0 1 0 0-.7H6.5Zm4 2.6a.35.35 0 1 0 0 .7h3.2a.35.35 0 1 0 0-.7h-3.2Zm-.65.35a.65.65 0 0 1 .65-.65h3.2a.65.65 0 1 1 0 1.3h-3.2a.65.65 0 0 1-.65-.65Z" fill="currentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M3.28 1.352A1.408 1.408 0 0 1 4.34.85h8.038a.78.78 0 0 1 .587.276l4.689 5.385a.98.98 0 0 1 .233.642v12.308c0 .442-.153.869-.43 1.187a1.408 1.408 0 0 1-1.06.502H4.34c-.403 0-.783-.184-1.06-.502a1.811 1.811 0 0 1-.43-1.187V2.538c0-.442.153-.869.43-1.186Zm1.06-.202c-.308 0-.61.14-.834.399a1.511 1.511 0 0 0-.356.99V19.46c0 .375.13.73.356.99.225.258.526.399.834.399h12.057c.309 0 .61-.14.834-.4.226-.259.356-.614.356-.989V7.153a.68.68 0 0 0-.16-.445L12.74 1.323a.48.48 0 0 0-.36-.173H4.34Zm7.02 1.238v4.647c0 .304.248.551.552.551h4.635v12.025H4.19V2.388h7.17Zm-6.87.3v16.623h11.757V7.886h-4.335a.852.852 0 0 1-.852-.851V2.688H4.49Zm7.974.039 3.27 3.756h-3.27V2.727Zm.3.801v2.655h2.312l-2.312-2.655ZM6.5 11.15a.35.35 0 1 0 0 .7h7.2a.35.35 0 1 0 0-.7H6.5Zm-.65.35a.65.65 0 0 1 .65-.65h7.2a.65.65 0 1 1 0 1.3H6.5a.65.65 0 0 1-.65-.65Zm0 2.4a.65.65 0 0 1 .65-.65h7.2a.65.65 0 1 1 0 1.3H6.5a.65.65 0 0 1-.65-.65Zm.65-.35a.35.35 0 1 0 0 .7h7.2a.35.35 0 1 0 0-.7H6.5Zm4 2.6a.35.35 0 1 0 0 .7h3.2a.35.35 0 1 0 0-.7h-3.2Zm-.65.35a.65.65 0 0 1 .65-.65h3.2a.65.65 0 1 1 0 1.3h-3.2a.65.65 0 0 1-.65-.65Z" fill="currentColor"/>
 </svg>

icons/transactions_slim.svg

 <svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M17.77 7.794H.987a.97.97 0 0 1-.549-.17 1.009 1.009 0 0 1-.364-.453 1.041 1.041 0 0 1 .218-1.106l3.722-3.827a.97.97 0 0 1 1.333.06 1.033 1.033 0 0 1 .058 1.37L3.371 5.764H17.77c.262 0 .513.107.698.297.185.19.29.449.29.718 0 .269-.105.527-.29.717a.973.973 0 0 1-.698.297ZM2.23 12.066h16.783c.195 0 .386.059.549.17.162.11.289.269.364.454a1.042 1.042 0 0 1-.218 1.106l-3.737 3.842-.006.007a.99.99 0 0 1-.711.354.963.963 0 0 1-.736-.296 1.017 1.017 0 0 1-.289-.757 1.04 1.04 0 0 1 .345-.731l.007-.007 2.047-2.112H2.23a.973.973 0 0 1-.698-.298 1.03 1.03 0 0 1-.29-.717c0-.27.105-.527.29-.718a.974.974 0 0 1 .698-.297Z" fill="currentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M17.77 7.794H.987a.97.97 0 0 1-.549-.17 1.009 1.009 0 0 1-.364-.453 1.041 1.041 0 0 1 .218-1.106l3.722-3.827a.97.97 0 0 1 1.333.06 1.033 1.033 0 0 1 .058 1.37L3.371 5.764H17.77c.262 0 .513.107.698.297a1.031 1.031 0 0 1 0 1.435.973.973 0 0 1-.698.297ZM2.23 12.066h16.783c.195 0 .386.059.549.17.162.11.289.269.364.454a1.042 1.042 0 0 1-.218 1.106l-3.737 3.842-.006.007a.99.99 0 0 1-.711.354.963.963 0 0 1-.736-.296 1.017 1.017 0 0 1-.289-.757 1.04 1.04 0 0 1 .345-.731l.007-.007 2.047-2.112H2.23a.973.973 0 0 1-.698-.298 1.03 1.03 0 0 1-.29-.717c0-.27.105-.527.29-.718a.974.974 0 0 1 .698-.297Z" fill="currentColor"/>
 </svg>

icons/txn_batches_slim.svg

 <svg viewBox="0 0 20 22" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M13.013 21H2.035a.626.626 0 0 1-.625-.625V4.749c0-.345.28-.625.625-.625h2.85V1.625c0-.345.279-.625.624-.625h7.853c.008 0 .014.002.021.004l.018.004a.6.6 0 0 1 .186.04.616.616 0 0 1 .208.126l4.603 4.414-.002.002a.622.622 0 0 1 .194.45v9.733c0 1.16-.943 2.103-2.102 2.103h-1.372v1.021c0 1.16-.944 2.103-2.103 2.103Zm3.764-15.586-2.79-2.69v1.838c0 .47.382.852.852.852h1.938Zm-3.673-3.531H5.767v15.11h11.089c.469 0 .851-.382.851-.852V6.297H14.84c-1.16 0-1.735-.575-1.735-1.735v-2.68Zm-8.22 3.124H2.293v15.11H13.38c.47 0 .852-.75.852-1.22v-1.02H5.509a.625.625 0 0 1-.625-.626V5.007Zm10.182 4.866a.418.418 0 1 0 0-.836H9.568l.54-.542a.418.418 0 0 0-.302-.69c-.105-.004-.226-.068-.306 0L8.172 9.103c-.06.058-.007.191-.024.272a.418.418 0 0 0 .178.43c.069.045.137.157.22.157l6.52-.088Zm-.013 1.377H8.545c-.11 0-.217.05-.295.129-.079.078-.123.265-.123.376a.418.418 0 0 0 .418.418h5.498l-.54.542a.417.417 0 0 0 .12.707.415.415 0 0 0 .47-.118l1.347-1.218c.059-.058.007-.169.023-.25a.417.417 0 0 0-.178-.43c-.068-.045-.15-.156-.232-.156Z" fill="currentColor"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M13.013 21H2.035a.626.626 0 0 1-.625-.625V4.749c0-.345.28-.625.625-.625h2.85V1.625c0-.345.279-.625.624-.625h7.853c.008 0 .014.002.021.004l.018.004a.6.6 0 0 1 .186.04.616.616 0 0 1 .208.126l4.603 4.414-.002.002a.622.622 0 0 1 .194.45v9.733c0 1.16-.943 2.103-2.102 2.103h-1.372v1.021c0 1.16-.944 2.103-2.103 2.103Zm3.764-15.586-2.79-2.69v1.838c0 .47.382.852.852.852h1.938Zm-3.673-3.531H5.767v15.11h11.089a.852.852 0 0 0 .851-.852V6.297H14.84c-1.16 0-1.735-.575-1.735-1.735v-2.68Zm-8.22 3.124H2.293v15.11H13.38c.47 0 .852-.75.852-1.22v-1.02H5.509a.625.625 0 0 1-.625-.626V5.007Zm10.182 4.866a.418.418 0 1 0 0-.836H9.568l.54-.542a.418.418 0 0 0-.302-.69c-.105-.004-.226-.068-.306 0L8.172 9.103c-.06.058-.007.191-.024.272a.418.418 0 0 0 .178.43c.069.045.137.157.22.157l6.52-.088Zm-.013 1.377H8.545c-.11 0-.217.05-.295.129-.079.078-.123.265-.123.376a.418.418 0 0 0 .418.418h5.498l-.54.542a.417.417 0 0 0 .12.707.415.415 0 0 0 .47-.118l1.347-1.218c.059-.058.007-.169.023-.25a.417.417 0 0 0-.178-.43c-.068-.045-.15-.156-.232-.156Z" fill="currentColor"/>
   <path fill-rule="evenodd" clip-rule="evenodd" d="M4.784 1.625c0-.4.325-.725.725-.725h7.853c.023 0 .042.006.048.008h.001a.705.705 0 0 1 .205.044h.002l.044.016a.72.72 0 0 1 .202.134l4.677 4.485-.007.007a.717.717 0 0 1 .156.446v9.733a2.205 2.205 0 0 1-2.202 2.203h-1.272v.921a2.205 2.205 0 0 1-2.203 2.203H2.035a.726.726 0 0 1-.725-.725V4.749c0-.4.325-.725.725-.725h2.75V1.625ZM18.255 5.59l-4.53-4.344a.518.518 0 0 0-.167-.103l-.026-.008a.492.492 0 0 0-.136-.027m4.86 4.482-.003.002.074.07c.1.097.163.23.163.378v9.733a2.005 2.005 0 0 1-2.002 2.003h-1.472v1.121a2.005 2.005 0 0 1-2.003 2.003H2.035a.526.526 0 0 1-.525-.525V4.749c0-.29.235-.525.525-.525h2.95V1.625c0-.29.234-.525.524-.525h7.846m-7.688.683h7.537v2.78c0 .564.14.968.403 1.231.264.263.668.403 1.232.403h2.968v9.944a.953.953 0 0 1-.951.952H5.667V1.783Zm.2.2v14.91h10.989a.753.753 0 0 0 .751-.752V6.397H14.84c-.595 0-1.059-.147-1.373-.462-.314-.314-.462-.778-.462-1.373v-2.58H5.867Zm8.02.505 3.138 3.026h-2.186a.953.953 0 0 1-.952-.952V2.488Zm.2.471v1.603c0 .415.337.752.752.752h1.69L14.087 2.96ZM2.193 4.907h2.791V17.25c0 .29.235.525.525.525h8.824v1.121c0 .257-.103.58-.265.84-.16.254-.399.48-.687.48H2.193V4.907Zm.2.2v14.91H13.38c.18 0 .368-.148.517-.387.146-.234.235-.52.235-.733v-.92H5.509a.725.725 0 0 1-.725-.726V5.107H2.393Zm7.193 2.872L8.334 9.231a.32.32 0 0 0-.07.347.318.318 0 0 0 .294.195h6.508a.318.318 0 0 0 0-.636H9.327l.707-.71a.319.319 0 0 0-.448-.448Zm-.133-.15a.518.518 0 0 1 .73.731l-.004.006-.37.37h5.257a.518.518 0 0 1 0 1.037H8.56m-.366-.884a.518.518 0 0 0 .366.884m.894-2.143-1.26 1.26 1.26-1.26Zm-.908 3.607a.318.318 0 1 0 0 .636h5.739l-.715.718a.319.319 0 0 0 .09.537.319.319 0 0 0 .358-.089l.005-.006 1.255-1.254a.318.318 0 0 0-.047-.489.318.318 0 0 0-.177-.053H8.545Zm-.366-.048a.518.518 0 0 1 .366-.152h6.508m.365.883a.518.518 0 0 0-.365-.883m.365.883-1.251 1.252a.518.518 0 1 1-.732-.73l.367-.369H8.545a.518.518 0 0 1-.366-.884" fill="currentColor"/>
 </svg>

lib/api/resources.ts

@@ -40,7 +40,7 @@ import type { L2TxnBatchesResponse } from 'types/api/l2TxnBatches';
 import type { L2WithdrawalsResponse } from 'types/api/l2Withdrawals';
 import type { LogsResponseTx, LogsResponseAddress } from 'types/api/log';
 import type { RawTracesResponse } from 'types/api/rawTrace';
-import type { SearchRedirectResult, SearchResult, SearchResultFilters } from 'types/api/search';
+import type { SearchRedirectResult, SearchResult, SearchResultFilters, SearchResultItem } from 'types/api/search';
 import type { Counters, StatsCharts, StatsChart, HomeStats } from 'types/api/stats';
 import type {
   TokenCounters,
@@ -420,6 +420,10 @@ export const RESOURCES = {
   },
 
   // SEARCH
+  quick_search: {
+    path: '/api/v2/search/quick',
+    filterFields: [ 'q' ],
+  },
   search: {
     path: '/api/v2/search',
     filterFields: [ 'q' ],
@@ -597,6 +601,7 @@ Q extends 'token_instance_transfers' ? TokenInstanceTransferResponse :
 Q extends 'token_instance_holders' ? TokenHolders :
 Q extends 'token_inventory' ? TokenInventoryResponse :
 Q extends 'tokens' ? TokensResponse :
+Q extends 'quick_search' ? Array<SearchResultItem> :
 Q extends 'search' ? SearchResult :
 Q extends 'search_check_redirect' ? SearchRedirectResult :
 Q extends 'contract' ? SmartContract :

lib/date/dayjs.ts

@@ -18,7 +18,9 @@ const relativeTimeConfig = {
     { l: 'h', r: 1 },
     { l: 'hh', r: 23, d: 'hour' },
     { l: 'd', r: 1 },
-    { l: 'dd', r: 29, d: 'day' },
+    { l: 'dd', r: 6, d: 'day' },
+    { l: 'w', r: 1 },
+    { l: 'ww', r: 4, d: 'week' },
     { l: 'M', r: 1 },
     { l: 'MM', r: 11, d: 'month' },
     { l: 'y', r: 17 },
@@ -38,20 +40,22 @@ dayjs.updateLocale('en', {
     llll: `MMM DD YYYY HH:mm:ss A (Z${ nbsp }UTC)`,
   },
   relativeTime: {
-    s: 'a sec',
-    ss: '%d secs',
+    s: '1s',
+    ss: '%ds',
     future: 'in %s',
     past: '%s ago',
-    m: '1 min',
-    mm: '%d mins',
-    h: '1 h',
-    hh: '%d h',
-    d: '1 d',
-    dd: '%d d',
-    M: '1 mo',
-    MM: '%d mo',
-    y: '1 y',
-    yy: '%d y',
+    m: '1m',
+    mm: '%dm',
+    h: '1h',
+    hh: '%dh',
+    d: '1d',
+    dd: '%dd',
+    w: '1w',
+    ww: '%dw',
+    M: '1mo',
+    MM: '%dmo',
+    y: '1y',
+    yy: '%dy',
   },
 });
 

mocks/search/index.ts

@@ -11,6 +11,7 @@ export const token1: SearchResultToken = {
   token_type: 'ERC-721',
   total_supply: '10000001',
   exchange_rate: null,
+  is_verified_via_admin_panel: true,
   is_smart_contract_verified: true,
 };
 
@@ -25,6 +26,7 @@ export const token2: SearchResultToken = {
   token_type: 'ERC-20',
   total_supply: '10000001',
   exchange_rate: '1.11',
+  is_verified_via_admin_panel: false,
   is_smart_contract_verified: false,
 };
 

playwright/utils/configs.ts

@@ -23,7 +23,7 @@ export const featureEnvs = {
 export const viewsEnvs = {
   block: {
     hiddenFields: [
-      { name: 'NEXT_PUBLIC_VIEWS_BLOCK_HIDDEN_FIELDS', value: '["burnt_fees", "total_reward"]' },
+      { name: 'NEXT_PUBLIC_VIEWS_BLOCK_HIDDEN_FIELDS', value: '["burnt_fees", "total_reward", "nonce"]' },
     ],
   },
 };

stubs/search.ts

@@ -10,6 +10,7 @@ export const SEARCH_RESULT_ITEM: SearchResultItem = {
   token_url: '/token/0x3714A8C7824B22271550894f7555f0a672f97809',
   type: 'token',
   icon_url: null,
+  is_verified_via_admin_panel: false,
   is_smart_contract_verified: false,
   exchange_rate: '1.11',
   total_supply: null,

types/api/search.ts

@@ -13,6 +13,7 @@ export interface SearchResultToken {
   token_type: TokenType;
   exchange_rate: string | null;
   total_supply: string | null;
+  is_verified_via_admin_panel: boolean;
   is_smart_contract_verified: boolean;
 }
 

ui/address/AddressBlocksValidated.tsx

@@ -94,7 +94,8 @@ const AddressBlocksValidated = ({ scrollRef }: Props) => {
               <Th width="17%">Age</Th>
               <Th width="16%">Txn</Th>
               <Th width="25%">Gas used</Th>
-              <Th width="25%" isNumeric>Reward { config.chain.currency.symbol }</Th>
+              { !config.UI.views.block.hiddenFields?.total_reward &&
+              <Th width="25%" isNumeric>Reward { config.chain.currency.symbol }</Th> }
             </Tr>
           </Thead>
           <Tbody>

ui/address/blocksValidated/AddressBlocksValidatedListItem.tsx

@@ -48,10 +48,12 @@ const AddressBlocksValidatedListItem = (props: Props) => {
           isLoading={ props.isLoading }
         />
       </Flex>
-      <Flex columnGap={ 2 } w="100%">
-        <Skeleton isLoaded={ !props.isLoading } fontWeight={ 500 } flexShrink={ 0 }>Reward { config.chain.currency.symbol }</Skeleton>
-        <Skeleton isLoaded={ !props.isLoading } color="text_secondary">{ totalReward.toFixed() }</Skeleton>
-      </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 } color="text_secondary">{ totalReward.toFixed() }</Skeleton>
+        </Flex>
+      ) }
     </ListItemMobile>
   );
 };

ui/address/blocksValidated/AddressBlocksValidatedTableItem.tsx

@@ -4,6 +4,7 @@ import React from 'react';
 
 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 BlockEntity from 'ui/shared/entities/block/BlockEntity';
@@ -52,11 +53,13 @@ const AddressBlocksValidatedTableItem = (props: Props) => {
           />
         </Flex>
       </Td>
-      <Td isNumeric display="flex" justifyContent="end">
-        <Skeleton isLoaded={ !props.isLoading } display="inline-block">
-          <span>{ totalReward.toFixed() }</span>
-        </Skeleton>
-      </Td>
+      { !config.UI.views.block.hiddenFields?.total_reward && (
+        <Td isNumeric display="flex" justifyContent="end">
+          <Skeleton isLoaded={ !props.isLoading } display="inline-block">
+            <span>{ totalReward.toFixed() }</span>
+          </Skeleton>
+        </Td>
+      ) }
     </Tr>
   );
 };

ui/block/BlockDetails.tsx

@@ -479,7 +479,7 @@ const BlockDetails = ({ query }: Props) => {
           >
             <Text wordBreak="break-all" whiteSpace="break-spaces">{ data.state_root }</Text>
           </DetailsInfoItem> */ }
-          { config.chain.verificationType !== 'validation' && (
+          { config.chain.verificationType !== 'validation' && !config.UI.views.block.hiddenFields?.nonce && (
             <DetailsInfoItem
               title="Nonce"
               hint="Block nonce is a value used during mining to demonstrate proof of work for a block"

ui/home/LatestBlocks.tsx

@@ -25,18 +25,18 @@ const BLOCK_HEIGHT_L2 = 112;
 const BLOCK_MARGIN = 12;
 
 const LatestBlocks = () => {
-  const blockHeight = config.features.rollup.isEnabled ? BLOCK_HEIGHT_L2 : BLOCK_HEIGHT_L1;
+  const blockHeight = config.features.rollup.isEnabled || config.UI.views.block.hiddenFields?.total_reward ? BLOCK_HEIGHT_L2 : BLOCK_HEIGHT_L1;
   const isMobile = useIsMobile();
   // const blocksMaxCount = isMobile ? 2 : 3;
   let blocksMaxCount: number;
-  if (config.features.rollup.isEnabled) {
+  if (config.features.rollup.isEnabled || config.UI.views.block.hiddenFields?.total_reward) {
     blocksMaxCount = isMobile ? 4 : 5;
   } else {
     blocksMaxCount = isMobile ? 2 : 3;
   }
   const { data, isPlaceholderData, isError } = useApiQuery('homepage_blocks', {
     queryOptions: {
-      placeholderData: Array(4).fill(BLOCK),
+      placeholderData: Array(blocksMaxCount).fill(BLOCK),
     },
   });
 

ui/home/LatestBlocksItem.tsx

@@ -61,7 +61,7 @@ const LatestBlocksItem = ({ block, h, isLoading }: Props) => {
       <Grid gridGap={ 2 } templateColumns="auto minmax(0, 1fr)" fontSize="sm">
         <Skeleton isLoaded={ !isLoading }>Txn</Skeleton>
         <Skeleton isLoaded={ !isLoading } color="text_secondary"><span>{ block.tx_count }</span></Skeleton>
-        { !config.features.rollup.isEnabled && (
+        { !config.features.rollup.isEnabled && !config.UI.views.block.hiddenFields?.nonce && (
           <>
             <Skeleton isLoaded={ !isLoading }>Reward</Skeleton>
             <Skeleton isLoaded={ !isLoading } color="text_secondary"><span>{ totalReward.toFixed() }</span></Skeleton>

ui/pages/SearchResults.tsx

@@ -21,7 +21,7 @@ import useSearchQuery from 'ui/snippets/searchBar/useSearchQuery';
 
 const SearchResultsPageContent = () => {
   const router = useRouter();
-  const { query, redirectCheckQuery, searchTerm, debouncedSearchTerm, handleSearchTermChange } = useSearchQuery(true);
+  const { query, redirectCheckQuery, searchTerm, debouncedSearchTerm, handleSearchTermChange } = useSearchQuery();
   const { data, isError, isPlaceholderData, pagination } = query;
   const [ showContent, setShowContent ] = React.useState(false);
 

ui/searchResults/SearchResultListItem.tsx

@@ -7,6 +7,7 @@ import { route } from 'nextjs-routes';
 
 import labelIcon from 'icons/publictags.svg';
 import iconSuccess from 'icons/status/success.svg';
+import verifiedToken from 'icons/verified_token.svg';
 import dayjs from 'lib/date/dayjs';
 import highlightText from 'lib/highlightText';
 import * as mixpanel from 'lib/mixpanel/index';
@@ -47,7 +48,7 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
         const name = data.name + (data.symbol ? ` (${ data.symbol })` : '');
 
         return (
-          <Flex alignItems="flex-start" flexGrow={ 1 } overflow="hidden">
+          <Flex alignItems="center" overflow="hidden">
             <TokenEntity.Icon token={ data } isLoading={ isLoading }/>
             <LinkInternal
               href={ route({ pathname: '/token/[hash]', query: { hash: data.address } }) }
@@ -66,6 +67,7 @@ const SearchResultListItem = ({ data, searchTerm, isLoading }: Props) => {
                 textOverflow="ellipsis"
               />
             </LinkInternal>
+            { data.is_verified_via_admin_panel && <Icon as={ verifiedToken } boxSize={ 4 } ml={ 1 } color="green.500"/> }
           </Flex>
         );
       }

ui/searchResults/SearchResultTableItem.tsx

@@ -7,6 +7,7 @@ import { route } from 'nextjs-routes';
 
 import labelIcon from 'icons/publictags.svg';
 import iconSuccess from 'icons/status/success.svg';
+import verifiedToken from 'icons/verified_token.svg';
 import dayjs from 'lib/date/dayjs';
 import highlightText from 'lib/highlightText';
 import * as mixpanel from 'lib/mixpanel/index';
@@ -66,6 +67,7 @@ const SearchResultTableItem = ({ data, searchTerm, isLoading }: Props) => {
                     dangerouslySetInnerHTML={{ __html: highlightText(name, searchTerm) }}
                   />
                 </LinkInternal>
+                { data.is_verified_via_admin_panel && <Icon as={ verifiedToken } boxSize={ 4 } ml={ 1 } color="green.500"/> }
               </Flex>
             </Td>
             <Td fontSize="sm" verticalAlign="middle">

ui/snippets/footer/Footer.tsx

@@ -24,7 +24,7 @@ import getApiVersionUrl from './utils/getApiVersionUrl';
 
 const MAX_LINKS_COLUMNS = 3;
 
-// const FRONT_VERSION_URL = `https://github.com/blockscout/frontend/tree/${ config.UI.footer.frontendVersion }`;
+const FRONT_VERSION_URL = `https://github.com/blockscout/frontend/tree/${ config.UI.footer.frontendVersion }`;
 
 const Footer = () => {
 
@@ -113,8 +113,7 @@ const Footer = () => {
           ) }
           { (config.UI.footer.frontendVersion || config.UI.footer.frontendCommit) && (
             <Text fontSize="xs">
-              { /* Frontend: <Link href={ FRONT_VERSION_URL } target="_blank">{ config.UI.footer.frontendVersion }</Link> */ }
-                Frontend: { [ config.UI.footer.frontendVersion, config.UI.footer.frontendCommit ].filter(Boolean).join('+') }
+              Frontend: <Link href={ FRONT_VERSION_URL } target="_blank">{ config.UI.footer.frontendVersion }</Link>
             </Text>
           ) }
         </VStack>

ui/snippets/searchBar/SearchBar.pw.tsx

@@ -30,15 +30,13 @@ test.beforeEach(async({ page }) => {
 });
 
 test('search by token name  +@mobile +@dark-mode', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + '?q=o';
+  const API_URL = buildApiUrl('quick_search') + '?q=o';
   await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.token1,
-        searchMock.token2,
-      ],
-    }),
+    body: JSON.stringify([
+      searchMock.token1,
+      searchMock.token2,
+    ]),
   }));
 
   await mount(
@@ -53,14 +51,12 @@ test('search by token name  +@mobile +@dark-mode', async({ mount, page }) => {
 });
 
 test('search by contract name  +@mobile +@dark-mode', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + '?q=o';
+  const API_URL = buildApiUrl('quick_search') + '?q=o';
   await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.contract1,
-      ],
-    }),
+    body: JSON.stringify([
+      searchMock.contract1,
+    ]),
   }));
 
   await mount(
@@ -75,16 +71,14 @@ test('search by contract name  +@mobile +@dark-mode', async({ mount, page }) =>
 });
 
 test('search by name homepage +@dark-mode', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + '?q=o';
+  const API_URL = buildApiUrl('quick_search') + '?q=o';
   await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.token1,
-        searchMock.token2,
-        searchMock.contract1,
-      ],
-    }),
+    body: JSON.stringify([
+      searchMock.token1,
+      searchMock.token2,
+      searchMock.contract1,
+    ]),
   }));
 
   await mount(
@@ -101,14 +95,12 @@ test('search by name homepage +@dark-mode', async({ mount, page }) => {
 });
 
 test('search by tag  +@mobile +@dark-mode', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + '?q=o';
+  const API_URL = buildApiUrl('quick_search') + '?q=o';
   await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.label1,
-      ],
-    }),
+    body: JSON.stringify([
+      searchMock.label1,
+    ]),
   }));
 
   await mount(
@@ -123,14 +115,12 @@ test('search by tag  +@mobile +@dark-mode', async({ mount, page }) => {
 });
 
 test('search by address hash +@mobile', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + `?q=${ searchMock.address1.address }`;
+  const API_URL = buildApiUrl('quick_search') + `?q=${ searchMock.address1.address }`;
   await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.address1,
-      ],
-    }),
+    body: JSON.stringify([
+      searchMock.address1,
+    ]),
   }));
 
   await mount(
@@ -145,14 +135,12 @@ test('search by address hash +@mobile', async({ mount, page }) => {
 });
 
 test('search by block number +@mobile', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + `?q=${ searchMock.block1.block_number }`;
-  await page.route(buildApiUrl('search') + `?q=${ searchMock.block1.block_number }`, (route) => route.fulfill({
+  const API_URL = buildApiUrl('quick_search') + `?q=${ searchMock.block1.block_number }`;
+  await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.block1,
-      ],
-    }),
+    body: JSON.stringify([
+      searchMock.block1,
+    ]),
   }));
 
   await mount(
@@ -167,14 +155,12 @@ test('search by block number +@mobile', async({ mount, page }) => {
 });
 
 test('search by block hash +@mobile', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + `?q=${ searchMock.block1.block_hash }`;
-  await page.route(buildApiUrl('search') + `?q=${ searchMock.block1.block_hash }`, (route) => route.fulfill({
+  const API_URL = buildApiUrl('quick_search') + `?q=${ searchMock.block1.block_hash }`;
+  await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.block1,
-      ],
-    }),
+    body: JSON.stringify([
+      searchMock.block1,
+    ]),
   }));
 
   await mount(
@@ -189,14 +175,12 @@ test('search by block hash +@mobile', async({ mount, page }) => {
 });
 
 test('search by tx hash +@mobile', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + `?q=${ searchMock.tx1.tx_hash }`;
-  await page.route(buildApiUrl('search') + `?q=${ searchMock.tx1.tx_hash }`, (route) => route.fulfill({
+  const API_URL = buildApiUrl('quick_search') + `?q=${ searchMock.tx1.tx_hash }`;
+  await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.tx1,
-      ],
-    }),
+    body: JSON.stringify([
+      searchMock.tx1,
+    ]),
   }));
 
   await mount(
@@ -211,17 +195,15 @@ test('search by tx hash +@mobile', async({ mount, page }) => {
 });
 
 test('search with view all link', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + '?q=o';
+  const API_URL = buildApiUrl('quick_search') + '?q=o';
   await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.token1,
-        searchMock.token2,
-        searchMock.contract1,
-      ],
-      next_page_params: { foo: 'bar' },
-    }),
+    body: JSON.stringify([
+      searchMock.token1,
+      searchMock.token2,
+      searchMock.contract1,
+      ...Array(47).fill(searchMock.contract1),
+    ]),
   }));
 
   await mount(
@@ -237,25 +219,23 @@ test('search with view all link', async({ mount, page }) => {
 });
 
 test('scroll suggest to category', async({ mount, page }) => {
-  const API_URL = buildApiUrl('search') + '?q=o';
+  const API_URL = buildApiUrl('quick_search') + '?q=o';
   await page.route(API_URL, (route) => route.fulfill({
     status: 200,
-    body: JSON.stringify({
-      items: [
-        searchMock.token1,
-        searchMock.token2,
-        searchMock.contract1,
-        searchMock.token1,
-        searchMock.token2,
-        searchMock.contract1,
-        searchMock.token1,
-        searchMock.token2,
-        searchMock.contract1,
-        searchMock.token1,
-        searchMock.token2,
-        searchMock.contract1,
-      ],
-    }),
+    body: JSON.stringify([
+      searchMock.token1,
+      searchMock.token2,
+      searchMock.contract1,
+      searchMock.token1,
+      searchMock.token2,
+      searchMock.contract1,
+      searchMock.token1,
+      searchMock.token2,
+      searchMock.contract1,
+      searchMock.token1,
+      searchMock.token2,
+      searchMock.contract1,
+    ]),
   }));
 
   await mount(
@@ -287,15 +267,12 @@ test.describe('with apps', () => {
   const MARKETPLACE_CONFIG_URL = 'https://localhost:3000/marketplace-config.json';
 
   test('default view +@mobile', async({ mount, page }) => {
-    const API_URL = buildApiUrl('search') + '?q=o';
+    const API_URL = buildApiUrl('quick_search') + '?q=o';
     await page.route(API_URL, (route) => route.fulfill({
       status: 200,
-      body: JSON.stringify({
-        items: [
-          searchMock.token1,
-        ],
-        next_page_params: { foo: 'bar' },
-      }),
+      body: JSON.stringify([
+        searchMock.token1,
+      ]),
     }));
 
     await page.route(MARKETPLACE_CONFIG_URL, (route) => route.fulfill({

ui/snippets/searchBar/SearchBar.tsx

@@ -15,7 +15,7 @@ import LinkInternal from 'ui/shared/LinkInternal';
 import SearchBarInput from './SearchBarInput';
 import SearchBarRecentKeywords from './SearchBarRecentKeywords';
 import SearchBarSuggest from './SearchBarSuggest/SearchBarSuggest';
-import useSearchQuery from './useSearchQuery';
+import useQuickSearchQuery from './useQuickSearchQuery';
 
 type Props = {
   isHomepage?: boolean;
@@ -34,7 +34,7 @@ const SearchBar = ({ isHomepage }: Props) => {
 
   const recentSearchKeywords = getRecentSearchKeywords();
 
-  const { searchTerm, debouncedSearchTerm, handleSearchTermChange, query, pathname } = useSearchQuery();
+  const { searchTerm, debouncedSearchTerm, handleSearchTermChange, query, pathname } = useQuickSearchQuery();
 
   const handleSubmit = React.useCallback((event: FormEvent<HTMLFormElement>) => {
     event.preventDefault();
@@ -160,7 +160,7 @@ const SearchBar = ({ isHomepage }: Props) => {
             ) }
           </Box>
         </PopoverBody>
-        { searchTerm.trim().length > 0 && query.data?.next_page_params && (
+        { searchTerm.trim().length > 0 && query.data && query.data.length >= 50 && (
           <PopoverFooter>
             <LinkInternal
               href={ route({ pathname: '/search-results', query: { q: searchTerm } }) }

ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggest.tsx

 import { Box, Tab, TabList, Tabs, Text, useColorModeValue } from '@chakra-ui/react';
+import type { UseQueryResult } from '@tanstack/react-query';
 import throttle from 'lodash/throttle';
 import React from 'react';
 import { scroller, Element } from 'react-scroll';
 
+import type { SearchResultItem } from 'types/api/search';
+
+import type { ResourceError } from 'lib/api/resources';
 import useIsMobile from 'lib/hooks/useIsMobile';
 import useMarketplaceApps from 'ui/marketplace/useMarketplaceApps';
 import TextAd from 'ui/shared/ad/TextAd';
 import ContentLoader from 'ui/shared/ContentLoader';
-import type { QueryWithPagesResult } from 'ui/shared/pagination/useQueryWithPages';
 import type { ApiCategory, ItemsCategoriesMap } from 'ui/shared/search/utils';
 import { getItemCategory, searchCategories } from 'ui/shared/search/utils';
 
@@ -15,7 +18,7 @@ import SearchBarSuggestApp from './SearchBarSuggestApp';
 import SearchBarSuggestItem from './SearchBarSuggestItem';
 
 interface Props {
-  query: QueryWithPagesResult<'search'>;
+  query: UseQueryResult<Array<SearchResultItem>, ResourceError<unknown>>;
   searchTerm: string;
   onItemClick: (event: React.MouseEvent<HTMLAnchorElement>) => void;
   containerId: string;
@@ -33,7 +36,7 @@ const SearchBarSuggest = ({ query, searchTerm, onItemClick, containerId }: Props
 
   const handleScroll = React.useCallback(() => {
     const container = document.getElementById(containerId);
-    if (!container || !query.data?.items.length) {
+    if (!container || !query.data?.length) {
       return;
     }
     const topLimit = container.getBoundingClientRect().y + (tabsRef.current?.clientHeight || 0) + 24;
@@ -47,7 +50,7 @@ const SearchBarSuggest = ({ query, searchTerm, onItemClick, containerId }: Props
         break;
       }
     }
-  }, [ containerId, query.data?.items ]);
+  }, [ containerId, query.data ]);
 
   React.useEffect(() => {
     const container = document.getElementById(containerId);
@@ -63,11 +66,11 @@ const SearchBarSuggest = ({ query, searchTerm, onItemClick, containerId }: Props
   }, [ containerId, handleScroll ]);
 
   const itemsGroups = React.useMemo(() => {
-    if (!query.data?.items && !marketplaceApps.displayedApps) {
+    if (!query.data && !marketplaceApps.displayedApps) {
       return {};
     }
     const map: Partial<ItemsCategoriesMap> = {};
-    query.data?.items.forEach(item => {
+    query.data?.forEach(item => {
       const cat = getItemCategory(item) as ApiCategory;
       if (cat) {
         if (cat in map) {
@@ -81,7 +84,7 @@ const SearchBarSuggest = ({ query, searchTerm, onItemClick, containerId }: Props
       map.app = marketplaceApps.displayedApps;
     }
     return map;
-  }, [ query.data?.items, marketplaceApps.displayedApps ]);
+  }, [ query.data, marketplaceApps.displayedApps ]);
 
   const scrollToCategory = React.useCallback((index: number) => () => {
     setTabIndex(index);
@@ -104,7 +107,7 @@ const SearchBarSuggest = ({ query, searchTerm, onItemClick, containerId }: Props
       return <Text>Something went wrong. Try refreshing the page or come back later.</Text>;
     }
 
-    if (!query.data.items || query.data.items.length === 0) {
+    if (!query.data || query.data.length === 0) {
       return <Text>No results found.</Text>;
     }
 

ui/snippets/searchBar/SearchBarSuggest/SearchBarSuggestToken.tsx

@@ -4,6 +4,7 @@ import React from 'react';
 import type { SearchResultToken } from 'types/api/search';
 
 import iconSuccess from 'icons/status/success.svg';
+import verifiedToken from 'icons/verified_token.svg';
 import highlightText from 'lib/highlightText';
 import * as TokenEntity from 'ui/shared/entities/token/TokenEntity';
 import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic';
@@ -16,6 +17,7 @@ interface Props {
 
 const SearchBarSuggestToken = ({ data, isMobile, searchTerm }: Props) => {
   const icon = <TokenEntity.Icon token={ data }/>;
+  const verifiedIcon = <Icon as={ verifiedToken } boxSize={ 4 } color="green.500" ml={ 1 }/>;
   const name = (
     <Text
       fontWeight={ 700 }
@@ -50,6 +52,7 @@ const SearchBarSuggestToken = ({ data, isMobile, searchTerm }: Props) => {
         <Flex alignItems="center">
           { icon }
           { name }
+          { data.is_verified_via_admin_panel && verifiedIcon }
         </Flex>
         <Grid templateColumns={ templateCols } alignItems="center" gap={ 2 }>
           <Flex alignItems="center" overflow="hidden">
@@ -67,6 +70,7 @@ const SearchBarSuggestToken = ({ data, isMobile, searchTerm }: Props) => {
       <Flex alignItems="center">
         { icon }
         { name }
+        { data.is_verified_via_admin_panel && verifiedIcon }
       </Flex>
       <Flex alignItems="center" overflow="hidden">
         { address }

ui/snippets/searchBar/useQuickSearchQuery.tsx

+import { useRouter } from 'next/router';
+import React from 'react';
+
+import useApiQuery from 'lib/api/useApiQuery';
+import useDebounce from 'lib/hooks/useDebounce';
+
+export default function useQuickSearchQuery() {
+  const router = useRouter();
+
+  const [ searchTerm, setSearchTerm ] = React.useState('');
+
+  const debouncedSearchTerm = useDebounce(searchTerm, 300);
+  const pathname = router.pathname;
+
+  const query = useApiQuery('quick_search', {
+    queryParams: { q: debouncedSearchTerm },
+    queryOptions: { enabled: debouncedSearchTerm.trim().length > 0 },
+  });
+
+  const redirectCheckQuery = useApiQuery('search_check_redirect', {
+    // on pages with regular search bar we check redirect on every search term change
+    // in order to prepend its result to suggest list since this resource is much faster than regular search
+    queryParams: { q: debouncedSearchTerm },
+    queryOptions: { enabled: Boolean(debouncedSearchTerm) },
+  });
+
+  return React.useMemo(() => ({
+    searchTerm,
+    debouncedSearchTerm,
+    handleSearchTermChange: setSearchTerm,
+    query,
+    redirectCheckQuery,
+    pathname,
+  }), [ debouncedSearchTerm, pathname, query, redirectCheckQuery, searchTerm ]);
+}

ui/snippets/searchBar/useSearchQuery.tsx

@@ -9,10 +9,10 @@ import { SEARCH_RESULT_ITEM, SEARCH_RESULT_NEXT_PAGE_PARAMS } from 'stubs/search
 import { generateListStub } from 'stubs/utils';
 import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
 
-export default function useSearchQuery(isSearchPage = false) {
+export default function useSearchQuery() {
   const router = useRouter();
   const q = React.useRef(getQueryParamString(router.query.q));
-  const initialValue = isSearchPage ? q.current : '';
+  const initialValue = q.current;
 
   const [ searchTerm, setSearchTerm ] = React.useState(initialValue);
 
@@ -24,24 +24,18 @@ export default function useSearchQuery(isSearchPage = false) {
     filters: { q: debouncedSearchTerm },
     options: {
       enabled: debouncedSearchTerm.trim().length > 0,
-      placeholderData: isSearchPage ?
-        generateListStub<'search'>(SEARCH_RESULT_ITEM, 50, { next_page_params: SEARCH_RESULT_NEXT_PAGE_PARAMS }) :
-        undefined,
+      placeholderData: generateListStub<'search'>(SEARCH_RESULT_ITEM, 50, { next_page_params: SEARCH_RESULT_NEXT_PAGE_PARAMS }),
     },
   });
 
   const redirectCheckQuery = useApiQuery('search_check_redirect', {
     // on search result page we check redirect only once on mount
-    // on pages with regular search bar we check redirect on every search term change
-    // in order to prepend its result to suggest list since this resource is much faster than regular search
-    queryParams: { q: isSearchPage ? q.current : debouncedSearchTerm },
-    queryOptions: { enabled: Boolean(isSearchPage ? q.current : debouncedSearchTerm) },
+    queryParams: { q: q.current },
+    queryOptions: { enabled: Boolean(q.current) },
   });
 
   useUpdateValueEffect(() => {
-    if (isSearchPage) {
-      query.onFilterChange({ q: debouncedSearchTerm });
-    }
+    query.onFilterChange({ q: debouncedSearchTerm });
   }, debouncedSearchTerm);
 
   return React.useMemo(() => ({