yujunjun/OpenMetadata
1
0
Fork 0
mirror of https://github.com/open-metadata/OpenMetadata.git synced 2026-01-08 05:26:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Add safeguard to prevent character loss during fast typing in search inputs (#24128)

Browse Source
This commit is contained in:
Harsh Vador 2025-11-04 13:12:03 +05:30 committed by GitHub
parent a9406a5045
commit edb52e2958
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
openmetadata-ui/src/main/resources/ui/src/components/common/SearchBarComponent/SearchBar.component.tsx
View File

@ -16,7 +16,7 @@ import { Input, InputProps } from 'antd';
import classNames from 'classnames';
import { debounce, isEmpty } from 'lodash';
import { LoadingState } from 'Models';
import { useCallback, useEffect, useState } from 'react';
import { useCallback, useEffect, useRef, useState } from 'react';
import { ReactComponent as IconSearchV1 } from '../../../assets/svg/search.svg';
import { useTableFilters } from '../../../hooks/useTableFilters';
import Loader from '../Loader/Loader';
@ -56,9 +56,10 @@ const Searchbar = ({
inputProps,
urlSearchKey,
}: SearchBarProps) => {
const [userSearch, setUserSearch] = useState('');
const [userSearch, setUserSearch] = useState(searchValue ?? '');
const [loadingState, setLoadingState] = useState<LoadingState>('initial');
const [isSearchBlur, setIsSearchBlur] = useState(true);
const isTypingRef = useRef(false);
const { setFilters } = useTableFilters(
urlSearchKey
? {
@ -68,7 +69,9 @@ const Searchbar = ({
);
useEffect(() => {
setUserSearch(searchValue ?? '');
if (!isTypingRef.current && searchValue !== userSearch) {
setUserSearch(searchValue ?? '');
}
}, [searchValue]);
const debouncedOnSearch = useCallback(
@ -80,6 +83,7 @@ const Searchbar = ({
}
onSearch(searchText);
isTypingRef.current = false;
},
[onSearch]
);
@ -91,6 +95,7 @@ const Searchbar = ({
const handleChange = (e: React.ChangeEvent<{ value: string }>): void => {
const searchText = e.target.value;
isTypingRef.current = true;
setUserSearch(searchText);
setLoadingState((pre) => (pre !== 'waiting' ? 'waiting' : pre));
debounceOnSearch(searchText);

2
openmetadata-ui/src/main/resources/ui/src/pages/UserListPage/UserListPageV1.test.tsx
View File

@ -416,7 +416,7 @@ describe('Test UserListPage component', () => {
expect(mockTableComponent).toHaveBeenCalledWith(
expect.objectContaining({
searchProps: expect.objectContaining({
typingInterval: 400,
typingInterval: 500,
}),
}),
expect.anything()

2
openmetadata-ui/src/main/resources/ui/src/pages/UserListPage/UserListPageV1.tsx
View File

@ -435,7 +435,7 @@ const UserListPageV1 = () => {
type: t('label.user'),
})}...`,
searchValue: searchValue,
typingInterval: 400,
typingInterval: 500,
urlSearchKey: 'user',
onSearch: handleSearch,
}),