#120 Arreglado bug cargando

Signed-off-by: danigonzser <[email protected]>

src/app/(home)/catalogues/[id]/page.tsx

@@ -4,6 +4,7 @@ import { Suspense } from "react"
 import type { Metadata } from 'next'
 import CatalogueNav from "@/components/catalogue_navegation"
 import TitleSkeleton from "@/components/title_skeleton"
+import MemesSkeleton from "@/components/memes_skeleton"
 
 export async function generateMetadata(
   props: {
@@ -41,7 +42,7 @@ export default async function CatalogueMemes(
           </Suspense>
         </h1>
       </div >
-      <Suspense>
+      <Suspense fallback={<MemesSkeleton />}>
         <Thumbs paramId={params.id} />
       </Suspense>
     </>

src/components/memes_skeleton.tsx

@@ -3,9 +3,13 @@ import { Skeleton } from "./ui/skeleton"
 export default function MemesSkeleton() {
   return (
     <div className="flex flex-col content-center items-center px-4 py-8">
-      {[...Array(30)].map((key) => (
-        <Skeleton key={key} className="h-[225px] w-[400px] bg-muted-foreground/20 rounded-xl" />
-      ))}
+      <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+        {[...Array(30)].map((key) => (
+          <div key={key}>
+            <Skeleton key={key} className="h-[225px] w-[400px] bg-muted-foreground/20 rounded-xl" />
+          </div>
+        ))}
+      </div >
     </div >
   )
 }