diff --git a/src/components/Blocks/BlocksList.tsx b/src/components/Blocks/BlocksList.tsx
index cc05f4f..adb1be9 100644
--- a/src/components/Blocks/BlocksList.tsx
+++ b/src/components/Blocks/BlocksList.tsx
@@ -78,7 +78,7 @@ export const PaginatedBlocksList = () => {
const isLoading = isLoadingStats || isLoadingBlocks
if (isLoading) {
- return
+ return
}
if (!blocks || blocks?.length === 0 || isError) {
diff --git a/src/components/Layout/Loading.tsx b/src/components/Layout/Loading.tsx
index f8c4b05..7799381 100644
--- a/src/components/Layout/Loading.tsx
+++ b/src/components/Layout/Loading.tsx
@@ -1,4 +1,14 @@
-import { Card, CardBody, SkeletonText, Spinner, Square, Stack, Text } from '@chakra-ui/react'
+import {
+ Card,
+ CardBody,
+ Flex,
+ SkeletonCircle,
+ SkeletonText,
+ SkeletonTextProps,
+ Spinner,
+ Square,
+ Text,
+} from '@chakra-ui/react'
import { Trans } from 'react-i18next'
export const Loading = () => (
@@ -10,14 +20,28 @@ export const Loading = () => (
)
-export const LoadingCards = ({ length = 4 }: { length?: number }) => (
-
+export const LoadingCards = ({
+ length = 4,
+ skeletonCircle,
+ ...rest
+}: {
+ length?: number
+ skeletonCircle?: boolean
+} & SkeletonTextProps) => (
+ <>
{Array.from({ length }).map((_, i) => (
-
+
+ {skeletonCircle && (
+ <>
+
+
+
+ >
+ )}
-
+
))}
-
+ >
)
diff --git a/src/components/Organizations/List.tsx b/src/components/Organizations/List.tsx
index 965b1d3..8f60384 100644
--- a/src/components/Organizations/List.tsx
+++ b/src/components/Organizations/List.tsx
@@ -50,7 +50,7 @@ export const PaginatedOrganizationsList = () => {
const isLoading = isLoadingCount || isLoadingOrgs
if (isLoading || (query && isFetching)) {
- return
+ return
}
if (!orgs || orgs?.organizations.length === 0 || isError) {
diff --git a/src/components/Process/ProcessList.tsx b/src/components/Process/ProcessList.tsx
index a6f7692..8ba0084 100644
--- a/src/components/Process/ProcessList.tsx
+++ b/src/components/Process/ProcessList.tsx
@@ -120,7 +120,7 @@ export const PaginatedProcessList = () => {
const isLoading = isLoadingCount || isLoadingProcesses
if (isLoading || (isFetching && !isEmpty(processFilters))) {
- return
+ return
}
if (!processes || processes?.elections.length === 0 || isError) {
diff --git a/src/components/Transactions/TransactionList.tsx b/src/components/Transactions/TransactionList.tsx
index a3e28aa..1df17a9 100644
--- a/src/components/Transactions/TransactionList.tsx
+++ b/src/components/Transactions/TransactionList.tsx
@@ -114,7 +114,7 @@ const TransactionsList = ({
}) => {
return (
<>
- {isLoading && }
+ {isLoading && }
{!data || data?.transactions.length === 0 || (isError && )}
{data && data.transactions.length > 0 && (