Skip to content

Commit

Permalink
bug fixes (#737)
Browse files Browse the repository at this point in the history 
Signed-off-by: Jackie Han <[email protected]>
  • Loading branch information
@jackiehanyang
jackiehanyang committed Apr 29, 2024
1 parent 1bed6ab commit 9c2d584
Show file tree
Hide file tree
Showing 11 changed files with 86 additions and 59 deletions.
4 changes: 2 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,13 +25,13 @@
"devDependencies": {
"@testing-library/user-event": "^12.1.6",
"@types/react-plotly.js": "^2.6.0",
"@types/redux-mock-store": "^1.0.1",
"@types/redux-mock-store": "^1.0.6",
"babel-polyfill": "^6.26.0",
"eslint-plugin-no-unsanitized": "^3.0.2",
"eslint-plugin-prefer-object-spread": "^1.2.1",
"lint-staged": "^9.2.0",
"moment": "^2.24.0",
"redux-mock-store": "^1.5.3",
"redux-mock-store": "^1.5.4",
"start-server-and-test": "^1.11.7"
},
"dependencies": {
Expand Down
32 changes: 18 additions & 14 deletions public/pages/Dashboard/Container/DashboardOverview.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,7 @@ import { RouteComponentProps } from 'react-router-dom';

interface OverviewProps extends RouteComponentProps {
setActionMenu: (menuMount: MountPoint | undefined) => void;
landingDataSourceId: string | undefined;
}

export function DashboardOverview(props: OverviewProps) {
Expand All @@ -91,11 +92,11 @@ export function DashboardOverview(props: OverviewProps) {
const queryParams = getDataSourceFromURL(props.location);
const [MDSOverviewState, setMDSOverviewState] = useState<MDSStates>({
queryParams,
selectedDataSourceId: queryParams.dataSourceId
? queryParams.dataSourceId
: undefined,
selectedDataSourceId: queryParams.dataSourceId === undefined
? undefined
: queryParams.dataSourceId,
});

const getDetectorOptions = (detectorsIdMap: {
[key: string]: DetectorListItem;
}) => {
Expand Down Expand Up @@ -215,13 +216,15 @@ export function DashboardOverview(props: OverviewProps) {

useEffect(() => {
const { history, location } = props;
const updatedParams = {
dataSourceId: MDSOverviewState.selectedDataSourceId,
};
history.replace({
...location,
search: queryString.stringify(updatedParams),
});
if (dataSourceEnabled) {
const updatedParams = {
dataSourceId: MDSOverviewState.selectedDataSourceId,
};
history.replace({
...location,
search: queryString.stringify(updatedParams),
});
}
intializeDetectors();
}, [MDSOverviewState]);

Expand Down Expand Up @@ -274,9 +277,10 @@ export function DashboardOverview(props: OverviewProps) {
componentType={'DataSourceSelectable'}
componentConfig={{
fullWidth: false,
activeOption: MDSOverviewState.selectedDataSourceId !== undefined
? [{ id: MDSOverviewState.selectedDataSourceId }]
: undefined,
activeOption: props.landingDataSourceId === undefined
|| MDSOverviewState.selectedDataSourceId === undefined
? undefined
: [{ id: MDSOverviewState.selectedDataSourceId }],
savedObjects: getSavedObjectsClient(),
notifications: getNotifications(),
onSelectedDataSources: (dataSources) =>
Expand Down
2 changes: 1 addition & 1 deletion public/pages/DefineDetector/containers/DefineDetector.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ export const DefineDetector = (props: DefineDetectorProps) => {

const [MDSCreateState, setMDSCreateState] = useState<MDSStates>({
queryParams: MDSQueryParams,
selectedDataSourceId: dataSourceId ? dataSourceId : undefined,
selectedDataSourceId: dataSourceId === undefined? undefined : dataSourceId,
});

// To handle backward compatibility, we need to pass some fields via
Expand Down
41 changes: 25 additions & 16 deletions public/pages/DetectorsList/containers/List/List.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ import {
} from '../../../../../server/utils/helpers';
import { CoreStart, MountPoint } from '../../../../../../../src/core/public';
import { CoreServicesContext } from '../../../../components/CoreServices/CoreServices';
import { DataSourceSelectableConfig } from '../../../../../../../src/plugins/data_source_management/public';
import { DataSourceOption, DataSourceSelectableConfig } from '../../../../../../../src/plugins/data_source_management/public';
import {
getDataSourceManagementPlugin,
getDataSourceEnabled,
Expand Down Expand Up @@ -206,25 +206,25 @@ export const DetectorList = (props: ListProps) => {
selectedIndices: queryParams.indices
? queryParams.indices.split(',')
: ALL_INDICES,
selectedDataSourceId: queryParams.dataSourceId
? queryParams.dataSourceId
: undefined,
selectedDataSourceId: queryParams.dataSourceId === undefined
? undefined
: queryParams.dataSourceId,
});

// Set breadcrumbs on page initialization
useEffect(() => {
if (dataSourceEnabled) {
core.chrome.setBreadcrumbs([
BREADCRUMBS.ANOMALY_DETECTOR,
BREADCRUMBS.DETECTORS,
MDS_BREADCRUMBS.ANOMALY_DETECTOR(state.selectedDataSourceId),
MDS_BREADCRUMBS.DETECTORS(state.selectedDataSourceId),
]);
} else {
core.chrome.setBreadcrumbs([
MDS_BREADCRUMBS.ANOMALY_DETECTOR(state.selectedDataSourceId),
MDS_BREADCRUMBS.DETECTORS(state.selectedDataSourceId),
BREADCRUMBS.ANOMALY_DETECTOR,
BREADCRUMBS.DETECTORS,
]);
}
}, []);
}, [state.selectedDataSourceId]);

// Getting all initial indices
const [indexQuery, setIndexQuery] = useState('');
Expand All @@ -238,12 +238,21 @@ export const DetectorList = (props: ListProps) => {
// Refresh data if user change any parameters / filter / sort
useEffect(() => {
const { history, location } = props;
const updatedParams = {
...state.queryParams,
indices: state.selectedIndices.join(','),
let updatedParams = {
from: state.page * state.queryParams.size,
dataSourceId: state.selectedDataSourceId,
};
size: state.queryParams.size,
search: state.queryParams.search,
indices: state.selectedIndices.join(','),
sortDirection: state.queryParams.sortDirection,
sortField: state.queryParams.sortField,
} as GetDetectorsQueryParams;

if (dataSourceEnabled) {
updatedParams = {
...updatedParams,
dataSourceId: state.selectedDataSourceId,
}
}

history.replace({
...location,
Expand Down Expand Up @@ -588,8 +597,8 @@ export const DetectorList = (props: ListProps) => {
});
};

const handleDataSourceChange = ([event]) => {
const dataSourceId = event?.id;
const handleDataSourceChange = (dataSources: DataSourceOption[]) => {
const dataSourceId = dataSources[0].id;

if (dataSourceEnabled && dataSourceId === undefined) {
getNotifications().toasts.addDanger(
Expand Down
6 changes: 3 additions & 3 deletions public/pages/DetectorsList/utils/__tests__/helpers.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ describe('helpers spec', () => {
indices: '',
sortField: 'name',
sortDirection: SORT_DIRECTION.ASC,
dataSourceId: '',
dataSourceId: undefined,
});
});
test('should default values if missing from queryParams', () => {
Expand All @@ -43,7 +43,7 @@ describe('helpers spec', () => {
indices: '',
sortField: 'name',
sortDirection: SORT_DIRECTION.ASC,
dataSourceId:'',
dataSourceId: undefined,
});
});
test('should return queryParams from location', () => {
Expand All @@ -59,7 +59,7 @@ describe('helpers spec', () => {
indices: 'someIndex',
sortField: 'name',
sortDirection: SORT_DIRECTION.DESC,
dataSourceId:'',
dataSourceId: undefined,
});
});
});
Expand Down
4 changes: 3 additions & 1 deletion public/pages/DetectorsList/utils/helpers.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,10 +47,12 @@ export const getURLQueryParams = (location: {
typeof sortDirection !== 'string'
? DEFAULT_QUERY_PARAMS.sortDirection
: (sortDirection as SORT_DIRECTION),
dataSourceId: typeof dataSourceId !== 'string' ? '' : dataSourceId,
dataSourceId: dataSourceId === undefined ? undefined : dataSourceId,
};
};



// For realtime detectors: cannot have 'Finished' state
export const getDetectorStateOptions = () => {
return Object.values(DETECTOR_STATE)
Expand Down
30 changes: 17 additions & 13 deletions public/pages/Overview/containers/AnomalyDetectionOverview.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,7 @@ import { MDSStates } from '../../../models/interfaces';

interface AnomalyDetectionOverviewProps extends RouteComponentProps {
setActionMenu: (menuMount: MountPoint | undefined) => void;
landingDataSourceId: string | undefined;
}

export function AnomalyDetectionOverview(props: AnomalyDetectionOverviewProps) {
Expand Down Expand Up @@ -103,9 +104,9 @@ export function AnomalyDetectionOverview(props: AnomalyDetectionOverviewProps) {
const queryParams = getDataSourceFromURL(props.location);
const [MDSOverviewState, setMDSOverviewState] = useState<MDSStates>({
queryParams,
selectedDataSourceId: queryParams.dataSourceId
? queryParams.dataSourceId
: undefined,
selectedDataSourceId: queryParams.dataSourceId === undefined
? undefined
: queryParams.dataSourceId,
});

// Set breadcrumbs on page initialization
Expand All @@ -120,14 +121,16 @@ export function AnomalyDetectionOverview(props: AnomalyDetectionOverviewProps) {
// Getting all initial sample detectors & indices
useEffect(() => {
const { history, location } = props;
const updatedParams = {
dataSourceId: MDSOverviewState.selectedDataSourceId,
};
history.replace({
...location,
search: queryString.stringify(updatedParams),
});
if (dataSourceEnabled && props.landingDataSourceId !== undefined) {
const updatedParams = {
dataSourceId: MDSOverviewState.selectedDataSourceId,
};

history.replace({
...location,
search: queryString.stringify(updatedParams),
});
}
fetchData();
}, [MDSOverviewState]);

Expand Down Expand Up @@ -247,9 +250,10 @@ export function AnomalyDetectionOverview(props: AnomalyDetectionOverviewProps) {
componentType={'DataSourceSelectable'}
componentConfig={{
fullWidth: false,
activeOption: MDSOverviewState.selectedDataSourceId !== undefined
? [{ id: MDSOverviewState.selectedDataSourceId }]
: undefined,
activeOption: props.landingDataSourceId === undefined
|| MDSOverviewState.selectedDataSourceId === undefined
? undefined
: [{ id: MDSOverviewState.selectedDataSourceId }],
savedObjects: getSavedObjectsClient(),
notifications: getNotifications(),
onSelectedDataSources: (dataSources) =>
Expand Down
8 changes: 6 additions & 2 deletions public/pages/main/Main.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,8 @@ export function Main(props: MainProps) {
const adState = useSelector((state: AppState) => state.ad);
const totalDetectors = adState.totalDetectors;
const queryParams = getURLQueryParams(props.location);
const dataSourceId = queryParams.dataSourceId ? queryParams.dataSourceId : '';

const dataSourceId = queryParams.dataSourceId === undefined ? undefined : queryParams.dataSourceId;
const sideNav = [
{
name: Navigation.AnomalyDetection,
Expand Down Expand Up @@ -99,6 +99,7 @@ export function Main(props: MainProps) {
render={(props: RouteComponentProps) => (
<DashboardOverview
setActionMenu={setHeaderActionMenu}
landingDataSourceId={dataSourceId}
{...props}
/>
)}
Expand Down Expand Up @@ -155,6 +156,7 @@ export function Main(props: MainProps) {
render={(props: RouteComponentProps) => (
<AnomalyDetectionOverview
setActionMenu={setHeaderActionMenu}
landingDataSourceId={dataSourceId}
{...props}
/>
)}
Expand All @@ -165,11 +167,13 @@ export function Main(props: MainProps) {
totalDetectors > 0 ? (
<DashboardOverview
setActionMenu={setHeaderActionMenu}
landingDataSourceId={dataSourceId}
{...props}
/>
) : (
<AnomalyDetectionOverview
setActionMenu={setHeaderActionMenu}
landingDataSourceId={dataSourceId}
{...props}
/>
)
Expand Down
7 changes: 5 additions & 2 deletions public/pages/utils/helpers.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -165,10 +165,13 @@ export const constructHrefWithDataSourceId = (
url.set(DETECTORS_QUERY_PARAMS.SEARCH, DEFAULT_QUERY_PARAMS.search);
url.set(DETECTORS_QUERY_PARAMS.INDICES, DEFAULT_QUERY_PARAMS.indices);
url.set(DETECTORS_QUERY_PARAMS.SORT_FIELD, DEFAULT_QUERY_PARAMS.sortField);
url.set(DETECTORS_QUERY_PARAMS.SORT_DIRECTION, SORT_DIRECTION.ASC);
url.set(DETECTORS_QUERY_PARAMS.SORT_DIRECTION, SORT_DIRECTION.ASC)
if (dataSourceEnabled) {
url.set(DETECTORS_QUERY_PARAMS.DATASOURCEID, '');
}
}

if (dataSourceEnabled && dataSourceId) {
if (dataSourceEnabled && dataSourceId !== undefined) {
url.set('dataSourceId', dataSourceId);
}

Expand Down
1 change: 1 addition & 0 deletions server/utils/constants.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@ export enum DETECTORS_QUERY_PARAMS {
SORT_FIELD = 'sortField',
SORT_DIRECTION = 'sortDirection',
NAME = 'name',
DATASOURCEID = 'dataSourceId',
}

export enum AD_DOC_FIELDS {
Expand Down
10 changes: 5 additions & 5 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -136,10 +136,10 @@
"@types/scheduler" "*"
csstype "^3.0.2"

"@types/redux-mock-store@^1.0.1":
version "1.0.3"
resolved "https://registry.yarnpkg.com/@types/redux-mock-store/-/redux-mock-store-1.0.3.tgz#895de4a364bc4836661570aec82f2eef5989d1fb"
integrity sha512-Wqe3tJa6x9MxMN4DJnMfZoBRBRak1XTPklqj4qkVm5VBpZnC8PSADf4kLuFQ9NAdHaowfWoEeUMz7NWc2GMtnA==
"@types/redux-mock-store@^1.0.6":
version "1.0.6"
resolved "https://registry.yarnpkg.com/@types/redux-mock-store/-/redux-mock-store-1.0.6.tgz#0a03b2655028b7cf62670d41ac1de5ca1b1f5958"
integrity sha512-eg5RDfhJTXuoJjOMyXiJbaDb1B8tfTaJixscmu+jOusj6adGC0Krntz09Tf4gJgXeCqCrM5bBMd+B7ez0izcAQ==
dependencies:
redux "^4.0.5"

Expand Down Expand Up @@ -1432,7 +1432,7 @@ readable-stream@^3.6.0, readable-stream@^3.6.2:
string_decoder "^1.1.1"
util-deprecate "^1.0.1"

redux-mock-store@^1.5.3:
redux-mock-store@^1.5.4:
version "1.5.4"
resolved "https://registry.yarnpkg.com/redux-mock-store/-/redux-mock-store-1.5.4.tgz#90d02495fd918ddbaa96b83aef626287c9ab5872"
integrity sha512-xmcA0O/tjCLXhh9Fuiq6pMrJCwFRaouA8436zcikdIpYWWCjU76CRk+i2bHx8EeiSiMGnB85/lZdU3wIJVXHTA==
Expand Down

0 comments on commit 9c2d584

Please sign in to comment.