From ac501976f0a9c6b96e96d5c62981d0aeae87fb61 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Fri, 14 Feb 2025 18:29:45 +0000 Subject: [PATCH] Fix: Query Insights Dashboards style integration - Configuration Page (#68) * Fix QI-Styling-Configuration Signed-off-by: Kishore Kumaar Natarajan * Fix QI-Styling-Configuration-lint Signed-off-by: Kishore Kumaar Natarajan --------- Signed-off-by: Kishore Kumaar Natarajan Co-authored-by: Kishore Kumaar Natarajan (cherry picked from commit 0eb3b7306d6b73b74cadbdc49975f7df30967442) Signed-off-by: github-actions[bot] --- public/pages/Configuration/Configuration.tsx | 144 ++--- .../__snapshots__/Configuration.test.tsx.snap | 518 +++++++++--------- 2 files changed, 345 insertions(+), 317 deletions(-) diff --git a/public/pages/Configuration/Configuration.tsx b/public/pages/Configuration/Configuration.tsx index 57700db..1bb31e3 100644 --- a/public/pages/Configuration/Configuration.tsx +++ b/public/pages/Configuration/Configuration.tsx @@ -21,6 +21,7 @@ import { EuiSwitch, EuiText, EuiTitle, + EuiDescriptionList, } from '@elastic/eui'; import { useHistory, useLocation } from 'react-router-dom'; import { AppMountParameters, CoreStart } from 'opensearch-dashboards/public'; @@ -215,7 +216,6 @@ const Configuration = ({ return windowVal >= 1 && windowVal <= 24; })(); - const textPadding = { lineHeight: '22px', padding: '5px 0px' }; const formRowPadding = { padding: '0px 0px 20px' }; const enabledSymb = Enabled; const disabledSymb = Disabled; @@ -241,20 +241,21 @@ const Configuration = ({ - -

Top n queries monitoring configuration settings

- +

Top n queries monitoring configuration settings

 - -

Metric Type

- - - Specify the metric type to set settings for. - + Metric Type, + description: 'Specify the metric type to set settings for.', + }, + ]} + /> @@ -268,12 +269,15 @@ const Configuration = ({ - -

Enabled

- - - {`Enable/disable top N query monitoring by ${metric}.`} - + Enabled, + description: 'Enable/disable top N query monitoring by ${metric}.', + }, + ]} + /> @@ -291,13 +295,16 @@ const Configuration = ({ {isEnabled ? ( <> - -

Value of N (count)

- - - Specify the value of N. N is the number of queries to be collected within - the window size. - + Value of N (count), + description: + 'Specify the value of N. N is the number of queries to be collected within the window size.', + }, + ]} + /> - -

Window size

- - - The duration during which the Top N queries are collected. - + Window size, + description: + ' The duration during which the Top N queries are collected.', + }, + ]} + /> - -

Statuses for configuration metrics

- +

