Code Canvas App

Explore file relationships, understand application flow, and gain insights into your project structure in a more intuitive way.

Supporting for now, although some of the features might work for other languages

Features:

1. Opening files in the canvas

** Opening the canvas: **

• Type Open Code Canvas in the Command Palette (Cmd + shift + P)
• Click Code Canvas icon in the bottom right corner

** Navigating: **

• Cmd + scroll to zoom
• Hold Space to enable panning, then drag from an empty space on the canvas
• Use the minimap controls or drag on the minimap to move (Press M to toggle minimap)

** Opening / closing files: **

• Right Click a file or folder in the side bar and select Open in Code Canvas
• Select files and hit Backspace or Cmd + X to close them. Shift + X to close all files
• Drag out the import handle to open imported files

Node Toolbar

• Open all imported files by clicking the right arrow in the file node toolbar
• Or open all files that import that file by clicking the left arrow
• Option + click on an arrow to see the list of files and select which ones to open

2. Real-time display of local changes

Particularly useful for understanding changes done by AI assistants, or reviewing large amounts of edits across multiple files before committing

• Press Shift + O to open all the files in the current workspace that have any changes (added, removed, edited)
• Editing a file automatically opens it in the canvas
• Changes are automatically refreshed when you commit, stage, or unstage files

3. Visual display of token references and their connections

• Click on a token (functions, variables, params, etc) to open a dropdown with a list of references, definitions, implementations, as well as outgoing and incoming calls for functions
  • (Press R to toggle the display of the references dropdown when tokens are selected)
• Trace code execution paths visually: see relationships between functions and their references throughout all the files in the codebase

4. Layout algorithms for organizing your selected files

• Layout options with keyboard shortcuts (Shift + 1, 2, 3, 4, etc) to organize your view
  • Select files to apply the algorithm only to the selection
• Shit + 1 is a custom layout algorithm with adjustable parameters. Open the Layout Panel in the toolbar to customize it
• Auto-fit and spacing options apply only to algos from 2 onwards

Privacy & Security

Your code stays on your machine

• All code processing is done locally on your device
• No code is ever sent to external servers
• Code analysis, syntax highlighting, and file relationships are computed entirely within VS Code
• Git authentication is only used for subscription management - your repository content remains private

Analytics & Privacy

Code Canvas collects anonymous telemetry to improve the extension experience. We take your privacy seriously:

• Respects VS Code Settings: Telemetry is automatically disabled when VS Code telemetry is off
• No Personal Information: We never collect names, emails, or any PII
• No Source Code: Your code content is never transmitted
• No File Paths: All file paths are sanitized to generic identifiers
• No Session Recordings: Screen recording and session replay are completely disabled

What We Collect

• Feature usage patterns (which features you use, not how you use them)
• Performance metrics (load times, render times)
• Error rates (without stack traces or sensitive details)
• Anonymous session identifiers
• VS Code and extension version information

How to Opt Out

You can disable telemetry at any time through:

1. VS Code Settings: Set telemetry.telemetryLevel to off (disables all extension telemetry)
2. Extension Settings: Disable codeCanvas.telemetry.enabled in VS Code settings

For complete details about our data practices, see our Privacy Policy

For any feedback / bug reports: codecanvas.userjot.com

or join the discord server: https://discord.gg/XgdGN9Z7ef