Refactor samples gallery

Signed-off-by: Felipe Cardoso <felipe.cardoso@hotmail.it>

backend/app/api/routes/samples.py

@@ -10,7 +10,7 @@ router = APIRouter()
 @router.get("/list", response_model=List[Sample])
 async def list_samples(
         request: Request,
-        limit: int = Query(20, ge=1, le=1000),
+        limit: int = Query(200, ge=1, le=1000),
         offset: int = Query(0, ge=0)
 ):
     """
@@ -25,7 +25,7 @@ async def list_samples(
 @router.get("/latest", response_model=List[Sample])
 async def get_latest_samples(
         request: Request,
-        count: int = Query(5, ge=1, le=20)
+        count: int = Query(20, ge=1, le=100)
 ):
     """
     Get the most recent sample images

backend/app/services/sample_manager.py

@@ -191,7 +191,7 @@ class SampleManager:
                 # Wait a bit before retrying on error
                 await asyncio.sleep(5)
 
-    async def list_samples(self, limit: int = 20, offset: int = 0) -> List[Sample]:
+    async def list_samples(self, limit: int = 200, offset: int = 0) -> List[Sample]:
         """List sample images with pagination"""
         logger.info(f"Total samples: {len(self.samples)}")
 
@@ -204,7 +204,7 @@ class SampleManager:
 
         return sorted_samples[offset:offset + limit]
 
-    async def get_latest_samples(self, count: int = 5) -> List[Sample]:
+    async def get_latest_samples(self, count: int = 20) -> List[Sample]:
         """Get most recent samples"""
         return await self.list_samples(limit=count, offset=0)
 

frontend/src/components/SamplesGallery.tsx

@@ -3,15 +3,15 @@ import {useSamples} from '@/contexts/SamplesContext'
 import Image from 'next/image'
 
 export function SamplesGallery() {
-    const {samples, isLoading, error, refreshSamples} = useSamples()
+    const {latestSamples, isLoading, error, refreshSamples} = useSamples()
 
     if (isLoading) return <div>Loading samples...</div>
     if (error) return <div>Error loading samples: {error.message}</div>
-    if (samples.length === 0) return <div>No samples available</div>
+    if (latestSamples.length === 0) return <div>No samples available</div>
 
     return (
-        <div className="grid grid-cols-3 gap-4">
-            {samples.map((sample) => (
+        <div className="grid grid-cols-5 gap-4">
+            {latestSamples.map((sample) => (
                 <div key={sample.filename}>
                     <Image
                         src={`${process.env.NEXT_PUBLIC_API_URL}${sample.url}`}
@@ -20,7 +20,7 @@ export function SamplesGallery() {
                         height={200}
                         className="object-cover rounded"
                     />
-                    <p className="text-sm mt-1">{sample.filename}</p>
+                    <p className="text-sm mt-1">{sample.url.split('__')[1]}</p>
                 </div>
             ))}
         </div>

frontend/src/contexts/SamplesContext.tsx

@@ -4,6 +4,7 @@ import type {Sample} from '@/types/api'
 
 interface SamplesContextType {
     samples: Sample[]
+    latestSamples: Sample[]
     isLoading: boolean
     error: Error | null
     refreshSamples: () => Promise<void>
@@ -37,7 +38,8 @@ export function SamplesProvider({children}: { children: React.ReactNode }) {
     }, [])
 
     return (
-        <SamplesContext.Provider value={{samples, isLoading, error, refreshSamples: fetchSamples}}>
+        <SamplesContext.Provider
+            value={{samples, latestSamples: samples.slice(0, 20), isLoading, error, refreshSamples: fetchSamples}}>
             {children}
         </SamplesContext.Provider>
     )