ccv directory mock

src/components/CCIP/Chain/ChainTokenGrid.tsx

@@ -53,8 +53,9 @@ function ChainTokenGrid({ tokens, network, environment }: ChainTokenGridProps) {
                       tokenSymbol: data[key].symbol,
                       tokenDecimals: data[key].decimals,
                       tokenAddress: data[key].tokenAddress,
-                      tokenPoolType: data[key].poolType,
-                      tokenPoolAddress: data[key].poolAddress || "",
+                      tokenPoolType: data[key].pool.type,
+                      tokenPoolAddress: data[key].pool.address || "",
+                      tokenPoolVersion: data[key].pool.version || "",
                       explorer: network.explorer,
                       chainType,
                     }

src/components/CCIP/Drawer/LaneDrawer.tsx

@@ -2,12 +2,11 @@
 import "../Tables/Table.css"
 import { Environment, LaneConfig, LaneFilter, Version } from "~/config/data/ccip/types.ts"
 import { getNetwork, getTokenData } from "~/config/data/ccip/data.ts"
-import { displayCapacity, determineTokenMechanism, isTokenPaused } from "~/config/data/ccip/utils.ts"
+import { determineTokenMechanism } from "~/config/data/ccip/utils.ts"
 import { useState } from "react"
 import LaneDetailsHero from "../ChainHero/LaneDetailsHero.tsx"
 import { getExplorerAddressUrl, getTokenIconUrl, fallbackTokenIconUrl } from "~/features/utils/index.ts"
 import TableSearchInput from "../Tables/TableSearchInput.tsx"
-import RateTooltip from "../Tooltip/RateTooltip.tsx"
 import { Tooltip } from "~/features/common/Tooltip/Tooltip.tsx"
 import { ChainType, ExplorerInfo } from "@config/types.ts"
 
@@ -32,7 +31,7 @@
     chain: destinationNetwork.key,
   })
 
   const sourceNetworkDetails = getNetwork({
     filter: environment,
     chain: sourceNetwork.key,
   })
@@ -63,7 +62,7 @@
         <div className="ccip-table__filters">
           <div>
             <div className="ccip-table__filters-title">
-              Tokens <span>({lane?.supportedTokens ? Object.keys(lane.supportedTokens).length : 0})</span>
+              Tokens <span>({lane?.supportedTokens ? lane.supportedTokens.length : 0})</span>
             </div>
           </div>
           <TableSearchInput search={search} setSearch={setSearch} />