Statuses for configuration metrics

 - Latency + Latency @@ -372,7 +381,7 @@ const Configuration = ({ - CPU Usage + CPU Usage @@ -381,7 +390,7 @@ const Configuration = ({ - Memory + Memory @@ -398,20 +407,21 @@ const Configuration = ({ - -

Top n queries grouping configuration settings

- +

Top n queries grouping configuration settings

 - -

Group By

- - - Specify the group by type. - + Group By, + description: ' Specify the group by type.', + }, + ]} + /> @@ -433,15 +443,13 @@ const Configuration = ({ - -

Statuses for group by

- +

Statuses for group by

 - Group By + Group By @@ -458,20 +466,21 @@ const Configuration = ({ - -

Query Insights export and data retention settings

- +

Query Insights export and data retention settings

 - -

Exporter

- - - Configure a sink for exporting Query Insights data. - + Exporter, + description: ' Configure a sink for exporting Query Insights data.', + }, + ]} + /> @@ -485,12 +494,15 @@ const Configuration = ({ - -

Delete After (days)

- - - Number of days to retain Query Insights data. - + Delete After (days), + description: ' Number of days to retain Query Insights data.', + }, + ]} + /> @@ -512,15 +524,13 @@ const Configuration = ({ - -

Statuses for data retention

- +

Statuses for data retention

 - Exporter + Exporter diff --git a/public/pages/Configuration/__snapshots__/Configuration.test.tsx.snap b/public/pages/Configuration/__snapshots__/Configuration.test.tsx.snap index b0717f7..61d102f 100644 --- a/public/pages/Configuration/__snapshots__/Configuration.test.tsx.snap +++ b/public/pages/Configuration/__snapshots__/Configuration.test.tsx.snap @@ -18,13 +18,11 @@ exports[`Configuration Component renders with default settings: should match def
-
-

- Top n queries monitoring configuration settings -

-
+ Top n queries monitoring configuration settings +
-
-

- Metric Type -

-
-
- Specify the metric type to set settings for. -
+
+

+ Metric Type +

+
+
+ Specify the metric type to set settings for. +
+
-
-

- Enabled -

-
-
- Enable/disable top N query monitoring by latency. -
+
+

+ Enabled +

+
+
+ Enable/disable top N query monitoring by \${metric}. +
+
-
-

- Value of N (count) -

-
-
- Specify the value of N. N is the number of queries to be collected within the window size. -
+
+

+ Value of N (count) +

+
+
+ Specify the value of N. N is the number of queries to be collected within the window size. +
+
-
-

- Window size -

-
-
- The duration during which the Top N queries are collected. -
+
+

+ Window size +

+
+
+ The duration during which the Top N queries are collected. +
+
-
-

- Statuses for configuration metrics -

-
+ Statuses for configuration metrics +
Latency
@@ -523,7 +531,7 @@ exports[`Configuration Component renders with default settings: should match def class="euiFlexItem" >
CPU Usage
@@ -574,7 +582,7 @@ exports[`Configuration Component renders with default settings: should match def class="euiFlexItem" >
Memory
@@ -637,13 +645,11 @@ exports[`Configuration Component renders with default settings: should match def
-
-

- Top n queries grouping configuration settings -

-
+ Top n queries grouping configuration settings +
-
-

- Group By -

-
-
- Specify the group by type. -
+
+

+ Group By +

+
+
+ Specify the group by type. +
+
-
-

- Statuses for group by -

-
+ Statuses for group by +
Group By
@@ -824,13 +831,11 @@ exports[`Configuration Component renders with default settings: should match def
-
-

- Query Insights export and data retention settings -

-
+ Query Insights export and data retention settings +
-
-

- Exporter -

-
-
- Configure a sink for exporting Query Insights data. -
+
+

+ Exporter +

+
+
+ Configure a sink for exporting Query Insights data. +
+
-
-

- Delete After (days) -

-
-
- Number of days to retain Query Insights data. -
+
+

+ Delete After (days) +

+
+
+ Number of days to retain Query Insights data. +
+
-
-

- Statuses for data retention -

-
+ Statuses for data retention +
Exporter
@@ -1065,13 +1074,11 @@ exports[`Configuration Component updates state when toggling metrics and enables
-
-

- Top n queries monitoring configuration settings -

-
+ Top n queries monitoring configuration settings +
-
-

- Metric Type -

-
-
- Specify the metric type to set settings for. -
+
+

+ Metric Type +

+
+
+ Specify the metric type to set settings for. +
+
-
-

- Enabled -

-
-
- Enable/disable top N query monitoring by cpu. -
+
+

+ Enabled +

+
+
+ Enable/disable top N query monitoring by \${metric}. +
+
-
-

- Value of N (count) -

-
-
- Specify the value of N. N is the number of queries to be collected within the window size. -
+
+

+ Value of N (count) +

+
+
+ Specify the value of N. N is the number of queries to be collected within the window size. +
+
-
-

- Window size -

-
-
- The duration during which the Top N queries are collected. -
+
+

+ Window size +

+
+
+ The duration during which the Top N queries are collected. +
+
-
-

- Statuses for configuration metrics -

-
+ Statuses for configuration metrics +
Latency
@@ -1535,7 +1552,7 @@ exports[`Configuration Component updates state when toggling metrics and enables class="euiFlexItem" >
CPU Usage
@@ -1588,7 +1605,7 @@ exports[`Configuration Component updates state when toggling metrics and enables class="euiFlexItem" >
Memory
@@ -1653,13 +1670,11 @@ exports[`Configuration Component updates state when toggling metrics and enables
-
-

- Top n queries grouping configuration settings -

-
+ Top n queries grouping configuration settings +
-
-

- Group By -

-
-
- Specify the group by type. -
+
+

+ Group By +

+
+
+ Specify the group by type. +
+
-
-

- Statuses for group by -

-
+ Statuses for group by +
Group By
@@ -1843,13 +1859,11 @@ exports[`Configuration Component updates state when toggling metrics and enables
-
-

- Query Insights export and data retention settings -

-
+ Query Insights export and data retention settings +
-
-

- Exporter -

-
-
- Configure a sink for exporting Query Insights data. -
+
+

+ Exporter +

+
+
+ Configure a sink for exporting Query Insights data. +
+
-
-

- Delete After (days) -

-
-
- Number of days to retain Query Insights data. -
+
+

+ Delete After (days) +

+
+
+ Number of days to retain Query Insights data. +
+
-
-

- Statuses for data retention -

-
+ Statuses for data retention +
Exporter