Add reccommended tag

janhq · Dec 4, 2023 · 3a4f354 · 3a4f354
1 parent f0f5b7d
commit 3a4f354
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 5 deletions.
diff --git a/web/screens/ExploreModels/ExploreModelItem/index.tsx b/web/screens/ExploreModels/ExploreModelItem/index.tsx
@@ -75,12 +75,12 @@ const ExploreModelItem = forwardRef<HTMLDivElement, Props>(({ model }, ref) => {
               </span>
               <p className="mt-2 font-medium uppercase">{model.format}</p>
             </div>
-            <div className="mt-4">
+            {/* <div className="mt-4">
               <span className="font-semibold text-muted-foreground">
                 Compatibility
               </span>
               <p className="mt-2 font-medium">-</p>
-            </div>
+            </div> */}
           </div>
         </div>
       )}

diff --git a/web/screens/ExploreModels/ExploreModelItemHeader/index.tsx b/web/screens/ExploreModels/ExploreModelItemHeader/index.tsx
@@ -2,7 +2,7 @@
 import { useCallback, useMemo } from 'react'
 
 import { Model } from '@janhq/core'
-import { Badge, Button } from '@janhq/uikit'
+import { Button } from '@janhq/uikit'
 
 import { atom, useAtomValue } from 'jotai'
 
@@ -101,7 +101,6 @@ const ExploreModelItemHeader: React.FC<Props> = ({ model, onClick, open }) => {
     >
       <div className="flex items-center gap-2">
         <span className="font-bold">{model.name}</span>
-        <Badge>{model.metadata.tags[0]}</Badge>
       </div>
       <div className="inline-flex items-center space-x-2">
         <span className="mr-4 font-semibold text-muted-foreground">

diff --git a/web/screens/ExploreModels/index.tsx b/web/screens/ExploreModels/index.tsx
@@ -35,14 +35,16 @@ const ExploreModelsScreen = () => {
   const [tabActive, setTabActive] = useState('Model')
   const { downloadedModels } = useGetDownloadedModels()
   const [sortSelected, setSortSelected] = useState('All Model')
-  const sortMenu = ['All Model', 'Downloaded']
+  const sortMenu = ['All Model', 'Recommended', 'Downloaded']
 
   const filteredModels = models.filter((x) => {
     if (sortSelected === 'Downloaded') {
       return (
         x.name.toLowerCase().includes(searchValue.toLowerCase()) &&
         downloadedModels.some((y) => y.id === x.id)
       )
+    } else if (sortSelected === 'Recommended') {
+      return x.metadata.tags.includes('Recommended')
     } else {
       return x.name.toLowerCase().includes(searchValue.toLowerCase())
     }