bug: style-trace-search is fixed

This commit is contained in:
Palash gupta 2022-04-06 11:33:56 +05:30
parent 8809105a8d
commit ead6885b29
No known key found for this signature in database
GPG Key ID: 8FD05AE6F9150AD6
3 changed files with 32 additions and 33 deletions

View File

@ -6,7 +6,7 @@ export const Container = styled(Card)`
min-height: 20vh; min-height: 20vh;
width: 100%; width: 100%;
z-index: 2; z-index: 2;
position: absolute; position: absolute !important;
.ant-card-body { .ant-card-body {
padding-bottom: 0; padding-bottom: 0;

View File

@ -113,41 +113,39 @@ function Search({
}; };
return ( return (
<Space direction="vertical" style={{ width: '100%' }}> <Container ref={tagRef}>
<Container ref={tagRef}> <SearchComponent
<SearchComponent onChange={(event): void => onChangeHandler(event.target.value)}
onChange={(event): void => onChangeHandler(event.target.value)} value={value}
value={value} allowClear
allowClear disabled={traces.filterLoading}
disabled={traces.filterLoading} onFocus={onFocusHandler}
onFocus={onFocusHandler} placeholder="Click to filter by tags"
placeholder="Click to filter by tags" type="search"
type="search" enterButton={<CaretRightFilled />}
enterButton={<CaretRightFilled />} onSearch={(string): void => {
onSearch={(string): void => { if (string.length === 0) {
if (string.length === 0) { updateTagVisibility(false);
updateTagVisibility(false); updateFilters([]);
updateFilters([]); return;
return; }
}
const { isError, payload } = parseQueryToTags(string); const { isError, payload } = parseQueryToTags(string);
if (isError) { if (isError) {
updateTagIsError(true); updateTagIsError(true);
} else { } else {
updateTagIsError(false); updateTagIsError(false);
updateTagVisibility(false); updateTagVisibility(false);
updateFilters(payload); updateFilters(payload);
} }
}} }}
/> />
{traces.isTagModalOpen && ( {traces.isTagModalOpen && (
<Tags updateFilters={updateFilters} onChangeHandler={onChangeHandler} /> <Tags updateFilters={updateFilters} onChangeHandler={onChangeHandler} />
)} )}
</Container> </Container>
</Space>
); );
} }

View File

@ -6,6 +6,7 @@ const { Search } = Input;
export const Container = styled.div` export const Container = styled.div`
display: flex; display: flex;
position: relative; position: relative;
width: 100%;
`; `;
export const SearchComponent = styled(Search)` export const SearchComponent = styled(Search)`