@@ -124,8 +123,8 @@
             </thead>
             <tbody>
               {lane.supportedTokens &&
-                Object.keys(lane.supportedTokens)
-                  ?.filter((token) => token.toLowerCase().includes(search.toLowerCase()))
+                lane.supportedTokens
+                  .filter((token) => token.toLowerCase().includes(search.toLowerCase()))
                   .map((token, index) => {
                     const data = getTokenData({
                       environment,
@@ -135,13 +134,10 @@
                     if (!Object.keys(data).length) return null
                     const logo = getTokenIconUrl(token)
 
-                    // Check if token is paused
-                    const tokenPaused = isTokenPaused(
-                      data[sourceNetwork.key].decimals,
-                      lane.supportedTokens?.[token]?.rateLimiterConfig?.[
-                        inOutbound === LaneFilter.Inbound ? "in" : "out"
-                      ]
-                    )
+                    // TODO: Fetch rate limits from API for both inbound and outbound
+                    // Token pause detection requires rate limiter data from API
+                    // A token is paused when rate limit capacity is 0
+                    const tokenPaused = false
 
                     return (
                       <tr key={index} className={tokenPaused ? "ccip-table__row--paused" : ""}>
@@ -179,35 +175,25 @@
                         <td>
                           {inOutbound === LaneFilter.Outbound
                             ? determineTokenMechanism(
-                                data[sourceNetwork.key].poolType,
-                                data[destinationNetwork.key].poolType
+                                data[sourceNetwork.key].pool.type,
+                                data[destinationNetwork.key].pool.type
                               )
                             : determineTokenMechanism(
-                                data[destinationNetwork.key].poolType,
-                                data[sourceNetwork.key].poolType
+                                data[destinationNetwork.key].pool.type,
+                                data[sourceNetwork.key].pool.type
                               )}
                         </td>
 
                         <td>
-                          {lane.supportedTokens &&
-                            displayCapacity(
-                              data[sourceNetwork.key].decimals,
-                              token,
-                              lane.supportedTokens[token]?.rateLimiterConfig?.[
-                                inOutbound === LaneFilter.Inbound ? "in" : "out"
-                              ]
-                            )}
+                          {/* TODO: Fetch rate limits from API for both inbound and outbound
+                              GET /api/ccip/v1/lanes/by-internal-id/{source}/{destination}/supported-tokens?environment={environment}
+                              Response will contain both standard and custom rate limits per token */}
+                          Disabled
                         </td>
                         <td className="rate-tooltip-cell">
-                          {lane.supportedTokens && (
-                            <RateTooltip
-                              destinationLane={lane.supportedTokens[token]}
-                              inOutbound={inOutbound}
-                              symbol={token}
-                              decimals={data[sourceNetwork.key].decimals}
-                              position="left"
-                            />
-                          )}
+                          {/* TODO: Fetch rate limits from API for both inbound and outbound
+                              Display refill rate from standard.in/out or custom.in/out based on inOutbound filter */}
+                          Disabled
                         </td>
                       </tr>
                     )
@@ -217,8 +203,9 @@
         </div>
         <div className="ccip-table__notFound">
           {lane.supportedTokens &&
-            Object.keys(lane.supportedTokens)?.filter((lane) => lane.toLowerCase().includes(search.toLowerCase()))
-              .length === 0 && <>No tokens found</>}
+            lane.supportedTokens.filter((token) => token.toLowerCase().includes(search.toLowerCase())).length === 0 && (
+              <>No tokens found</>
+            )}
         </div>
       </div>
     </>

src/components/CCIP/Drawer/TokenDrawer.tsx

@@ -8,20 +8,17 @@ import {
   SupportedTokenConfig,
   Version,
   LaneFilter,
-  displayCapacity,
   determineTokenMechanism,
   PoolType,
   getTokenData,
   LaneConfig,
 } from "~/config/data/ccip/index.ts"
-import { isTokenPaused } from "~/config/data/ccip/utils.ts"
 import { useState } from "react"
 import { ChainType, ExplorerInfo, SupportedChain } from "~/config/index.ts"
 import LaneDrawer from "../Drawer/LaneDrawer.tsx"
 import TableSearchInput from "../Tables/TableSearchInput.tsx"
 import Tabs from "../Tables/Tabs.tsx"
 import { Tooltip } from "~/features/common/Tooltip/Tooltip.tsx"
-import RateTooltip from "../Tooltip/RateTooltip.tsx"
 
 function TokenDrawer({
   token,
@@ -84,7 +81,7 @@ function TokenDrawer({
         console.error(`No token data found for ${token.id} on ${network.key} -> ${destinationChain}`)
         return null
       }
-      const destinationPoolType = destinationTokenData.poolType
+      const destinationPoolType = destinationTokenData.pool.type
       if (!destinationPoolType) {
         console.error(`No pool type found for ${token.id} on ${network.key} -> ${destinationChain}`)
         return null
@@ -100,11 +97,11 @@ function TokenDrawer({
         console.error(`No lane data found for ${token.id} on ${network.key} -> ${destinationChain}`)
         return null
       }
-      if (!laneData.supportedTokens) {
+      if (!laneData.supportedTokens || !Array.isArray(laneData.supportedTokens)) {
         console.error(`No supported tokens found for ${token.id} on ${network.key} -> ${destinationChain}`)
         return null
       }
-      if (!(token.id in laneData.supportedTokens)) {
+      if (!laneData.supportedTokens.includes(token.id)) {
         console.error(`${token.id} not found in supported tokens for ${network.key} -> ${destinationChain}`)
         return null
       }
@@ -216,13 +213,10 @@ function TokenDrawer({
                 .map(({ networkDetails, laneData, destinationChain, destinationPoolType }) => {
                   if (!laneData || !networkDetails) return null
 
-                  // Check if token is paused on this lane
-                  const tokenPaused = isTokenPaused(
-                    network.tokenDecimals,
-                    destinationLanes[destinationChain].rateLimiterConfig?.[
-                      inOutbound === LaneFilter.Inbound ? "in" : "out"
-                    ]
-                  )
+                  // TODO: Fetch rate limits from API for both inbound and outbound
+                  // Token pause detection requires rate limiter data from API
+                  // A token is paused when rate limit capacity is 0
+                  const tokenPaused = false
 
                   return (
                     <tr key={networkDetails.name} className={tokenPaused ? "ccip-table__row--paused" : ""}>
@@ -262,21 +256,15 @@ function TokenDrawer({
                         </button>
                       </td>
                       <td>
-                        {displayCapacity(
-                          network.tokenDecimals,
-                          network.tokenSymbol,
-                          destinationLanes[destinationChain].rateLimiterConfig?.[
-                            inOutbound === LaneFilter.Inbound ? "in" : "out"
-                          ]
-                        )}
+                        {/* TODO: Fetch rate limits from API for both inbound and outbound
+                            GET /api/ccip/v1/lanes/by-internal-id/{source}/{destination}/supported-tokens?environment={environment}
+                            Response will contain both standard and custom rate limits per token */}
+                        Disabled
                       </td>
                       <td>
-                        <RateTooltip
-                          destinationLane={destinationLanes[destinationChain]}
-                          inOutbound={inOutbound}
-                          symbol={network.tokenSymbol}
-                          decimals={network.tokenDecimals}
-                        />
+                        {/* TODO: Fetch rate limits from API for both inbound and outbound
+                            Display refill rate from standard.in/out or custom.in/out based on inOutbound filter */}
+                        Disabled
                       </td>
                       <td>
                         {inOutbound === LaneFilter.Outbound

src/components/CCIP/Search/Search.tsx

@@ -273,10 +273,8 @@ function Search({ chains, tokens, small, environment, lanes }: SearchProps) {
                         {lane.sourceNetwork.name} {">"} {lane.destinationNetwork.name}
                         {!small && (
                           <span>
-                            {lane?.lane?.supportedTokens ? Object.keys(lane.lane.supportedTokens).length : 0}{" "}
-                            {lane?.lane?.supportedTokens && Object.keys(lane.lane.supportedTokens).length > 1
-                              ? "tokens"
-                              : "token"}
+                            {lane?.lane?.supportedTokens ? lane.lane.supportedTokens.length : 0}{" "}
+                            {lane?.lane?.supportedTokens && lane.lane.supportedTokens.length > 1 ? "tokens" : "token"}
                           </span>
                         )}
                       </button>

src/components/CCIP/Tables/TokenChainsTable.tsx

@@ -23,6 +23,7 @@ interface TableProps {
     tokenAddress: string
     tokenPoolType: PoolType
     tokenPoolAddress: string
+    tokenPoolVersion: string
     explorer: ExplorerInfo
   }[]
   token: {
@@ -60,6 +61,9 @@ function TokenChainsTable({ networks, token, lanes, environment }: TableProps) {
               <th>Token address</th>
               <th>Token pool type</th>
               <th>Token pool address</th>
+              <th>Pool version</th>
+              <th>Custom finality</th>
+              <th>Min Blocks required</th>
             </tr>
           </thead>
           <tbody>
@@ -139,6 +143,18 @@ function TokenChainsTable({ networks, token, lanes, environment }: TableProps) {
                         endLength={6}
                       />
                     </td>
+                    <td>{network.tokenPoolVersion}</td>
+                    <td>
+                      {/* TODO: Fetch from API - GET /api/ccip/v1/tokens/{tokenCanonicalSymbol}/finality?environment={environment}
+                          Custom finality is derived from minBlockConfirmation > 0
+                          Display: "Yes" | "No" | "N/A" (with tooltip for unavailable) */}
+                      -
+                    </td>
+                    <td>
+                      {/* TODO: Fetch from API - GET /api/ccip/v1/tokens/{tokenCanonicalSymbol}/finality?environment={environment}
+                          Display minBlockConfirmation value or "-" if custom finality is disabled/unavailable */}
+                      -
+                    </td>
                   </tr>
                 )
               })}

src/components/CCIP/Token/Token.astro

@@ -150,8 +150,9 @@ const tokenStructuredData = generateTokenStructuredData(token, environment, chai
               tokenSymbol: data[key]?.symbol ?? "",
               tokenDecimals: data[key]?.decimals ?? 0,
               tokenAddress: data[key]?.tokenAddress ?? "",
-              tokenPoolType: data[key]?.poolType,
-              tokenPoolAddress: data[key]?.poolAddress ?? "",
+              tokenPoolType: data[key]?.pool.type,
+              tokenPoolAddress: data[key]?.pool.address ?? "",
+              tokenPoolVersion: data[key]?.pool.version ?? "",
               explorer: explorer,
               chainType: chainType,
             }

src/config/cdn.ts

@@ -0,0 +1,14 @@
+/**
+ * CDN Base URLs and asset path configuration
+ * Centralized configuration for all CDN-hosted assets
+ */
+
+// CloudFront CDN base URL
+export const CLOUDFRONT_CDN_BASE = "https://d2f70xi62kby8n.cloudfront.net"
+
+// Asset-specific paths
+export const TOKEN_ICONS_PATH = `${CLOUDFRONT_CDN_BASE}/tokens`
+export const VERIFIER_LOGOS_PATH = `${CLOUDFRONT_CDN_BASE}/verifiers`
+
+// Other CDNs (for future centralization if needed)
+export const IMGIX_CDN_BASE = "https://smartcontract.imgix.net"