mirror of
https://github.com/open-metadata/OpenMetadata.git
synced 2025-08-31 20:51:26 +00:00
* Worked on fixing issue #7403 * Worked on explore page loading tab data issue * code optimization * Worked on comments
This commit is contained in:
parent
c4eb9260be
commit
ef5c4016f4
@ -16,17 +16,20 @@ import {
|
||||
faSortAmountUpAlt,
|
||||
} from '@fortawesome/free-solid-svg-icons';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import { AxiosError } from 'axios';
|
||||
import classNames from 'classnames';
|
||||
import { cloneDeep, isEmpty, lowerCase } from 'lodash';
|
||||
import { cloneDeep, get, isEmpty, lowerCase } from 'lodash';
|
||||
import {
|
||||
AggregationType,
|
||||
Bucket,
|
||||
FilterObject,
|
||||
FormattedTableData,
|
||||
SearchDataFunctionType,
|
||||
SearchResponse,
|
||||
} from 'Models';
|
||||
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
||||
import { useHistory, useLocation } from 'react-router-dom';
|
||||
import { searchData } from '../../axiosAPIs/miscAPI';
|
||||
import { Button } from '../../components/buttons/Button/Button';
|
||||
import ErrorPlaceHolderES from '../../components/common/error-with-placeholder/ErrorPlaceHolderES';
|
||||
import FacetFilter from '../../components/common/facetfilter/FacetFilter';
|
||||
@ -50,6 +53,7 @@ import {
|
||||
UPDATABLE_AGGREGATION,
|
||||
ZERO_SIZE,
|
||||
} from '../../constants/explore.constants';
|
||||
import { mockSearchData } from '../../constants/mockTourData.constants';
|
||||
import { SearchIndex } from '../../enums/search.enum';
|
||||
import { usePrevious } from '../../hooks/usePrevious';
|
||||
import {
|
||||
@ -63,7 +67,11 @@ import AdvancedFields from '../AdvancedSearch/AdvancedFields';
|
||||
import AdvancedSearchDropDown from '../AdvancedSearch/AdvancedSearchDropDown';
|
||||
import LeftPanelCard from '../common/LeftPanelCard/LeftPanelCard';
|
||||
import PageLayoutV1 from '../containers/PageLayoutV1';
|
||||
import { AdvanceField, ExploreProps } from './explore.interface';
|
||||
import {
|
||||
AdvanceField,
|
||||
ExploreProps,
|
||||
ExploreSearchData,
|
||||
} from './explore.interface';
|
||||
import SortingDropDown from './SortingDropDown';
|
||||
|
||||
const Explore: React.FC<ExploreProps> = ({
|
||||
@ -73,20 +81,18 @@ const Explore: React.FC<ExploreProps> = ({
|
||||
searchFilter,
|
||||
tab,
|
||||
searchQuery,
|
||||
searchResult,
|
||||
sortValue,
|
||||
error,
|
||||
fetchCount,
|
||||
handleFilterChange,
|
||||
handlePathChange,
|
||||
handleSearchText,
|
||||
fetchData,
|
||||
showDeleted,
|
||||
onShowDeleted,
|
||||
isFilterSelected,
|
||||
handleTabCounts,
|
||||
}: ExploreProps) => {
|
||||
const location = useLocation();
|
||||
const isTourPage = location.pathname.includes(ROUTES.TOUR);
|
||||
const history = useHistory();
|
||||
const filterObject: FilterObject = {
|
||||
...INITIAL_FILTERS,
|
||||
@ -106,6 +112,8 @@ const Explore: React.FC<ExploreProps> = ({
|
||||
const [sortOrder, setSortOrder] = useState<string>(INITIAL_SORT_ORDER);
|
||||
const [searchIndex, setSearchIndex] = useState<string>(getCurrentIndex(tab));
|
||||
const [currentTab, setCurrentTab] = useState<number>(getCurrentTab(tab));
|
||||
const [error, setError] = useState<string>('');
|
||||
const currentSearchIndex = useRef<string>();
|
||||
|
||||
const [isEntityLoading, setIsEntityLoading] = useState(true);
|
||||
const [isFilterSet, setIsFilterSet] = useState<boolean>(
|
||||
@ -287,6 +295,117 @@ const Explore: React.FC<ExploreProps> = ({
|
||||
}
|
||||
};
|
||||
|
||||
const updateData = (searchResult: ExploreSearchData) => {
|
||||
if (searchResult) {
|
||||
updateSearchResults(searchResult.resSearchResults);
|
||||
setCount(searchResult.resSearchResults.data.hits.total.value);
|
||||
if (forceSetAgg.current) {
|
||||
setAggregations(
|
||||
searchResult.resSearchResults.data.hits.hits.length > 0
|
||||
? getAggregationList(
|
||||
searchResult.resSearchResults.data.aggregations
|
||||
)
|
||||
: getAggregationListFromQS(location.search)
|
||||
);
|
||||
setIsInitialFilterSet(false);
|
||||
} else {
|
||||
const aggServiceType = getAggregationList(
|
||||
searchResult.resAggServiceType.data.aggregations,
|
||||
'service'
|
||||
);
|
||||
const aggTier = getAggregationList(
|
||||
searchResult.resAggTier.data.aggregations,
|
||||
'tier'
|
||||
);
|
||||
const aggTag = getAggregationList(
|
||||
searchResult.resAggTag.data.aggregations,
|
||||
'tags'
|
||||
);
|
||||
const aggDatabase = getAggregationList(
|
||||
searchResult.resAggDatabase.data.aggregations,
|
||||
'database'
|
||||
);
|
||||
const aggDatabaseSchema = getAggregationList(
|
||||
searchResult.resAggDatabaseSchema.data.aggregations,
|
||||
'databaseschema'
|
||||
);
|
||||
const aggServiceName = getAggregationList(
|
||||
searchResult.resAggServiceName.data.aggregations,
|
||||
'servicename'
|
||||
);
|
||||
|
||||
updateAggregationCount([
|
||||
...aggServiceType,
|
||||
...aggTier,
|
||||
...aggTag,
|
||||
...aggDatabase,
|
||||
...aggDatabaseSchema,
|
||||
...aggServiceName,
|
||||
]);
|
||||
}
|
||||
}
|
||||
setIsEntityLoading(false);
|
||||
};
|
||||
|
||||
const fetchData = (value: SearchDataFunctionType[]) => {
|
||||
if (isTourPage) {
|
||||
updateData(mockSearchData as unknown as ExploreSearchData);
|
||||
} else {
|
||||
const promiseValue = value.map((d) => {
|
||||
currentSearchIndex.current = d.searchIndex;
|
||||
|
||||
return searchData(
|
||||
d.queryString,
|
||||
d.from,
|
||||
d.size,
|
||||
d.filters,
|
||||
d.sortField,
|
||||
d.sortOrder,
|
||||
d.searchIndex,
|
||||
showDeleted
|
||||
);
|
||||
});
|
||||
|
||||
Promise.all(promiseValue)
|
||||
.then(
|
||||
([
|
||||
resSearchResults,
|
||||
resAggServiceType,
|
||||
resAggTier,
|
||||
resAggTag,
|
||||
resAggDatabase,
|
||||
resAggDatabaseSchema,
|
||||
resAggServiceName,
|
||||
]: Array<SearchResponse>) => {
|
||||
setError('');
|
||||
if (
|
||||
currentSearchIndex.current ===
|
||||
resSearchResults.data.hits.hits[0]?._index ||
|
||||
isEmpty(resSearchResults.data.hits.hits)
|
||||
) {
|
||||
updateData({
|
||||
resSearchResults,
|
||||
resAggServiceType,
|
||||
resAggTier,
|
||||
resAggTag,
|
||||
resAggDatabase,
|
||||
resAggDatabaseSchema,
|
||||
resAggServiceName,
|
||||
});
|
||||
if (isEmpty(resSearchResults.data.hits.hits)) {
|
||||
setTotalNumberOfValues(0);
|
||||
setIsEntityLoading(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
)
|
||||
.catch((err: AxiosError) => {
|
||||
const errMsg = get(err, 'response.data.responseMessage', '');
|
||||
setError(errMsg);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const fetchTableData = () => {
|
||||
setIsEntityLoading(true);
|
||||
const fetchParams = [
|
||||
@ -507,7 +626,9 @@ const Explore: React.FC<ExploreProps> = ({
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
handleSearchText(searchQuery || emptyValue);
|
||||
isTourPage
|
||||
? updateData(mockSearchData as unknown as ExploreSearchData)
|
||||
: handleSearchText && handleSearchText(searchQuery || emptyValue);
|
||||
setCurrentPage(1);
|
||||
}, [searchQuery]);
|
||||
|
||||
@ -546,58 +667,6 @@ const Explore: React.FC<ExploreProps> = ({
|
||||
}
|
||||
}, [searchText, searchIndex, showDeleted]);
|
||||
|
||||
useEffect(() => {
|
||||
if (searchResult) {
|
||||
updateSearchResults(searchResult.resSearchResults);
|
||||
setCount(searchResult.resSearchResults.data.hits.total.value);
|
||||
if (forceSetAgg.current) {
|
||||
setAggregations(
|
||||
searchResult.resSearchResults.data.hits.hits.length > 0
|
||||
? getAggregationList(
|
||||
searchResult.resSearchResults.data.aggregations
|
||||
)
|
||||
: getAggregationListFromQS(location.search)
|
||||
);
|
||||
setIsInitialFilterSet(false);
|
||||
} else {
|
||||
const aggServiceType = getAggregationList(
|
||||
searchResult.resAggServiceType.data.aggregations,
|
||||
'service'
|
||||
);
|
||||
const aggTier = getAggregationList(
|
||||
searchResult.resAggTier.data.aggregations,
|
||||
'tier'
|
||||
);
|
||||
const aggTag = getAggregationList(
|
||||
searchResult.resAggTag.data.aggregations,
|
||||
'tags'
|
||||
);
|
||||
const aggDatabase = getAggregationList(
|
||||
searchResult.resAggDatabase.data.aggregations,
|
||||
'database'
|
||||
);
|
||||
const aggDatabaseSchema = getAggregationList(
|
||||
searchResult.resAggDatabaseSchema.data.aggregations,
|
||||
'databaseschema'
|
||||
);
|
||||
const aggServiceName = getAggregationList(
|
||||
searchResult.resAggServiceName.data.aggregations,
|
||||
'servicename'
|
||||
);
|
||||
|
||||
updateAggregationCount([
|
||||
...aggServiceType,
|
||||
...aggTier,
|
||||
...aggTag,
|
||||
...aggDatabase,
|
||||
...aggDatabaseSchema,
|
||||
...aggServiceName,
|
||||
]);
|
||||
}
|
||||
setIsEntityLoading(false);
|
||||
}
|
||||
}, [searchResult]);
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, [currentPage, sortField, sortOrder]);
|
||||
@ -704,9 +773,7 @@ const Explore: React.FC<ExploreProps> = ({
|
||||
currentPage={currentPage}
|
||||
data={data}
|
||||
isFilterSelected={isFilterSelected}
|
||||
isLoading={
|
||||
!location.pathname.includes(ROUTES.TOUR) && isEntityLoading
|
||||
}
|
||||
isLoading={!isTourPage && isEntityLoading}
|
||||
paginate={paginate}
|
||||
searchText={searchText}
|
||||
totalValue={totalNumberOfValue}
|
||||
|
@ -12,10 +12,8 @@
|
||||
*/
|
||||
|
||||
import { findAllByTestId, findByTestId, render } from '@testing-library/react';
|
||||
import { SearchResponse } from 'Models';
|
||||
import React from 'react';
|
||||
import { MemoryRouter } from 'react-router';
|
||||
import { mockResponse } from './exlore.mock';
|
||||
import Explore from './Explore.component';
|
||||
jest.mock('react-router-dom', () => ({
|
||||
useHistory: jest.fn(),
|
||||
@ -55,6 +53,10 @@ jest.mock('../../components/common/facetfilter/FacetFilter', () =>
|
||||
jest.fn().mockImplementation(() => <div>FacetFilter</div>)
|
||||
);
|
||||
|
||||
jest.mock('../../axiosAPIs/miscAPI', () => ({
|
||||
searchData: jest.fn().mockImplementation(() => Promise.resolve()),
|
||||
}));
|
||||
|
||||
jest.mock(
|
||||
'../containers/PageLayoutV1',
|
||||
() =>
|
||||
@ -78,30 +80,17 @@ jest.mock(
|
||||
|
||||
const mockFunction = jest.fn();
|
||||
|
||||
const mockSearchResult = {
|
||||
resSearchResults: mockResponse as unknown as SearchResponse,
|
||||
resAggServiceType: mockResponse as unknown as SearchResponse,
|
||||
resAggTier: mockResponse as unknown as SearchResponse,
|
||||
resAggTag: mockResponse as unknown as SearchResponse,
|
||||
resAggDatabase: mockResponse as unknown as SearchResponse,
|
||||
resAggDatabaseSchema: mockResponse as unknown as SearchResponse,
|
||||
resAggServiceName: mockResponse as unknown as SearchResponse,
|
||||
};
|
||||
|
||||
describe('Test Explore component', () => {
|
||||
it('Component should render', async () => {
|
||||
const { container } = render(
|
||||
<Explore
|
||||
isFilterSelected
|
||||
error=""
|
||||
fetchCount={mockFunction}
|
||||
fetchData={mockFunction}
|
||||
handleFilterChange={mockFunction}
|
||||
handlePathChange={mockFunction}
|
||||
handleSearchText={mockFunction}
|
||||
handleTabCounts={mockFunction}
|
||||
searchQuery=""
|
||||
searchResult={mockSearchResult}
|
||||
searchText=""
|
||||
showDeleted={false}
|
||||
sortValue=""
|
||||
|
@ -11,7 +11,7 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { FilterObject, SearchDataFunctionType, SearchResponse } from 'Models';
|
||||
import { FilterObject, SearchResponse } from 'Models';
|
||||
|
||||
export type UrlParams = {
|
||||
searchQuery: string;
|
||||
@ -35,16 +35,13 @@ export interface ExploreProps {
|
||||
searchFilter?: FilterObject;
|
||||
sortValue: string;
|
||||
tab: string;
|
||||
error: string;
|
||||
searchQuery: string;
|
||||
showDeleted: boolean;
|
||||
searchResult: ExploreSearchData | undefined;
|
||||
isFilterSelected: boolean;
|
||||
fetchCount: () => void;
|
||||
handleFilterChange: (data: FilterObject) => void;
|
||||
handlePathChange: (path: string) => void;
|
||||
handleSearchText: (text: string) => void;
|
||||
fetchData: (value: SearchDataFunctionType[]) => void;
|
||||
handleSearchText?: (text: string) => void;
|
||||
onShowDeleted: (checked: boolean) => void;
|
||||
handleTabCounts: (value: { [key: string]: number }) => void;
|
||||
}
|
||||
|
@ -4152,4 +4152,391 @@ export const mockSearchData = {
|
||||
},
|
||||
request: {},
|
||||
},
|
||||
resAggDatabase: {
|
||||
data: {
|
||||
took: 1,
|
||||
timed_out: false,
|
||||
_shards: {
|
||||
total: 1,
|
||||
successful: 1,
|
||||
skipped: 0,
|
||||
failed: 0,
|
||||
},
|
||||
hits: {
|
||||
total: {
|
||||
value: 18,
|
||||
relation: 'eq',
|
||||
},
|
||||
max_score: null,
|
||||
hits: [],
|
||||
},
|
||||
aggregations: {
|
||||
'sterms#EntityType': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'table',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#ServiceCategory': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'databaseService',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Tier': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [],
|
||||
},
|
||||
'sterms#ServiceName': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'sample_data',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Database': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'ecommerce_db',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Service': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'BigQuery',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Tags': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'PII.None',
|
||||
doc_count: 1,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#DatabaseSchema': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'shopify',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
status: 200,
|
||||
statusText: 'OK',
|
||||
headers: {
|
||||
connection: 'close',
|
||||
'content-encoding': 'gzip',
|
||||
'content-type': 'application/json',
|
||||
date: 'Thu, 15 Sep 2022 17:29:32 GMT',
|
||||
'transfer-encoding': 'chunked',
|
||||
vary: 'Accept-Encoding',
|
||||
'x-powered-by': 'Express',
|
||||
},
|
||||
config: {
|
||||
transitional: {
|
||||
silentJSONParsing: true,
|
||||
forcedJSONParsing: true,
|
||||
clarifyTimeoutError: false,
|
||||
},
|
||||
transformRequest: [null],
|
||||
transformResponse: [null],
|
||||
timeout: 0,
|
||||
xsrfCookieName: 'XSRF-TOKEN',
|
||||
xsrfHeaderName: 'X-XSRF-TOKEN',
|
||||
maxContentLength: -1,
|
||||
maxBodyLength: -1,
|
||||
headers: {
|
||||
Accept: 'application/json, text/plain, */*',
|
||||
},
|
||||
baseURL: '/api/v1',
|
||||
method: 'get',
|
||||
url: '/search/query?q=*&from=0&size=0&sort_field=updatedAt&sort_order=desc&index=table_search_index',
|
||||
},
|
||||
request: {},
|
||||
},
|
||||
resAggDatabaseSchema: {
|
||||
data: {
|
||||
took: 1,
|
||||
timed_out: false,
|
||||
_shards: {
|
||||
total: 1,
|
||||
successful: 1,
|
||||
skipped: 0,
|
||||
failed: 0,
|
||||
},
|
||||
hits: {
|
||||
total: {
|
||||
value: 18,
|
||||
relation: 'eq',
|
||||
},
|
||||
max_score: null,
|
||||
hits: [],
|
||||
},
|
||||
aggregations: {
|
||||
'sterms#EntityType': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'table',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#ServiceCategory': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'databaseService',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Tier': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [],
|
||||
},
|
||||
'sterms#ServiceName': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'sample_data',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Database': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'ecommerce_db',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Service': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'BigQuery',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Tags': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'PII.None',
|
||||
doc_count: 1,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#DatabaseSchema': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'shopify',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
status: 200,
|
||||
statusText: 'OK',
|
||||
headers: {
|
||||
connection: 'close',
|
||||
'content-encoding': 'gzip',
|
||||
'content-type': 'application/json',
|
||||
date: 'Thu, 15 Sep 2022 17:29:32 GMT',
|
||||
'transfer-encoding': 'chunked',
|
||||
vary: 'Accept-Encoding',
|
||||
'x-powered-by': 'Express',
|
||||
},
|
||||
config: {
|
||||
transitional: {
|
||||
silentJSONParsing: true,
|
||||
forcedJSONParsing: true,
|
||||
clarifyTimeoutError: false,
|
||||
},
|
||||
transformRequest: [null],
|
||||
transformResponse: [null],
|
||||
timeout: 0,
|
||||
xsrfCookieName: 'XSRF-TOKEN',
|
||||
xsrfHeaderName: 'X-XSRF-TOKEN',
|
||||
maxContentLength: -1,
|
||||
maxBodyLength: -1,
|
||||
headers: {
|
||||
Accept: 'application/json, text/plain, */*',
|
||||
},
|
||||
baseURL: '/api/v1',
|
||||
method: 'get',
|
||||
url: '/search/query?q=*&from=0&size=0&sort_field=updatedAt&sort_order=desc&index=table_search_index',
|
||||
},
|
||||
request: {},
|
||||
},
|
||||
resAggServiceName: {
|
||||
data: {
|
||||
took: 1,
|
||||
timed_out: false,
|
||||
_shards: {
|
||||
total: 1,
|
||||
successful: 1,
|
||||
skipped: 0,
|
||||
failed: 0,
|
||||
},
|
||||
hits: {
|
||||
total: {
|
||||
value: 18,
|
||||
relation: 'eq',
|
||||
},
|
||||
max_score: null,
|
||||
hits: [],
|
||||
},
|
||||
aggregations: {
|
||||
'sterms#EntityType': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'table',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#ServiceCategory': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'databaseService',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Tier': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [],
|
||||
},
|
||||
'sterms#ServiceName': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'sample_data',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Database': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'ecommerce_db',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Service': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'BigQuery',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#Tags': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'PII.None',
|
||||
doc_count: 1,
|
||||
},
|
||||
],
|
||||
},
|
||||
'sterms#DatabaseSchema': {
|
||||
doc_count_error_upper_bound: 0,
|
||||
sum_other_doc_count: 0,
|
||||
buckets: [
|
||||
{
|
||||
key: 'shopify',
|
||||
doc_count: 18,
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
},
|
||||
status: 200,
|
||||
statusText: 'OK',
|
||||
headers: {
|
||||
connection: 'close',
|
||||
'content-encoding': 'gzip',
|
||||
'content-type': 'application/json',
|
||||
date: 'Thu, 15 Sep 2022 17:29:32 GMT',
|
||||
'transfer-encoding': 'chunked',
|
||||
vary: 'Accept-Encoding',
|
||||
'x-powered-by': 'Express',
|
||||
},
|
||||
config: {
|
||||
transitional: {
|
||||
silentJSONParsing: true,
|
||||
forcedJSONParsing: true,
|
||||
clarifyTimeoutError: false,
|
||||
},
|
||||
transformRequest: [null],
|
||||
transformResponse: [null],
|
||||
timeout: 0,
|
||||
xsrfCookieName: 'XSRF-TOKEN',
|
||||
xsrfHeaderName: 'X-XSRF-TOKEN',
|
||||
maxContentLength: -1,
|
||||
maxBodyLength: -1,
|
||||
headers: {
|
||||
Accept: 'application/json, text/plain, */*',
|
||||
},
|
||||
baseURL: '/api/v1',
|
||||
method: 'get',
|
||||
url: '/search/query?q=*&from=0&size=0&sort_field=updatedAt&sort_order=desc&index=table_search_index',
|
||||
},
|
||||
request: {},
|
||||
},
|
||||
};
|
||||
|
@ -11,14 +11,8 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { AxiosError } from 'axios';
|
||||
import { get, isEmpty } from 'lodash';
|
||||
import {
|
||||
Bucket,
|
||||
FilterObject,
|
||||
SearchDataFunctionType,
|
||||
SearchResponse,
|
||||
} from 'Models';
|
||||
import { isEmpty } from 'lodash';
|
||||
import { Bucket, FilterObject } from 'Models';
|
||||
import React, { FunctionComponent, useEffect, useMemo, useState } from 'react';
|
||||
import { useHistory, useLocation, useParams } from 'react-router-dom';
|
||||
import AppState from '../../AppState';
|
||||
@ -26,24 +20,19 @@ import { searchData } from '../../axiosAPIs/miscAPI';
|
||||
import PageContainerV1 from '../../components/containers/PageContainerV1';
|
||||
import Explore from '../../components/Explore/Explore.component';
|
||||
import {
|
||||
ExploreSearchData,
|
||||
TabCounts,
|
||||
UrlParams,
|
||||
} from '../../components/Explore/explore.interface';
|
||||
import { getExplorePathWithSearch, PAGE_SIZE } from '../../constants/constants';
|
||||
import { getExplorePathWithSearch } from '../../constants/constants';
|
||||
import {
|
||||
emptyValue,
|
||||
getCurrentIndex,
|
||||
getCurrentTab,
|
||||
getEntityTypeByIndex,
|
||||
getInitialFilter,
|
||||
getQueryParam,
|
||||
getSearchFilter,
|
||||
INITIAL_FROM,
|
||||
INITIAL_SORT_ORDER,
|
||||
INITIAL_TAB_COUNTS,
|
||||
tabsInfo,
|
||||
ZERO_SIZE,
|
||||
} from '../../constants/explore.constants';
|
||||
import { SearchIndex } from '../../enums/search.enum';
|
||||
import jsonData from '../../jsons/en';
|
||||
@ -62,11 +51,11 @@ const ExplorePage: FunctionComponent = () => {
|
||||
() => getQueryParam(getSearchFilter(location.search)),
|
||||
[location.search]
|
||||
);
|
||||
const [error, setError] = useState<string>('');
|
||||
|
||||
const { searchQuery, tab } = useParams<UrlParams>();
|
||||
|
||||
const [searchText, setSearchText] = useState<string>(searchQuery || '');
|
||||
const [tabCounts, setTabCounts] = useState<TabCounts>(INITIAL_TAB_COUNTS);
|
||||
const [searchResult, setSearchResult] = useState<ExploreSearchData>();
|
||||
const [showDeleted, setShowDeleted] = useState(false);
|
||||
const [initialSortField] = useState<string>(
|
||||
tabsInfo[getCurrentTab(tab) - 1].sortField
|
||||
@ -137,49 +126,6 @@ const ExplorePage: FunctionComponent = () => {
|
||||
fetchEntityCount(SearchIndex.MLMODEL);
|
||||
};
|
||||
|
||||
const fetchData = (value: SearchDataFunctionType[]) => {
|
||||
const promiseValue = value.map((d) => {
|
||||
return searchData(
|
||||
d.queryString,
|
||||
d.from,
|
||||
d.size,
|
||||
d.filters,
|
||||
d.sortField,
|
||||
d.sortOrder,
|
||||
d.searchIndex,
|
||||
showDeleted
|
||||
);
|
||||
});
|
||||
|
||||
Promise.all(promiseValue)
|
||||
.then(
|
||||
([
|
||||
resSearchResults,
|
||||
resAggServiceType,
|
||||
resAggTier,
|
||||
resAggTag,
|
||||
resAggDatabase,
|
||||
resAggDatabaseSchema,
|
||||
resAggServiceName,
|
||||
]: Array<SearchResponse>) => {
|
||||
setError('');
|
||||
setSearchResult({
|
||||
resSearchResults,
|
||||
resAggServiceType,
|
||||
resAggTier,
|
||||
resAggTag,
|
||||
resAggDatabase,
|
||||
resAggDatabaseSchema,
|
||||
resAggServiceName,
|
||||
});
|
||||
}
|
||||
)
|
||||
.catch((err: AxiosError) => {
|
||||
const errMsg = get(err, 'response.data.responseMessage', '');
|
||||
setError(errMsg);
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
fetchCounts();
|
||||
}, [searchText, showDeleted, initialFilter]);
|
||||
@ -188,55 +134,10 @@ const ExplorePage: FunctionComponent = () => {
|
||||
AppState.updateExplorePageTab(tab);
|
||||
}, [tab]);
|
||||
|
||||
useEffect(() => {
|
||||
setSearchResult(undefined);
|
||||
|
||||
fetchData([
|
||||
{
|
||||
queryString: searchText,
|
||||
from: INITIAL_FROM,
|
||||
size: PAGE_SIZE,
|
||||
filters: getFilterString(initialFilter),
|
||||
sortField: initialSortField,
|
||||
sortOrder: INITIAL_SORT_ORDER,
|
||||
searchIndex: getCurrentIndex(tab),
|
||||
},
|
||||
{
|
||||
queryString: searchText,
|
||||
from: INITIAL_FROM,
|
||||
size: ZERO_SIZE,
|
||||
filters: getFilterString(initialFilter),
|
||||
sortField: initialSortField,
|
||||
sortOrder: INITIAL_SORT_ORDER,
|
||||
searchIndex: getCurrentIndex(tab),
|
||||
},
|
||||
{
|
||||
queryString: searchText,
|
||||
from: INITIAL_FROM,
|
||||
size: ZERO_SIZE,
|
||||
filters: getFilterString(initialFilter),
|
||||
sortField: initialSortField,
|
||||
sortOrder: INITIAL_SORT_ORDER,
|
||||
searchIndex: getCurrentIndex(tab),
|
||||
},
|
||||
{
|
||||
queryString: searchText,
|
||||
from: INITIAL_FROM,
|
||||
size: ZERO_SIZE,
|
||||
filters: getFilterString(initialFilter),
|
||||
sortField: initialSortField,
|
||||
sortOrder: INITIAL_SORT_ORDER,
|
||||
searchIndex: getCurrentIndex(tab),
|
||||
},
|
||||
]);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<PageContainerV1>
|
||||
<Explore
|
||||
error={error}
|
||||
fetchCount={fetchCounts}
|
||||
fetchData={fetchData}
|
||||
handleFilterChange={handleFilterChange}
|
||||
handlePathChange={handlePathChange}
|
||||
handleSearchText={handleSearchText}
|
||||
@ -245,7 +146,6 @@ const ExplorePage: FunctionComponent = () => {
|
||||
isFilterSelected={!isEmpty(searchFilter) || !isEmpty(initialFilter)}
|
||||
searchFilter={searchFilter}
|
||||
searchQuery={searchQuery}
|
||||
searchResult={searchResult}
|
||||
searchText={searchText}
|
||||
showDeleted={showDeleted}
|
||||
sortValue={initialSortField}
|
||||
|
@ -18,7 +18,6 @@ import { useLocation } from 'react-router-dom';
|
||||
import AppState from '../../AppState';
|
||||
import DatasetDetails from '../../components/DatasetDetails/DatasetDetails.component';
|
||||
import Explore from '../../components/Explore/Explore.component';
|
||||
import { ExploreSearchData } from '../../components/Explore/explore.interface';
|
||||
import MyData from '../../components/MyData/MyData.component';
|
||||
import { MyDataProps } from '../../components/MyData/MyData.interface';
|
||||
import NavBar from '../../components/nav-bar/NavBar';
|
||||
@ -27,7 +26,6 @@ import { ROUTES, TOUR_SEARCH_TERM } from '../../constants/constants';
|
||||
import {
|
||||
mockDatasetData,
|
||||
mockFeedData,
|
||||
mockSearchData as exploreSearchData,
|
||||
} from '../../constants/mockTourData.constants';
|
||||
import { CurrentTourPageType } from '../../enums/tour.enum';
|
||||
import {
|
||||
@ -58,8 +56,6 @@ const TourPage = () => {
|
||||
AppState.currentTourPage
|
||||
);
|
||||
const [myDataSearchResult, setMyDataSearchResult] = useState(mockFeedData);
|
||||
const [exploreSearchResult, setExploreSearchResult] =
|
||||
useState(exploreSearchData);
|
||||
const [datasetActiveTab, setdatasetActiveTab] = useState(
|
||||
AppState.activeTabforTourDatasetPage
|
||||
);
|
||||
@ -159,15 +155,11 @@ const TourPage = () => {
|
||||
return (
|
||||
<Explore
|
||||
isFilterSelected
|
||||
error=""
|
||||
fetchCount={handleCountChange}
|
||||
fetchData={() => setExploreSearchResult(exploreSearchData)}
|
||||
handleFilterChange={handleFilterChange}
|
||||
handlePathChange={handleCountChange}
|
||||
handleSearchText={() => setExploreSearchResult(exploreSearchData)}
|
||||
handleTabCounts={handleCountChange}
|
||||
searchQuery=""
|
||||
searchResult={exploreSearchResult as unknown as ExploreSearchData}
|
||||
searchText=""
|
||||
showDeleted={false}
|
||||
sortValue=""
|
||||
|
Loading…
x
Reference in New Issue
Block a user