chore: my models search box css issue (#4984)

This commit is contained in:
Louis 2025-05-13 21:28:17 +07:00 committed by GitHub
parent 75d3dd2de0
commit dc9750ecb4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -5,22 +5,12 @@ import { SearchIcon } from 'lucide-react'
import { useDebouncedCallback } from 'use-debounce' import { useDebouncedCallback } from 'use-debounce'
import {
useGetModelSources,
useModelSourcesMutation,
} from '@/hooks/useModelSource'
import Spinner from '../Loader/Spinner'
type Props = { type Props = {
onSearchLocal?: (searchText: string) => void onSearchLocal?: (searchText: string) => void
} }
const ModelSearch = ({ onSearchLocal }: Props) => { const ModelSearch = ({ onSearchLocal }: Props) => {
const [searchText, setSearchText] = useState('') const [searchText, setSearchText] = useState('')
const [isSearching, setSearching] = useState(false)
const { mutate } = useGetModelSources()
const { addModelSource } = useModelSourcesMutation()
const inputRef = useRef<HTMLInputElement | null>(null) const inputRef = useRef<HTMLInputElement | null>(null)
const debounced = useDebouncedCallback(async () => { const debounced = useDebouncedCallback(async () => {
if (searchText.indexOf('/') === -1) { if (searchText.indexOf('/') === -1) {
@ -30,16 +20,6 @@ const ModelSearch = ({ onSearchLocal }: Props) => {
} }
// Attempt to search local // Attempt to search local
onSearchLocal?.(searchText) onSearchLocal?.(searchText)
setSearching(true)
// Attempt to search model source
addModelSource(searchText)
.then(() => mutate())
.then(() => onSearchLocal?.(searchText))
.catch((e) => {
console.debug(e)
})
.finally(() => setSearching(false))
}, 300) }, 300)
const onSearchChanged = useCallback( const onSearchChanged = useCallback(
@ -70,20 +50,14 @@ const ModelSearch = ({ onSearchLocal }: Props) => {
return ( return (
<Input <Input
ref={inputRef} ref={inputRef}
prefixIcon={ prefixIcon={<SearchIcon size={16} />}
isSearching ? ( placeholder="Search models..."
<Spinner size={16} strokeWidth={2} />
) : (
<SearchIcon size={16} />
)
}
placeholder="Search or enter Hugging Face URL"
onChange={onSearchChanged} onChange={onSearchChanged}
onKeyDown={onKeyDown} onKeyDown={onKeyDown}
value={searchText} value={searchText}
clearable={searchText.length > 0} clearable={searchText.length > 0}
onClear={onClear} onClear={onClear}
className="border-0 bg-[hsla(var(--app-bg))]" className="border-1 bg-[hsla(var(--app-bg))]"
onClick={() => { onClick={() => {
onSearchLocal?.(inputRef.current?.value ?? '') onSearchLocal?.(inputRef.current?.value ?? '')
}} }}