Skip to content

Commit 6eace81

Browse files
authored
removed duplicate popout icon and ran prettier (opensearch-project#382)
Signed-off-by: Amit Galitzky <amgalitz@amazon.com>
1 parent 0ee7503 commit 6eace81

File tree

40 files changed

+813
-1055
lines changed

40 files changed

+813
-1055
lines changed

global-setup.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
export default () => {
2-
process.env.TZ = 'UTC';
3-
}
2+
process.env.TZ = 'UTC';
3+
};

public/components/FormattedFormRow/FormattedFormRow.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export const FormattedFormRow = (props: FormattedFormRowProps) => {
3535
{props.hintLink ? ' ' : null}
3636
{props.hintLink ? (
3737
<EuiLink href={props.hintLink} target="_blank">
38-
Learn more <EuiIcon size="s" type="popout" />
38+
Learn more
3939
</EuiLink>
4040
) : null}
4141
</EuiText>

public/models/interfaces.ts

+18-18
Original file line numberDiff line numberDiff line change
@@ -82,27 +82,27 @@ export type FeatureAttributes = {
8282

8383
// all possible valid units accepted by the backend
8484
export enum UNITS {
85-
NANOS = "Nanos",
86-
MICROS = "Micros",
87-
MILLIS = "Millis",
88-
SECONDS = "Seconds",
85+
NANOS = 'Nanos',
86+
MICROS = 'Micros',
87+
MILLIS = 'Millis',
88+
SECONDS = 'Seconds',
8989
MINUTES = 'Minutes',
90-
HOURS = "Hours",
91-
HALF_DAYS = "HalfDays",
92-
DAYS = "Days",
93-
WEEKS = "Weeks",
94-
MONTHS = "Months",
95-
YEARS = "Years",
96-
DECADES = "Decades",
97-
CENTURIES = "Centuries",
98-
MILLENNIA = "Millennia",
99-
ERAS = "Eras",
100-
FOREVER = "Forever"
90+
HOURS = 'Hours',
91+
HALF_DAYS = 'HalfDays',
92+
DAYS = 'Days',
93+
WEEKS = 'Weeks',
94+
MONTHS = 'Months',
95+
YEARS = 'Years',
96+
DECADES = 'Decades',
97+
CENTURIES = 'Centuries',
98+
MILLENNIA = 'Millennia',
99+
ERAS = 'Eras',
100+
FOREVER = 'Forever',
101101
}
102102

103103
// cannot create a method in enum, have to write function separately
104104
export function toDuration(units: UNITS): Duration {
105-
switch(units) {
105+
switch (units) {
106106
case UNITS.NANOS: {
107107
// Duration in moment library does not support
108108
return moment.duration(0.000000001, 'seconds');
@@ -155,7 +155,7 @@ export function toDuration(units: UNITS): Duration {
155155
default:
156156
break;
157157
}
158-
throw new Error("Unexpected unit: " + units);
158+
throw new Error('Unexpected unit: ' + units);
159159
}
160160

161161
export type Schedule = {
@@ -235,7 +235,7 @@ export type AnomalyData = {
235235
entity?: EntityData[];
236236
features?: { [key: string]: FeatureAggregationData };
237237
contributions?: { [key: string]: FeatureContributionData };
238-
aggInterval?: string;
238+
aggInterval?: string;
239239
};
240240

241241
export type FeatureAggregationData = {

public/pages/AnomalyCharts/components/AnomaliesStat/AnomalyStat.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ export const AlertsStat = (props: {
9191
target="_blank"
9292
style={{ fontSize: '14px' }}
9393
>
94-
View monitor <EuiIcon type="popout"></EuiIcon>
94+
View monitor
9595
</EuiLink>
9696
) : null}
9797
</Fragment>

public/pages/AnomalyCharts/components/AnomaliesStat/__tests__/__snapshots__/AnomalyStat.test.tsx.snap

+2-26
Original file line numberDiff line numberDiff line change
@@ -38,21 +38,7 @@ exports[`<AlertsStat /> spec Alert Stat renders component with monitor and loadi
3838
style="font-size: 14px;"
3939
target="_blank"
4040
>
41-
View monitor
42-
<svg
43-
aria-hidden="true"
44-
class="euiIcon euiIcon--medium"
45-
focusable="false"
46-
height="16"
47-
role="img"
48-
viewBox="0 0 16 16"
49-
width="16"
50-
xmlns="http://www.w3.org/2000/svg"
51-
>
52-
<path
53-
d="M13 8.5a.5.5 0 111 0V12a2 2 0 01-2 2H4a2 2 0 01-2-2V4a2 2 0 012-2h3.5a.5.5 0 010 1H4a1 1 0 00-1 1v8a1 1 0 001 1h8a1 1 0 001-1V8.5zm-5.12.339a.5.5 0 11-.706-.707L13.305 2H10.5a.5.5 0 110-1H14a1 1 0 011 1v3.5a.5.5 0 11-1 0V2.72L7.88 8.838z"
54-
/>
55-
</svg>
41+
View monitor
5642
<svg
5743
aria-label="External link"
5844
class="euiIcon euiIcon--small euiLink__externalIcon"
@@ -116,17 +102,7 @@ exports[`<AlertsStat /> spec Alert Stat renders component with monitor and not l
116102
style="font-size: 14px;"
117103
target="_blank"
118104
>
119-
View monitor
120-
<svg
121-
aria-hidden="true"
122-
class="euiIcon euiIcon--medium euiIcon-isLoading"
123-
focusable="false"
124-
height="16"
125-
role="img"
126-
viewBox="0 0 16 16"
127-
width="16"
128-
xmlns="http://www.w3.org/2000/svg"
129-
/>
105+
View monitor
130106
<svg
131107
aria-hidden="true"
132108
aria-label="External link"

public/pages/AnomalyCharts/components/FeatureChart/FeatureChart.tsx

+13-14
Original file line numberDiff line numberDiff line change
@@ -205,7 +205,7 @@ export const FeatureChart = (props: FeatureChartProps) => {
205205
* and thus show different annotations per feature chart (currently all annotations
206206
* shown equally across all enabled feature charts for a given detector).
207207
*/}
208-
208+
209209
{props.feature.featureEnabled ? (
210210
<RectAnnotation
211211
dataValues={flattenData(props.annotations)}
@@ -265,7 +265,7 @@ export const FeatureChart = (props: FeatureChartProps) => {
265265
', '
266266
)})`
267267
: props.featureDataSeriesName;
268-
timeSeriesList.push(
268+
timeSeriesList.push(
269269
<LineSeries
270270
id={seriesKey}
271271
name={seriesKey}
@@ -280,29 +280,28 @@ export const FeatureChart = (props: FeatureChartProps) => {
280280
yAccessors={[CHART_FIELDS.DATA]}
281281
data={featureTimeSeries}
282282
/>
283-
)
284-
if (featureTimeSeries.map(
285-
(item: FeatureAggregationData) => {
286-
if(item.hasOwnProperty('expectedValue')) {
283+
);
284+
if (
285+
featureTimeSeries.map((item: FeatureAggregationData) => {
286+
if (item.hasOwnProperty('expectedValue')) {
287287
timeSeriesList.push(
288288
<LineSeries
289-
id={"ExpectedValue"}
290-
name={"Expected Value"}
291-
color={"#0475a2"}
289+
id={'ExpectedValue'}
290+
name={'Expected Value'}
291+
color={'#0475a2'}
292292
xScaleType={ScaleType.Time}
293293
yScaleType={ScaleType.Linear}
294294
xAccessor={CHART_FIELDS.PLOT_TIME}
295295
yAccessors={[CHART_FIELDS.EXPECTED_VALUE]}
296296
data={featureTimeSeries}
297297
/>
298-
)
298+
);
299299
}
300-
}
301-
))
302-
return timeSeriesList;
300+
})
301+
)
302+
return timeSeriesList;
303303
}
304304
)}
305-
306305
</Chart>
307306
{showCustomExpression ? (
308307
<CodeModal

public/pages/AnomalyCharts/containers/AnomalyDetailsChart.tsx

+57-54
Original file line numberDiff line numberDiff line change
@@ -348,66 +348,67 @@ export const AnomalyDetailsChart = React.memo(
348348
zoomRange.endDate,
349349
]);
350350

351-
352351
const customAnomalyContributionTooltip = (details?: string) => {
353352
const anomaly = details ? JSON.parse(details) : undefined;
354-
const contributionData = get(anomaly, `contributions`, [])
353+
const contributionData = get(anomaly, `contributions`, []);
355354

356-
const featureData = get(anomaly, `features`, {})
355+
const featureData = get(anomaly, `features`, {});
357356
let featureAttributionList = [] as any[];
358357
if (Array.isArray(contributionData)) {
359358
contributionData.map((contribution: any) => {
360-
const featureName = get(get(featureData, contribution.feature_id, ""), "name", "")
361-
const dataString = (contribution.data * 100) + "%"
359+
const featureName = get(
360+
get(featureData, contribution.feature_id, ''),
361+
'name',
362+
''
363+
);
364+
const dataString = contribution.data * 100 + '%';
362365
featureAttributionList.push(
363366
<div>
364367
{featureName}: {dataString} <br />
365368
</div>
366-
)
367-
})
369+
);
370+
});
368371
} else {
369372
for (const [, value] of Object.entries(contributionData)) {
370373
featureAttributionList.push(
371374
<div>
372375
{value.name}: {value.attribution} <br />
373376
</div>
374-
)
377+
);
375378
}
376379
}
377380
return (
378381
<div>
379382
<EuiText size="xs">
380383
<EuiIcon type="list" /> <b>Feature Contribution: </b>
381384
{anomaly ? (
382-
<p>
383-
<hr style={{ color: '#E0E0E0' }}></hr>
384-
{featureAttributionList}
385-
</p>
386-
) : null}
385+
<p>
386+
<hr style={{ color: '#E0E0E0' }}></hr>
387+
{featureAttributionList}
388+
</p>
389+
) : null}
387390
</EuiText>
388391
</div>
389392
);
390393
};
391394

392-
393395
const generateContributionAnomalyAnnotations = (
394396
anomalies: AnomalyData[][]
395397
): any[][] => {
396398
let annotations = [] as any[];
397399
anomalies.forEach((anomalyTimeSeries: AnomalyData[]) => {
398400
annotations.push(
399-
Array.isArray(anomalyTimeSeries) ? (
400-
anomalyTimeSeries
401-
.filter((anomaly: AnomalyData) => anomaly.anomalyGrade > 0)
402-
.map((anomaly: AnomalyData) => (
403-
{
404-
coordinates: {
405-
x0: anomaly.startTime,
406-
x1: anomaly.endTime + (anomaly.endTime - anomaly.startTime),
407-
},
408-
details: `${JSON.stringify(anomaly)}`
409-
}))
410-
) : []
401+
Array.isArray(anomalyTimeSeries)
402+
? anomalyTimeSeries
403+
.filter((anomaly: AnomalyData) => anomaly.anomalyGrade > 0)
404+
.map((anomaly: AnomalyData) => ({
405+
coordinates: {
406+
x0: anomaly.startTime,
407+
x1: anomaly.endTime + (anomaly.endTime - anomaly.startTime),
408+
},
409+
details: `${JSON.stringify(anomaly)}`,
410+
}))
411+
: []
411412
);
412413
});
413414
return annotations;
@@ -601,7 +602,9 @@ export const AnomalyDetailsChart = React.memo(
601602
/>
602603
)}
603604
<RectAnnotation
604-
dataValues={flattenData(generateContributionAnomalyAnnotations(zoomedAnomalies))}
605+
dataValues={flattenData(
606+
generateContributionAnomalyAnnotations(zoomedAnomalies)
607+
)}
605608
id="featureAttributionAnnotation"
606609
style={{
607610
stroke: CHART_COLORS.ANOMALY_GRADE_COLOR,
@@ -610,8 +613,8 @@ export const AnomalyDetailsChart = React.memo(
610613
fill: CHART_COLORS.ANOMALY_GRADE_COLOR,
611614
}}
612615
renderTooltip={customAnomalyContributionTooltip}
613-
/>
614-
616+
/>
617+
615618
{alertAnnotations ? (
616619
<LineAnnotation
617620
id="alertAnnotation"
@@ -683,31 +686,31 @@ export const AnomalyDetailsChart = React.memo(
683686
get(anomalySeries, '0.entity', []),
684687
', '
685688
)})`
686-
: props.anomalyGradeSeriesName;
687-
return (
688-
<LineSeries
689-
id={seriesKey}
690-
name={seriesKey}
691-
color={
692-
multipleTimeSeries
693-
? ENTITY_COLORS[index]
694-
: CHART_COLORS.ANOMALY_GRADE_COLOR
695-
}
696-
data={anomalySeries}
697-
xScaleType={
698-
showAggregateResults
699-
? ScaleType.Ordinal
700-
: ScaleType.Time
701-
}
702-
yScaleType={ScaleType.Linear}
703-
xAccessor={
704-
showAggregateResults
705-
? CHART_FIELDS.AGG_INTERVAL
706-
: CHART_FIELDS.PLOT_TIME
707-
}
708-
yAccessors={[CHART_FIELDS.ANOMALY_GRADE]}
709-
/>
710-
)
689+
: props.anomalyGradeSeriesName;
690+
return (
691+
<LineSeries
692+
id={seriesKey}
693+
name={seriesKey}
694+
color={
695+
multipleTimeSeries
696+
? ENTITY_COLORS[index]
697+
: CHART_COLORS.ANOMALY_GRADE_COLOR
698+
}
699+
data={anomalySeries}
700+
xScaleType={
701+
showAggregateResults
702+
? ScaleType.Ordinal
703+
: ScaleType.Time
704+
}
705+
yScaleType={ScaleType.Linear}
706+
xAccessor={
707+
showAggregateResults
708+
? CHART_FIELDS.AGG_INTERVAL
709+
: CHART_FIELDS.PLOT_TIME
710+
}
711+
yAccessors={[CHART_FIELDS.ANOMALY_GRADE]}
712+
/>
713+
);
711714
}
712715
)}
713716
</Chart>

public/pages/AnomalyCharts/containers/FeatureBreakDown.tsx

+3-5
Original file line numberDiff line numberDiff line change
@@ -176,11 +176,9 @@ export const FeatureBreakDown = React.memo((props: FeatureBreakDownProps) => {
176176
detectorEnabledTime={props.detector.enabledTime}
177177
entityData={getEntityDataForChart(props.anomalyAndFeatureResults)}
178178
isHCDetector={props.isHCDetector}
179-
windowDelay={
180-
get(props, `detector.windowDelay.period`, {
181-
period: { interval: 0, unit: UNITS.MINUTES },
182-
})
183-
}
179+
windowDelay={get(props, `detector.windowDelay.period`, {
180+
period: { interval: 0, unit: UNITS.MINUTES },
181+
})}
184182
/>
185183
{index + 1 ===
186184
get(props, 'detector.featureAttributes', []).length ? null : (

public/pages/AnomalyCharts/utils/anomalyChartUtils.tsx

+1-3
Original file line numberDiff line numberDiff line change
@@ -640,9 +640,7 @@ export const getFeatureBreakdownWording = (
640640
return isNotSample ? 'Feature breakdown' : 'Sample feature breakdown';
641641
};
642642

643-
export const getFeatureDataWording = (
644-
isNotSample: boolean | undefined
645-
) => {
643+
export const getFeatureDataWording = (isNotSample: boolean | undefined) => {
646644
return isNotSample ? 'Feature output' : 'Sample feature output';
647645
};
648646

0 commit comments

Comments
 (0)