Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Query grouping dashboard changes and extensive tests #33

Merged
merged 7 commits into from
Jan 16, 2025

Conversation

deshsidd
Copy link
Collaborator

Description

Query grouping dashboard changes based on the proposed UX. Support grouping related configurations setting and viewing query groups using the query insights dashboards.

Currently, dashboards only supports Top N queries. With the introduction of grouping Top N queries by similarity, this PR aims to integrate query insights dashboard with the query grouping changes.

Change Details:

  • Modify the Top N queries page to now display groups
  • Add a filter type to filter out groups or queries
  • Create a new Query Group Details page which displays additional information regarding the query group
  • The query group details page will have a section displaying aggregate statistics followed by another section to display details for a sample query from the group.
  • Added extensive tests

Issues Resolved

List any issues this PR will resolve, e.g. Closes [...].
Closes : #14

Screenshots

Top N queries/groups page displaying multiple query groups:
queryinsights1
Option to filter by group/query:
queryinsights5
queryinsights7
Query Group Details Page after clicking on the query group row in the Top N page:
queryinsights1 5
Sample Query Details section on the query group details page:
queryinsights3
Query Configuration Page to configure Top N Query Groups:
queryinsights9
queryinsights10

By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license.
For more information on following Developer Certificate of Origin and signing off your commits, please check here.

public/pages/QueryGroupDetails/QueryGroupDetails.tsx Outdated Show resolved Hide resolved
public/pages/QueryInsights/QueryInsights.tsx Outdated Show resolved Hide resolved
public/pages/QueryInsights/QueryInsights.tsx Outdated Show resolved Hide resolved
types/types.ts Outdated Show resolved Hide resolved
@derek-ho
Copy link
Contributor

Description

Query grouping dashboard changes based on the proposed UX. Support grouping related configurations setting and viewing query groups using the query insights dashboards.

Currently, dashboards only supports Top N queries. With the introduction of grouping Top N queries by similarity, this PR aims to integrate query insights dashboard with the query grouping changes.

Change Details:

  • Modify the Top N queries page to now display groups
  • Add a filter type to filter out groups or queries
  • Create a new Query Group Details page which displays additional information regarding the query group
  • The query group details page will have a section displaying aggregate statistics followed by another section to display details for a sample query from the group.
  • Added extensive tests

Issues Resolved

List any issues this PR will resolve, e.g. Closes [...]. Closes : #14

Screenshots

Top N queries/groups page displaying multiple query groups: queryinsights1 Option to filter by group/query: queryinsights5 queryinsights7 Query Group Details Page after clicking on the query group row in the Top N page: queryinsights1 5 Sample Query Details section on the query group details page: queryinsights3 Query Configuration Page to configure Top N Query Groups: queryinsights9 queryinsights10

By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license. For more information on following Developer Certificate of Origin and signing off your commits, please check here.

Maybe I am not fully understanding the group-by feature, but if you do not do group_by on the table, shouldn't it show all of the single queries by themselves? Or does group-by have a different meaning in terms of the data?

Copy link
Member

@ansjcy ansjcy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@derek-ho Could you please also take a look?

Note after we add the cypress tests, we need to follow up on this PR to add integ tests for query group details page and also all other related changes as well.

package.json Outdated
@@ -45,7 +45,7 @@
"@types/react-dom": "^16.9.8",
"@types/object-hash": "^3.0.0",
"@types/react-router-dom": "^5.3.2",
"cypress": "9.5.4",
"cypress": "12.17.4",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we are not adding cypress tests, why is this change needed?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Getting error that version is not matching the version in OSD without this change

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

But there is also no harm that I can see in bumping cypress version

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We need to update the package lock file if we want to bump up the version. Let's rebase the main branch to pick up the cypress version bump.

public/components/app.test.tsx Outdated Show resolved Hide resolved
public/pages/Configuration/Configuration.tsx Outdated Show resolved Hide resolved
public/pages/QueryDetails/Components/QuerySummary.tsx Outdated Show resolved Hide resolved
public/pages/QueryInsights/QueryInsights.tsx Outdated Show resolved Hide resolved
public/pages/QueryInsights/QueryInsights.tsx Outdated Show resolved Hide resolved
@ansjcy
Copy link
Member

ansjcy commented Jan 10, 2025

but if you do not do group_by on the table, shouldn't it show all of the single queries by themselves?

