Fix new types

src/components/Accounts/Details/Transfers.tsx

@@ -128,7 +128,7 @@ const TransfersRow = ({
               toCopy={transfer.txHash}
               fontWeight={'normal'}
               fontSize={'sm'}
-              to={generatePath(RoutePath.TransactionByHashOrHeight, { hashOrHeight: transfer.txHash })}
+              to={generatePath(RoutePath.TransactionByHash, { hash: transfer.txHash, tab: null })}
             >
               {transfer.txHash}
             </ReducedTextAndCopy>

src/components/Blocks/BlockCard.tsx

@@ -1,30 +1,25 @@
-import { Box, Card, CardBody, Flex, Link, HStack, Icon, Text } from '@chakra-ui/react'
-import { BlockError, BlockNotFoundError } from '@vocdoni/extended-sdk'
-import { IChainBlockInfoResponse } from '@vocdoni/sdk'
-import { Trans, useTranslation } from 'react-i18next'
-import { BiTransferAlt } from 'react-icons/bi'
+import { Box, CardBody, Flex, HStack, Icon, Text } from '@chakra-ui/react'
+import { IBlock } from '@vocdoni/sdk'
+import { Trans } from 'react-i18next'
 
-import { generatePath, Link as RouterLink } from 'react-router-dom'
+import { generatePath } from 'react-router-dom'
 import { ReducedTextAndCopy } from '~components/Layout/CopyButton'
 import LinkCard from '~components/Layout/LinkCard'
 import { RoutePath } from '~constants'
 import { useDateFns } from '~i18n/use-date-fns'
 import { Icons } from '~src/theme/components/Icons'
 
 interface IBlockCardProps {
-  block: IChainBlockInfoResponse | BlockError
+  block: IBlock
   compact?: boolean
 }
 
 export const BlockCard = ({ block, compact = false }: IBlockCardProps) => {
   const { formatDistance } = useDateFns()
-  if (block instanceof BlockError) return <BlockErrorCard error={block} height={block.height} />
 
-  const height = block.header.height
-  const time = block.header.time
-  const proposer = block.header.proposerAddress
-  // Not on the SDK yet
-  // @ts-ignore
+  const height = block.height
+  const time = block.time
+  const proposer = block.proposer
   const txn = block.txCount
 
   const date = new Date(time)
@@ -62,21 +57,3 @@ export const BlockCard = ({ block, compact = false }: IBlockCardProps) => {
     </LinkCard>
   )
 }
-
-const BlockErrorCard = ({ height, error }: { height: number; error: BlockError }) => {
-  const { t } = useTranslation()
-
-  let message = error.message
-  if (error instanceof BlockNotFoundError) {
-    message = t('blocks.block_not_found')
-  }
-
-  return (
-    <Card>
-      <CardBody>
-        <Text fontWeight='bold'># {height}</Text>
-        <Text wordBreak='break-word'>{message}</Text>
-      </CardBody>
-    </Card>
-  )
-}

src/components/Blocks/BlocksList.tsx

@@ -3,12 +3,12 @@ import { useCallback, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { generatePath, useNavigate } from 'react-router-dom'
 import { BlockCard } from '~components/Blocks/BlockCard'
+import { PaginatedAsyncList } from '~components/Layout/AsyncList'
 import { PopoverInputSearch } from '~components/Layout/Inputs'
 import { RoutedPaginationProvider, useRoutedPagination } from '~components/Pagination/PaginationProvider'
 import { PaginationItemsPerPage, RefreshIntervalBlocks, RoutePath } from '~constants'
 import { useBlockList } from '~queries/blocks'
 import { useChainInfo } from '~queries/stats'
-import { PaginatedAsyncList } from '~components/Layout/AsyncList'
 
 export const BlocksFilter = () => {
   const { t } = useTranslation()
@@ -67,7 +67,6 @@ export const BlocksList = () => {
     error,
   } = useBlockList({
     params: {
-      totalItems: blockCount,
       page: page,
       limit: PaginationItemsPerPage,
     },

src/components/Blocks/Detail.tsx

@@ -7,11 +7,11 @@ import { ReducedTextAndCopy } from '~components/Layout/CopyButton'
 import { DetailsGrid, GridItemProps } from '~components/Layout/DetailsGrid'
 import { RouteParamsTabs } from '~components/Layout/RouteParamsTabs'
 import { RawContentBox } from '~components/Layout/ShowRawButton'
+import TextAndTag from '~components/Layout/TextAndTag'
 import { PaginatedBlockTransactionsList } from '~components/Transactions/TransactionList'
 import { RefreshIntervalBlocks, RoutePath } from '~constants'
 import { useDateFns } from '~i18n/use-date-fns'
 import { useBlocksHeight } from '~queries/blocks'
-import TextAndTag from '~components/Layout/TextAndTag'
 
 const HeightNavigator = ({ height }: { height: number }) => {
   const { data, isLoading } = useBlocksHeight({
@@ -117,8 +117,6 @@ const DetailsTab = ({ block }: { block: IChainBlockInfoResponse }) => {
 export const BlockDetail = ({ block }: { block: IChainBlockInfoResponse }) => {
   const height = block.header.height
   const date = new Date(block.header.time)
-  // Not on the SDK yet
-  // @ts-ignore
   const txCount = block.txCount
 
   const { t } = useTranslation()
@@ -142,7 +140,10 @@ export const BlockDetail = ({ block }: { block: IChainBlockInfoResponse }) => {
             <Trans i18nKey={'process.tab_details'}>Details</Trans>
           </Tab>
           <Tab>
-            <TextAndTag text={t('process.tab_txs', { defaultValue: 'Transactions' })} tagLabel={txCount ?? '0'} />
+            <TextAndTag
+              text={t('process.tab_txs', { defaultValue: 'Transactions' })}
+              tagLabel={txCount.toString() ?? '0'}
+            />
           </Tab>
           <Tab>
             <Trans i18nKey={'raw'}>Raw</Trans>

src/components/Process/Card.tsx

@@ -1,17 +1,17 @@
 import { CardBody, CardProps, Flex, HStack } from '@chakra-ui/react'
 import { ElectionSchedule, ElectionTitle } from '@vocdoni/chakra-components'
 import { ElectionProvider, OrganizationProvider, useElection } from '@vocdoni/react-providers'
-import { ArchivedElection, InvalidElection as InvalidElectionType, PublishedElection } from '@vocdoni/sdk'
+import { InvalidElection as InvalidElectionType, PublishedElection } from '@vocdoni/sdk'
 import { generatePath } from 'react-router-dom'
+import { SmallAccountCard } from '~components/Accounts/Card'
 import { ElectionStatusBadge } from '~components/Accounts/StatusBadge'
+import LinkCard from '~components/Layout/LinkCard'
 import InvalidElection from '~components/Process/InvalidElection'
 import { RoutePath } from '~constants'
-import { SmallAccountCard } from '~components/Accounts/Card'
-import LinkCard from '~components/Layout/LinkCard'
 
 export type ElectionCardProps = {
   id?: string
-  election?: PublishedElection | ArchivedElection | InvalidElectionType
+  election?: PublishedElection | InvalidElectionType
 } & CardProps
 
 /**

src/components/Process/Detail.tsx

@@ -26,18 +26,18 @@ import {
 import { useElection } from '@vocdoni/react-providers'
 import { ElectionStatus, IElectionInfoResponse, InvalidElection as InvalidElectionType } from '@vocdoni/sdk'
 import { Trans, useTranslation } from 'react-i18next'
+import { AccountCard } from '~components/Accounts/Card'
+import { ElectionStatusBadge } from '~components/Accounts/StatusBadge'
+import { PaginatedEnvelopeList } from '~components/Envelope/EnvelopeList'
+import { NoResultsError } from '~components/Layout/ContentError'
 import { ReducedTextAndCopy } from '~components/Layout/CopyButton'
 import { HeroHeaderLayout } from '~components/Layout/HeroHeaderLayout'
+import { RouteParamsTabs } from '~components/Layout/RouteParamsTabs'
 import { RawContentBox } from '~components/Layout/ShowRawButton'
-import { AccountCard } from '~components/Accounts/Card'
-import { ElectionStatusBadge } from '~components/Accounts/StatusBadge'
 import InvalidElection from '~components/Process/InvalidElection'
 import { FallbackHeaderImg, RoutePath } from '~constants'
 import { useElectionKeys } from '~queries/processes'
 import { ucfirst } from '~utils/strings'
-import { RouteParamsTabs } from '~components/Layout/RouteParamsTabs'
-import { NoResultsError } from '~components/Layout/ContentError'
-import { PaginatedEnvelopeList } from '~components/Envelope/EnvelopeList'
 
 const Detail = () => {
   const { election } = useElection()
@@ -52,9 +52,6 @@ const Detail = () => {
 
   const raw = election.raw as IElectionInfoResponse
   const censusOrigin = ucfirst(raw.census.censusOrigin.replace('_', ' ').toLocaleLowerCase())
-  const autoStart = raw.electionMode.autoStart
-    ? t('processes.process_mode_badge.autostart')
-    : t('processes.process_mode_badge.notAutostart')
   const encryptedVotes = raw.voteMode.encryptedVotes
     ? t('processes.envelope_type_badge.encrypted_votes')
     : t('processes.envelope_type_badge.not_encrypted_votes')
@@ -96,18 +93,12 @@ const Detail = () => {
       {/*Information tags */}
       <Flex wrap={'wrap'} gap={2}>
         <QuestionsTypeBadge />
-        {election.fromArchive && (
-          <Tag variant={'vocdoni'}>
-            <Trans i18nKey={'process.badge.archive'}>From archive</Trans>
-          </Tag>
-        )}
         {raw.voteMode.anonymous && (
           <Tag variant={'vocdoni'}>
             <Trans i18nKey={'process.badge.anonymous'}>Anonymous</Trans>
           </Tag>
         )}
         <Tag variant={'vocdoni'}>{censusOrigin}</Tag>
-        <Tag variant={'vocdoni'}>{autoStart}</Tag>
         <Tag variant={'vocdoni'}>{encryptedVotes}</Tag>
       </Flex>
       {/*Organization card and other cards*/}

src/components/Stats/LatestBlocks.tsx

@@ -3,11 +3,11 @@ import { keepPreviousData } from '@tanstack/react-query'
 import { Trans } from 'react-i18next'
 import { generatePath, Link as RouterLink } from 'react-router-dom'
 import { BlockCard } from '~components/Blocks/BlockCard'
+import { ContentError } from '~components/Layout/ContentError'
 import { LoadingCards } from '~components/Layout/Loading'
 import { RoutePath } from '~constants'
 import { useBlockList } from '~queries/blocks'
 import { useChainInfo } from '~queries/stats'
-import { ContentError } from '~components/Layout/ContentError'
 
 export const LatestBlocks = () => {
   const blockListSize = 3
@@ -22,7 +22,6 @@ export const LatestBlocks = () => {
     params: {
       page: 0,
       limit: blockListSize,
-      totalItems: stats?.height ?? 0,
     },
     enabled: !!stats?.height,
     placeholderData: keepPreviousData,

src/components/Transactions/Detail.tsx

@@ -5,13 +5,13 @@ import { RouteParamsTabs } from '~components/Layout/RouteParamsTabs'
 import { RawContentBox } from '~components/Layout/ShowRawButton'
 import { SpecificTxDetails } from '~components/Transactions/TxDetails/SpecificTxDetails'
 import { TxDetailsGrid } from '~components/Transactions/TxDetails/TxDetails'
+import { RoutePath } from '~constants'
 import { useDateFns } from '~i18n/use-date-fns'
 import { useBlockToDate } from '~queries/stats'
 import { objectB64StringsToHex } from '~utils/objects'
-import { RoutePath } from '~constants'
 
 export const TransactionDetail = (tx: Tx) => {
-  const { data } = useBlockToDate({ height: tx.txInfo.blockHeight })
+  const { data } = useBlockToDate({ height: tx.txInfo.height })
   const { formatDistance } = useDateFns()
 
   let createdOn = ''
@@ -33,8 +33,9 @@ export const TransactionDetail = (tx: Tx) => {
     <Flex direction={'column'} mt={'40px'} gap={6}>
       <VStack align='start'>
         <Heading isTruncated wordBreak='break-word' mb={0}>
-          <Trans i18nKey={'transactions.tx_title'} number={tx.txInfo.transactionNumber}>
-            Transaction #{{ number: tx.txInfo.transactionNumber }}
+          <Trans i18nKey={'transactions.tx_title'} number={tx.txInfo.index}>
+            // todo(sdkbump)
+            {/*Transaction #{{ number: tx.txInfo.transactionNumber }}*/}
           </Trans>
         </Heading>
         {createdOn && (

src/components/Transactions/TransactionCard.tsx

@@ -1,45 +1,44 @@
-import { Box, CardBody, Flex, Tag, Text } from '@chakra-ui/react'
-import { IChainTxReference, TransactionType } from '@vocdoni/sdk'
-import { Trans } from 'react-i18next'
+import { Box, CardBody, Flex, Icon, Tag } from '@chakra-ui/react'
+import { IChainTxReference } from '@vocdoni/sdk'
 import { generatePath } from 'react-router-dom'
 import { ReducedTextAndCopy } from '~components/Layout/CopyButton'
-import { RoutePath } from '~constants'
-import LinkCard from '~components/Layout/LinkCard'
 import { BlockIconLink } from '~components/Layout/IconLink'
+import LinkCard from '~components/Layout/LinkCard'
+import { RoutePath } from '~constants'
+import { Icons } from '~src/theme/components/Icons'
 
-export const TransactionTypeBadge = ({ transactionType }: { transactionType: TransactionType }) => {
+export const TransactionTypeBadge = ({ transactionType }: { transactionType: string }) => {
   return (
     <Tag bg={'#f3fccc'} color={'#74af07'} variant={'vocdoni'}>
       {transactionType}
     </Tag>
   )
 }
 
-export const TransactionCard = ({
-  transactionIndex,
-  transactionType,
-  transactionNumber,
-  transactionHash,
-  blockHeight,
-}: IChainTxReference) => {
+export const TransactionCard = ({ index, hash, height, subtype }: IChainTxReference) => {
   return (
     <LinkCard
       to={generatePath(RoutePath.Transaction, {
-        block: blockHeight.toString(),
-        index: transactionIndex.toString(),
+        block: height.toString(),
+        index: index.toString(),
         tab: null,
       })}
     >
       <CardBody>
         <Flex gap={3} direction={'column'}>
           <Flex gap={2}>
-            <TransactionTypeBadge transactionType={transactionType} />
-            <BlockIconLink height={blockHeight} />
+            <TransactionTypeBadge transactionType={subtype} />
           </Flex>
-          <Text fontWeight='bold'># {transactionNumber}</Text>
+
+          <Flex align='center' gap={2}>
+            <Icon as={Icons.TxIcon} />
+            <Box>{index}</Box>
+            <BlockIconLink height={height} />
+          </Flex>
+
           <Flex gap={2} align={'center'}>
-            <ReducedTextAndCopy fontSize={'sm'} color={'textAccent1'} toCopy={transactionHash}>
-              {transactionHash}
+            <ReducedTextAndCopy fontSize={'sm'} color={'textAccent1'} toCopy={hash}>
+              {hash}
             </ReducedTextAndCopy>
           </Flex>
         </Flex>

src/components/Transactions/TransactionList.tsx

@@ -1,43 +1,41 @@
 import { Flex } from '@chakra-ui/react'
 import { keepPreviousData } from '@tanstack/react-query'
 import { IChainTxListResponse } from '@vocdoni/sdk'
+import { useCallback, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { generatePath, useNavigate } from 'react-router-dom'
+import { PaginatedAsyncList } from '~components/Layout/AsyncList'
 import { PopoverInputSearch } from '~components/Layout/Inputs'
 import { RoutedPaginationProvider, useRoutedPagination } from '~components/Pagination/PaginationProvider'
 import { TransactionCard } from '~components/Transactions/TransactionCard'
 import { RoutePath } from '~constants'
 import { useBlockTransactions } from '~queries/blocks'
 import { useTransactionList, useTransactionsCount } from '~queries/transactions'
-import { useCallback, useState } from 'react'
 import { isValidHash } from '~utils/strings'
-import { PaginatedAsyncList } from '~components/Layout/AsyncList'
 
 export const TransactionFilter = () => {
   const { t } = useTranslation()
   const navigate = useNavigate()
   const { data } = useTransactionsCount()
-  const [txNumberOrHash, setTxNumberOrHash] = useState('')
+  const [txHash, setTxHash] = useState('')
 
   const goTo = useCallback(() => {
     if (!data) {
       throw new Error(t('transactions.invalid_tx_count', { defaultValue: 'Invalid chain transactions count' }))
     }
-    const num = parseInt(txNumberOrHash)
     // Throw an error if the input is not a valid hash or num is not a number and is not between 0 and data
-    if (!isValidHash(txNumberOrHash) && (isNaN(num) || num <= 0 || num > data)) {
-      throw new Error(t('transactions.invalid_tx_search', { defaultValue: 'Must to be a valid tx hash or index' }))
+    if (!isValidHash(txHash)) {
+      throw new Error(t('transactions.invalid_tx_search', { defaultValue: 'Must to be a valid tx hash' }))
     }
-    const hashOrHeight = isValidHash(txNumberOrHash) ? txNumberOrHash : num.toString()
-    navigate(generatePath(RoutePath.TransactionByHashOrHeight, { hashOrHeight }))
-  }, [txNumberOrHash, data])
+    navigate(generatePath(RoutePath.TransactionByHash, { hash: txHash, tab: null }))
+  }, [txHash, data])
 
   return (
     <PopoverInputSearch
       input={{
         placeholder: t('transactions.go_to_tx', { defaultValue: 'Go to transaction' }),
         onChange: (value: string) => {
-          setTxNumberOrHash(value)
+          setTxHash(value)
         },
       }}
       button={{
@@ -132,7 +130,7 @@ const TransactionsListCards = ({
       component={({ element }) => (
         <TransactionCard
           {...element}
-          blockHeight={height ?? element.blockHeight} // If is IBlockTransactionsResponse the block height is not on tx info
+          height={height ?? element.height} // If is IBlockTransactionsResponse the block height is not on tx info
         />
       )}
       skeletonProps={{ spacing: 4 }}