From 4506c56393bca61dcf74e37f7c4ea68bbe92ea32 Mon Sep 17 00:00:00 2001 From: tom Date: Wed, 11 Feb 2026 16:07:43 +0100 Subject: [PATCH 1/2] Rollups: move layer numbering to the ENV Resolves #2554 --- configs/app/features/rollup.ts | 2 + .../envs-validator/schemas/features/rollup.ts | 13 ++++ .../tools/envs-validator/test/.env.optimism | 3 +- deploy/tools/llms-txt-generator/index.ts | 21 ++++--- docs/ENVS.md | 7 ++- lib/hooks/useNavItems.tsx | 5 +- lib/metadata/templates/title.ts | 7 ++- lib/rollups/utils.ts | 37 ++++++++++++ ui/block/BlockDetails.tsx | 24 +++++--- .../OptimisticDepositsListItem.tsx | 9 +-- .../optimisticL2/OptimisticDepositsTable.tsx | 9 +-- .../scrollL2/ScrollL2DepositsListItem.tsx | 7 ++- .../scrollL2/ScrollL2DepositsTable.tsx | 7 ++- ui/deposits/shibarium/DepositsListItem.tsx | 7 ++- ui/deposits/shibarium/DepositsTable.tsx | 7 ++- .../zkEvmL2/ZkEvmL2DepositsListItem.tsx | 7 ++- ui/deposits/zkEvmL2/ZkEvmL2DepositsTable.tsx | 7 ++- .../OptimisticL2DisputeGamesListItem.tsx | 3 +- .../OptimisticL2DisputeGamesTable.tsx | 3 +- ui/home/Stats.tsx | 3 +- ui/home/Transactions.tsx | 5 +- ui/home/latestDeposits/LatestDeposits.tsx | 9 +-- ui/home/latestDeposits/LatestDepositsItem.tsx | 9 +-- ui/messages/ArbitrumL2Messages.tsx | 5 +- ui/messages/ArbitrumL2MessagesListItem.tsx | 7 ++- ui/messages/ArbitrumL2MessagesTable.tsx | 7 ++- .../OptimisticL2OutputRootsListItem.tsx | 7 ++- .../OptimisticL2OutputRootsTable.tsx | 7 ++- ui/pages/ArbitrumL2TxnWithdrawals.tsx | 5 +- ui/pages/OptimisticL2Deposits.tsx | 3 +- ui/pages/OptimisticL2OutputRoots.tsx | 3 +- ui/pages/OptimisticL2Withdrawals.tsx | 3 +- ui/pages/ScrollL2Deposits.tsx | 3 +- ui/pages/ScrollL2Withdrawals.tsx | 3 +- ui/pages/ShibariumDeposits.tsx | 3 +- ui/pages/ShibariumWithdrawals.tsx | 3 +- ui/pages/ZkEvmL2Deposits.tsx | 3 +- ui/pages/ZkEvmL2Withdrawals.tsx | 3 +- ui/shared/statusTag/ZkEvmL2TxnBatchStatus.tsx | 20 +++++-- .../statusTag/ZkSyncL2TxnBatchStatus.tsx | 6 +- ui/tx/details/TxDetailsInterop.tsx | 5 +- .../TxDetailsWithdrawalStatusArbitrum.tsx | 3 +- ui/tx/details/TxInfo.tsx | 59 +++++++++++-------- ui/tx/details/TxInfoScrollFees.tsx | 19 +++--- .../arbitrumL2/ArbitrumL2TxnBatchDetails.tsx | 15 ++--- .../ArbitrumL2TxnBatchesListItem.tsx | 7 ++- .../arbitrumL2/ArbitrumL2TxnBatchesTable.tsx | 7 ++- .../OptimisticL2TxnBatchBlobCallData.tsx | 3 +- .../OptimisticL2TxnBatchBlobCelestia.tsx | 3 +- .../OptimisticL2TxnBatchBlobEigenda.tsx | 3 +- .../OptimisticL2TxnBatchBlobEip4844.tsx | 3 +- .../OptimisticL2TxnBatchDetails.tsx | 7 ++- .../OptimisticL2TxnBatchesListItem.tsx | 5 +- .../OptimisticL2TxnBatchesTable.tsx | 5 +- .../scrollL2/ScrollL2TxnBatchDetails.tsx | 18 +++--- .../zkEvmL2/ZkEvmL2TxnBatchDetails.tsx | 7 ++- .../zkSyncL2/ZkSyncL2TxnBatchDetails.tsx | 17 ++++-- .../zkSyncL2/ZkSyncL2TxnBatchHashesInfo.tsx | 7 ++- .../OptimisticL2WithdrawalsListItem.tsx | 5 +- .../OptimisticL2WithdrawalsTable.tsx | 5 +- .../scrollL2/ScrollL2WithdrawalsListItem.tsx | 7 ++- .../scrollL2/ScrollL2WithdrawalsTable.tsx | 7 ++- .../shibarium/WithdrawalsListItem.tsx | 7 ++- ui/withdrawals/shibarium/WithdrawalsTable.tsx | 7 ++- .../zkEvmL2/ZkEvmL2WithdrawalsListItem.tsx | 5 +- .../zkEvmL2/ZkEvmL2WithdrawalsTable.tsx | 5 +- 66 files changed, 347 insertions(+), 196 deletions(-) create mode 100644 lib/rollups/utils.ts diff --git a/configs/app/features/rollup.ts b/configs/app/features/rollup.ts index bb37e5c713..ca64bcd91c 100644 --- a/configs/app/features/rollup.ts +++ b/configs/app/features/rollup.ts @@ -32,6 +32,7 @@ const title = 'Rollup (L2) chain'; const config: Feature<{ type: RollupType; stageIndex: string | undefined; + layerNumber: number; homepage: { showLatestBlocks: boolean }; outputRootsEnabled: boolean; interopEnabled: boolean; @@ -50,6 +51,7 @@ const config: Feature<{ isEnabled: true, type, stageIndex: getEnvValue('NEXT_PUBLIC_ROLLUP_STAGE_INDEX'), + layerNumber: Number(getEnvValue('NEXT_PUBLIC_ROLLUP_LAYER_NUMBER') ?? 2), L2WithdrawalUrl: type === 'optimistic' ? L2WithdrawalUrl : undefined, outputRootsEnabled: type === 'optimistic' && getEnvValue('NEXT_PUBLIC_ROLLUP_OUTPUT_ROOTS_ENABLED') === 'true', interopEnabled: type === 'optimistic' && getEnvValue('NEXT_PUBLIC_INTEROP_ENABLED') === 'true', diff --git a/deploy/tools/envs-validator/schemas/features/rollup.ts b/deploy/tools/envs-validator/schemas/features/rollup.ts index 2764501324..175c3e96eb 100644 --- a/deploy/tools/envs-validator/schemas/features/rollup.ts +++ b/deploy/tools/envs-validator/schemas/features/rollup.ts @@ -169,4 +169,17 @@ export const rollupSchema = yup value => value === undefined, ), }), + NEXT_PUBLIC_ROLLUP_LAYER_NUMBER: yup.number() + .positive() + .integer() + .min(2) + .when('NEXT_PUBLIC_ROLLUP_TYPE', { + is: (value: string) => Boolean(value), + then: (schema) => schema, + otherwise: (schema) => schema.test( + 'not-exist', + 'NEXT_PUBLIC_ROLLUP_LAYER_NUMBER can only be used with NEXT_PUBLIC_ROLLUP_TYPE', + value => value === undefined, + ), + }), }); \ No newline at end of file diff --git a/deploy/tools/envs-validator/test/.env.optimism b/deploy/tools/envs-validator/test/.env.optimism index 491a54a811..0a21caefa0 100644 --- a/deploy/tools/envs-validator/test/.env.optimism +++ b/deploy/tools/envs-validator/test/.env.optimism @@ -6,4 +6,5 @@ NEXT_PUBLIC_ROLLUP_HOMEPAGE_SHOW_LATEST_BLOCKS=true NEXT_PUBLIC_ROLLUP_OUTPUT_ROOTS_ENABLED=false NEXT_PUBLIC_ROLLUP_PARENT_CHAIN={'baseUrl':'https://explorer.duckchain.io'} NEXT_PUBLIC_INTEROP_ENABLED=true -NEXT_PUBLIC_ROLLUP_STAGE_INDEX=1 \ No newline at end of file +NEXT_PUBLIC_ROLLUP_STAGE_INDEX=1 +NEXT_PUBLIC_ROLLUP_LAYER_NUMBER=5 \ No newline at end of file diff --git a/deploy/tools/llms-txt-generator/index.ts b/deploy/tools/llms-txt-generator/index.ts index 2c7c200b64..d6a2d754e8 100644 --- a/deploy/tools/llms-txt-generator/index.ts +++ b/deploy/tools/llms-txt-generator/index.ts @@ -3,6 +3,7 @@ import { writeFileSync } from 'node:fs'; import { dirname, resolve as resolvePath } from 'node:path'; import { fileURLToPath } from 'node:url'; import dedent from 'dedent'; +import { layerLabels } from 'lib/rollups/utils'; const currentFilePath = fileURLToPath(import.meta.url); const currentDir = dirname(currentFilePath); @@ -20,6 +21,8 @@ function run() { const rollupFeature = config.features.rollup; const parentChainUrl = rollupFeature.isEnabled ? rollupFeature.parentChain.baseUrl : undefined; + const currentToParentLayerLabel = rollupFeature.isEnabled ? layerLabels.current + '→' + layerLabels.parent : undefined; + const parentToCurrentLayerLabel = rollupFeature.isEnabled ? layerLabels.parent + '→' + layerLabels.current : undefined; const validatorsFeature = config.features.validators; @@ -106,19 +109,19 @@ function run() { curl --request GET --url '${ generalApiUrl }/api/v2/blocks/arbitrum-batch/{batch_number}' \`\`\` - ### Get L1→L2 messages + ### Get ${ parentToCurrentLayerLabel } messages \`\`\`bash curl --request GET --url '${ generalApiUrl }/api/v2/arbitrum/messages/to-rollup' \`\`\` - ### Get L2→L1 messages + ### Get ${ currentToParentLayerLabel } messages \`\`\`bash curl --request GET --url '${ generalApiUrl }/api/v2/arbitrum/messages/from-rollup' \`\`\` - ### L2→L1 messages by transaction: + ### ${ currentToParentLayerLabel } messages by transaction: \`\`\`bash curl --request GET --url '${ generalApiUrl }/api/v2/arbitrum/messages/withdrawals/{transactions_hash}' @@ -150,13 +153,13 @@ function run() { curl --request GET --url '${ generalApiUrl }/api/v2/optimism/games' \`\`\` - ### Get L1→L2 messages + ### Get ${ parentToCurrentLayerLabel } messages \`\`\`bash curl --request GET --url '${ generalApiUrl }/api/v2/optimism/deposits' \`\`\` - ### Get L2→L1 messages + ### Get ${ currentToParentLayerLabel } messages \`\`\`bash curl --request GET --url '${ generalApiUrl }/api/v2/optimism/withdrawals' @@ -294,13 +297,13 @@ function run() { curl --request GET --url '${ generalApiUrl }/api/v2/blocks/scroll-batch/{batch_number}' \`\`\` - ### Deposits (L1→L2) + ### Deposits (${ parentToCurrentLayerLabel }) \`\`\`bash curl --request GET --url '${ generalApiUrl }/api/v2/scroll/deposits' \`\`\` - ### Withdrawals (L2→L1) + ### Withdrawals (${ currentToParentLayerLabel }) \`\`\`bash curl --request GET --url '${ generalApiUrl }/api/v2/scroll/withdrawals' @@ -308,13 +311,13 @@ function run() { ` : undefined; const SHIBARIUM_CHAIN_TEMPLATE = rollupFeature.isEnabled && rollupFeature.type === 'shibarium' ? ` - ### Deposits (L1→L2) + ### Deposits (${ parentToCurrentLayerLabel }) \`\`\`bash curl --request GET --url '${ generalApiUrl }/api/v2/shibarium/deposits' \`\`\` - ### Withdrawals (L2→L1) + ### Withdrawals (${ currentToParentLayerLabel }) \`\`\`bash curl --request GET --url '${ generalApiUrl }/api/v2/shibarium/withdrawals' diff --git a/docs/ENVS.md b/docs/ENVS.md index 43c4a8dd83..a14111e636 100644 --- a/docs/ENVS.md +++ b/docs/ENVS.md @@ -528,8 +528,9 @@ Ads are enabled by default on all self-hosted instances. If you would like to di | Variable | Type| Description | Compulsoriness | Default value | Example value | Version | | --- | --- | --- | --- | --- | --- | --- | | NEXT_PUBLIC_ROLLUP_TYPE | `'optimistic' \| 'arbitrum' \| 'shibarium' \| 'zkEvm' \| 'zkSync' \| 'scroll'` | Rollup chain type | Required | - | `'optimistic'` | v1.24.0+ | -| NEXT_PUBLIC_ROLLUP_L1_BASE_URL | `string` | Blockscout base URL for L1 network. **DEPRECATED** _Use `NEXT_PUBLIC_ROLLUP_PARENT_CHAIN` instead_ | Required | - | `'http://eth-goerli.blockscout.com'` | v1.24.0+ | -| NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL | `string` | URL for L2 -> L1 withdrawals (Optimistic stack only) | - | - | `https://app.optimism.io/bridge/withdraw` | v1.24.0+ | +| NEXT_PUBLIC_ROLLUP_L1_BASE_URL | `string` | Blockscout base URL for parent network. **DEPRECATED** _Use `NEXT_PUBLIC_ROLLUP_PARENT_CHAIN` instead_ | Required | - | `'http://eth-goerli.blockscout.com'` | v1.24.0+ | +| NEXT_PUBLIC_ROLLUP_L2_WITHDRAWAL_URL | `string` | URL for rollup to parent chain withdrawals (Optimistic stack only) | - | - | `https://app.optimism.io/bridge/withdraw` | v1.24.0+ | +| NEXT_PUBLIC_ROLLUP_LAYER_NUMBER | `number` | Layer number of the rollup | - | `2` | `3` | upcoming | | NEXT_PUBLIC_ROLLUP_STAGE_INDEX | `1 \| 2` | Reflects the maturity and decentralization level of the chain based on [L2BEAT's framework](https://medium.com/l2beat/introducing-stages-a-framework-to-evaluate-rollups-maturity-d290bb22befe). The label will be added to the sidebar according to the provided stage index. Not applicable for testnets. | - | - | `1` | v2.1.0+ | | NEXT_PUBLIC_FAULT_PROOF_ENABLED | `boolean` | Set to `true` for chains with fault proof system enabled (Optimistic stack only) | - | - | `true` | v1.31.0+ | | NEXT_PUBLIC_HAS_MUD_FRAMEWORK | `boolean` | Set to `true` for instances that use MUD framework (Optimistic stack only) | - | - | `true` | v1.33.0+ | @@ -545,7 +546,7 @@ Ads are enabled by default on all self-hosted instances. If you would like to di | Variable | Type| Description | Compulsoriness | Default value | Example value | | --- | --- | --- | --- | --- | --- | | id | `number` | Chain id, see [https://chainlist.org](https://chainlist.org) for the reference. | - | - | `42` | -| name | `string` | Displayed name of the chain. Set to customize L1 transaction status labels in the UI (e.g., "Sent to "). Currently, this setting is applicable only for Arbitrum-based chains. | - | - | `DuckChain` | +| name | `string` | Displayed name of the chain. Set to customize parent chain transaction status labels in the UI (e.g., "Sent to "). Currently, this setting is applicable only for Arbitrum-based chains. | - | - | `DuckChain` | | baseUrl | `string` | Base url of the chain explorer. | Required | - | `https://explorer.duckchain.io` | | rpcUrls | `Array` | Chain public RPC server urls, see [https://chainlist.org](https://chainlist.org) for the reference. | - | - | `['https://rpc.duckchain.io']` | | currency | `{ name: string; symbol: string; decimals: number; }` | Chain currency config. | - | - | `{ name: Quack, symbol: QUA, decimals: 18 }` | diff --git a/lib/hooks/useNavItems.tsx b/lib/hooks/useNavItems.tsx index f510851ced..ed60fc5b4e 100644 --- a/lib/hooks/useNavItems.tsx +++ b/lib/hooks/useNavItems.tsx @@ -4,6 +4,7 @@ import React from 'react'; import type { NavItemInternal, NavItem, NavGroupItem } from 'types/client/navigation'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { rightLineArrow } from 'toolkit/utils/htmlEntities'; const marketplaceFeature = config.features.marketplace; @@ -98,13 +99,13 @@ export default function useNavItems(): ReturnType { isActive: pathname === '/validators' || pathname === '/validators/[id]', } : null; const rollupDeposits = { - text: `Deposits (L1${ rightLineArrow }L2)`, + text: `Deposits (${ layerLabels.parent }${ rightLineArrow }${ layerLabels.current })`, nextRoute: { pathname: '/deposits' as const }, icon: 'navigation/deposits', isActive: pathname === '/deposits', }; const rollupWithdrawals = { - text: `Withdrawals (L2${ rightLineArrow }L1)`, + text: `Withdrawals (${ layerLabels.current }${ rightLineArrow }${ layerLabels.parent })`, nextRoute: { pathname: '/withdrawals' as const }, icon: 'navigation/withdrawals', isActive: pathname === '/withdrawals', diff --git a/lib/metadata/templates/title.ts b/lib/metadata/templates/title.ts index cfaf0b71e2..c48b35aedb 100644 --- a/lib/metadata/templates/title.ts +++ b/lib/metadata/templates/title.ts @@ -3,6 +3,7 @@ import { getFeaturePayload } from 'configs/app/features/types'; import type { Route } from 'nextjs-routes'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; const dappEntityName = (getFeaturePayload(config.features.marketplace)?.titles.entity_name ?? '').toLowerCase(); @@ -43,15 +44,15 @@ const TEMPLATE_MAP: Record = { '/account/verified-addresses': '%network_name% - my verified addresses', '/public-tags/submit': '%network_name% - public tag requests', '/withdrawals': '%network_name% withdrawals - track on %network_name% explorer', - '/txn-withdrawals': '%network_name% L2 to L1 message relayer', + '/txn-withdrawals': `${ layerLabels.current } to ${ layerLabels.parent } message relayer`, '/visualize/sol2uml': '%network_name% Solidity UML diagram', '/csv-export': '%network_name% export data to CSV', '/deposits': '%network_name% deposits - track on %network_name% explorer', '/output-roots': '%network_name% output roots', '/dispute-games': '%network_name% dispute games', '/batches': '%network_name% txn batches', - '/batches/[number]': '%network_name% L2 txn batch %number%', - '/batches/celestia/[height]/[commitment]': '%network_name% L2 txn batch %height% %commitment%', + '/batches/[number]': `%network_name% ${ layerLabels.current } txn batch %number%`, + '/batches/celestia/[height]/[commitment]': `%network_name% ${ layerLabels.current } txn batch %height% %commitment%`, '/blobs/[hash]': '%network_name% blob %hash% details', '/ops': 'User operations on %network_name% - %network_name% explorer', '/op/[hash]': '%network_name% user operation %hash%', diff --git a/lib/rollups/utils.ts b/lib/rollups/utils.ts new file mode 100644 index 0000000000..e6c70ffe37 --- /dev/null +++ b/lib/rollups/utils.ts @@ -0,0 +1,37 @@ +import type { ZKEVM_L2_TX_STATUSES } from 'types/api/transaction'; +import type { ZKEVM_L2_TX_BATCH_STATUSES } from 'types/api/zkEvmL2'; +import type { ZKSYNC_L2_TX_BATCH_STATUSES } from 'types/api/zkSyncL2'; + +import config from 'configs/app'; + +const feature = config.features.rollup; + +export const layerLabels = feature.isEnabled ? { + current: `L${ feature.layerNumber }`, + parent: `L${ feature.layerNumber - 1 }`, +} : { + current: 'L2', + parent: 'L1', +}; + +export const formatZkEvmTxStatus = (status: typeof ZKEVM_L2_TX_STATUSES[number]) => { + switch (status) { + case 'L1 Confirmed': + return `${ layerLabels.parent } Confirmed`; + default: + return status; + } +}; + +export const formatZkEvmL2TxnBatchStatus = (status: typeof ZKEVM_L2_TX_BATCH_STATUSES[number]) => { + switch (status) { + case 'L1 Sequence Confirmed': + return `${ layerLabels.parent } Sequence Confirmed`; + default: + return status; + } +}; + +export const formatZkSyncL2TxnBatchStatus = (status: typeof ZKSYNC_L2_TX_BATCH_STATUSES[number]) => { + return status.replace('L1', layerLabels.parent).replace('L2', layerLabels.current); +}; diff --git a/ui/block/BlockDetails.tsx b/ui/block/BlockDetails.tsx index 033d965e94..dec8f49e2a 100644 --- a/ui/block/BlockDetails.tsx +++ b/ui/block/BlockDetails.tsx @@ -13,6 +13,7 @@ import getBlockReward from 'lib/block/getBlockReward'; import { useMultichainContext } from 'lib/contexts/multichain'; import getNetworkValidatorTitle from 'lib/networks/getNetworkValidatorTitle'; import * as arbitrum from 'lib/rollups/arbitrum'; +import { formatZkSyncL2TxnBatchStatus, layerLabels } from 'lib/rollups/utils'; import getQueryParamString from 'lib/router/getQueryParamString'; import { CollapsibleDetails } from 'toolkit/chakra/collapsible'; import { Link } from 'toolkit/chakra/link'; @@ -174,10 +175,10 @@ const BlockDetails = ({ query }: Props) => { { rollupFeature.isEnabled && rollupFeature.type === 'arbitrum' && data.arbitrum && ( <> - L1 block height + { layerLabels.parent } block height @@ -305,8 +306,13 @@ const BlockDetails = ({ query }: Props) => { Status - { rollupFeature.type === 'zkSync' && data.zksync && - } + { rollupFeature.type === 'zkSync' && data.zksync && ( + + ) } { rollupFeature.type === 'arbitrum' && data.arbitrum && ( { { data.arbitrum?.commitment_transaction.hash && ( <> Commitment tx @@ -358,7 +364,7 @@ const BlockDetails = ({ query }: Props) => { { data.arbitrum?.confirmation_transaction.hash && ( <> Confirmation tx @@ -684,7 +690,7 @@ const BlockDetails = ({ query }: Props) => { { rollupFeature.isEnabled && rollupFeature.type === 'arbitrum' && data.arbitrum && data.arbitrum.send_count && ( <> Send count @@ -694,7 +700,7 @@ const BlockDetails = ({ query }: Props) => { Send root @@ -704,7 +710,7 @@ const BlockDetails = ({ query }: Props) => { Delayed messages diff --git a/ui/deposits/optimisticL2/OptimisticDepositsListItem.tsx b/ui/deposits/optimisticL2/OptimisticDepositsListItem.tsx index f49a2e46d0..7c66104b45 100644 --- a/ui/deposits/optimisticL2/OptimisticDepositsListItem.tsx +++ b/ui/deposits/optimisticL2/OptimisticDepositsListItem.tsx @@ -4,6 +4,7 @@ import React from 'react'; import type { OptimisticL2DepositsItem } from 'types/api/optimisticL2'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import AddressEntityL1 from 'ui/shared/entities/address/AddressEntityL1'; import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1'; @@ -24,7 +25,7 @@ const OptimisticDepositsListItem = ({ item, isLoading }: Props) => { return ( - L1 block No + { layerLabels.parent } block No { /> - L2 txn hash + { layerLabels.current } txn hash { /> - L1 txn hash + { layerLabels.parent } txn hash { /> - L1 txn origin + { layerLabels.parent } txn origin { - L1 block No - L2 txn hash + { layerLabels.parent } block No + { layerLabels.current } txn hash Timestamp - L1 txn hash - L1 txn origin + { layerLabels.parent } txn hash + { layerLabels.parent } txn origin Gas limit diff --git a/ui/deposits/scrollL2/ScrollL2DepositsListItem.tsx b/ui/deposits/scrollL2/ScrollL2DepositsListItem.tsx index 170de4f04f..7b8c456892 100644 --- a/ui/deposits/scrollL2/ScrollL2DepositsListItem.tsx +++ b/ui/deposits/scrollL2/ScrollL2DepositsListItem.tsx @@ -4,6 +4,7 @@ import React from 'react'; import type { ScrollL2MessageItem } from 'types/api/scrollL2'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1'; import TxEntity from 'ui/shared/entities/tx/TxEntity'; @@ -24,7 +25,7 @@ const ScrollL2DepositsListItem = ({ item, isLoading }: Props) => { return ( - L1 block + { layerLabels.parent } block { - L1 txn hash + { layerLabels.parent } txn hash { /> - L2 txn hash + { layerLabels.current } txn hash { item.completion_transaction_hash ? ( { - L1 block + { layerLabels.parent } block Index - L1 txn hash + { layerLabels.parent } txn hash Timestamp - L2 txn hash + { layerLabels.current } txn hash Value { config.chain.currency.symbol } diff --git a/ui/deposits/shibarium/DepositsListItem.tsx b/ui/deposits/shibarium/DepositsListItem.tsx index cbb8d342fe..bdb4cbed31 100644 --- a/ui/deposits/shibarium/DepositsListItem.tsx +++ b/ui/deposits/shibarium/DepositsListItem.tsx @@ -3,6 +3,7 @@ import React from 'react'; import type { ShibariumDepositsItem } from 'types/api/shibarium'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import AddressStringOrParam from 'ui/shared/entities/address/AddressStringOrParam'; import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1'; import TxEntity from 'ui/shared/entities/tx/TxEntity'; @@ -22,7 +23,7 @@ const DepositsListItem = ({ item, isLoading }: Props) => { return ( - L1 block No + { layerLabels.parent } block No { /> - L1 txn hash + { layerLabels.parent } txn hash { /> - L2 txn hash + { layerLabels.current } txn hash { - L1 block No - L1 txn hash - L2 txn hash + { layerLabels.parent } block No + { layerLabels.parent } txn hash + { layerLabels.current } txn hash User Timestamp diff --git a/ui/deposits/zkEvmL2/ZkEvmL2DepositsListItem.tsx b/ui/deposits/zkEvmL2/ZkEvmL2DepositsListItem.tsx index a959a32e3f..6097aeeccc 100644 --- a/ui/deposits/zkEvmL2/ZkEvmL2DepositsListItem.tsx +++ b/ui/deposits/zkEvmL2/ZkEvmL2DepositsListItem.tsx @@ -5,6 +5,7 @@ import React from 'react'; import type { ZkEvmL2DepositsItem } from 'types/api/zkEvmL2'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1'; import TxEntity from 'ui/shared/entities/tx/TxEntity'; @@ -25,7 +26,7 @@ const ZkEvmL2DepositsListItem = ({ item, isLoading }: Props) => { return ( - L1 block + { layerLabels.parent } block { - L1 txn hash + { layerLabels.parent } txn hash { /> - L2 txn hash + { layerLabels.current } txn hash { item.l2_transaction_hash ? ( { - L1 block + { layerLabels.parent } block Index - L1 txn hash + { layerLabels.parent } txn hash Timestamp - L2 txn hash + { layerLabels.current } txn hash Value Token diff --git a/ui/disputeGames/optimisticL2/OptimisticL2DisputeGamesListItem.tsx b/ui/disputeGames/optimisticL2/OptimisticL2DisputeGamesListItem.tsx index 79271da014..6c05190a00 100644 --- a/ui/disputeGames/optimisticL2/OptimisticL2DisputeGamesListItem.tsx +++ b/ui/disputeGames/optimisticL2/OptimisticL2DisputeGamesListItem.tsx @@ -3,6 +3,7 @@ import React from 'react'; import type { OptimisticL2DisputeGamesItem } from 'types/api/optimisticL2'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import CopyToClipboard from 'ui/shared/CopyToClipboard'; import BlockEntityL2 from 'ui/shared/entities/block/BlockEntityL2'; @@ -40,7 +41,7 @@ const OptimisticL2DisputeGamesListItem = ({ item, isLoading }: Props) => { - L2 block # + { layerLabels.current } block # { Index Game type Address - L2 block # + { layerLabels.current } block # Timestamp diff --git a/ui/home/Stats.tsx b/ui/home/Stats.tsx index b693871d1a..5c1d62d688 100644 --- a/ui/home/Stats.tsx +++ b/ui/home/Stats.tsx @@ -4,6 +4,7 @@ import React from 'react'; import config from 'configs/app'; import useApiQuery from 'lib/api/useApiQuery'; +import { layerLabels } from 'lib/rollups/utils'; import { HOMEPAGE_STATS, HOMEPAGE_STATS_MICROSERVICE } from 'stubs/stats'; import GasInfoTooltip from 'ui/shared/gas/GasInfoTooltip'; import GasPrice from 'ui/shared/gas/GasPrice'; @@ -167,7 +168,7 @@ const Stats = () => { apiData?.last_output_root_size && { id: 'latest_l1_state_batch' as const, icon: 'txn_batches' as const, - label: 'Latest L1 state batch', + label: `Latest ${ layerLabels.parent } state batch`, value: apiData?.last_output_root_size, href: { pathname: '/batches' as const }, isLoading, diff --git a/ui/home/Transactions.tsx b/ui/home/Transactions.tsx index 10d4891e4b..8219e708f4 100644 --- a/ui/home/Transactions.tsx +++ b/ui/home/Transactions.tsx @@ -1,6 +1,7 @@ import React from 'react'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { SocketProvider } from 'lib/socket/context'; import { Heading } from 'toolkit/chakra/heading'; import AdaptiveTabs from 'toolkit/components/AdaptiveTabs/AdaptiveTabs'; @@ -30,9 +31,9 @@ const Transactions = () => { }, { id: 'txn', title: zetachainFeature.isEnabled ? 'ZetaChain EVM' : 'Latest txn', component: }, rollupFeature.isEnabled && rollupFeature.type === 'optimistic' && - { id: 'deposits', title: 'Deposits (L1→L2 txn)', component: }, + { id: 'deposits', title: `Deposits (${ layerLabels.parent }→${ layerLabels.current } txn)`, component: }, rollupFeature.isEnabled && rollupFeature.type === 'arbitrum' && - { id: 'deposits', title: 'Deposits (L1→L2 txn)', component: }, + { id: 'deposits', title: `Deposits (${ layerLabels.parent }→${ layerLabels.current } txn)`, component: }, isAuth && { id: 'watchlist', title: 'Watch list', component: }, ].filter(Boolean); return ( diff --git a/ui/home/latestDeposits/LatestDeposits.tsx b/ui/home/latestDeposits/LatestDeposits.tsx index 0947b952b6..ca99d79095 100644 --- a/ui/home/latestDeposits/LatestDeposits.tsx +++ b/ui/home/latestDeposits/LatestDeposits.tsx @@ -9,6 +9,7 @@ import React from 'react'; import { route } from 'nextjs-routes'; import useIsMobile from 'lib/hooks/useIsMobile'; +import { layerLabels } from 'lib/rollups/utils'; import { Link } from 'toolkit/chakra/link'; import { Skeleton } from 'toolkit/chakra/skeleton'; import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1'; @@ -96,11 +97,11 @@ const LatestDepositsItem = ({ item, isLoading }: ItemProps) => { - L1 txn + { layerLabels.parent } txn { l1TxLink } - L2 txn + { layerLabels.current } txn { l2TxLink } @@ -112,7 +113,7 @@ const LatestDepositsItem = ({ item, isLoading }: ItemProps) => { { l1BlockLink } - L1 txn + { layerLabels.parent } txn { l1TxLink } { item.timestamp ? ( @@ -127,7 +128,7 @@ const LatestDepositsItem = ({ item, isLoading }: ItemProps) => { /> ) : } - L2 txn + { layerLabels.current } txn { l2TxLink } diff --git a/ui/home/latestDeposits/LatestDepositsItem.tsx b/ui/home/latestDeposits/LatestDepositsItem.tsx index 5af814b03f..1ee0bc7e47 100644 --- a/ui/home/latestDeposits/LatestDepositsItem.tsx +++ b/ui/home/latestDeposits/LatestDepositsItem.tsx @@ -6,6 +6,7 @@ import { import React from 'react'; import useIsMobile from 'lib/hooks/useIsMobile'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1'; import TxEntity from 'ui/shared/entities/tx/TxEntity'; @@ -68,11 +69,11 @@ const LatestDepositsItem = ({ l1BlockNumber, l1TxHash, l2TxHash, timestamp, isLo - L1 txn + { layerLabels.parent } txn { l1TxLink } - L2 txn + { layerLabels.current } txn { l2TxLink } @@ -84,7 +85,7 @@ const LatestDepositsItem = ({ l1BlockNumber, l1TxHash, l2TxHash, timestamp, isLo { l1BlockLink } - L1 txn + { layerLabels.parent } txn { l1TxLink } - L2 txn + { layerLabels.current } txn { l2TxLink } diff --git a/ui/messages/ArbitrumL2Messages.tsx b/ui/messages/ArbitrumL2Messages.tsx index ca2c09862a..62daa67f84 100644 --- a/ui/messages/ArbitrumL2Messages.tsx +++ b/ui/messages/ArbitrumL2Messages.tsx @@ -2,6 +2,7 @@ import { Box } from '@chakra-ui/react'; import React from 'react'; import useApiQuery from 'lib/api/useApiQuery'; +import { layerLabels } from 'lib/rollups/utils'; import { ARBITRUM_MESSAGES_ITEM } from 'stubs/arbitrumL2'; import { generateListStub } from 'stubs/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; @@ -85,8 +86,8 @@ const ArbitrumL2Messages = ({ direction }: Props) => { <> { { direction === 'to-rollup' && ( <> - L1 block + { layerLabels.parent } block { item.origination_transaction_block_number ? ( { - L2 transaction + { layerLabels.current } transaction { l2TxHash ? ( { } - L1 transaction + { layerLabels.parent } transaction { l1TxHash ? ( - { direction === 'to-rollup' && L1 block } + { direction === 'to-rollup' && { layerLabels.parent } block } { direction === 'from-rollup' && From } Message # - L2 transaction + { layerLabels.current } transaction Timestamp Status - L1 transaction + { layerLabels.parent } transaction diff --git a/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsListItem.tsx b/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsListItem.tsx index 5dcde5b8f3..0cebf427e8 100644 --- a/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsListItem.tsx +++ b/ui/outputRoots/optimisticL2/OptimisticL2OutputRootsListItem.tsx @@ -4,6 +4,7 @@ import React from 'react'; import type { OptimisticL2OutputRootsItem } from 'types/api/optimisticL2'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import CopyToClipboard from 'ui/shared/CopyToClipboard'; import BlockEntityL2 from 'ui/shared/entities/block/BlockEntityL2'; @@ -24,7 +25,7 @@ const OptimisticL2OutputRootsListItem = ({ item, isLoading }: Props) => { return ( - L2 output index + { layerLabels.current } output index { item.l2_output_index } @@ -38,7 +39,7 @@ const OptimisticL2OutputRootsListItem = ({ item, isLoading }: Props) => { /> - L2 block # + { layerLabels.current } block # { /> - L1 txn hash + { layerLabels.parent } txn hash { - L2 output index + { layerLabels.current } output index Timestamp - L2 block # - L1 txn hash + { layerLabels.current } block # + { layerLabels.parent } txn hash Output root diff --git a/ui/pages/ArbitrumL2TxnWithdrawals.tsx b/ui/pages/ArbitrumL2TxnWithdrawals.tsx index 386eb55718..97d7971c16 100644 --- a/ui/pages/ArbitrumL2TxnWithdrawals.tsx +++ b/ui/pages/ArbitrumL2TxnWithdrawals.tsx @@ -3,6 +3,7 @@ import { useRouter } from 'next/router'; import React from 'react'; import useApiQuery from 'lib/api/useApiQuery'; +import { layerLabels } from 'lib/rollups/utils'; import getQueryParamString from 'lib/router/getQueryParamString'; import { ARBITRUM_L2_TXN_WITHDRAWALS_ITEM } from 'stubs/arbitrumL2'; import { FilterInput } from 'toolkit/components/filters/FilterInput'; @@ -75,7 +76,9 @@ const ArbitrumL2TxnWithdrawals = () => { return ( <> - L2 to L1 message relayer: search for your L2 transaction to execute a manual withdrawal. + + { layerLabels.current } to { layerLabels.parent } message relayer: search for your { layerLabels.current } transaction to execute a manual withdrawal. + { return ( <> - + { return ( - L2 output index + { layerLabels.current } output index #{ data.items[0].l2_output_index } to #{ data.items[data.items.length - 1].l2_output_index } (total of { countersQuery.data?.toLocaleString() } roots) diff --git a/ui/pages/OptimisticL2Withdrawals.tsx b/ui/pages/OptimisticL2Withdrawals.tsx index da6e3be0ad..75a49f37e7 100644 --- a/ui/pages/OptimisticL2Withdrawals.tsx +++ b/ui/pages/OptimisticL2Withdrawals.tsx @@ -2,6 +2,7 @@ import { Box } from '@chakra-ui/react'; import React from 'react'; import useApiQuery from 'lib/api/useApiQuery'; +import { layerLabels } from 'lib/rollups/utils'; import { L2_WITHDRAWAL_ITEM } from 'stubs/L2'; import { generateListStub } from 'stubs/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; @@ -73,7 +74,7 @@ const OptimisticL2Withdrawals = () => { return ( <> - + { return ( <> - + { return ( <> - + { return ( <> - + { return ( <> - + { return ( <> - + { return ( <> - + { let type: StatusTagType; + let text: string; switch (status) { - case 'L1 Sequence Confirmed': - case 'Finalized': + case 'L1 Sequence Confirmed': { type = 'ok'; + text = `${ layerLabels.parent } sequence confirmed`; break; - default: - type = 'pending'; + } + case 'Finalized': { + type = 'ok'; + text = status; break; + } + default: { + type = 'pending'; + text = status; + } } - return ; + return ; }; export default ZkEvmL2TxnBatchStatus; diff --git a/ui/shared/statusTag/ZkSyncL2TxnBatchStatus.tsx b/ui/shared/statusTag/ZkSyncL2TxnBatchStatus.tsx index 88e35b5b2c..5a7254e011 100644 --- a/ui/shared/statusTag/ZkSyncL2TxnBatchStatus.tsx +++ b/ui/shared/statusTag/ZkSyncL2TxnBatchStatus.tsx @@ -2,6 +2,8 @@ import React from 'react'; import type { ZkSyncBatchStatus } from 'types/api/zkSyncL2'; +import { layerLabels } from 'lib/rollups/utils'; + import type { StatusTagType } from './StatusTag'; import StatusTag from './StatusTag'; @@ -22,7 +24,9 @@ const ZkSyncL2TxnBatchStatus = ({ status, isLoading }: Props) => { break; } - return ; + const text = status.replace('L1', layerLabels.parent).replace('L2', layerLabels.current); + + return ; }; export default ZkSyncL2TxnBatchStatus; diff --git a/ui/tx/details/TxDetailsInterop.tsx b/ui/tx/details/TxDetailsInterop.tsx index fd7ccf3574..6774dfa55e 100644 --- a/ui/tx/details/TxDetailsInterop.tsx +++ b/ui/tx/details/TxDetailsInterop.tsx @@ -4,6 +4,7 @@ import React from 'react'; import type { InteropTransactionInfo } from 'types/api/transaction'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { CollapsibleDetails } from 'toolkit/chakra/collapsible'; import InteropMessageDestinationTx from 'ui/interopMessages/InteropMessageDestinationTx'; import InteropMessageSourceTx from 'ui/interopMessages/InteropMessageSourceTx'; @@ -86,7 +87,7 @@ const TxDetailsInterop = ({ data, isLoading }: Props) => { return ( <> Interop source tx @@ -105,7 +106,7 @@ const TxDetailsInterop = ({ data, isLoading }: Props) => { return ( <> Interop relay tx diff --git a/ui/tx/details/TxDetailsWithdrawalStatusArbitrum.tsx b/ui/tx/details/TxDetailsWithdrawalStatusArbitrum.tsx index f33707c4ad..4616a3ebf5 100644 --- a/ui/tx/details/TxDetailsWithdrawalStatusArbitrum.tsx +++ b/ui/tx/details/TxDetailsWithdrawalStatusArbitrum.tsx @@ -5,6 +5,7 @@ import type { ArbitrumTransactionMessageStatus, Transaction } from 'types/api/tr import { route } from 'nextjs-routes'; +import { layerLabels } from 'lib/rollups/utils'; import { Link } from 'toolkit/chakra/link'; import * as DetailedInfo from 'ui/shared/DetailedInfo/DetailedInfo'; import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1'; @@ -85,7 +86,7 @@ const TxDetailsWithdrawalStatusArbitrum = ({ data }: Props) => { - Originating L1 txn hash + Originating { layerLabels.parent } txn hash { data.arbitrum.message_related_info.associated_l1_transaction_hash ? diff --git a/ui/tx/details/TxInfo.tsx b/ui/tx/details/TxInfo.tsx index f12fdbddf5..8305ebbb56 100644 --- a/ui/tx/details/TxInfo.tsx +++ b/ui/tx/details/TxInfo.tsx @@ -23,6 +23,7 @@ import useApiQuery from 'lib/api/useApiQuery'; import useIsMobile from 'lib/hooks/useIsMobile'; import getNetworkValidatorTitle from 'lib/networks/getNetworkValidatorTitle'; import * as arbitrum from 'lib/rollups/arbitrum'; +import { formatZkEvmTxStatus, formatZkSyncL2TxnBatchStatus, layerLabels } from 'lib/rollups/utils'; import getConfirmationDuration from 'lib/tx/getConfirmationDuration'; import { currencyUnits } from 'lib/units'; import { Badge } from 'toolkit/chakra/badge'; @@ -197,7 +198,7 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { rollupFeature.isEnabled && (rollupFeature.type === 'zkEvm' || rollupFeature.type === 'zkSync' || rollupFeature.type === 'arbitrum' || rollupFeature.type === 'scroll') ? - 'L2 status and method' : + `${ layerLabels.current } status and method` : 'Status and method' } @@ -244,13 +245,17 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { data.zkevm_status && !config.UI.views.tx.hiddenFields?.L1_status && ( <> Confirmation status - + ) } @@ -258,10 +263,10 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { data.arbitrum?.status && !config.UI.views.tx.hiddenFields?.L1_status && ( <> - L1 status + { layerLabels.parent } status { hint="Status is the short interpretation of the batch lifecycle" isLoading={ isLoading } > - L1 status + { layerLabels.parent } status - + ) } @@ -537,7 +546,7 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { data.arbitrum?.commitment_transaction.hash && ( <> Commitment tx @@ -551,7 +560,7 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { data.arbitrum?.confirmation_transaction.hash && ( <> Confirmation tx @@ -637,7 +646,7 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { rollupFeature.isEnabled && rollupFeature.type === 'arbitrum' && data.arbitrum && ( <> Poster fee @@ -649,7 +658,7 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { /> Network fee @@ -671,10 +680,10 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { rollupFeature.isEnabled && rollupFeature.type === 'arbitrum' && data.arbitrum && data.gas_used && ( <> - Gas used for L1 + Gas used for { layerLabels.parent } { BigNumber(data.arbitrum.gas_used_for_l1 || 0).toFormat() } @@ -687,10 +696,10 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { - Gas used for L2 + Gas used for { layerLabels.current } { BigNumber(data.arbitrum.gas_used_for_l2 || 0).toFormat() } @@ -707,10 +716,10 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { data.scroll?.l1_gas_used !== undefined && ( <> - L1 Gas used + { layerLabels.parent } Gas used { BigNumber(data.scroll?.l1_gas_used || 0).toFormat() } @@ -775,10 +784,10 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { data.l1_gas_used && ( <> - L1 gas used by txn + { layerLabels.parent } gas used by txn { BigNumber(data.l1_gas_used).toFormat() } @@ -789,10 +798,10 @@ const TxInfo = ({ data, tacOperations, isLoading, socketStatus }: Props) => { { data.l1_gas_price && ( <> - L1 gas price + { layerLabels.parent } gas price { <> - L1 fee + { layerLabels.parent } fee { { data.l1_fee_scalar && ( <> - L1 fee scalar + { layerLabels.parent } fee scalar { data.l1_fee_scalar } diff --git a/ui/tx/details/TxInfoScrollFees.tsx b/ui/tx/details/TxInfoScrollFees.tsx index 8a1981282b..aaf74d80ee 100644 --- a/ui/tx/details/TxInfoScrollFees.tsx +++ b/ui/tx/details/TxInfoScrollFees.tsx @@ -3,6 +3,7 @@ import React from 'react'; import type { Transaction } from 'types/api/transaction'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import * as DetailedInfo from 'ui/shared/DetailedInfo/DetailedInfo'; import DetailedInfoNativeCoinValue from 'ui/shared/DetailedInfo/DetailedInfoNativeCoinValue'; @@ -21,10 +22,10 @@ export const TxInfoScrollFees = ({ data, isLoading }: Props) => { <> - L1 data fee + { layerLabels.parent } data fee { { data.scroll?.l2_fee !== undefined && ( <> Execution fee @@ -56,7 +57,7 @@ export const TxInfoScrollFees = ({ data, isLoading }: Props) => { hint="Commitment scalar" isLoading={ isLoading } > - L1 commit scalar + { layerLabels.parent } commit scalar { hint="Additional gas overhead of a data commitment transaction" isLoading={ isLoading } > - L1 Fee Overhead + { layerLabels.parent } Fee Overhead { { (data.scroll?.l1_base_fee !== undefined || data.scroll?.l1_fee_scalar !== undefined) && ( <> - L1 gas fees + { layerLabels.parent } gas fees { data.scroll?.l1_base_fee !== undefined && ( @@ -121,10 +122,10 @@ export const TxInfoScrollFees = ({ data, isLoading }: Props) => { { (data.scroll?.l1_blob_base_fee !== undefined || data.scroll?.l1_fee_blob_scalar !== undefined) && ( <> - L1 blob fees + { layerLabels.parent } blob fees { data.scroll?.l1_blob_base_fee !== undefined && ( diff --git a/ui/txnBatches/arbitrumL2/ArbitrumL2TxnBatchDetails.tsx b/ui/txnBatches/arbitrumL2/ArbitrumL2TxnBatchDetails.tsx index 19f28427a6..18032a7532 100644 --- a/ui/txnBatches/arbitrumL2/ArbitrumL2TxnBatchDetails.tsx +++ b/ui/txnBatches/arbitrumL2/ArbitrumL2TxnBatchDetails.tsx @@ -9,6 +9,7 @@ import { route } from 'nextjs-routes'; import type { ResourceError } from 'lib/api/resources'; import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError'; +import { layerLabels } from 'lib/rollups/utils'; import { CollapsibleDetails } from 'toolkit/chakra/collapsible'; import { Link } from 'toolkit/chakra/link'; import { Skeleton } from 'toolkit/chakra/skeleton'; @@ -66,7 +67,7 @@ const ArbitrumL2TxnBatchDetails = ({ query }: Props) => { > Txn batch number @@ -86,7 +87,7 @@ const ArbitrumL2TxnBatchDetails = ({ query }: Props) => { Timestamp @@ -111,7 +112,7 @@ const ArbitrumL2TxnBatchDetails = ({ query }: Props) => { Blocks @@ -123,9 +124,9 @@ const ArbitrumL2TxnBatchDetails = ({ query }: Props) => { - L1 transaction hash + { layerLabels.parent } transaction hash { - L1 block + { layerLabels.parent } block { /> - L1 status + { layerLabels.parent } status - L1 block + { layerLabels.parent } block { ) } - L1 transaction + { layerLabels.parent } transaction { Batch # - L1 status - L1 block + { layerLabels.parent } status + { layerLabels.parent } block Block count - L1 transaction + { layerLabels.parent } transaction Timestamp diff --git a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobCallData.tsx b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobCallData.tsx index cc054f9dec..935ec9cae7 100644 --- a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobCallData.tsx +++ b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobCallData.tsx @@ -1,6 +1,7 @@ import { GridItem } from '@chakra-ui/react'; import React from 'react'; +import { layerLabels } from 'lib/rollups/utils'; import DetailedInfoTimestamp from 'ui/shared/DetailedInfo/DetailedInfoTimestamp'; import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1'; @@ -19,7 +20,7 @@ const OptimisticL2TxnBatchBlobCallData = ({ l1TxHashes, l1Timestamp, isLoading } - L1 txn hash{ l1TxHashes.length > 1 ? 'es' : '' } + { layerLabels.parent } txn hash{ l1TxHashes.length > 1 ? 'es' : '' } { l1TxHashes.map((hash) => ) } diff --git a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobCelestia.tsx b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobCelestia.tsx index efae78cb96..18440af755 100644 --- a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobCelestia.tsx +++ b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobCelestia.tsx @@ -3,6 +3,7 @@ import React from 'react'; import type { OptimisticL2BlobTypeCelestia } from 'types/api/optimisticL2'; +import { layerLabels } from 'lib/rollups/utils'; import CeleniumLink from 'ui/shared/batch/CeleniumLink'; import CopyToClipboard from 'ui/shared/CopyToClipboard'; import DetailedInfoTimestamp from 'ui/shared/DetailedInfo/DetailedInfoTimestamp'; @@ -38,7 +39,7 @@ const OptimisticL2TxnBatchBlobCelestia = ({ blobs, isLoading }: Props) => { - L1 txn hash + { layerLabels.parent } txn hash diff --git a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobEigenda.tsx b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobEigenda.tsx index a15b02cf01..507dd494ef 100644 --- a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobEigenda.tsx +++ b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobEigenda.tsx @@ -3,6 +3,7 @@ import React from 'react'; import type { OptimisticL2BlobTypeEigenda } from 'types/api/optimisticL2'; +import { layerLabels } from 'lib/rollups/utils'; import CopyToClipboard from 'ui/shared/CopyToClipboard'; import DetailedInfoTimestamp from 'ui/shared/DetailedInfo/DetailedInfoTimestamp'; import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1'; @@ -32,7 +33,7 @@ const OptimisticL2TxnBatchBlobEigenda = ({ blobs, isLoading }: Props) => { - L1 txn hash + { layerLabels.parent } txn hash diff --git a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobEip4844.tsx b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobEip4844.tsx index 090ab5b50f..492fa5c2a8 100644 --- a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobEip4844.tsx +++ b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchBlobEip4844.tsx @@ -3,6 +3,7 @@ import React from 'react'; import type { OptimisticL2BlobTypeEip4844 } from 'types/api/optimisticL2'; +import { layerLabels } from 'lib/rollups/utils'; import DetailedInfoTimestamp from 'ui/shared/DetailedInfo/DetailedInfoTimestamp'; import BlobEntityL1 from 'ui/shared/entities/blob/BlobEntityL1'; import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1'; @@ -28,7 +29,7 @@ const OptimisticL2TxnBatchBlobEip4844 = ({ blobs, isLoading }: Props) => { - L1 txn hash + { layerLabels.parent } txn hash diff --git a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchDetails.tsx b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchDetails.tsx index b48d3e3147..8da5237fb4 100644 --- a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchDetails.tsx +++ b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchDetails.tsx @@ -8,6 +8,7 @@ import { route } from 'nextjs-routes'; import type { ResourceError } from 'lib/api/resources'; import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError'; +import { layerLabels } from 'lib/rollups/utils'; import { Link } from 'toolkit/chakra/link'; import { Skeleton } from 'toolkit/chakra/skeleton'; import isCustomAppError from 'ui/shared/AppError/isCustomAppError'; @@ -62,7 +63,7 @@ const OptimisticL2TxnBatchDetails = ({ query }: Props) => { > Batch ID @@ -82,7 +83,7 @@ const OptimisticL2TxnBatchDetails = ({ query }: Props) => { Timestamp @@ -110,7 +111,7 @@ const OptimisticL2TxnBatchDetails = ({ query }: Props) => { Blocks diff --git a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesListItem.tsx b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesListItem.tsx index 5f5d795f18..3ce6d59fdd 100644 --- a/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesListItem.tsx +++ b/ui/txnBatches/optimisticL2/OptimisticL2TxnBatchesListItem.tsx @@ -5,6 +5,7 @@ import type { OptimisticL2TxnBatchesItem } from 'types/api/optimisticL2'; import { route } from 'nextjs-routes'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { Link } from 'toolkit/chakra/link'; import { Skeleton } from 'toolkit/chakra/skeleton'; import OptimisticL2TxnBatchDA from 'ui/shared/batch/OptimisticL2TxnBatchDA'; @@ -49,14 +50,14 @@ const OptimisticL2TxnBatchesListItem = ({ item, isLoading }: Props) => { /> - L1 txn count + { layerLabels.parent } txn count { item.l1_transaction_hashes.length } - L2 blocks + { layerLabels.current } blocks { Timestamp - L1 txn count - L2 blocks + { layerLabels.parent } txn count + { layerLabels.current } blocks Txn diff --git a/ui/txnBatches/scrollL2/ScrollL2TxnBatchDetails.tsx b/ui/txnBatches/scrollL2/ScrollL2TxnBatchDetails.tsx index 04b0ef2452..5a82a48980 100644 --- a/ui/txnBatches/scrollL2/ScrollL2TxnBatchDetails.tsx +++ b/ui/txnBatches/scrollL2/ScrollL2TxnBatchDetails.tsx @@ -8,6 +8,7 @@ import { route } from 'nextjs-routes'; import type { ResourceError } from 'lib/api/resources'; import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError'; +import { layerLabels } from 'lib/rollups/utils'; import { Link } from 'toolkit/chakra/link'; import { Skeleton } from 'toolkit/chakra/skeleton'; import isCustomAppError from 'ui/shared/AppError/isCustomAppError'; @@ -19,7 +20,6 @@ import BlockEntityL1 from 'ui/shared/entities/block/BlockEntityL1'; import TxEntityL1 from 'ui/shared/entities/tx/TxEntityL1'; import PrevNext from 'ui/shared/PrevNext'; import ScrollL2TxnBatchStatus from 'ui/shared/statusTag/ScrollL2TxnBatchStatus'; - interface Props { query: UseQueryResult; } @@ -60,7 +60,7 @@ const ScrollL2TxnBatchDetails = ({ query }: Props) => { > Txn batch number @@ -100,7 +100,7 @@ const ScrollL2TxnBatchDetails = ({ query }: Props) => { Finalized timestamp @@ -129,7 +129,7 @@ const ScrollL2TxnBatchDetails = ({ query }: Props) => { Blocks @@ -141,7 +141,7 @@ const ScrollL2TxnBatchDetails = ({ query }: Props) => { Committed timestamp @@ -154,7 +154,7 @@ const ScrollL2TxnBatchDetails = ({ query }: Props) => { Committed transaction hash @@ -170,7 +170,7 @@ const ScrollL2TxnBatchDetails = ({ query }: Props) => { Committed block @@ -183,7 +183,7 @@ const ScrollL2TxnBatchDetails = ({ query }: Props) => { Finalized transaction hash @@ -200,7 +200,7 @@ const ScrollL2TxnBatchDetails = ({ query }: Props) => { Finalized block diff --git a/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx b/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx index bd08cae6b0..f9f41342d4 100644 --- a/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx +++ b/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx @@ -10,6 +10,7 @@ import { route } from 'nextjs-routes'; import type { ResourceError } from 'lib/api/resources'; import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError'; +import { formatZkEvmL2TxnBatchStatus } from 'lib/rollups/utils'; import { Link } from 'toolkit/chakra/link'; import { Skeleton } from 'toolkit/chakra/skeleton'; import isCustomAppError from 'ui/shared/AppError/isCustomAppError'; @@ -83,7 +84,11 @@ const ZkEvmL2TxnBatchDetails = ({ query }: Props) => { Status - + { templateColumns={{ base: 'minmax(0, 1fr)', lg: 'minmax(min-content, 200px) minmax(0, 1fr)' }} > Txn batch number @@ -94,7 +95,11 @@ const ZkSyncL2TxnBatchDetails = ({ query }: Props) => { Status - + { Root hash @@ -142,9 +147,9 @@ const ZkSyncL2TxnBatchDetails = ({ query }: Props) => { - L1 gas price + { layerLabels.parent } gas price { - L2 fair gas price + { layerLabels.current } fair gas price { return ( <> Commit tx hash @@ -45,7 +46,7 @@ const ZkSyncL2TxnBatchHashesInfo = ({ isLoading, data }: Props) => { Prove tx hash @@ -66,7 +67,7 @@ const ZkSyncL2TxnBatchHashesInfo = ({ isLoading, data }: Props) => { Execute tx hash diff --git a/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsListItem.tsx b/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsListItem.tsx index b02683a75e..85e8df017d 100644 --- a/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsListItem.tsx +++ b/ui/withdrawals/optimisticL2/OptimisticL2WithdrawalsListItem.tsx @@ -4,6 +4,7 @@ import type { OptimisticL2WithdrawalsItem } from 'types/api/optimisticL2'; import config from 'configs/app'; import dayjs from 'lib/date/dayjs'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import AddressEntity from 'ui/shared/entities/address/AddressEntity'; import TxEntity from 'ui/shared/entities/tx/TxEntity'; @@ -47,7 +48,7 @@ const OptimisticL2WithdrawalsListItem = ({ item, isLoading }: Props) => { ) } - L2 txn hash + { layerLabels.current } txn hash { { item.l1_transaction_hash && ( <> - L1 txn hash + { layerLabels.parent } txn hash { Msg nonce From - L2 txn hash + { layerLabels.current } txn hash Timestamp Status - L1 txn hash + { layerLabels.parent } txn hash Time left diff --git a/ui/withdrawals/scrollL2/ScrollL2WithdrawalsListItem.tsx b/ui/withdrawals/scrollL2/ScrollL2WithdrawalsListItem.tsx index c09cd862f5..8645cf46b6 100644 --- a/ui/withdrawals/scrollL2/ScrollL2WithdrawalsListItem.tsx +++ b/ui/withdrawals/scrollL2/ScrollL2WithdrawalsListItem.tsx @@ -4,6 +4,7 @@ import React from 'react'; import type { ScrollL2MessageItem } from 'types/api/scrollL2'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import BlockEntity from 'ui/shared/entities/block/BlockEntity'; import TxEntity from 'ui/shared/entities/tx/TxEntity'; @@ -24,7 +25,7 @@ const ScrollL2WithdrawalsListItem = ({ item, isLoading }: Props) => { return ( - L2 block + { layerLabels.current } block { - L2 txn hash + { layerLabels.current } txn hash { /> - L1 txn hash + { layerLabels.parent } txn hash { item.completion_transaction_hash ? ( { - L2 block + { layerLabels.current } block Index - L2 txn hash + { layerLabels.current } txn hash Timestamp - L1 txn hash + { layerLabels.parent } txn hash { `Value ${ config.chain.currency.symbol }` } diff --git a/ui/withdrawals/shibarium/WithdrawalsListItem.tsx b/ui/withdrawals/shibarium/WithdrawalsListItem.tsx index c920035991..ba5e507f9f 100644 --- a/ui/withdrawals/shibarium/WithdrawalsListItem.tsx +++ b/ui/withdrawals/shibarium/WithdrawalsListItem.tsx @@ -3,6 +3,7 @@ import React from 'react'; import type { ShibariumWithdrawalsItem } from 'types/api/shibarium'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import AddressStringOrParam from 'ui/shared/entities/address/AddressStringOrParam'; import BlockEntity from 'ui/shared/entities/block/BlockEntity'; import TxEntity from 'ui/shared/entities/tx/TxEntity'; @@ -22,7 +23,7 @@ const WithdrawalsListItem = ({ item, isLoading }: Props) => { return ( - L2 block No + { layerLabels.current } block No { /> - L2 txn hash + { layerLabels.current } txn hash { /> - L1 txn hash + { layerLabels.parent } txn hash { - L2 block No - L2 txn hash - L1 txn hash + { layerLabels.current } block No + { layerLabels.current } txn hash + { layerLabels.parent } txn hash User Timestamp diff --git a/ui/withdrawals/zkEvmL2/ZkEvmL2WithdrawalsListItem.tsx b/ui/withdrawals/zkEvmL2/ZkEvmL2WithdrawalsListItem.tsx index 68b34133c8..eab9f3f0fd 100644 --- a/ui/withdrawals/zkEvmL2/ZkEvmL2WithdrawalsListItem.tsx +++ b/ui/withdrawals/zkEvmL2/ZkEvmL2WithdrawalsListItem.tsx @@ -5,6 +5,7 @@ import React from 'react'; import type { ZkEvmL2WithdrawalsItem } from 'types/api/zkEvmL2'; import config from 'configs/app'; +import { layerLabels } from 'lib/rollups/utils'; import { Skeleton } from 'toolkit/chakra/skeleton'; import BlockEntity from 'ui/shared/entities/block/BlockEntity'; import TxEntity from 'ui/shared/entities/tx/TxEntity'; @@ -42,7 +43,7 @@ const ZkEvmL2WithdrawalsListItem = ({ item, isLoading }: Props) => { - L2 txn hash + { layerLabels.current } txn hash { /> - L1 txn hash + { layerLabels.parent } txn hash { item.l1_transaction_hash ? ( { Block Index - L2 txn hash + { layerLabels.current } txn hash Timestamp - L1 txn hash + { layerLabels.parent } txn hash Value Token From c2fcb43f7958c46037b077ca5d9bafc778f0e13f Mon Sep 17 00:00:00 2001 From: tom Date: Wed, 25 Feb 2026 12:43:31 +0100 Subject: [PATCH 2/2] fix review comments --- configs/app/features/rollup.ts | 2 +- deploy/tools/llms-txt-generator/index.ts | 4 ++-- lib/rollups/utils.ts | 2 +- ui/block/BlockDetails.tsx | 4 +++- ui/txnBatches/arbitrumL2/ArbitrumL2TxnBatchDetails.tsx | 2 +- ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx | 4 +++- 6 files changed, 11 insertions(+), 7 deletions(-) diff --git a/configs/app/features/rollup.ts b/configs/app/features/rollup.ts index ca64bcd91c..2eb5625060 100644 --- a/configs/app/features/rollup.ts +++ b/configs/app/features/rollup.ts @@ -51,7 +51,7 @@ const config: Feature<{ isEnabled: true, type, stageIndex: getEnvValue('NEXT_PUBLIC_ROLLUP_STAGE_INDEX'), - layerNumber: Number(getEnvValue('NEXT_PUBLIC_ROLLUP_LAYER_NUMBER') ?? 2), + layerNumber: Number(getEnvValue('NEXT_PUBLIC_ROLLUP_LAYER_NUMBER') || 2), L2WithdrawalUrl: type === 'optimistic' ? L2WithdrawalUrl : undefined, outputRootsEnabled: type === 'optimistic' && getEnvValue('NEXT_PUBLIC_ROLLUP_OUTPUT_ROOTS_ENABLED') === 'true', interopEnabled: type === 'optimistic' && getEnvValue('NEXT_PUBLIC_INTEROP_ENABLED') === 'true', diff --git a/deploy/tools/llms-txt-generator/index.ts b/deploy/tools/llms-txt-generator/index.ts index 98b9ec4db6..bfa4ec7fbb 100644 --- a/deploy/tools/llms-txt-generator/index.ts +++ b/deploy/tools/llms-txt-generator/index.ts @@ -26,8 +26,8 @@ function run() { const rollupFeature = config.features.rollup; const parentChainUrl = rollupFeature.isEnabled ? rollupFeature.parentChain.baseUrl : undefined; - const currentToParentLayerLabel = rollupFeature.isEnabled ? layerLabels.current + '→' + layerLabels.parent : undefined; - const parentToCurrentLayerLabel = rollupFeature.isEnabled ? layerLabels.parent + '→' + layerLabels.current : undefined; + const currentToParentLayerLabel = layerLabels.current + '→' + layerLabels.parent; + const parentToCurrentLayerLabel = layerLabels.parent + '→' + layerLabels.current; const validatorsFeature = config.features.validators; diff --git a/lib/rollups/utils.ts b/lib/rollups/utils.ts index e6c70ffe37..aea480d965 100644 --- a/lib/rollups/utils.ts +++ b/lib/rollups/utils.ts @@ -33,5 +33,5 @@ export const formatZkEvmL2TxnBatchStatus = (status: typeof ZKEVM_L2_TX_BATCH_STA }; export const formatZkSyncL2TxnBatchStatus = (status: typeof ZKSYNC_L2_TX_BATCH_STATUSES[number]) => { - return status.replace('L1', layerLabels.parent).replace('L2', layerLabels.current); + return status.replace('L2', layerLabels.current).replace('L1', layerLabels.parent); }; diff --git a/ui/block/BlockDetails.tsx b/ui/block/BlockDetails.tsx index dec8f49e2a..2d90281af5 100644 --- a/ui/block/BlockDetails.tsx +++ b/ui/block/BlockDetails.tsx @@ -47,6 +47,8 @@ import BlockDetailsBlobInfo from './details/BlockDetailsBlobInfo'; import BlockDetailsZilliqaQuorumCertificate from './details/BlockDetailsZilliqaQuorumCertificate'; import type { BlockQuery } from './useBlockQuery'; +const zkSyncVerificationSteps = ZKSYNC_L2_TX_BATCH_STATUSES.map(formatZkSyncL2TxnBatchStatus); + interface Props { query: BlockQuery; } @@ -308,7 +310,7 @@ const BlockDetails = ({ query }: Props) => { { rollupFeature.type === 'zkSync' && data.zksync && ( diff --git a/ui/txnBatches/arbitrumL2/ArbitrumL2TxnBatchDetails.tsx b/ui/txnBatches/arbitrumL2/ArbitrumL2TxnBatchDetails.tsx index 18032a7532..f7c0570be1 100644 --- a/ui/txnBatches/arbitrumL2/ArbitrumL2TxnBatchDetails.tsx +++ b/ui/txnBatches/arbitrumL2/ArbitrumL2TxnBatchDetails.tsx @@ -139,7 +139,7 @@ const ArbitrumL2TxnBatchDetails = ({ query }: Props) => { { layerLabels.parent } block diff --git a/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx b/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx index f9f41342d4..9941225c7f 100644 --- a/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx +++ b/ui/txnBatches/zkEvmL2/ZkEvmL2TxnBatchDetails.tsx @@ -23,6 +23,8 @@ import HashStringShortenDynamic from 'ui/shared/HashStringShortenDynamic'; import PrevNext from 'ui/shared/PrevNext'; import VerificationSteps from 'ui/shared/verificationSteps/VerificationSteps'; +const verificationSteps = ZKEVM_L2_TX_BATCH_STATUSES.map(formatZkEvmL2TxnBatchStatus); + interface Props { query: UseQueryResult; } @@ -85,7 +87,7 @@ const ZkEvmL2TxnBatchDetails = ({ query }: Props) => {