From e5b1511c663bed9ac79584ac893ee5b69604a38f Mon Sep 17 00:00:00 2001
From: balibabu <cike8899@users.noreply.github.com>
Date: Tue, 31 Dec 2024 15:32:14 +0800
Subject: [PATCH] Fix: Fixed the issue that the graph could not display the
 grouping #4180 (#4306)

### What problem does this PR solve?

Fix: Fixed the issue that the graph could not display the grouping #4180

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)
---
 .../components/knowledge-graph/force-graph.tsx         |  3 +++
 .../knowledge-chunk/components/knowledge-graph/util.ts | 10 ++++++++--
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/web/src/pages/add-knowledge/components/knowledge-chunk/components/knowledge-graph/force-graph.tsx b/web/src/pages/add-knowledge/components/knowledge-chunk/components/knowledge-graph/force-graph.tsx
index ad0d5851a..8969d688d 100644
--- a/web/src/pages/add-knowledge/components/knowledge-chunk/components/knowledge-graph/force-graph.tsx
+++ b/web/src/pages/add-knowledge/components/knowledge-chunk/components/knowledge-graph/force-graph.tsx
@@ -50,6 +50,9 @@ const ForceGraph = ({ data, show }: IProps) => {
           enterable: true,
           getContent: (e: IElementEvent, items: ElementDatum) => {
             if (Array.isArray(items)) {
+              if (items.some((x) => x?.isCombo)) {
+                return `<p style="font-weight:600;color:red">${items?.[0]?.data?.label}</p>`;
+              }
               let result = ``;
               items.forEach((item) => {
                 result += `<section style="color:${TooltipColorMap[e['targetType'] as keyof typeof TooltipColorMap]};"><h3>${item?.id}</h3>`;
diff --git a/web/src/pages/add-knowledge/components/knowledge-chunk/components/knowledge-graph/util.ts b/web/src/pages/add-knowledge/components/knowledge-chunk/components/knowledge-graph/util.ts
index f79ab401f..e0be797f2 100644
--- a/web/src/pages/add-knowledge/components/knowledge-chunk/components/knowledge-graph/util.ts
+++ b/web/src/pages/add-knowledge/components/knowledge-chunk/components/knowledge-graph/util.ts
@@ -63,12 +63,18 @@ export const isDataExist = (data: any) => {
   );
 };
 
+const findCombo = (communities: string[]) => {
+  const combo = Array.isArray(communities) ? communities[0] : undefined;
+  return combo;
+};
+
 export const buildNodesAndCombos = (nodes: any[]) => {
   const combos: any[] = [];
   nodes.forEach((x) => {
-    const combo = Array.isArray(x?.communities) ? x.communities[0] : undefined;
+    const combo = findCombo(x?.communities);
     if (combo && combos.every((y) => y.data.label !== combo)) {
       combos.push({
+        isCombo: true,
         id: uuid(),
         data: {
           label: combo,
@@ -80,7 +86,7 @@ export const buildNodesAndCombos = (nodes: any[]) => {
   const nextNodes = nodes.map((x) => {
     return {
       ...x,
-      combo: combos.find((y) => y.data.label === x.id)?.id,
+      combo: combos.find((y) => y.data.label === findCombo(x?.communities))?.id,
     };
   });