Inspiration

With most code nowadays being AI generated, it's easy for developers to lose understanding of their code. Additionally, long, top-down files of code and codebases with many connecting files can be overwhelming to navigate, especially for beginners. Codegraph aims to solve this problem by providing a better visual experience for fully understanding your codebase.

What it does

Codegraph is a VS Code extension that takes a C or C++ folder and lays out the header files, c files, classes, structs, variables, etc. in a graph format. Arrows connect these nodes to show the relationships between files and elements (whether something is a caller, callee, inherits, overrides, etc.). An AI summary of each node is also generated based when a node is clicked, explaining the node's purpose in the context of the program. An 'Ask AI' panel is also available, which can highlight specific affected nodes and trace through the specific nodes in the program in response to questions. For each node, you can also see how big of a risk changing the node in various ways (renaming, deleting, changing behavior, etc.) would have on other methods, and will calculate a risk score for these other methods.

How we built it

We built the graph using the Cytoscape.js library and the cytoscape-elk extension for the library. The AI is built on VS Code's Language Model API, which calls GitHub Copilot Chat or GPT-4o.

Challenges we ran into

Our main challenge was with merging code and overall keeping a clean codebase.

Accomplishments that we're proud of

We are proud of getting the graph view to display correctly, even for large and complex C files, and for the AI's ability to understand the codebase and provide targeted, specific help to the user when prompted.