review fix

types/api/arbitrumL2.ts

@@ -8,7 +8,7 @@ export type ArbitrumL2MessagesItem = {
   origination_timestamp: string | null;
   origination_transaction_block_number: number;
   origination_transaction_hash: string;
-  status: string;
+  status: 'initiated' | 'sent' | 'confirmed' | 'relayed';
 }
 
 export type ArbitrumL2MessagesResponse = {

ui/blocks/BlocksContent.tsx

@@ -23,11 +23,11 @@ const TABS_HEIGHT = 88;
 interface Props {
   type?: BlockType;
   query: QueryWithPagesResult<'blocks'>;
-  showSocketInfo?: boolean;
+  enableSocket?: boolean;
   top?: number;
 }
 
-const BlocksContent = ({ type, query, showSocketInfo = true, top }: Props) => {
+const BlocksContent = ({ type, query, enableSocket = true, top }: Props) => {
   const queryClient = useQueryClient();
   const isMobile = useIsMobile();
   const [ socketAlert, setSocketAlert ] = React.useState('');
@@ -73,7 +73,7 @@ const BlocksContent = ({ type, query, showSocketInfo = true, top }: Props) => {
     topic: 'blocks:new_block',
     onSocketClose: handleSocketClose,
     onSocketError: handleSocketError,
-    isDisabled: query.isPlaceholderData || query.isError || query.pagination.page !== 1 || !showSocketInfo,
+    isDisabled: query.isPlaceholderData || query.isError || query.pagination.page !== 1 || !enableSocket,
   });
   useSocketMessage({
     channel,
@@ -84,7 +84,7 @@ const BlocksContent = ({ type, query, showSocketInfo = true, top }: Props) => {
   const content = query.data?.items ? (
     <>
       <Box display={{ base: 'block', lg: 'none' }}>
-        { query.pagination.page === 1 && showSocketInfo && (
+        { query.pagination.page === 1 && enableSocket && (
           <SocketNewItemsNotice.Mobile
             url={ window.location.href }
             num={ newItemsCount }
@@ -101,7 +101,7 @@ const BlocksContent = ({ type, query, showSocketInfo = true, top }: Props) => {
           top={ top || (query.pagination.isVisible ? TABS_HEIGHT : 0) }
           page={ query.pagination.page }
           isLoading={ query.isPlaceholderData }
-          showSocketInfo={ query.pagination.page === 1 && showSocketInfo }
+          showSocketInfo={ query.pagination.page === 1 && enableSocket }
           socketInfoNum={ newItemsCount }
           socketInfoAlert={ socketAlert }
         />

ui/deposits/zkEvmL2/ZkEvmL2DepositsListItem.tsx

@@ -70,7 +70,7 @@ const ZkEvmL2DepositsListItem = ({ item, isLoading }: Props) => {
             truncation="constant_long"
           />
         ) : (
-          <chakra.span color="text_secondary">
+          <chakra.span>
           Pending Claim
           </chakra.span>
         ) }

ui/messages/ArbitrumL2MessagesListItem.tsx

@@ -80,7 +80,7 @@ const ArbitrumL2MessagesListItem = ({ item, isLoading, direction }: Props) => {
             truncation="constant_long"
           />
         ) : (
-          <chakra.span color="text_secondary">
+          <chakra.span>
             N/A
           </chakra.span>
         ) }
@@ -107,7 +107,7 @@ const ArbitrumL2MessagesListItem = ({ item, isLoading, direction }: Props) => {
             truncation="constant_long"
           />
         ) : (
-          <chakra.span color="text_secondary">
+          <chakra.span>
             N/A
           </chakra.span>
         ) }

ui/pages/ArbitrumL2TxnBatch.tsx

@@ -96,7 +96,7 @@ const ArbitrumL2TxnBatch = () => {
     {
       id: 'blocks',
       title: 'Blocks',
-      component: <BlocksContent type="block" query={ batchBlocksQuery } showSocketInfo={ false } top={ hasPagination ? TABS_HEIGHT : 0 }/>,
+      component: <BlocksContent type="block" query={ batchBlocksQuery } enableSocket={ false } top={ hasPagination ? TABS_HEIGHT : 0 }/>,
     },
   ].filter(Boolean)), [ batchQuery, batchTxsQuery, batchBlocksQuery, hasPagination ]);
 

ui/shared/statusTag/StatusTag.tsx

@@ -19,6 +19,8 @@ const StatusTag = ({ type, text, errorText, isLoading, className }: Props) => {
   let icon: IconName;
   let colorScheme;
 
+  const capitalizedText = text.charAt(0).toUpperCase() + text.slice(1);
+
   switch (type) {
     case 'ok':
       icon = 'status/success';
@@ -38,7 +40,7 @@ const StatusTag = ({ type, text, errorText, isLoading, className }: Props) => {
     <Tooltip label={ errorText }>
       <Tag colorScheme={ colorScheme } display="flex" isLoading={ isLoading } className={ className }>
         <IconSvg boxSize={ 2.5 } name={ icon } mr={ 1 } flexShrink={ 0 }/>
-        <TagLabel display="block">{ text }</TagLabel>
+        <TagLabel display="block">{ capitalizedText }</TagLabel>
       </Tag>
     </Tooltip>
   );

ui/withdrawals/zkEvmL2/ZkEvmL2WithdrawalsListItem.tsx

@@ -70,7 +70,7 @@ const ZkEvmL2WithdrawalsListItem = ({ item, isLoading }: Props) => {
             truncation="constant_long"
           />
         ) : (
-          <chakra.span color="text_secondary">
+          <chakra.span>
             Pending Claim
           </chakra.span>
         ) }