fix: hub ui no result search found (#4739)
This commit is contained in:
parent
d7329c7719
commit
36a14600ee
@ -5,18 +5,29 @@ import ModelItem from '@/screens/Hub/ModelList/ModelItem'
|
|||||||
type Props = {
|
type Props = {
|
||||||
models: ModelSource[]
|
models: ModelSource[]
|
||||||
onSelectedModel: (model: ModelSource) => void
|
onSelectedModel: (model: ModelSource) => void
|
||||||
|
filterOption?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
const ModelList = ({ models, onSelectedModel }: Props) => {
|
const ModelList = ({ models, onSelectedModel, filterOption }: Props) => {
|
||||||
return (
|
return (
|
||||||
<div className="w-full">
|
<div className="w-full">
|
||||||
{models.map((model) => (
|
{models.length === 0 && filterOption === 'on-device' ? (
|
||||||
<ModelItem
|
<div className="my-4 p-2 text-center">
|
||||||
key={model.id}
|
<span className="text-[hsla(var(--text-tertiary))]">
|
||||||
model={model}
|
No results found
|
||||||
onSelectedModel={() => onSelectedModel(model)}
|
</span>
|
||||||
/>
|
</div>
|
||||||
))}
|
) : (
|
||||||
|
<>
|
||||||
|
{models.map((model) => (
|
||||||
|
<ModelItem
|
||||||
|
key={model.id}
|
||||||
|
model={model}
|
||||||
|
onSelectedModel={() => onSelectedModel(model)}
|
||||||
|
/>
|
||||||
|
))}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -404,34 +404,44 @@ const HubScreen = () => {
|
|||||||
<div
|
<div
|
||||||
className={twMerge(
|
className={twMerge(
|
||||||
'invisible absolute mt-2 w-full overflow-hidden rounded-lg border border-[hsla(var(--app-border))] bg-[hsla(var(--app-bg))] shadow-lg',
|
'invisible absolute mt-2 w-full overflow-hidden rounded-lg border border-[hsla(var(--app-border))] bg-[hsla(var(--app-bg))] shadow-lg',
|
||||||
searchedModels.length > 0 && 'visible'
|
searchValue.length > 0 && 'visible'
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
{searchedModels.map((model) => (
|
{searchedModels.length === 0 ? (
|
||||||
<div
|
<div className="p-2 text-center">
|
||||||
key={model.id}
|
<span className="text-[hsla(var(--text-tertiary))]">
|
||||||
className="z-10 flex cursor-pointer items-center space-x-2 px-4 py-2 hover:bg-[hsla(var(--dropdown-menu-hover-bg))]"
|
No results found
|
||||||
onClick={(e) => {
|
|
||||||
setSelectedModel(model)
|
|
||||||
e.stopPropagation()
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<span className="text-bold flex flex-row text-[hsla(var(--app-text-primary))]">
|
|
||||||
{searchValue.includes('huggingface.co') && (
|
|
||||||
<>
|
|
||||||
<Image
|
|
||||||
src={'icons/huggingFace.svg'}
|
|
||||||
width={16}
|
|
||||||
height={16}
|
|
||||||
className="mr-2"
|
|
||||||
alt=""
|
|
||||||
/>{' '}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
{extractModelRepo(model.id)}
|
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
))}
|
) : (
|
||||||
|
<>
|
||||||
|
{searchedModels.map((model) => (
|
||||||
|
<div
|
||||||
|
key={model.id}
|
||||||
|
className="z-10 flex cursor-pointer items-center space-x-2 px-4 py-2 hover:bg-[hsla(var(--dropdown-menu-hover-bg))]"
|
||||||
|
onClick={(e) => {
|
||||||
|
setSelectedModel(model)
|
||||||
|
e.stopPropagation()
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<span className="text-bold flex flex-row text-[hsla(var(--app-text-primary))]">
|
||||||
|
{searchValue.includes('huggingface.co') && (
|
||||||
|
<>
|
||||||
|
<Image
|
||||||
|
src={'icons/huggingFace.svg'}
|
||||||
|
width={16}
|
||||||
|
height={16}
|
||||||
|
className="mr-2"
|
||||||
|
alt=""
|
||||||
|
/>{' '}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
{extractModelRepo(model.id)}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -523,6 +533,7 @@ const HubScreen = () => {
|
|||||||
<ModelList
|
<ModelList
|
||||||
models={sortedModels}
|
models={sortedModels}
|
||||||
onSelectedModel={(model) => setSelectedModel(model)}
|
onSelectedModel={(model) => setSelectedModel(model)}
|
||||||
|
filterOption={filterOption}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{(filterOption === 'cloud' || filterOption === 'all') && (
|
{(filterOption === 'cloud' || filterOption === 'all') && (
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user