diff --git a/public/pages/Configuration/Configuration.tsx b/public/pages/Configuration/Configuration.tsx
index cda1aa6..66a71ef 100644
--- a/public/pages/Configuration/Configuration.tsx
+++ b/public/pages/Configuration/Configuration.tsx
@@ -1,20 +1,21 @@
import React, { useMemo, useCallback, useState, useEffect } from 'react';
import {
- EuiFlexItem,
- EuiPanel,
- EuiTitle,
- EuiFlexGrid,
- EuiText,
+ EuiBottomBar,
+ EuiButton,
+ EuiButtonEmpty,
EuiFieldNumber,
- EuiSelect,
+ EuiFlexGrid,
EuiFlexGroup,
- EuiFormRow,
+ EuiFlexItem,
EuiForm,
- EuiButton,
- EuiButtonEmpty,
- EuiBottomBar,
- EuiSwitch,
+ EuiFormRow,
+ EuiHealth,
+ EuiPanel,
+ EuiSelect,
EuiSpacer,
+ EuiSwitch,
+ EuiText,
+ EuiTitle
} from '@elastic/eui';
import { useHistory, useLocation } from 'react-router-dom';
import { CoreStart } from '../../../../../src/core/public';
@@ -165,119 +166,163 @@ const Configuration = ({
const textPadding = { lineHeight: '22px', padding: '5px 0px' };
const formRowPadding = { padding: '0px 0px 20px' };
+ const enabledSymb = Enabled;
+ const disabledSymb = Disabled;
return (
-
-
-
+
+
+
+
+
+
+
+ Top n queries monitoring configuration settings
+
+
+
+
+
+
+
+ Metric Type
+
+
+ Specify the metric type to set settings for.
+
+
+
+
+ onMetricChange(e)}
+ />
+
+
+
+
+ Enabled
+
+
+ {`Enable/disable top N query monitoring by ${metric}.`}
+
+
+
+
+
+
+ onEnabledChange(e)} />
+
+
+
+ {isEnabled ? (
+ <>
+
+
+ Value of N (count)
+
+
+ Specify the value of N. N is the number of queries to be collected within
+ the window size.
+
+
+
+
+ onTopNSizeChange(e)}
+ />
+
+
+
+
+ Window size
+
+
+ The duration during which the Top N queries are collected.
+
+
+
+
+
+
+
+
+
+ onTimeChange(e)}
+ />
+
+
+
+
+ >
+ ) : null}
+
+
+
+
+
+
+
- Configuration settings
+ Statuses for configuration metrics
-
+
-
- Metric Type
-
-
- Specify the metric type to set settings for.
-
+ Latency
-
- onMetricChange(e)}
- />
-
+
+ {latencySettings.isEnabled ? enabledSymb : disabledSymb}
+
+
-
- Enabled
-
-
- {`Enable/disable ${metric} to be include in Top N Queries.`}
-
+ CPU Usage
+
+
+
+ {cpuSettings.isEnabled ? enabledSymb : disabledSymb}
+
+
+
+
+ Memory
-
-
-
- onEnabledChange(e)} />
-
-
+
+ {memorySettings.isEnabled ? enabledSymb : disabledSymb}
- {isEnabled ? (
- <>
-
-
- Value of N (count)
-
-
- Specify the value of N. N is the number of queries to be collected within
- the window size.
-
-
-
-
- onTopNSizeChange(e)}
- />
-
-
-
-
- Window size
-
-
- The duration during which the Top N queries are collected.
-
-
-
-
-
-
-
-
-
- onTimeChange(e)}
- />
-
-
-
-
- >
- ) : null}
-
+
-
-
-
+
+
+
{changed && valid ? (
diff --git a/public/pages/QueryDetails/Components/QuerySummary.tsx b/public/pages/QueryDetails/Components/QuerySummary.tsx
index fcae816..7d6d5fb 100644
--- a/public/pages/QueryDetails/Components/QuerySummary.tsx
+++ b/public/pages/QueryDetails/Components/QuerySummary.tsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { EuiFlexItem, EuiPanel, EuiText, EuiHorizontalRule, EuiFlexGrid } from '@elastic/eui';
+import { EuiFlexGrid, EuiFlexItem, EuiHorizontalRule, EuiPanel, EuiText } from '@elastic/eui';
const QuerySummary = ({ query }: { query: any }) => {
const convertTime = (unixTime: number) => {
diff --git a/public/pages/QueryDetails/QueryDetails.tsx b/public/pages/QueryDetails/QueryDetails.tsx
index 9efe886..67dc932 100644
--- a/public/pages/QueryDetails/QueryDetails.tsx
+++ b/public/pages/QueryDetails/QueryDetails.tsx
@@ -1,16 +1,16 @@
import React, { useEffect } from 'react';
import Plotly from 'plotly.js-dist';
import {
- EuiTitle,
+ EuiButton,
+ EuiCodeBlock,
+ EuiFlexGrid,
+ EuiFlexGroup,
EuiFlexItem,
+ EuiHorizontalRule,
EuiPanel,
- EuiText,
EuiSpacer,
- EuiHorizontalRule,
- EuiFlexGrid,
- EuiCodeBlock,
- EuiButton,
- EuiFlexGroup,
+ EuiText,
+ EuiTitle
} from '@elastic/eui';
import { useParams, useHistory, useLocation } from 'react-router-dom';
import { CoreStart } from '../../../../../src/core/public';
diff --git a/public/pages/QueryInsights/QueryInsights.tsx b/public/pages/QueryInsights/QueryInsights.tsx
index 7263628..c3169f6 100644
--- a/public/pages/QueryInsights/QueryInsights.tsx
+++ b/public/pages/QueryInsights/QueryInsights.tsx
@@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
-import { EuiBasicTableColumn, EuiSuperDatePicker, EuiInMemoryTable, EuiLink } from '@elastic/eui';
+import { EuiBasicTableColumn, EuiInMemoryTable, EuiLink, EuiSuperDatePicker } from '@elastic/eui';
import { useHistory, useLocation } from 'react-router-dom';
import { CoreStart } from '../../../../../src/core/public';
import { QUERY_INSIGHTS } from '../TopNQueries/TopNQueries';
@@ -126,7 +126,7 @@ const QueryInsights = ({
onTimeChange({ start, end });
};
- const filterDuplicates = (options: any[]) => options.filter((value, index, self) =>
+ const filterDuplicates = (options: any[]) => options.filter((value, index, self) =>
index === self.findIndex((t) => (
t.value === value.value
)));
diff --git a/public/pages/TopNQueries/TopNQueries.tsx b/public/pages/TopNQueries/TopNQueries.tsx
index c305574..406417b 100644
--- a/public/pages/TopNQueries/TopNQueries.tsx
+++ b/public/pages/TopNQueries/TopNQueries.tsx
@@ -21,7 +21,7 @@ const TopNQueries = ({ core }: { core: CoreStart }) => {
const history = useHistory();
const location = useLocation();
const [loading, setLoading] = useState(false);
- const [currStart, setStart] = useState('now-1y');
+ const [currStart, setStart] = useState('now-1d');
const [currEnd, setEnd] = useState('now');
const [recentlyUsedRanges, setRecentlyUsedRanges] = useState([
{ start: currStart, end: currEnd },
@@ -100,14 +100,13 @@ const TopNQueries = ({ core }: { core: CoreStart }) => {
return date ? date.toDate().getTime() : new Date().getTime();
};
- // Not guaranteed without error msg from calling a newly allowed metric
const retrieveQueries = useCallback(
async (start: string, end: string) => {
const nullResponse = { response: { top_queries: [] } };
const params = {
query: {
- from: parseDateString(start),
- to: parseDateString(end),
+ from: new Date(parseDateString(start)).toISOString(),
+ to: new Date(parseDateString(end)).toISOString(),
},
};
const fetchMetric = async (endpoint : string) => {
diff --git a/yarn.lock b/yarn.lock
new file mode 100644
index 0000000..4f8fcd3
--- /dev/null
+++ b/yarn.lock
@@ -0,0 +1,13 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+object-hash@^3.0.0:
+ version "3.0.0"
+ resolved "https://registry.yarnpkg.com/object-hash/-/object-hash-3.0.0.tgz#73f97f753e7baffc0e2cc9d6e079079744ac82e9"
+ integrity sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==
+
+plotly.js-dist@^2.34.0:
+ version "2.34.0"
+ resolved "https://registry.yarnpkg.com/plotly.js-dist/-/plotly.js-dist-2.34.0.tgz#7664ca33520b5dc1f142a1f6377e1c7354e6514d"
+ integrity sha512-FZR9QT60vtE1ocdSIfop+zDIJEoy1lejwOvAjTSy+AmE4GZ//rW1nnIXwCRv4o9ejfzWq++lQMu6FJf9G+NtFg==