Frontend App

The app module is a modern, responsive web application that visualizes the final output of the aut0arch system.

Role

The final output, clustering_data.json, contains the entire structural architecture of a Java repository alongside AI-generated functional explanations. The app presents this data.

Built on React, Vite, and Cytoscape, the application creates a large interactive graph where nodes represent architectural clusters, and edges represent their flow and dependency.

When a user selects a cluster visually, a dynamic sidebar expands rendering the textual context generated by the explainer:

• The purpose of the cluster
• Detected design patterns (e.g., Singleton, Proxy)
• Extracted snippets of code that highlight the model’s evidence

Core Technologies

• react: For UI and component state management.
• cytoscape: For rendering the mathematical node connections.
• cytoscape-dagre: For automatically organizing the nodes using hierarchical layout algorithms.