fix: search not working when switching spans (#3048)

This commit is contained in:
Sachin M K 2023-07-10 10:52:28 +05:30 committed by GitHub
parent c72729f8bc
commit e3e0787459
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -6,7 +6,6 @@ import {
Dispatch,
SetStateAction,
useCallback,
useEffect,
useMemo,
useState,
} from 'react';
@ -24,13 +23,9 @@ function Tags({
setText,
}: TagsProps): JSX.Element {
const { t } = useTranslation(['traceDetails']);
const [allRenderedTags, setAllRenderedTags] = useState(tags);
const [searchText, setSearchText] = useState('');
const isSearchVisible = useMemo(() => tags.length > 5, [tags]);
useEffect(() => {
setAllRenderedTags(tags);
}, [tags]);
const getLink = useCallback(
(item: Record<string, string>) =>
`${ROUTES.TRACE}/${item.TraceId}${formUrlParams({
@ -41,14 +36,12 @@ function Tags({
[],
);
const onChangeHandler = useCallback(
(e: ChangeEvent<HTMLInputElement>): void => {
const onChangeHandler = (e: ChangeEvent<HTMLInputElement>): void => {
const { value } = e.target;
const filteredTags = tags.filter((tag) => tag.key.includes(value));
setAllRenderedTags(filteredTags);
},
[tags],
);
setSearchText(value);
};
const filteredTags = tags.filter((tag) => tag.key.includes(searchText));
if (tags.length === 0) {
return <Typography>No tags in selected span</Typography>;
@ -61,9 +54,10 @@ function Tags({
placeholder={t('traceDetails:search_tags')}
allowClear
onChange={onChangeHandler}
value={searchText}
/>
)}
{allRenderedTags.map((tag) => (
{filteredTags.map((tag) => (
<Tag
key={JSON.stringify(tag)}
{...{