get process topology

src/graphql/fragments/topology.ts

@@ -83,7 +83,6 @@ export const ProcessTopology = {
     nodes {
       id
       name
-      type
       isReal
       serviceName
       serviceId

src/store/modules/ebpf.ts

@@ -1,4 +1,3 @@
-import { TaskListItem } from "./../../types/profile.d";
 /**
  * Licensed to the Apache Software Foundation (ASF) under one or more
  * contributor license agreements.  See the NOTICE file distributed with
@@ -22,11 +21,12 @@ import {
   EBPFProfilingSchedule,
   EBPFTaskList,
   AnalyzationTrees,
+  ProcessNode,
 } from "@/types/ebpf";
 import { store } from "@/store";
 import graphql from "@/graphql";
 import { AxiosResponse } from "axios";
-
+import { Call } from "@/types/topology";
 interface EbpfStore {
   taskList: EBPFTaskList[];
   networkTasks: EBPFTaskList[];
@@ -40,6 +40,8 @@ interface EbpfStore {
   selectedTask: Recordable<EBPFTaskList>;
   selectedNetworkTask: Recordable<EBPFTaskList>;
   aggregateType: string;
+  nodes: ProcessNode[];
+  calls: Call[];
 }
 
 export const ebpfStore = defineStore({
@@ -57,6 +59,8 @@ export const ebpfStore = defineStore({
     selectedTask: {},
     selectedNetworkTask: {},
     aggregateType: "COUNT",
+    nodes: [],
+    calls: [],
   }),
   actions: {
     setSelectedTask(task: EBPFTaskList) {
@@ -207,6 +211,21 @@ export const ebpfStore = defineStore({
       this.analyzeTrees = analysisEBPFResult.trees;
       return res.data;
     },
+    async getProcessTopology(params: {
+      duration: any;
+      serviceInstanceId: string;
+    }) {
+      const res: AxiosResponse = await graphql
+        .query("getProcessTopology")
+        .params(params);
+      if (res.data.errors) {
+        this.nodes = [];
+        this.calls = [];
+        return res.data;
+      }
+      const topo = res.data.data;
+      return res.data;
+    },
   },
 });
 

src/types/ebpf.d.ts

@@ -75,3 +75,13 @@ export type AnalyzationTrees = {
   dumpCount: number;
   stackType: string;
 };
+export type ProcessNode = {
+  id: string;
+  name: string;
+  serviceId: string;
+  serviceName: string;
+  serviceInstanceId: string;
+  serviceInstanceName: string;
+  name: string;
+  isReal: boolean;
+};

src/views/dashboard/related/network-profiling/Content.vue

@@ -19,13 +19,16 @@ limitations under the License. -->
       <div class="schedules">
         <Schedules />
       </div>
-      <div class="item">EBPF Stack</div>
+      <div class="item">
+        <Topology></Topology>
+      </div>
     </div>
   </div>
 </template>
 <script lang="ts" setup>
 import Tasks from "./components/Tasks.vue";
 import Schedules from "./components/Schedules.vue";
+import Topology from "./components/Topology.vue";
 </script>
 <style lang="scss" scoped>
 .content {

src/views/dashboard/related/network-profiling/components/Topology.vue

@@ -16,13 +16,28 @@ limitations under the License. -->
   <div ref="topology" class="topology"></div>
 </template>
 <script lang="ts" setup>
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
 import { useI18n } from "vue-i18n";
 import { useEbpfStore } from "@/store/modules/ebpf";
+import { useSelectorStore } from "@/store/modules/selectors";
+import { useAppStoreWithOut } from "@/store/modules/app";
 
-/*global Nullable */
+const selectorStore = useSelectorStore();
-const { t } = useI18n();
 const ebpfStore = useEbpfStore();
+const appStore = useAppStoreWithOut();
+
+onMounted(() => {
+  getTopology();
+});
+
+function getTopology() {
+  const serviceInstanceId =
+    (selectorStore.currentPod && selectorStore.currentPod.id) || "";
+  ebpfStore.getProcessTopology({
+    serviceInstanceId,
+    duration: appStore.durationTime,
+  });
+}
 </script>
 <style lang="scss" scoped>
 .topology {