Skip to content
This repository has been archived by the owner on Aug 2, 2022. It is now read-only.

Commit

Permalink
Merging master to opendistro-1.10
Browse files Browse the repository at this point in the history
  • Loading branch information
@saratvemulapalli
saratvemulapalli committed Sep 8, 2020
2 parents fa4ab99 + fd28abd commit 0834407
Show file tree
Hide file tree
Showing 20 changed files with 301 additions and 169 deletions.
1 change: 1 addition & 0 deletions public/models/interfaces.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,7 @@ export type Detector = {
featureAttributes: FeatureAttributes[];
windowDelay: { period: Schedule };
detectionInterval: { period: Schedule };
shingleSize: number;
uiMetadata: UiMetaData;
lastUpdateTime: number;
enabled?: boolean;
Expand Down
15 changes: 8 additions & 7 deletions public/pages/Dashboard/Components/AnomaliesLiveChart.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ import {
getLatestAnomalyResultsForDetectorsByTimeRange,
getLatestAnomalyResultsByTimeRange,
} from '../utils/utils';
import { MAX_ANOMALIES } from '../../../utils/constants';
import { MAX_ANOMALIES, SPACE_STR } from '../../../utils/constants';

export interface AnomaliesLiveChartProps {
selectedDetectors: DetectorListItem[];
Expand Down Expand Up @@ -134,7 +134,7 @@ export const AnomaliesLiveChart = (props: AnomaliesLiveChartProps) => {

setLatestLiveAnomalousDetectorsCount(
new Set(
latestLiveAnomalyResult.map(anomalyData =>
latestLiveAnomalyResult.map((anomalyData) =>
get(anomalyData, AD_DOC_FIELDS.DETECTOR_ID, '')
)
).size
Expand Down Expand Up @@ -165,15 +165,15 @@ export const AnomaliesLiveChart = (props: AnomaliesLiveChartProps) => {
liveTimeRange.endDateTime.valueOf(),
]);

const visualizedAnomalies = liveAnomalyData.flatMap(anomalyResult =>
const visualizedAnomalies = liveAnomalyData.flatMap((anomalyResult) =>
visualizeAnomalyResultForXYChart(anomalyResult)
);
const prepareVisualizedAnomalies = (
liveVisualizedAnomalies: object[]
): object[] => {
// add data point placeholder at every minute,
// to ensure chart evenly distrubted
const existingPlotTimes = liveVisualizedAnomalies.map(anomaly =>
const existingPlotTimes = liveVisualizedAnomalies.map((anomaly) =>
getFloorPlotTime(get(anomaly, AD_DOC_FIELDS.PLOT_TIME, 0))
);
const result = [...liveVisualizedAnomalies];
Expand All @@ -187,12 +187,13 @@ export const AnomaliesLiveChart = (props: AnomaliesLiveChartProps) => {
continue;
}
result.push({
[AD_DOC_FIELDS.DETECTOR_NAME]: !isEmpty(liveAnomalyData) ? '' : null,
[AD_DOC_FIELDS.DETECTOR_NAME]: !isEmpty(liveAnomalyData)
? ''
: SPACE_STR,
[AD_DOC_FIELDS.PLOT_TIME]: currentTime,
[AD_DOC_FIELDS.ANOMALY_GRADE]: null,
});
}

return result;
};

Expand All @@ -206,7 +207,7 @@ export const AnomaliesLiveChart = (props: AnomaliesLiveChartProps) => {

const fullScreenButton = () => (
<EuiButton
onClick={() => setIsFullScreen(isFullScreen => !isFullScreen)}
onClick={() => setIsFullScreen((isFullScreen) => !isFullScreen)}
iconType={isFullScreen ? 'exit' : 'fullScreen'}
aria-label="View full screen"
>
Expand Down
142 changes: 72 additions & 70 deletions public/pages/Dashboard/Container/DashboardOverview.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -203,75 +203,77 @@ export function DashboardOverview() {
}, [selectedDetectorsName, selectedIndices, selectedDetectorStates]);

return (
<Fragment>
<DashboardHeader hasDetectors={adState.totalDetectors > 0} />
{isLoadingDetectors ? (
<div>
<EuiLoadingSpinner size="s" />
&nbsp;&nbsp;
<EuiLoadingSpinner size="m" />
&nbsp;&nbsp;
<EuiLoadingSpinner size="l" />
&nbsp;&nbsp;
<EuiLoadingSpinner size="xl" />
</div>
) : adState.totalDetectors === 0 ? (
<EmptyDashboard />
) : (
<Fragment>
<EuiFlexGroup justifyContent="flexStart" gutterSize="s">
<EuiFlexItem>
<EuiComboBox
id="detectorFilter"
data-test-subj="detectorFilter"
placeholder={ALL_DETECTORS_MESSAGE}
options={getDetectorOptions(allDetectorList)}
onChange={handleDetectorsFilterChange}
selectedOptions={selectedDetectorsName.map(buildItemOption)}
isClearable={true}
fullWidth
/>
</EuiFlexItem>
<EuiFlexItem>
<EuiComboBox
id="detectorStateFilter"
data-test-subj="detectorStateFilter"
placeholder={ALL_DETECTOR_STATES_MESSAGE}
options={getDetectorStateOptions()}
onChange={handleDetectorStateFilterChange}
selectedOptions={selectedDetectorStates.map(buildItemOption)}
isClearable={true}
fullWidth
/>
</EuiFlexItem>
<EuiFlexItem>
<EuiComboBox
id="indicesFilter"
data-test-subj="indicesFilter"
placeholder={ALL_INDICES_MESSAGE}
options={getVisibleOptions(visibleIndices, visibleAliases)}
onChange={handleIndicesFilterChange}
selectedOptions={selectedIndices.map(buildItemOption)}
isClearable={true}
fullWidth
/>
</EuiFlexItem>
</EuiFlexGroup>
<EuiSpacer />
<AnomaliesLiveChart selectedDetectors={currentDetectors} />
<EuiSpacer />
<EuiFlexGroup justifyContent="spaceBetween">
<EuiFlexItem grow={6}>
<AnomaliesDistributionChart
selectedDetectors={currentDetectors}
/>
</EuiFlexItem>
<EuiFlexItem grow={3}>
<AnomalousDetectorsList selectedDetectors={currentDetectors} />
</EuiFlexItem>
</EuiFlexGroup>
</Fragment>
)}
</Fragment>
<div style={{ height: '1200px' }}>
<Fragment>
<DashboardHeader hasDetectors={adState.totalDetectors > 0} />
{isLoadingDetectors ? (
<div>
<EuiLoadingSpinner size="s" />
&nbsp;&nbsp;
<EuiLoadingSpinner size="m" />
&nbsp;&nbsp;
<EuiLoadingSpinner size="l" />
&nbsp;&nbsp;
<EuiLoadingSpinner size="xl" />
</div>
) : adState.totalDetectors === 0 ? (
<EmptyDashboard />
) : (
<Fragment>
<EuiFlexGroup justifyContent="flexStart" gutterSize="s">
<EuiFlexItem>
<EuiComboBox
id="detectorFilter"
data-test-subj="detectorFilter"
placeholder={ALL_DETECTORS_MESSAGE}
options={getDetectorOptions(allDetectorList)}
onChange={handleDetectorsFilterChange}
selectedOptions={selectedDetectorsName.map(buildItemOption)}
isClearable={true}
fullWidth
/>
</EuiFlexItem>
<EuiFlexItem>
<EuiComboBox
id="detectorStateFilter"
data-test-subj="detectorStateFilter"
placeholder={ALL_DETECTOR_STATES_MESSAGE}
options={getDetectorStateOptions()}
onChange={handleDetectorStateFilterChange}
selectedOptions={selectedDetectorStates.map(buildItemOption)}
isClearable={true}
fullWidth
/>
</EuiFlexItem>
<EuiFlexItem>
<EuiComboBox
id="indicesFilter"
data-test-subj="indicesFilter"
placeholder={ALL_INDICES_MESSAGE}
options={getVisibleOptions(visibleIndices, visibleAliases)}
onChange={handleIndicesFilterChange}
selectedOptions={selectedIndices.map(buildItemOption)}
isClearable={true}
fullWidth
/>
</EuiFlexItem>
</EuiFlexGroup>
<EuiSpacer />
<AnomaliesLiveChart selectedDetectors={currentDetectors} />
<EuiSpacer />
<EuiFlexGroup justifyContent="spaceBetween">
<EuiFlexItem grow={6}>
<AnomaliesDistributionChart
selectedDetectors={currentDetectors}
/>
</EuiFlexItem>
<EuiFlexItem grow={3}>
<AnomalousDetectorsList selectedDetectors={currentDetectors} />
</EuiFlexItem>
</EuiFlexGroup>
</Fragment>
)}
</Fragment>
</div>
);
}
11 changes: 11 additions & 0 deletions public/pages/DetectorConfig/DetectorConfig.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,3 +82,14 @@
line-height: 24px;
text-align: center;
}

.header-single-value-euiBasicTable {
.euiTableHeaderCell, .euiTableRowCell {
border: 0;
.euiTableCellContent {
padding-top: 0;
padding-bottom: 0;
}
}

}
64 changes: 45 additions & 19 deletions public/pages/DetectorConfig/containers/Features.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,14 +20,15 @@ import {
EuiIcon,
EuiButton,
EuiEmptyPrompt,
EuiSpacer,
} from '@elastic/eui';
import {
Detector,
FEATURE_TYPE,
FeatureAttributes,
} from '../../../models/interfaces';
import { get, sortBy } from 'lodash';
import { PLUGIN_NAME } from '../../../utils/constants';
import { PLUGIN_NAME, SHINGLE_SIZE } from '../../../utils/constants';
import ContentPanel from '../../../components/ContentPanel/ContentPanel';
import { CodeModal } from '../components/CodeModal/CodeModal';
import { getTitleWithCount } from '../../../utils/utils';
Expand Down Expand Up @@ -93,6 +94,7 @@ export class Features extends Component<FeaturesProps, FeaturesState> {

public render() {
const featureAttributes = get(this.props.detector, 'featureAttributes', []);
const shingleSize = get(this.props.detector, 'shingleSize', SHINGLE_SIZE);

const sorting = {
sort: {
Expand Down Expand Up @@ -170,7 +172,7 @@ export class Features extends Component<FeaturesProps, FeaturesState> {
},
{
field: 'state',
name: 'State',
name: 'Feature state',
},
];

Expand All @@ -182,17 +184,21 @@ export class Features extends Component<FeaturesProps, FeaturesState> {

const featureNum = Object.keys(featureAttributes).length;

const setParamsText = `Set the index fields that you want to find anomalies for by defining
the model features. You can also set other model parameters such as
window size.`

const previewText = `After you set the model features and other optional parameters, you can
preview your anomalies from a sample feature output.`

return (
<ContentPanel
title={getTitleWithCount('Features', featureNum)}
title="Model configuration"
titleSize="s"
subTitle={
<EuiText className="anomaly-distribution-subtitle">
<p>
Specify index fields that you want to find anomalies for by
defining features. A detector can discover anomalies for up to 5
features. Once you define the features, you can preview your
anomalies from a sample feature output.{' '}
{`${setParamsText} ${previewText} `}
<EuiLink
href="https://opendistro.github.io/for-elasticsearch-docs/docs/ad/"
target="_blank"
Expand All @@ -211,14 +217,15 @@ export class Features extends Component<FeaturesProps, FeaturesState> {
<EuiEmptyPrompt
title={
<span className="emptyFeatureTitle">
Features are required to run a detector
Model parameters are required to run a detector
</span>
}
body={
<EuiText className="emptyFeatureBody">
Specify index fields that you want to find anomalies for by
defining features. Once you define the features, you can preview
your anomalies from a sample feature output.
{setParamsText}
<br/>
<br/>
{previewText}
</EuiText>
}
actions={[
Expand All @@ -227,18 +234,37 @@ export class Features extends Component<FeaturesProps, FeaturesState> {
href={`${PLUGIN_NAME}#/detectors/${this.props.detectorId}/features`}
fill
>
Add feature
Configure model
</EuiButton>,
]}
/>
) : (
<EuiBasicTable
items={sortedItems}
columns={columns}
cellProps={getCellProps}
sorting={sorting}
onChange={this.handleTableChange}
/>
<div>
<ContentPanel
title={getTitleWithCount('Features', featureNum)}
titleSize="s"
>
<EuiBasicTable
items={sortedItems}
columns={columns}
cellProps={getCellProps}
sorting={sorting}
onChange={this.handleTableChange}
/>
</ContentPanel>
<EuiSpacer size="m"/>
<ContentPanel
title="Additional settings"
titleSize="s"
>
<EuiBasicTable
className="header-single-value-euiBasicTable"
items={[{ windowSize: shingleSize }]}
columns={[{ field: 'windowSize', name: 'Window size'}]}
cellProps={getCellProps}
/>
</ContentPanel>
</div>
)}
</ContentPanel>
);
Expand Down
3 changes: 0 additions & 3 deletions public/pages/DetectorConfig/containers/MetaData.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,8 @@ import {
EuiButton,
EuiFormRowProps,
} from '@elastic/eui';
import { PLUGIN_NAME } from '../../../utils/constants';
import {
Detector,
Schedule,
UiMetaData,
FILTER_TYPES,
UIFilter,
} from '../../../models/interfaces';
Expand Down
Loading

0 comments on commit 0834407

Please sign in to comment.