update for graphrag v0.5.0 (#26)

Author: noworneverev

README.md

@@ -9,6 +9,11 @@
 
 GraphRAG Visualizer is an application designed to visualize Microsoft [GraphRAG](https://github.com/microsoft/graphrag) artifacts. By uploading parquet files generated from the GraphRAG indexing pipeline, users can easily view and analyze data without needing additional software or scripts.
 
+## Important Note
+
+If you are using **GraphRAG 0.3.x or below**, please use the legacy version of GraphRAG Visualizer available at:  
+👉 [GraphRAG Visualizer Legacy](https://noworneverev.github.io/graphrag-visualizer-legacy)
+
 ## Features
 
 - **Graph Visualization**: View the graph in 2D or 3D in the "Graph Visualization" tab.

src/app/components/GraphViewer.tsx

@@ -21,7 +21,6 @@ import {
 import FullscreenIcon from "@mui/icons-material/Fullscreen";
 import FullscreenExitIcon from "@mui/icons-material/FullscreenExit";
 import SearchIcon from "@mui/icons-material/Search";
-import DeleteIcon from "@mui/icons-material/Delete";
 import Fuse from "fuse.js";
 import {
   CSS2DRenderer,
@@ -525,10 +524,10 @@ const GraphViewer: React.FC<GraphViewerProps> = ({
     ? includeTextUnits && includeCommunities && includeCovariates
     : includeTextUnits && includeCommunities;
 
-  const clearSearchResults = () => {
-    setGraphData(initialGraphData.current);
-    setApiSearchResults(null);
-  };
+  // const clearSearchResults = () => {
+  //   setGraphData(initialGraphData.current);
+  //   setApiSearchResults(null);
+  // };
 
   return (
     <Box
@@ -881,7 +880,7 @@ const GraphViewer: React.FC<GraphViewerProps> = ({
       >
         <Typography variant="body2">Nodes: {nodeCount}</Typography>
         <Typography variant="body2">Relationships: {linkCount}</Typography>
-        <Button
+        {/* <Button
           variant="contained"
           onClick={toggleApiDrawer(true)}
           startIcon={<SearchIcon />}
@@ -896,7 +895,7 @@ const GraphViewer: React.FC<GraphViewerProps> = ({
           disabled={apiSearchResults === null}
         >
           Clear Query Results
-        </Button>
+        </Button> */}
       </Box>
     </Box>
   );

src/app/components/Introduction.tsx

@@ -20,6 +20,18 @@ const Introduction: React.FC = () => {
         Welcome to the GraphRAG Visualizer
       </Typography>
 
+      <Typography variant="body1" gutterBottom sx={{ color: "error.main" }}>
+        If you are using <strong>GraphRAG 0.3.x or below</strong>, please visit
+        the legacy site:{" "}
+        <Link
+          href="https://noworneverev.github.io/graphrag-visualizer-legacy"
+          target="_blank"
+          rel="noopener"
+        >
+          GraphRAG Visualizer Legacy
+        </Link>
+      </Typography>
+
       <Typography variant="h6" gutterBottom>
         Overview
       </Typography>

src/app/hooks/useGraphData.ts

@@ -26,14 +26,12 @@ const useGraphData = (
   useEffect(() => {
     const nodes: CustomNode[] = entities.map((entity) => ({
       uuid: entity.id,
-      id: entity.name,
-      name: entity.name,
+      id: entity.title,
+      name: entity.title,
       type: entity.type,
       description: entity.description,
-      human_readable_id: entity.human_readable_id,
-      graph_embedding: entity.graph_embedding,
-      text_unit_ids: entity.text_unit_ids,
-      description_embedding: entity.description_embedding,
+      human_readable_id: entity.human_readable_id,      
+      text_unit_ids: entity.text_unit_ids,      
       neighbors: [],
       links: [],
     }));
@@ -51,9 +49,7 @@ const useGraphData = (
         text_unit_ids: relationship.text_unit_ids,
         id: relationship.id,
         human_readable_id: relationship.human_readable_id,
-        source_degree: relationship.source_degree,
-        target_degree: relationship.target_degree,
-        rank: relationship.rank,
+        combined_degree: relationship.combined_degree,        
       }))
       .filter((link) => nodesMap[link.source] && nodesMap[link.target]);
 
@@ -66,8 +62,9 @@ const useGraphData = (
         name: document.title,
         title: document.title,
         type: "RAW_DOCUMENT", // avoid conflict with "DOCUMENT" type
-        raw_content: document.raw_content,
+        text: document.text,
         text_unit_ids: document.text_unit_ids,
+        human_readable_id: document.human_readable_id,
         neighbors: [],
         links: [],
       }));
@@ -102,6 +99,7 @@ const useGraphData = (
         document_ids: textunit.document_ids,
         entity_ids: textunit.entity_ids,
         relationship_ids: textunit.relationship_ids,
+        human_readable_id: textunit.human_readable_id,
         neighbors: [],
         links: [],
       }));
@@ -230,17 +228,13 @@ const useGraphData = (
         // type: "COVARIATE",
         type: covariate.type,
         description: covariate.description || "",
-        subject_id: covariate.subject_id,
-        subject_type: covariate.subject_type,
-        object_id: covariate.object_id,
-        object_type: covariate.object_type,
+        subject_id: covariate.subject_id,        
+        object_id: covariate.object_id,        
         status: covariate.status,
         start_date: covariate.start_date,
         end_date: covariate.end_date,
         source_text: covariate.source_text,
-        text_unit_id: covariate.text_unit_id,
-        document_ids: covariate.document_ids,
-        n_tokens: covariate.n_tokens,
+        text_unit_id: covariate.text_unit_id,                
         neighbors: [],
         links: [],
       }));

src/app/models/community-report.ts

@@ -6,66 +6,77 @@ export interface Finding {
 }
 
 export interface CommunityReport {
+    id: string;
+    human_readable_id: number;
     community: number;
-    full_content: string;
     level: number;
-    rank: number;
     title: string;
-    rank_explanation: string;
     summary: string;
+    full_content: string;
+    rank: number;
+    rank_explanation: string;
     findings: Finding[];
     full_content_json: string;
-    id: string;
+    period: string;
+    size: number;
 }
 
 export const findingColumns: MRT_ColumnDef<Finding>[] = [
   {
     accessorKey: "id",
-    header: "ID",
+    header: "id",
   },
   {
     accessorKey: "explanation",
-    header: "Explanation",
+    header: "explanation",
   },
   {
     accessorKey: "summary",
-    header: "Summary",
+    header: "summary",
   },
 
 ]
 
 export const communityReportColumns: MRT_ColumnDef<CommunityReport>[] = [
     {
-      accessorKey: "community",
-      header: "Community",
+      accessorKey: "id",
+      header: "id",
+    },  
+    {
+      accessorKey: "human_readable_id",
+      header: "human_readable_id",
     },
     {
-      accessorKey: "full_content",
-      header: "Full Content",
+      accessorKey: "community",
+      header: "community",
     },
     {
       accessorKey: "level",
-      header: "Level",
+      header: "level",
     },
     {
-      accessorKey: "rank",
-      header: "Rank",
+      accessorKey: "title",
+      header: "title",
     },
     {
-      accessorKey: "title",
-      header: "Title",
+      accessorKey: "summary",
+      header: "summary",
     },
     {
-      accessorKey: "rank_explanation",
-      header: "Rank Explanation",
+      accessorKey: "full_content",
+      header: "full_content",
     },
     {
-      accessorKey: "summary",
-      header: "Summary",
+      accessorKey: "rank",
+      header: "rank",
+    },
+    {
+      accessorKey: "rank_explanation",
+      header: "rank_explanation",
     },
     {
       accessorKey: "findings",
-      header: "Findings",
+      header: "findings",
       Cell: ({ renderedCellValue }) =>
         Array.isArray(renderedCellValue)
           ? JSON.stringify(renderedCellValue, null, 2)
@@ -76,7 +87,11 @@ export const communityReportColumns: MRT_ColumnDef<CommunityReport>[] = [
       header: "Full Content JSON",
     },
     {
-      accessorKey: "id",
-      header: "ID",
+      accessorKey: "period",
+      header: "period",
+    },
+    {
+      accessorKey: "size",
+      header: "size",
     },
   ];

src/app/models/community.ts

@@ -2,44 +2,68 @@ import { MRT_ColumnDef } from "material-react-table";
 
 export interface Community {
     id: number;
-    title: string;
+    human_readable_id: number;
+    community: number;
     level: number;
-    raw_community: number;
+    title: string;    
+    entity_ids: string[];
     relationship_ids: string[];
     text_unit_ids: string[];
+    period: string;
+    size: number;
 }
 
 export const communityColumns: MRT_ColumnDef<Community>[] = [
     {
       accessorKey: "id",
-      header: "ID",
+      header: "id",
     },
     {
-      accessorKey: "title",
-      header: "Title",
+      accessorKey: "human_readable_id",
+      header: "human_readable_id",
+    },
+    {
+      accessorKey: "community",
+      header: "community",
     },
     {
       accessorKey: "level",
-      header: "Level",
+      header: "level",
     },
     {
-      accessorKey: "raw_community",
-      header: "Raw Community",
+      accessorKey: "title",
+      header: "title",
+    },
+    {
+      accessorKey: "entity_ids",
+      header: "entity_ids",
+      Cell: ({ renderedCellValue }) =>
+        Array.isArray(renderedCellValue)
+          ? JSON.stringify(renderedCellValue, null, 2)
+          : renderedCellValue,
     },
     {
       accessorKey: "relationship_ids",
-      header: "Relationship IDs",
+      header: "relationship_ids",
       Cell: ({ renderedCellValue }) =>
         Array.isArray(renderedCellValue)
           ? JSON.stringify(renderedCellValue, null, 2)
           : renderedCellValue,
     },
     {
       accessorKey: "text_unit_ids",
-      header: "Text Unit IDs",
+      header: "text_unit_ids",
       Cell: ({ renderedCellValue }) =>
         Array.isArray(renderedCellValue)
           ? JSON.stringify(renderedCellValue, null, 2)
           : renderedCellValue,
     },
+    {
+      accessorKey: "period",
+      header: "period",
+    },
+    {
+      accessorKey: "size",
+      header: "size",
+    },
   ];