diff --git a/app/transactions/loading.tsx b/app/transactions/loading.tsx index 4349ac3..0a84f4d 100644 --- a/app/transactions/loading.tsx +++ b/app/transactions/loading.tsx @@ -1,3 +1,11 @@ +import { RefreshCw } from "lucide-react"; + export default function Loading() { - return null; + return ( +
+
+ +
+
+ ); } diff --git a/app/transactions/page.tsx b/app/transactions/page.tsx index 04e9563..abb0364 100644 --- a/app/transactions/page.tsx +++ b/app/transactions/page.tsx @@ -2,7 +2,8 @@ import { useState, useMemo, useEffect, useCallback } from "react"; import { useSearchParams } from "next/navigation"; -import { PageLayout, LoadingState, PageHeader } from "@/components/layout"; +import { PageLayout, PageHeader } from "@/components/layout"; +import { RefreshCw } from "lucide-react"; import { TransactionFilters, TransactionBulkActions, @@ -252,10 +253,6 @@ export default function TransactionsPage() { queryClient.invalidateQueries({ queryKey: ["banking-metadata"] }); }, [invalidateTransactions, queryClient]); - if (isLoadingMetadata || !metadata) { - return ; - } - const formatCurrency = (amount: number) => { return new Intl.NumberFormat("fr-FR", { style: "currency", @@ -530,6 +527,17 @@ export default function TransactionsPage() { const totalTransactions = transactionsData?.total || 0; const hasMore = transactionsData?.hasMore || false; + // Early return for loading state - prevents sidebar flash + if (isLoadingMetadata || !metadata) { + return ( +
+
+ +
+
+ ); + } + return ( {isLoadingTransactions ? ( - +
+ +
) : ( <>