Refactor samples gallery

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

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>
     )