Architecture Diagram & Connection Details
The Architecture Diagram gives you a live map of how your repositories relate to each other. It shows auto-detected dependencies, manually added connections, and any custom infrastructure cards you have defined.
Opening the Diagram
Navigate to Code Navigation in the sidebar. The diagram loads automatically with all repositories you have connected to Codity. Use the repository drawer on the left to control which repos are visible on the canvas.
Nodes
Repository Nodes
Each connected repository appears as a node. Codity classifies it by service type based on its name:
| Service type | Accent color | Detected from name containing |
|---|---|---|
| Gateway | Purple | gateway, proxy, ingress, nginx, cdn |
| Web | Green | web, dashboard, frontend, ui, portal |
| Mobile | Orange | mobile, ios, android |
| Backend | Blue | api, service, backend, server |
| Data | Pink | analytics, data, worker, queue, scanner, etl |
| Default | Gray | anything else |
Each node displays:
- Short repository name: provider and owner prefix removed automatically
- Service category label: shown in uppercase below the name
- Index status: "Indexed", "Indexing" (with pulsing dot), or "Not indexed"
- Branch selector: click the branch button on the node to switch which branch Codity analyzes for that repo
Nodes with a solid border are indexed. Nodes with a dashed border are not yet indexed.
Custom Card Nodes
Custom cards represent shared infrastructure that multiple repos depend on: databases, queues, caches, and similar components. You add these yourself via the Add Connection panel.
Custom cards always have a dashed border and display a type label ("DATABASE", "QUEUE", etc.) above the card name.
Proposed Cards
When you use Feature Mode in the Intelligence Chat, the AI may generate Proposed cards on the diagram. These have a purple-tinted dashed border and a "PROPOSED" label. They represent suggested new components and disappear if the chat is reset.
Edges (Connections)
Lines between nodes represent connections. Their appearance indicates their type:
| Edge style | Meaning |
|---|---|
| Solid line | Auto-detected or manually added connection |
| Dashed line, purple | Proposed connection from Feature Mode |
| Dashed line, pink | Denied connection |
| Arrows on both ends | Bidirectional connection |
| No arrow | Connection direction unknown |
Edge labels (showing connection type like "API CALL" or "SHARED LIBRARY") are hidden by default. They appear when the edge is selected, marked as denied, or generated by Feature Mode.
Navigating the Diagram
- Pan: click and drag the canvas background
- Zoom: use the + / − buttons in the toolbar, or scroll
- Select a node: click it to highlight and see its connections emphasized
- Select an edge: click any connection line to open the Connection Details panel
- Deselect: click the canvas background
Saving Layout
Dragging nodes repositions them on the canvas. When you have unsaved position changes, a Save layout button (disk icon) with an orange indicator appears in the toolbar. Click it to persist the layout. Positions are saved server-side and restored on next load.
Connection Details Panel
Clicking any edge opens the Connection Details panel on the right side of the screen.
What It Shows
Connection flow: a visual Source → Connection Type → Target representation. If the connection has been reversed via an override, the flow reflects the corrected direction.
Confidence: a percentage bar indicating how confident Codity is that this connection is real (based on code evidence). This applies to auto-detected connections only.
Summary: an AI-generated description of why these two repos are connected. If you have added your own description, it appears below the AI summary in a highlighted box labeled "Actual relationship".
Evidence: code snippets from both repositories that prove the connection exists. Shows "No code evidence recorded" if none is available.
Actions
Describe relationship
Add your own description to clarify what this connection actually means for your team. Click "Describe relationship", type your description, and click "Save description". Your text replaces the AI summary as the canonical explanation.
Reverse direction
If Codity detected the arrow going the wrong way, click "Reverse direction" to flip it. The diagram updates immediately. Click "Restore direction" to undo. A "Currently flipped" hint is shown when the direction is overridden.
Deny connection
If the connection does not actually exist, click "Deny connection", optionally enter a reason, and click "Deny & regenerate". The edge turns dashed and pink on the diagram and is labelled "Denied". Your reason is stored and visible to your team. Click "Restore connection" to undo.
History
Expand the History section at the bottom of the panel to see a log of every change made to that connection: denials, restores, direction changes, and description edits, each with a timestamp.