Query Execution Plan Expensive Operator Highlighting (#20579)

* Boilerplate for new context menu options

* Enables checkmarks for expensive operator context menu actions

* Updates azdataGraph version to 0.0.44

* Adds clearing logic to actions and retrieves additional info from nodes

* Removes unnecessary actions that aren't supported by other providers

* Finishes setting up the rest of the context menu actions

* Corrects context menu action label

* Defines new widget type for finding expensive operations

* Adds TODO for class icon name

* Creates action to open the expensive operation widget

* Adds escape and enter key shortcuts to findExpensiveOperation widget

* Styles find expensive operation widget

* Corrects class name for finding expensive operator action

* Corrects import statement.

* Code clean up

* Bumps azdataGraph version to 0.0.45

* Adds an info box for when a metric doesn't find any nodes

* Adds label to find expensive operator widget

* Invokes dispose when widget controller removes widget

* Implements disposable in all execution plan widgets.

* Adds off action to clear highlighting

* Adds a default setting and default prompt for highlighting metric

* Fixes not all code paths return error

* Removes shortcut key from text for widget actions

* Adds enum description

* Removes added dictionary type, and renames class name

* Removes unnecessary null checks

* Removes cost metric dictionary and adds corresponding properties

* Code review changes

* Removes incorrectly implemented key down event for widget.

* Renames widget and action class names for highlighting expensive ops

* File rename

* Cleans up labels to better reflect highlight action

* Removes hardcoded button width style and sets it to auto

* More clean up

* Clean up import statement

* Code review changes

* Drop down list only shows available metrics

* Updates highlight expensive operation icon

* Update STS version
This commit is contained in:
Lewis Sanchez
2022-10-03 12:32:39 -07:00
committed by GitHub
parent d0cab10cc9
commit f521d7cc63
22 changed files with 660 additions and 77 deletions

View File

@@ -92,11 +92,42 @@ However we always want it to be the width of the container it is resizing.
width: 240px;
}
/* Find expensive operation view */
.eps-container .execution-plan .plan .plan-action-container .find-expensive-operation-widget {
display: flex;
flex-direction: row;
padding: 5px;
height: auto;
width: auto;
}
.eps-container .execution-plan .plan .plan-action-container .find-expensive-operation-widget .select-container {
margin-left: 5px;
display: flex;
align-items: center;
}
.eps-container .execution-plan .plan .plan-action-container .find-expensive-operation-widget .select-container expensive-operation-name-select-box-label {
margin-right: 5px;
}
.eps-container .execution-plan .plan .plan-action-container .find-expensive-operation-widget .select-container>select {
height: 100%;
}
.eps-container .execution-plan .plan .plan-action-container .find-expensive-operation-widget .monaco-button.monaco-text-button {
width: auto;
padding-left: 15px;
padding-right: 15px;
}
/* execution plan header that contains the relative query cost, query statement and recommendations */
.eps-container .execution-plan .plan .header,
.top-operations-tab .top-operations-container .query-row {
padding: 5px;
font-weight: bolder;
margin-left: 5px;
margin-right: 5px;
}
/* execution plan header that contains the relative query cost, query statement and recommendations */
@@ -478,6 +509,21 @@ However we always want it to be the width of the container it is resizing.
background-repeat: no-repeat;
}
.eps-container .ep-highlight-expensive-operation-icon {
background-image: url(../images/actionIcons/highlightExpensiveOperation.svg);
background-size: 16px 16px;
background-position: center;
background-repeat: no-repeat;
}
.vs-dark .eps-container .ep-highlight-expensive-operation-icon,
.hc-black .eps-container .ep-highlight-expensive-operation-icon {
background-image: url(../images/actionIcons/highlightExpensiveOperationDark.svg);
background-size: 16px 16px;
background-position: center;
background-repeat: no-repeat;
}
.eps-container .ep-enable-tooltip-icon {
background-image: url(../images/actionIcons/enableTooltip.svg);
background-size: 16px 16px;