diff --git a/src/shared/canvas/MyData/types.ts b/src/shared/canvas/MyData/types.ts
index 6ae5be1d8..94b620c6b 100644
--- a/src/shared/canvas/MyData/types.ts
+++ b/src/shared/canvas/MyData/types.ts
@@ -1,5 +1,5 @@
import { MenuProps } from 'antd';
-import { TType } from '../../molecules/TypeSelector/types';
+import { TType, TTypeOperator } from '../../molecules/TypeSelector/types';
export type TIssuer = 'createdBy' | 'updatedBy';
export type TDateField = 'createdAt' | 'updatedAt';
@@ -18,7 +18,7 @@ export type TFilterOptions = {
sort: string[];
locate: boolean;
issuer: TIssuer;
- typeOperator: 'AND' | 'OR';
+ typeOperator: TTypeOperator;
};
export type TCurrentDate = Pick<
TFilterOptions,
diff --git a/src/shared/molecules/MyDataHeader/MyDataHeaderFilters/index.tsx b/src/shared/molecules/MyDataHeader/MyDataHeaderFilters/index.tsx
index 74bbe79e1..f3b7b42f9 100644
--- a/src/shared/molecules/MyDataHeader/MyDataHeaderFilters/index.tsx
+++ b/src/shared/molecules/MyDataHeader/MyDataHeaderFilters/index.tsx
@@ -46,6 +46,7 @@ const MyDataHeaderFilters = ({
{
const nexus = useNexusContext();
const originTypes = useRef([]);
@@ -161,15 +161,17 @@ const TypeSelector = ({
const onDeselectTypesChange = (value: any) => {
const newTypes = types?.filter((item: TType) => item.value !== value);
updateOptions({
+ typeOperator,
types: newTypes,
});
- afterUpdate?.(newTypes);
+ afterUpdate?.(typeOperator, newTypes);
};
const onClearTypesChange = () => {
updateOptions({
+ typeOperator,
types: [],
});
- afterUpdate?.([]);
+ afterUpdate?.('OR', []);
};
const handleOnCheckType = (
@@ -182,9 +184,10 @@ const TypeSelector = ({
? types.filter((item: TType) => item.value !== type.value)
: [...(types ? types : []), type];
updateOptions({
+ typeOperator,
types: newTypes,
});
- afterUpdate?.(newTypes);
+ afterUpdate?.(typeOperator, newTypes);
};
const renderedTypes = typeSearchValue ? typesOptionsArray : typeOptions ?? [];
const onTypeOperatorChange = ({ target: { value } }: RadioChangeEvent) => {
diff --git a/src/shared/molecules/TypeSelector/types.ts b/src/shared/molecules/TypeSelector/types.ts
index d041f44f0..9d8e50d9e 100644
--- a/src/shared/molecules/TypeSelector/types.ts
+++ b/src/shared/molecules/TypeSelector/types.ts
@@ -30,16 +30,17 @@ type TTypeSelectorStyle = {
container?: React.CSSProperties;
selector?: React.CSSProperties;
};
+export type TTypeOperator = 'AND' | 'OR';
export type TTypeSelectorProps = {
org?: string;
project?: string;
types?: TType[];
styles?: TTypeSelectorStyle;
defaultValue?: TType[];
- typeOperator?: 'AND' | 'OR';
+ typeOperator: TTypeOperator;
updateOptions(options: {
types?: TType[];
- typeOperator?: 'AND' | 'OR';
+ typeOperator: TTypeOperator;
}): void;
- afterUpdate?: (types?: TType[]) => void;
+ afterUpdate?: (typeOperator: TTypeOperator, types?: TType[]) => void;
};
diff --git a/src/subapps/dataExplorer/DataExplorer.tsx b/src/subapps/dataExplorer/DataExplorer.tsx
index e0ea9da47..2261a26b7 100644
--- a/src/subapps/dataExplorer/DataExplorer.tsx
+++ b/src/subapps/dataExplorer/DataExplorer.tsx
@@ -12,16 +12,17 @@ import {
sortColumns,
usePaginatedExpandedResources,
} from './DataExplorerUtils';
+import {
+ TType,
+ TTypeOperator,
+} from '../../shared/molecules/TypeSelector/types';
+import TypeSelector from '../../shared/molecules/TypeSelector/TypeSelector';
import { ProjectSelector } from './ProjectSelector';
import { PredicateSelector } from './PredicateSelector';
import { DatasetCount } from './DatasetCount';
import { DataExplorerCollapsibleHeader } from './DataExplorerCollapsibleHeader';
import DateExplorerScrollArrows from './DateExplorerScrollArrows';
-import { RootState } from '../../shared/store/reducers';
-import { UpdateDataExplorerOrigin } from '../../shared/store/reducers/data-explorer';
-import { TType } from '../../shared/molecules/TypeSelector/types';
import ColumnsSelector, { TColumn } from './ColumnsSelector';
-import TypeSelector from '../../shared/molecules/TypeSelector/TypeSelector';
import './styles.less';
const $update = (
@@ -42,6 +43,7 @@ export interface DataExplorerConfiguration {
selectedPath: string | null;
deprecated: boolean;
columns: TColumn[];
+ typeOperator: TTypeOperator;
}
const SELECTED_COLUMNS_CACHED_KEY = 'data-explorer-selected-columns';
const SELECTED_FILTERS_CACHED_KEY = 'data-explorer-selected-filters';
@@ -83,6 +85,7 @@ const getSelectedFiltersCached = () => {
showEmptyCells: parsed.showEmptyCells ?? true,
pageSize: parsed.pageSize ?? 50,
offset: parsed.offset ?? 0,
+ typeOperator: parsed.typeOperator ?? 'OR',
};
} catch (e) {
return null;
@@ -133,6 +136,7 @@ const DataExplorer: React.FC<{}> = () => {
selectedPath,
deprecated,
columns,
+ typeOperator,
},
updateTableConfiguration,
] = useReducer(
@@ -152,6 +156,7 @@ const DataExplorer: React.FC<{}> = () => {
selectedPath: null,
deprecated: false,
columns: [],
+ typeOperator: 'OR',
}
);
@@ -160,6 +165,7 @@ const DataExplorer: React.FC<{}> = () => {
offset,
orgAndProject,
deprecated,
+ typeOperator,
types: types?.map(t => t.value),
});
@@ -225,6 +231,7 @@ const DataExplorer: React.FC<{}> = () => {
: undefined,
types: selectedFilters.types,
deprecated: selectedFilters.deprecated ?? deprecated,
+ typeOperator: selectedFilters.typeOperator ?? typeOperator,
});
setShowMetadataColumns(
selectedFilters.showMetadata ?? showMetadataColumns
@@ -312,10 +319,12 @@ const DataExplorer: React.FC<{}> = () => {
}}
/>
= () => {
'--types-background-color': 'white',
} as React.CSSProperties,
}}
- afterUpdate={types => {
- updateTableConfiguration({ types });
+ afterUpdate={(typeOperator, types) => {
+ updateTableConfiguration({ types, typeOperator });
clearSelectedColumnsCached();
updateSelectedFiltersCached({
+ typeOperator,
types: types && types.length > 0 ? types : undefined,
});
}}
diff --git a/src/subapps/dataExplorer/DataExplorerUtils.tsx b/src/subapps/dataExplorer/DataExplorerUtils.tsx
index fd990e503..f4bea2718 100644
--- a/src/subapps/dataExplorer/DataExplorerUtils.tsx
+++ b/src/subapps/dataExplorer/DataExplorerUtils.tsx
@@ -1,11 +1,12 @@
+import { useEffect } from 'react';
import { Resource } from '@bbp/nexus-sdk';
+import { useQuery } from 'react-query';
import { useNexusContext } from '@bbp/react-nexus';
-import PromisePool from '@supercharge/promise-pool';
import { notification } from 'antd';
-import { useQuery } from 'react-query';
-import { makeOrgProjectTuple } from '../../shared/molecules/MyDataTable/MyDataTable';
import { isString } from 'lodash';
-import { useEffect } from 'react';
+import PromisePool from '@supercharge/promise-pool';
+import { makeOrgProjectTuple } from '../../shared/molecules/MyDataTable/MyDataTable';
+import { TTypeOperator } from '../../shared/molecules/TypeSelector/types';
export const usePaginatedExpandedResources = ({
pageSize,
@@ -13,10 +14,14 @@ export const usePaginatedExpandedResources = ({
orgAndProject,
deprecated,
types,
+ typeOperator,
}: PaginatedResourcesParams) => {
const nexus = useNexusContext();
return useQuery({
- queryKey: ['data-explorer', { pageSize, offset, orgAndProject, types }],
+ queryKey: [
+ 'data-explorer',
+ { pageSize, offset, orgAndProject, types, typeOperator },
+ ],
retry: false,
queryFn: async () => {
const resultWithPartialResources = await nexus.Resource.list(
@@ -25,8 +30,9 @@ export const usePaginatedExpandedResources = ({
{
deprecated,
// @ts-ignore
+ typeOperator,
+ // @ts-ignore
type: types,
- typeOperator: 'or',
from: offset,
size: pageSize,
}
@@ -186,6 +192,7 @@ interface PaginatedResourcesParams {
orgAndProject?: string[];
deprecated: boolean;
types?: string[];
+ typeOperator: TTypeOperator;
}
export const useTimeoutMessage = ({