topsql: add ui for aggregating by table or db

pkg/apiserver/topsql/service.go

@@ -80,11 +80,13 @@ type GetSummaryRequest struct {
 	Start        string `json:"start"`
 	End          string `json:"end"`
 	Top          string `json:"top"`
+	GroupBy      string `json:"group_by"`
 	Window       string `json:"window"`
 }
 
 type SummaryResponse struct {
-	Data []SummaryItem `json:"data"`
+	Data   []SummaryItem   `json:"data"`
+	DataBy []SummaryByItem `json:"data_by"`
 }
 
 type SummaryItem struct {
@@ -99,6 +101,13 @@ type SummaryItem struct {
 	Plans             []SummaryPlanItem `json:"plans"`
 }
 
+type SummaryByItem struct {
+	Text         string   `json:"text"`
+	TimestampSec []uint64 `json:"timestamp_sec"`
+	CPUTimeMs    []uint64 `json:"cpu_time_ms,omitempty"`
+	CPUTimeMsSum uint64   `json:"cpu_time_ms_sum"`
+}
+
 type SummaryPlanItem struct {
 	PlanDigest        string   `json:"plan_digest"`
 	PlanText          string   `json:"plan_text"`

ui/packages/tidb-dashboard-client/src/client/api/api/default-api.ts

@@ -3710,6 +3710,7 @@ export const DefaultApiAxiosParamCreator = function (configuration?: Configurati
          * 
          * @summary Get summaries
          * @param {string} [end] 
+         * @param {string} [groupBy] 
          * @param {string} [instance] 
          * @param {string} [instanceType] 
          * @param {string} [start] 
@@ -3718,7 +3719,7 @@ export const DefaultApiAxiosParamCreator = function (configuration?: Configurati
          * @param {*} [options] Override http request option.
          * @throws {RequiredError}
          */
-        topsqlSummaryGet: async (end?: string, instance?: string, instanceType?: string, start?: string, top?: string, window?: string, options: AxiosRequestConfig = {}): Promise<RequestArgs> => {
+        topsqlSummaryGet: async (end?: string, groupBy?: string, instance?: string, instanceType?: string, start?: string, top?: string, window?: string, options: AxiosRequestConfig = {}): Promise<RequestArgs> => {
             const localVarPath = `/topsql/summary`;
             // use dummy base URL string because the URL constructor only accepts absolute URLs.
             const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
@@ -3738,6 +3739,10 @@ export const DefaultApiAxiosParamCreator = function (configuration?: Configurati
                 localVarQueryParameter['end'] = end;
             }
 
+            if (groupBy !== undefined) {
+                localVarQueryParameter['group_by'] = groupBy;
+            }
+
             if (instance !== undefined) {
                 localVarQueryParameter['instance'] = instance;
             }
@@ -5206,6 +5211,7 @@ export const DefaultApiFp = function(configuration?: Configuration) {
          * 
          * @summary Get summaries
          * @param {string} [end] 
+         * @param {string} [groupBy] 
          * @param {string} [instance] 
          * @param {string} [instanceType] 
          * @param {string} [start] 
@@ -5214,8 +5220,8 @@ export const DefaultApiFp = function(configuration?: Configuration) {
          * @param {*} [options] Override http request option.
          * @throws {RequiredError}
          */
-        async topsqlSummaryGet(end?: string, instance?: string, instanceType?: string, start?: string, top?: string, window?: string, options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<TopsqlSummaryResponse>> {
-            const localVarAxiosArgs = await localVarAxiosParamCreator.topsqlSummaryGet(end, instance, instanceType, start, top, window, options);
+        async topsqlSummaryGet(end?: string, groupBy?: string, instance?: string, instanceType?: string, start?: string, top?: string, window?: string, options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<TopsqlSummaryResponse>> {
+            const localVarAxiosArgs = await localVarAxiosParamCreator.topsqlSummaryGet(end, groupBy, instance, instanceType, start, top, window, options);
             return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
         },
         /**
@@ -6277,6 +6283,7 @@ export const DefaultApiFactory = function (configuration?: Configuration, basePa
          * 
          * @summary Get summaries
          * @param {string} [end] 
+         * @param {string} [groupBy] 
          * @param {string} [instance] 
          * @param {string} [instanceType] 
          * @param {string} [start] 
@@ -6285,8 +6292,8 @@ export const DefaultApiFactory = function (configuration?: Configuration, basePa
          * @param {*} [options] Override http request option.
          * @throws {RequiredError}
          */
-        topsqlSummaryGet(end?: string, instance?: string, instanceType?: string, start?: string, top?: string, window?: string, options?: any): AxiosPromise<TopsqlSummaryResponse> {
-            return localVarFp.topsqlSummaryGet(end, instance, instanceType, start, top, window, options).then((request) => request(axios, basePath));
+        topsqlSummaryGet(end?: string, groupBy?: string, instance?: string, instanceType?: string, start?: string, top?: string, window?: string, options?: any): AxiosPromise<TopsqlSummaryResponse> {
+            return localVarFp.topsqlSummaryGet(end, groupBy, instance, instanceType, start, top, window, options).then((request) => request(axios, basePath));
         },
         /**
          * 
@@ -7497,6 +7504,13 @@ export interface DefaultApiTopsqlSummaryGetRequest {
      */
     readonly end?: string
 
+    /**
+     * 
+     * @type {string}
+     * @memberof DefaultApiTopsqlSummaryGet
+     */
+    readonly groupBy?: string
+
     /**
      * 
      * @type {string}
@@ -8730,7 +8744,7 @@ export class DefaultApi extends BaseAPI {
      * @memberof DefaultApi
      */
     public topsqlSummaryGet(requestParameters: DefaultApiTopsqlSummaryGetRequest = {}, options?: AxiosRequestConfig) {
-        return DefaultApiFp(this.configuration).topsqlSummaryGet(requestParameters.end, requestParameters.instance, requestParameters.instanceType, requestParameters.start, requestParameters.top, requestParameters.window, options).then((request) => request(this.axios, this.basePath));
+        return DefaultApiFp(this.configuration).topsqlSummaryGet(requestParameters.end, requestParameters.groupBy, requestParameters.instance, requestParameters.instanceType, requestParameters.start, requestParameters.top, requestParameters.window, options).then((request) => request(this.axios, this.basePath));
     }
 
     /**

ui/packages/tidb-dashboard-client/src/client/api/models/index.ts

@@ -86,6 +86,7 @@ export * from './topology-ti-proxy-info';
 export * from './topsql-editable-config';
 export * from './topsql-instance-item';
 export * from './topsql-instance-response';
+export * from './topsql-summary-by-item';
 export * from './topsql-summary-item';
 export * from './topsql-summary-plan-item';
 export * from './topsql-summary-response';

ui/packages/tidb-dashboard-client/src/client/api/models/topsql-summary-by-item.ts

@@ -0,0 +1,48 @@
+/* tslint:disable */
+/* eslint-disable */
+/**
+ * Dashboard API
+ * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
+ *
+ * The version of the OpenAPI document: 1.0
+ * 
+ *
+ * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
+ * https://openapi-generator.tech
+ * Do not edit the class manually.
+ */
+
+
+
+/**
+ * 
+ * @export
+ * @interface TopsqlSummaryByItem
+ */
+export interface TopsqlSummaryByItem {
+    /**
+     * 
+     * @type {Array<number>}
+     * @memberof TopsqlSummaryByItem
+     */
+    'cpu_time_ms'?: Array<number>;
+    /**
+     * 
+     * @type {number}
+     * @memberof TopsqlSummaryByItem
+     */
+    'cpu_time_ms_sum'?: number;
+    /**
+     * 
+     * @type {string}
+     * @memberof TopsqlSummaryByItem
+     */
+    'text'?: string;
+    /**
+     * 
+     * @type {Array<number>}
+     * @memberof TopsqlSummaryByItem
+     */
+    'timestamp_sec'?: Array<number>;
+}
+

ui/packages/tidb-dashboard-client/src/client/api/models/topsql-summary-response.ts

@@ -13,6 +13,7 @@
  */
 
 
+import { TopsqlSummaryByItem } from './topsql-summary-by-item';
 import { TopsqlSummaryItem } from './topsql-summary-item';
 
 /**
@@ -27,5 +28,11 @@ export interface TopsqlSummaryResponse {
      * @memberof TopsqlSummaryResponse
      */
     'data'?: Array<TopsqlSummaryItem>;
+    /**
+     * 
+     * @type {Array<TopsqlSummaryByItem>}
+     * @memberof TopsqlSummaryResponse
+     */
+    'data_by'?: Array<TopsqlSummaryByItem>;
 }
 

ui/packages/tidb-dashboard-client/swagger/spec.json

@@ -3508,6 +3508,11 @@
                         "name": "end",
                         "in": "query"
                     },
+                    {
+                        "type": "string",
+                        "name": "group_by",
+                        "in": "query"
+                    },
                     {
                         "type": "string",
                         "name": "instance",
@@ -6019,6 +6024,29 @@
                 }
             }
         },
+        "topsql.SummaryByItem": {
+            "type": "object",
+            "properties": {
+                "cpu_time_ms": {
+                    "type": "array",
+                    "items": {
+                        "type": "integer"
+                    }
+                },
+                "cpu_time_ms_sum": {
+                    "type": "integer"
+                },
+                "text": {
+                    "type": "string"
+                },
+                "timestamp_sec": {
+                    "type": "array",
+                    "items": {
+                        "type": "integer"
+                    }
+                }
+            }
+        },
         "topsql.SummaryItem": {
             "type": "object",
             "properties": {
@@ -6097,6 +6125,12 @@
                     "items": {
                         "$ref": "#/definitions/topsql.SummaryItem"
                     }
+                },
+                "data_by": {
+                    "type": "array",
+                    "items": {
+                        "$ref": "#/definitions/topsql.SummaryByItem"
+                    }
                 }
             }
         },

ui/packages/tidb-dashboard-for-clinic-cloud/src/apps/TopSQL/context.ts

@@ -22,6 +22,7 @@ class DataSource implements ITopSQLDataSource {
 
   topsqlSummaryGet(
     end?: string,
+    groupBy?: string,
     instance?: string,
     instanceType?: string,
     start?: string,
@@ -32,6 +33,7 @@ class DataSource implements ITopSQLDataSource {
     return client.getInstance().topsqlSummaryGet(
       {
         end,
+        groupBy,
         instance,
         instanceType,
         start,

ui/packages/tidb-dashboard-for-op/src/apps/TopSQL/context.ts

@@ -21,6 +21,7 @@ class DataSource implements ITopSQLDataSource {
 
   topsqlSummaryGet(
     end?: string,
+    groupBy?: string,
     instance?: string,
     instanceType?: string,
     start?: string,
@@ -31,6 +32,7 @@ class DataSource implements ITopSQLDataSource {
     return client.getInstance().topsqlSummaryGet(
       {
         end,
+        groupBy,
         instance,
         instanceType,
         start,
@@ -49,6 +51,7 @@ export const ctx: ITopSQLContext = {
   cfg: {
     checkNgm: true,
     showSetting: true,
-    showLimit: true
+    showLimit: true,
+    showGroupBy: true
   }
 }

ui/packages/tidb-dashboard-lib/src/apps/TopSQL/context/index.ts

@@ -26,6 +26,7 @@ export interface ITopSQLDataSource {
 
   topsqlSummaryGet(
     end?: string,
+    groupBy?: string,
     instance?: string,
     instanceType?: string,
     start?: string,
@@ -53,6 +54,7 @@ export interface ITopSQLConfig {
 
   showSearchInStatements?: boolean
   showLimit?: boolean
+  showGroupBy?: boolean
 }
 
 export interface ITopSQLContext {