From 562e23d8bf1c7e4a13ccd55cf5e62140cd1bedbc Mon Sep 17 00:00:00 2001
From: Consultoria AS <desarrollo@consultoria-as.com>
Date: Tue, 17 Feb 2026 07:21:41 +0000
Subject: [PATCH] perf(cfdi): add skeleton loader for better perceived
 performance

- Replace "Cargando..." text with animated skeleton rows
- Mimics table structure while loading
- Improves perceived loading speed

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 apps/web/app/(dashboard)/cfdi/page.tsx | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/apps/web/app/(dashboard)/cfdi/page.tsx b/apps/web/app/(dashboard)/cfdi/page.tsx
index bc0ea39..47cfb34 100644
--- a/apps/web/app/(dashboard)/cfdi/page.tsx
+++ b/apps/web/app/(dashboard)/cfdi/page.tsx
@@ -1202,8 +1202,20 @@ export default function CfdiPage() {
           </CardHeader>
           <CardContent>
             {isLoading ? (
-              <div className="text-center py-8 text-muted-foreground">
-                Cargando...
+              <div className="space-y-3">
+                {/* Skeleton loader */}
+                {[...Array(8)].map((_, i) => (
+                  <div key={i} className="flex items-center gap-4 animate-pulse">
+                    <div className="h-4 bg-muted rounded w-20"></div>
+                    <div className="h-5 bg-muted rounded w-16"></div>
+                    <div className="h-4 bg-muted rounded w-12"></div>
+                    <div className="h-4 bg-muted rounded flex-1 max-w-[180px]"></div>
+                    <div className="h-4 bg-muted rounded flex-1 max-w-[180px]"></div>
+                    <div className="h-4 bg-muted rounded w-24 ml-auto"></div>
+                    <div className="h-5 bg-muted rounded w-16"></div>
+                    <div className="h-8 bg-muted rounded w-8"></div>
+                  </div>
+                ))}
               </div>
             ) : data?.data.length === 0 ? (
               <div className="text-center py-8 text-muted-foreground">