diff --git a/src/components/Stats/LatestBlocks.tsx b/src/components/Stats/LatestBlocks.tsx
index b22a27a..486b7a8 100644
--- a/src/components/Stats/LatestBlocks.tsx
+++ b/src/components/Stats/LatestBlocks.tsx
@@ -1,50 +1,30 @@
-import { Button, Stack } from '@chakra-ui/react'
+import { Flex } from '@chakra-ui/react'
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 { PaginatedAsyncList } from '~components/Layout/AsyncList'
import { useBlockList } from '~queries/blocks'
-import { useChainInfo } from '~queries/stats'
export const LatestBlocks = () => {
const blockListSize = 3
- const { data: stats, isLoading: isLoadingStats } = useChainInfo()
- const {
- data: blocks,
- isLoading: isLoadingBlocks,
- error,
- isError,
- } = useBlockList({
+ const { data, isLoading, error, isError } = useBlockList({
params: {
page: 0,
limit: blockListSize,
},
- enabled: !!stats?.height,
placeholderData: keepPreviousData,
})
- const isLoading = isLoadingStats || isLoadingBlocks
-
- if (isLoading || !stats || !stats?.height || !blocks) {
- return
- }
-
- if (isError) {
- return
- }
-
return (
-
- {blocks.blocks.map((block, i) => (
-
- ))}
-
-
+
+ }
+ skeletonProps={{ length: blockListSize }}
+ />
+
)
}