fix: persist pipeline tree graph rows (#17400)

web/src/components/ui/tree-view.tsx

@@ -19,6 +19,7 @@ const selectedTreeVariants = cva(
 export interface TreeDataItem {
   id: string;
   name: string;
+  entityType?: string;
   icon?: any;
   selectedIcon?: any;
   openIcon?: any;
@@ -37,6 +38,36 @@ type TreeProps = React.HTMLAttributes<HTMLDivElement> & {
   defaultLeafIcon?: any;
 };
 
+const TreeItemLabel = ({ item }: { item: TreeDataItem }) => {
+  if (!item.entityType) {
+    return <span className="flex-grow truncate text-sm">{item.name}</span>;
+  }
+
+  const isTitle = item.entityType === 'title';
+  return (
+    <span className="flex min-w-0 flex-grow items-center gap-2">
+      <span
+        className={cn(
+          'truncate text-sm',
+          isTitle && 'font-medium text-text-primary',
+        )}
+      >
+        {item.name}
+      </span>
+      <span
+        className={cn(
+          'shrink-0 rounded px-1.5 py-0.5 text-[10px] leading-none',
+          isTitle
+            ? 'bg-accent/15 text-accent-foreground'
+            : 'bg-bg-card text-text-secondary',
+        )}
+      >
+        {item.entityType}
+      </span>
+    </span>
+  );
+};
+
 const TreeView = React.forwardRef<HTMLDivElement, TreeProps>(
   (
     {
@@ -211,7 +242,7 @@ const TreeNode = ({
             isOpen={value.includes(item.id)}
             default={defaultNodeIcon}
           />
-          <span className="text-sm truncate">{item.name}</span>
+          <TreeItemLabel item={item} />
           <TreeActions isSelected={selectedItemId === item.id}>
             {item.actions}
           </TreeActions>
@@ -271,7 +302,7 @@ const TreeLeaf = React.forwardRef<
           isSelected={selectedItemId === item.id}
           default={defaultLeafIcon}
         />
-        <span className="flex-grow text-sm truncate">{item.name}</span>
+        <TreeItemLabel item={item} />
         <TreeActions isSelected={selectedItemId === item.id}>
           {item.actions}
         </TreeActions>

web/src/pages/chunk/representation/utils/adapters.ts

@@ -30,6 +30,7 @@ function buildTreeDataItems(
   entities: IStructureGraphEntity[],
   relations: IStructureGraphRelation[],
   relationTypes: string[],
+  showEntityType = false,
 ): TreeDataItem[] {
   const normalized = entities
     .map(normalizeEntity)
@@ -40,6 +41,7 @@ function buildTreeDataItems(
       {
         id: entity.id,
         name: entity.name,
+        entityType: showEntityType ? entity.type : undefined,
         source_chunk_ids: entity.source_chunk_ids,
       },
     ]),
@@ -88,6 +90,7 @@ function buildUniqueTreeDataItems(
       {
         id: entity.id,
         name: entity.name,
+        entityType: entity.type,
         source_chunk_ids: entity.source_chunk_ids,
       },
     ]),
@@ -131,7 +134,12 @@ function buildUniqueTreeDataItems(
 export function adaptPageIndexToTreeData(
   template: IStructureGraphTemplate,
 ): TreeDataItem[] {
-  return buildTreeDataItems(template.entities, template.relations, ['include']);
+  return buildTreeDataItems(
+    template.entities,
+    template.relations,
+    ['include'],
+    true,
+  );
 }
 
 export function adaptTreeToTreeData(