diff --git a/datahub-web-react/src/app/entity/shared/components/styled/search/SearchSelect.tsx b/datahub-web-react/src/app/entity/shared/components/styled/search/SearchSelect.tsx index d9a6890ead..7b88d6cf2e 100644 --- a/datahub-web-react/src/app/entity/shared/components/styled/search/SearchSelect.tsx +++ b/datahub-web-react/src/app/entity/shared/components/styled/search/SearchSelect.tsx @@ -1,5 +1,6 @@ import { FilterOutlined } from '@ant-design/icons'; import { Button, Typography, message } from 'antd'; +import { debounce } from 'lodash'; import React, { useState } from 'react'; import styled from 'styled-components'; @@ -11,6 +12,7 @@ import { EntityAndType } from '@app/entity/shared/types'; import { isListSubset } from '@app/entity/shared/utils'; import { SearchBar } from '@app/search/SearchBar'; import { ENTITY_FILTER_NAME, UnionType } from '@app/search/utils/constants'; +import { DEBOUNCE_SEARCH_MS } from '@app/shared/constants'; import { useEntityRegistry } from '@app/useEntityRegistry'; import { SearchCfg } from '@src/conf'; @@ -112,9 +114,9 @@ export const SearchSelect = ({ const selectedEntityUrns = selectedEntities.map((entity) => entity.urn); const facets = searchAcrossEntities?.facets || []; - const onSearch = (q: string) => { + const onSearch = debounce((q: string) => { setQuery(q); - }; + }, DEBOUNCE_SEARCH_MS); const onChangeFilters = (newFilters: Array) => { setPage(1); diff --git a/datahub-web-react/src/app/entityV2/shared/components/styled/search/SearchSelect.tsx b/datahub-web-react/src/app/entityV2/shared/components/styled/search/SearchSelect.tsx index 71e1150cfd..2fee771fc3 100644 --- a/datahub-web-react/src/app/entityV2/shared/components/styled/search/SearchSelect.tsx +++ b/datahub-web-react/src/app/entityV2/shared/components/styled/search/SearchSelect.tsx @@ -1,5 +1,6 @@ import { FilterOutlined } from '@ant-design/icons'; import { Button, Typography, message } from 'antd'; +import { debounce } from 'lodash'; import React, { useState } from 'react'; import { useDebounce } from 'react-use'; import styled from 'styled-components'; @@ -12,6 +13,7 @@ import { ANTD_GRAY } from '@app/entityV2/shared/constants'; import { isListSubset } from '@app/entityV2/shared/utils'; import { SearchBar } from '@app/search/SearchBar'; import { ENTITY_FILTER_NAME, UnionType } from '@app/search/utils/constants'; +import { DEBOUNCE_SEARCH_MS } from '@app/shared/constants'; import { useEntityRegistry } from '@app/useEntityRegistry'; import SearchSortSelect from '@src/app/searchV2/sorting/SearchSortSelect'; import useSortInput from '@src/app/searchV2/sorting/useSortInput'; @@ -119,9 +121,9 @@ export const SearchSelect = ({ const selectedEntityUrns = selectedEntities.map((entity) => entity.urn); const facets = searchAcrossEntities?.facets || []; - const onSearch = (q: string) => { + const onSearch = debounce((q: string) => { setQuery(q); - }; + }, DEBOUNCE_SEARCH_MS); const onChangeFilters = (newFilters: Array) => { setPage(1); diff --git a/datahub-web-react/src/app/shared/constants.ts b/datahub-web-react/src/app/shared/constants.ts index 5ccc6e5698..62e6baf01e 100644 --- a/datahub-web-react/src/app/shared/constants.ts +++ b/datahub-web-react/src/app/shared/constants.ts @@ -10,3 +10,5 @@ export enum ErrorCodes { NotFound = 404, ServerError = 500, } + +export const DEBOUNCE_SEARCH_MS = 300; diff --git a/smoke-test/tests/cypress/cypress/e2e/mutations/domains.js b/smoke-test/tests/cypress/cypress/e2e/mutations/domains.js index be2212e094..ad76ff5873 100644 --- a/smoke-test/tests/cypress/cypress/e2e/mutations/domains.js +++ b/smoke-test/tests/cypress/cypress/e2e/mutations/domains.js @@ -44,8 +44,7 @@ describe("add remove domain", () => { cy.get(".ant-modal-content").within(() => { cy.get('[data-testid="search-input"]') .click() - .invoke("val", "cypress_project.jaffle_shop.") - .type("customer"); + .type("cypress_project.jaffle_shop.customer"); cy.contains("BigQuery", { timeout: 30000 }); cy.get(".ant-checkbox-input").first().click(); cy.get("#continueButton").click();