@derek-ho , group_by is a backend feature, (see https://opensearch.org/docs/latest/observing-your-data/query-insights/grouping-top-n-queries/), if group_by is enabled by similarity, it means when we collect the top n queries, all similar queries will be grouped into the same group. Since there could be a lot of queries in one group, we only keep one sample of the queries in the group.

@ansjcy
Copy link
Member

ansjcy commented Jan 10, 2025

Also please avoid creating branches in the original repo, follow the best practices in OpenSearch-Dashboards developer guide: https://github.com/opensearch-project/OpenSearch-Dashboards/blob/main/DEVELOPER_GUIDE.md#fork-and-clone-opensearch-dashboards

...All local development should be done in a forked repository....

@ansjcy
Copy link
Member

ansjcy commented Jan 10, 2025

I tried sorting on the timestamp field, it doesn't looks correct to me:
image

@ansjcy
Copy link
Member

ansjcy commented Jan 10, 2025

Also please wait until this PR is merged: opensearch-project/query-insights#184
And test the integration with the exporter. See if the UI can correctly display and do filter by date correctly for the group records.

render: (indices: string[]) => Array.from(new Set(indices.flat())).join(', '),
render: (indices: string[], query: SearchQueryRecord) => {
const isSimilarity = query.group_by === 'SIMILARITY';
return isSimilarity ? '-' : Array.from(new Set(indices.flat())).join(', ');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why are we not showing the indices of the group here?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The group only contains indices of the first query in the group. Since displaying this information might be misleading we decided to not display this here after consulting with UX.

Comment on lines +228 to +241
render: (nodeId: string, query: SearchQueryRecord) => {
const isSimilarity = query.group_by === 'SIMILARITY';
return isSimilarity ? '-' : nodeId;
},
sortable: true,
truncateText: true,
},
{
field: TOTAL_SHARDS_FIELD,
name: TOTAL_SHARDS,
render: (totalShards: number, query: SearchQueryRecord) => {
const isSimilarity = query.group_by === 'SIMILARITY';
return isSimilarity ? '-' : totalShards;
},
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some of these don't seem to make sense if looking at group_by. Should we remove some columns from the table depending on the type you are looking at? Which brings up another question, I wasn't able to get to a situation where both group and single queries show up. If it is only one or the other, IMO it is confusing to put type filter - it should just be one or the other based on your configuration.

Copy link
Member

@ansjcy ansjcy Jan 13, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Only if the user just switched from single query to group (or vice versa), the type parameter would be useful.

I think it makes sense to change the table column based on the data. A lot of the columns can be hidden if there's only one type of data.

Copy link
Contributor

@derek-ho derek-ho left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some minor implementation concerns but nothing blocking - they can be addressed in follow ups. I am also not loving re-creating a component for the possibility they will diverge in the future, but if that is a UX call then let's go with it.

@ansjcy
Copy link
Member

ansjcy commented Jan 13, 2025

re-creating a component for the possibility they will diverge in the future

+1. I still think we should reuse the previous component. Splitting it out to a separate page would make it harder to maintain - for example, updating the chart library etc - Or you can abstract all the "sample query panels" into one component, and reuse it across query details page and sample queries page

@ansjcy
Copy link
Member

ansjcy commented Jan 13, 2025

Also please add e2e tests for the grouping features as well.

This reverts commit 9efdbaf.

Signed-off-by: Siddhant Deshmukh <[email protected]>
Signed-off-by: Siddhant Deshmukh <[email protected]>
Signed-off-by: Siddhant Deshmukh <[email protected]>
Signed-off-by: Siddhant Deshmukh <[email protected]>
@deshsidd
Copy link
Collaborator Author

Also please add e2e tests for the grouping features as well.

Will do this as a followup

@deshsidd
Copy link
Collaborator Author

Some minor implementation concerns but nothing blocking - they can be addressed in follow ups. I am also not loving re-creating a component for the possibility they will diverge in the future, but if that is a UX call then let's go with it.

Discussed this specific point with Kevin and UX before implementation and they recommended creating a new component. Keeping this in mind lets keep it as is for now and take a call in the future based on how the pages evolve.

@ansjcy ansjcy merged commit 67fd811 into main Jan 16, 2025
9 checks passed
@opensearch-trigger-bot
Copy link

The backport to 2.x failed:

The process '/usr/bin/git' failed with exit code 128

To backport manually, run these commands in your terminal:

# Navigate to the root of your repository
cd $(git rev-parse --show-toplevel)
# Fetch latest updates from GitHub
git fetch
# Create a new working tree
git worktree add ../.worktrees/query-insights-dashboards/backport-2.x 2.x
# Navigate to the new working tree
pushd ../.worktrees/query-insights-dashboards/backport-2.x
# Create a new branch
git switch --create backport/backport-33-to-2.x
# Cherry-pick the merged commit of this pull request and resolve the conflicts
git cherry-pick -x --mainline 1 67fd811437662e9b69ff5943440e2d5ec489d476
# Push it to GitHub
git push --set-upstream origin backport/backport-33-to-2.x
# Go back to the original working tree
popd
# Delete the working tree
git worktree remove ../.worktrees/query-insights-dashboards/backport-2.x

Then, create a pull request where the base branch is 2.x and the compare/head branch is backport/backport-33-to-2.x.

ansjcy pushed a commit to ansjcy/query-insights-dashboards that referenced this pull request Jan 16, 2025
…ect#33)

* Revert "remove records with grouping (opensearch-project#26)"

This reverts commit 9efdbaf.

Signed-off-by: Siddhant Deshmukh <[email protected]>

* Query grouping dashboard changes and extensive tests

Signed-off-by: Siddhant Deshmukh <[email protected]>

* Fix tests and linting

Signed-off-by: Siddhant Deshmukh <[email protected]>

* Address review comments

Signed-off-by: Siddhant Deshmukh <[email protected]>

* Address review comments and update tests

Signed-off-by: Siddhant Deshmukh <[email protected]>

* Update cypress tests, hashcode to id, refactoring

Signed-off-by: Siddhant Deshmukh <[email protected]>

* Lint

Signed-off-by: Siddhant Deshmukh <[email protected]>

---------

Signed-off-by: Siddhant Deshmukh <[email protected]>
deshsidd added a commit that referenced this pull request Jan 16, 2025
* Revert "remove records with grouping (#26)"

This reverts commit 9efdbaf.



* Query grouping dashboard changes and extensive tests



* Fix tests and linting



* Address review comments



* Address review comments and update tests



* Update cypress tests, hashcode to id, refactoring



* Lint



---------

Signed-off-by: Siddhant Deshmukh <[email protected]>
Co-authored-by: Siddhant Deshmukh <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[FEATURE] Integrate grouping top N queries with dashboards
3 participants