[skywalking-grafana-plugins] 02/02: feat: query call metrics

[qi...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

qiuxiafan pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/skywalking-grafana-plugins.git

commit 7d35f8e932733f66f1d6b1a8e5383c88e453ef0e
Author: Fine0830 <fa...@gmail.com>
AuthorDate: Sun Apr 30 16:52:01 2023 +0800

    feat: query call metrics
---
 src/components/QueryEditor.tsx |  8 +-------
 src/datasource.ts              | 36 +++++++++++++++++++++++++-----------
 src/types.ts                   |  1 -
 3 files changed, 26 insertions(+), 19 deletions(-)

diff --git a/src/components/QueryEditor.tsx b/src/components/QueryEditor.tsx
index d08bfd7..1f14503 100644
--- a/src/components/QueryEditor.tsx
+++ b/src/components/QueryEditor.tsx
@@ -10,9 +10,6 @@ export function QueryEditor({ query, onChange, onRunQuery }: Props) {
   const onServiceChange = (event: ChangeEvent<HTMLInputElement>) => {
     onChange({ ...query, service: event.target.value });
   };
-  const onLayerChange = (event: ChangeEvent<HTMLInputElement>) => {
-    onChange({ ...query, layer: event.target.value });
-  };
   const onNodeMetricsChange = (event: ChangeEvent<HTMLInputElement>) => {
     onChange({ ...query, nodeMetrics: event.target.value });
   };
@@ -25,16 +22,13 @@ export function QueryEditor({ query, onChange, onRunQuery }: Props) {
   const onRunQueryText = () => {
     onRunQuery();
   };
-  const { service, layer, nodeMetrics, edgeServerMetrics, edgeClientMetrics } = query;
+  const { service, nodeMetrics, edgeServerMetrics, edgeClientMetrics } = query;
 
   return (
     <div className="gf-form-group">
       <InlineField label="Service"  tooltip="Not used yet" labelWidth={20}>
         <Input onBlur={onRunQueryText} onChange={onServiceChange} value={service || ''} width={40} />
       </InlineField>
-      <InlineField label="Layer"  tooltip="Not used yet" labelWidth={20}>
-        <Input onBlur={onRunQueryText} onChange={onLayerChange} value={layer || ''} width={40} />
-      </InlineField>
       <InlineField label="Node Metrics"  tooltip="Not used yet" labelWidth={20}>
         <Input onBlur={onRunQueryText} onChange={onNodeMetricsChange} value={nodeMetrics || ''} width={60} />
       </InlineField>
diff --git a/src/datasource.ts b/src/datasource.ts
index cc83b56..670d42e 100644
--- a/src/datasource.ts
+++ b/src/datasource.ts
@@ -43,8 +43,9 @@ export class DataSource extends DataSourceApi<MyQuery, MyDataSourceOptions> {
     const promises = options.targets.map(async (target) => {
       const query = defaults(target, DEFAULT_QUERY);
       const serviceName = getTemplateSrv().replace(query.service, options.scopedVars);
-      const layer = getTemplateSrv().replace(query.layer, options.scopedVars);
       const nodeMetrics = getTemplateSrv().replace(query.nodeMetrics, options.scopedVars);
+      const edgeServerMetrics = getTemplateSrv().replace(query.edgeServerMetrics, options.scopedVars);
+      const edgeClientMetrics = getTemplateSrv().replace(query.edgeClientMetrics, options.scopedVars);
       let services = [];
       let t: any = {
         query: Fragments.globalTopology,
@@ -67,18 +68,20 @@ export class DataSource extends DataSourceApi<MyQuery, MyDataSourceOptions> {
           };
         }
       }
-      
+
+      const ids = serviceObj ? [serviceObj.id] : services.map((d: any) => d.id);
       // fetch topology data from api
       const res = await this.doRequest(t);
-      if (layer && nodeMetrics) {
-        const regex = /{[^}]+}/g;
-        const arr = nodeMetrics.match(regex);
-        const metrics = arr?.map((d: string) => JSON.parse(d)) || [];
-        const names = metrics?.map((d: MetricData) => d.name);
-        const ids = serviceObj ? [serviceObj.id] : services.map((d: any) => d.id);
-        const m = this.queryTopologyMetrics(names, ids, duration);
-        const metricJson = await this.doRequest(m);
-        console.log(metricJson);
+
+      // fetch topology metrics from api
+      if (nodeMetrics) {
+        await this.parseMetrics(nodeMetrics, ids, duration);
+      }
+      if (edgeServerMetrics) {
+        await this.parseMetrics(edgeServerMetrics, ids, duration);
+      }
+      if (edgeClientMetrics) {
+        await this.parseMetrics(edgeClientMetrics, ids, duration);
       }
       const nodes = res.data.topology.nodes || [];
       const calls = res.data.topology.calls || [];
@@ -128,6 +131,17 @@ export class DataSource extends DataSourceApi<MyQuery, MyDataSourceOptions> {
     return result;
   }
 
+  async parseMetrics(params: string, ids: string[], duration: DurationTime) {
+    const regex = /{[^}]+}/g;
+    const arr = params.match(regex);
+    const metrics = arr?.map((d: string) => JSON.parse(d)) || [];
+    const names = metrics?.map((d: MetricData) => d.name);
+    const m = this.queryTopologyMetrics(names, ids, duration);
+    const metricJson = await this.doRequest(m);
+
+    return metricJson;
+  }
+
   queryTopologyMetrics(metrics: string[], ids: string[], duration: DurationTime) {
     const conditions: { [key: string]: unknown } = {
       duration,
diff --git a/src/types.ts b/src/types.ts
index 7a05872..d1583c3 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -2,7 +2,6 @@ import { DataQuery, DataSourceJsonData } from '@grafana/data';
 
 export interface MyQuery extends DataQuery {
   service?: string;
-  layer?: string;
   nodeMetrics?: string;
   edgeServerMetrics?: string;
   edgeClientMetrics?: string;