Skip to content

Commit 6cd1f6d

Browse files
author
Kishore Kumaar Natarajan
committed
Update the logic in QueryInsights Dynamic Columns
Signed-off-by: Kishore Kumaar Natarajan <[email protected]>
1 parent 5b810a5 commit 6cd1f6d

File tree

3 files changed

+73
-49
lines changed

3 files changed

+73
-49
lines changed

‎cypress/e2e/1_top_queries.cy.js

+4-22
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,6 @@ describe('Query Insights Dashboard', () => {
3636
cy.wait(1000);
3737
cy.searchOnIndex(indexName);
3838
cy.navigateToOverview();
39-
cy.wait(1000);
4039
});
4140

4241
/**
@@ -59,6 +58,7 @@ describe('Query Insights Dashboard', () => {
5958
*/
6059
it('should sort the table by the Timestamp column', () => {
6160
// Click the Timestamp column header to sort
61+
cy.navigateToOverview();
6262
cy.get('.euiTableHeaderCell').contains('Timestamp').click();
6363
// eslint-disable-next-line jest/valid-expect-in-promise
6464
cy.get('.euiTableRow')
@@ -159,33 +159,16 @@ describe('Query Insights Dashboard', () => {
159159
'Average CPU Time',
160160
'Average Memory Usage',
161161
];
162-
cy.screenshot('overview_page_group');
163162

164163
cy.get('.euiTableHeaderCell').should(($headers) => {
165164
const actualHeaders = $headers.map((index, el) => Cypress.$(el).text().trim()).get();
166165
expect(actualHeaders).to.deep.equal(expectedHeaders);
167166
});
168167
});
169168
it('should display both query and group data with proper headers when both are selected', () => {
170-
cy.setWindowSize('1m');
171-
cy.wait(40000);
172-
cy.disableGrouping();
173-
cy.searchOnIndex(indexName);
174-
cy.wait(1000);
175-
cy.searchOnIndex(indexName);
176-
cy.wait(1000);
177-
cy.searchOnIndex(indexName);
178-
cy.wait(1000);
179-
cy.enableGrouping();
180-
cy.wait(1000);
181-
cy.searchOnIndex(indexName);
182-
cy.wait(1000);
183-
cy.searchOnIndex(indexName);
184-
cy.wait(1000);
185-
cy.searchOnIndex(indexName);
186-
cy.navigateToOverview();
187-
cy.wait(1000);
188-
//cy.wait(10000);
169+
clearAll();
170+
cy.wait(10000);
171+
cy.reload();
189172
cy.get('.euiFilterButton').contains('Type').click();
190173
cy.get('.euiFilterSelectItem').contains('query').click();
191174
cy.get('.euiFilterSelectItem').contains('group').click();
@@ -204,7 +187,6 @@ describe('Query Insights Dashboard', () => {
204187
'Coordinator Node ID',
205188
'Total Shards',
206189
];
207-
cy.screenshot('overview_page_group_and_indidvual');
208190
cy.get('.euiTableHeaderCell').should(($headers) => {
209191
const actualHeaders = $headers.map((index, el) => Cypress.$(el).text().trim()).get();
210192
expect(actualHeaders).to.deep.equal(expectedGroupHeaders);

‎public/components/__snapshots__/app.test.tsx.snap

+34-9
Original file line numberDiff line numberDiff line change
@@ -520,7 +520,32 @@ exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
520520
aria-live="polite"
521521
aria-sort="none"
522522
class="euiTableHeaderCell"
523-
data-test-subj="tableHeaderCell_Timestamp_2"
523+
data-test-subj="tableHeaderCell_measurements_2"
524+
role="columnheader"
525+
scope="col"
526+
>
527+
<button
528+
class="euiTableHeaderButton"
529+
data-test-subj="tableHeaderSortButton"
530+
type="button"
531+
>
532+
<span
533+
class="euiTableCellContent"
534+
>
535+
<span
536+
class="euiTableCellContent__text"
537+
title="Query Count"
538+
>
539+
Query Count
540+
</span>
541+
</span>
542+
</button>
543+
</th>
544+
<th
545+
aria-live="polite"
546+
aria-sort="none"
547+
class="euiTableHeaderCell"
548+
data-test-subj="tableHeaderCell_Timestamp_3"
524549
role="columnheader"
525550
scope="col"
526551
>
@@ -545,7 +570,7 @@ exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
545570
aria-live="polite"
546571
aria-sort="none"
547572
class="euiTableHeaderCell"
548-
data-test-subj="tableHeaderCell_measurements_3"
573+
data-test-subj="tableHeaderCell_measurements_4"
549574
role="columnheader"
550575
scope="col"
551576
>
@@ -570,7 +595,7 @@ exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
570595
aria-live="polite"
571596
aria-sort="none"
572597
class="euiTableHeaderCell"
573-
data-test-subj="tableHeaderCell_measurements_4"
598+
data-test-subj="tableHeaderCell_measurements_5"
574599
role="columnheader"
575600
scope="col"
576601
>
@@ -593,7 +618,7 @@ exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
593618
</th>
594619
<th
595620
class="euiTableHeaderCell"
596-
data-test-subj="tableHeaderCell_measurements_5"
621+
data-test-subj="tableHeaderCell_measurements_6"
597622
role="columnheader"
598623
scope="col"
599624
>
@@ -612,7 +637,7 @@ exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
612637
aria-live="polite"
613638
aria-sort="none"
614639
class="euiTableHeaderCell"
615-
data-test-subj="tableHeaderCell_indices_6"
640+
data-test-subj="tableHeaderCell_indices_7"
616641
role="columnheader"
617642
scope="col"
618643
>
@@ -637,7 +662,7 @@ exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
637662
aria-live="polite"
638663
aria-sort="none"
639664
class="euiTableHeaderCell"
640-
data-test-subj="tableHeaderCell_search_type_7"
665+
data-test-subj="tableHeaderCell_search_type_8"
641666
role="columnheader"
642667
scope="col"
643668
>
@@ -662,7 +687,7 @@ exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
662687
aria-live="polite"
663688
aria-sort="none"
664689
class="euiTableHeaderCell"
665-
data-test-subj="tableHeaderCell_node_id_8"
690+
data-test-subj="tableHeaderCell_node_id_9"
666691
role="columnheader"
667692
scope="col"
668693
>
@@ -687,7 +712,7 @@ exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
687712
aria-live="polite"
688713
aria-sort="none"
689714
class="euiTableHeaderCell"
690-
data-test-subj="tableHeaderCell_total_shards_9"
715+
data-test-subj="tableHeaderCell_total_shards_10"
691716
role="columnheader"
692717
scope="col"
693718
>
@@ -716,7 +741,7 @@ exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
716741
>
717742
<td
718743
class="euiTableRowCell euiTableRowCell--isMobileFullWidth"
719-
colspan="10"
744+
colspan="11"
720745
>
721746
<div
722747
class="euiTableCellContent euiTableCellContent--alignCenter"

‎public/pages/QueryInsights/QueryInsights.tsx

+35-18
Original file line numberDiff line numberDiff line change
@@ -93,12 +93,13 @@ const QueryInsights = ({
9393
return `${loc[1]} ${loc[2]}, ${loc[3]} @ ${date.toLocaleTimeString('en-US')}`;
9494
};
9595
useEffect(() => {
96-
if (queries.length === 0) return; // No queries? Do nothing.
96+
if (queries.length === 0) return;
9797

9898
const allAreGroups = queries.every((query) => query.group_by === 'SIMILARITY');
9999
const allAreQueries = queries.every((query) => query.group_by === 'NONE');
100100

101101
if (allAreGroups) {
102+
console.log('SIMILARITY selected');
102103
setSelectedFilter(['SIMILARITY']);
103104
} else if (allAreQueries) {
104105
setSelectedFilter(['NONE']);
@@ -311,32 +312,48 @@ const QueryInsights = ({
311312
);
312313
}, [queries, selectedFilter]);
313314

315+
const defaultColumns = [
316+
...baseColumns,
317+
...querycountColumn,
318+
...timestampColumn,
319+
...metricColumns,
320+
...Columnsset5,
321+
];
322+
323+
const groupTypeColumns = [...baseColumns, ...querycountColumn, ...metricColumns];
324+
const queryTypeColumns = [...baseColumns, ...timestampColumn, ...metricColumns, ...Columnsset5];
325+
314326
const columnsToShow = useMemo(() => {
315-
if (selectedFilter.includes('NONE') && selectedFilter.includes('SIMILARITY')) {
316-
return [
317-
...baseColumns,
318-
...querycountColumn,
319-
...timestampColumn,
320-
...metricColumns,
321-
...Columnsset5,
322-
];
327+
const hasQueryType = selectedFilter.includes('NONE');
328+
const hasGroupType = selectedFilter.includes('SIMILARITY');
329+
330+
if (queries.length === 0) {
331+
if (hasQueryType && hasGroupType) return defaultColumns;
332+
if (hasGroupType) return groupTypeColumns;
333+
if (hasQueryType) return queryTypeColumns;
334+
} else if (queries.every((q) => q.group_by === 'NONE')) {
335+
if (hasQueryType && hasGroupType) return queryTypeColumns;
336+
if (hasQueryType) return queryTypeColumns;
337+
} else if (queries.every((q) => q.group_by === 'SIMILARITY')) {
338+
if (hasQueryType && hasGroupType) return groupTypeColumns;
339+
if (hasGroupType) return groupTypeColumns;
340+
} else {
341+
if (hasQueryType && hasGroupType) return defaultColumns;
342+
if (hasQueryType) return queryTypeColumns.filter((col) => col.name !== 'group');
343+
if (hasGroupType) return groupTypeColumns.filter((col) => col.name !== 'query');
323344
}
324-
return selectedFilter.includes('SIMILARITY')
325-
? [...baseColumns, ...querycountColumn, ...metricColumns]
326-
: [...baseColumns, ...timestampColumn, ...metricColumns, ...Columnsset5];
327-
}, [selectedFilter]);
345+
346+
return defaultColumns; // Fallback to default columns
347+
}, [selectedFilter, queries]);
328348

329349
const onChangeFilter = ({ query: searchQuery }) => {
330350
const text = searchQuery?.text || '';
331351

332352
const newFilters = new Set<string>();
333353

334-
if (
335-
text.includes('group_by:(SIMILARITY)') ||
336-
queries.every((q) => q.group_by === 'SIMILARITY')
337-
) {
354+
if (text.includes('group_by:(SIMILARITY)')) {
338355
newFilters.add('SIMILARITY');
339-
} else if (text.includes('group_by:(NONE)') || queries.every((q) => q.group_by === 'NONE')) {
356+
} else if (text.includes('group_by:(NONE)')) {
340357
newFilters.add('NONE');
341358
} else if (
342359
text.includes('group_by:(NONE or SIMILARITY)') ||

0 commit comments

Comments
 (0)