fix: models hub should show latest data only (#5925)

* fix: models hub should show latest data only

* test: correct expected result

web-app/src/hooks/__tests__/useModelSources.test.ts

@@ -33,7 +33,7 @@ describe('useModelSources', () => {
     // Get the mocked function
     const { fetchModelCatalog } = await import('@/services/models')
     mockFetchModelCatalog = fetchModelCatalog as any
-    
+
     // Reset store state to defaults
     useModelSources.setState({
       sources: [],
@@ -98,7 +98,7 @@ describe('useModelSources', () => {
       expect(result.current.sources).toEqual([])
     })
 
-    it('should merge new sources with existing ones', async () => {
+    it('should not merge new sources with existing ones', async () => {
       const existingSources: CatalogModel[] = [
         {
           model_name: 'existing-model',
@@ -132,7 +132,7 @@ describe('useModelSources', () => {
         await result.current.fetchSources()
       })
 
-      expect(result.current.sources).toEqual([...newSources, ...existingSources])
+      expect(result.current.sources).toEqual(newSources)
     })
 
     it('should not duplicate models with same model_name', async () => {
@@ -175,15 +175,7 @@ describe('useModelSources', () => {
         await result.current.fetchSources()
       })
 
-      expect(result.current.sources).toEqual([
-        ...newSources,
-        {
-          model_name: 'unique-model',
-          provider: 'provider',
-          description: 'Unique model',
-          version: '1.0.0',
-        },
-      ])
+      expect(result.current.sources).toEqual(newSources)
     })
 
     it('should handle empty sources response', async () => {
@@ -236,7 +228,7 @@ describe('useModelSources', () => {
   describe('addSource', () => {
     it('should add a new source to the store', () => {
       const { result } = renderHook(() => useModelSources())
-      
+
       const testModel: CatalogModel = {
         model_name: 'test-model',
         description: 'Test model description',
@@ -263,7 +255,7 @@ describe('useModelSources', () => {
 
     it('should replace existing source with same model_name', () => {
       const { result } = renderHook(() => useModelSources())
-      
+
       const originalModel: CatalogModel = {
         model_name: 'duplicate-model',
         description: 'Original description',
@@ -306,7 +298,7 @@ describe('useModelSources', () => {
 
     it('should handle multiple different sources', () => {
       const { result } = renderHook(() => useModelSources())
-      
+
       const model1: CatalogModel = {
         model_name: 'model-1',
         description: 'First model',
@@ -342,7 +334,7 @@ describe('useModelSources', () => {
 
     it('should handle CatalogModel with complete quants data', () => {
       const { result } = renderHook(() => useModelSources())
-      
+
       const modelWithQuants: CatalogModel = {
         model_name: 'model-with-quants',
         description: 'Model with quantizations',
@@ -475,7 +467,7 @@ describe('useModelSources', () => {
         await result.current.fetchSources()
       })
 
-      expect(result.current.sources).toEqual([...sources2, ...sources1])
+      expect(result.current.sources).toEqual(sources2)
     })
 
     it('should handle fetch after error', async () => {
@@ -510,4 +502,4 @@ describe('useModelSources', () => {
       expect(result.current.sources).toEqual(mockSources)
     })
   })
-})
+})

web-app/src/hooks/useModelSources.ts

@@ -31,15 +31,9 @@ export const useModelSources = create<ModelSourcesState>()(
         set({ loading: true, error: null })
         try {
           const newSources = await fetchModelCatalog()
-          const currentSources = get().sources
 
           set({
-            sources: [
-              ...newSources,
-              ...currentSources.filter(
-                (e) => !newSources.some((s) => s.model_name === e.model_name)
-              ),
-            ],
+            sources: newSources.length ? newSources : get().sources,
             loading: false,
           })
         } catch (error) {

web-app/src/routes/hub/index.tsx

@@ -145,8 +145,12 @@ function Hub() {
           const repoInfo = await fetchHuggingFaceRepo(search.repo)
           if (repoInfo) {
             const catalogModel = convertHfRepoToCatalogModel(repoInfo)
-            setHuggingFaceRepo(catalogModel)
-            addSource(catalogModel)
+            if (
+              !sources.some((s) => s.model_name === catalogModel.model_name)
+            ) {
+              setHuggingFaceRepo(catalogModel)
+              addSource(catalogModel)
+            }
           }
 
           await fetchSources()
@@ -157,7 +161,7 @@ function Hub() {
         }
       }, 500)
     }
-  }, [convertHfRepoToCatalogModel, fetchSources, addSource, search])
+  }, [convertHfRepoToCatalogModel, fetchSources, addSource, search, sources])
 
   // Sorting functionality
   const sortedModels = useMemo(() => {
@@ -247,8 +251,12 @@ function Hub() {
           const repoInfo = await fetchHuggingFaceRepo(e.target.value)
           if (repoInfo) {
             const catalogModel = convertHfRepoToCatalogModel(repoInfo)
-            setHuggingFaceRepo(catalogModel)
-            addSource(catalogModel)
+            if (
+              !sources.some((s) => s.model_name === catalogModel.model_name)
+            ) {
+              setHuggingFaceRepo(catalogModel)
+              addSource(catalogModel)
+            }
           }
 
           // Original addSource logic (if needed)