Flowditor

A VSCode extension for security auditors to create and manage code flows - track function sequences and navigate codebases efficiently during security reviews.

Features

Create and Manage Flows

Flows are named collections of functions that represent execution paths, attack surfaces, or logical groupings in a codebase.

• Create flows from the sidebar or Command Palette
• Add functions to flows via symbol picker
• Quick add the function at cursor with a keyboard shortcut
• Navigate by clicking any function to jump to its location
• Reorder, rename, delete flows and functions

Smart Function Picker

When adding functions to a flow:

• Functions currently visible in the editor appear first (marked with eye icon)
• Only shows callable symbols (functions, methods, constructors)
• Displays parent class/contract and line number

Code Lens Integration

See which flows a function belongs to directly in the editor:

• Small annotations appear above functions that are part of any flow
• Shows flow name(s) the function belongs to
• Click the annotation to reveal the function in the sidebar
• Updates automatically when flows change

Persistent Storage

• Flows are saved to .vscode/flowditor.json in your workspace
• Easily backup, share via git, or copy between projects
• Export/import flows as JSON for team collaboration

Installation

1. Open VSCode
2. Go to Extensions (Cmd+Shift+X / Ctrl+Shift+X)
3. Search for "Flowditor"
4. Click Install

Development Installation

git clone <repository-url>
cd flowditor
npm install
npm run compile

Press F5 to launch the Extension Development Host.

Usage

Creating a Flow

1. Click the + button in the Flowditor sidebar panel
2. Or use Command Palette: Flowditor: Create New Flow
3. Enter a name for your flow

Adding Functions to a Flow

Method 1: Function Picker

1. Open a file with the code you want to audit
2. Use Command Palette: Flowditor: Add Function to Flow
3. Select the target flow
4. Pick a function from the list

Method 2: Quick Add (Recommended)

1. Place your cursor inside any function
2. Press Cmd+Shift+A (Mac) or Ctrl+Shift+A (Windows/Linux)
3. The function is added to the last used flow

Method 3: From Flow Context Menu

1. Right-click a flow in the sidebar
2. Select "Add Function to Flow"

Navigating Flows

• Click any function in the sidebar to jump to its location
• The function is highlighted briefly for visibility
• Line numbers update automatically when files change

Managing Flows

Right-click a flow to:

• Add Function to Flow - Add more functions
• Rename Flow - Change the flow name
• Delete Flow - Remove the flow

Right-click a function to:

• Remove from Flow - Remove the function from its flow

Export/Import

• Export: Command Palette → Flowditor: Export Flows to JSON
• Import: Command Palette → Flowditor: Import Flows from JSON

Commands

Command	Description	Keybinding
Flowditor: Create New Flow	Create a new empty flow	-
Flowditor: Create Flow from Function	Create flow with selected function	-
Flowditor: Add Function to Flow	Add a function via picker	-
Flowditor: Quick Add Function to Flow	Add function at cursor to last flow	Cmd+Shift+A / Ctrl+Shift+A
Flowditor: Export Flows to JSON	Export all flows to file	-
Flowditor: Import Flows from JSON	Import flows from file	-

Storage

Flows are stored in .vscode/flowditor.json in your workspace root:

{
  "version": "1.0.0",
  "flows": [
    {
      "id": "unique-id",
      "name": "Authentication Flow",
      "functions": [
        {
          "id": "func-id",
          "name": "login",
          "uri": "file:///path/to/file.sol",
          "range": { "start": { "line": 10 }, "end": { "line": 25 } },
          "kind": 12
        }
      ],
      "createdAt": 1234567890,
      "updatedAt": 1234567890
    }
  ]
}

Requirements

• VSCode 1.85.0 or higher
• A language extension that provides document symbols for your file types (e.g., Solidity, TypeScript, Python)

Extension Settings

This extension does not contribute any settings yet.

Known Issues

• Function matching relies on symbol names; if two functions have the same name in the same file, the first match is used
• Some language servers may take a moment to initialize symbols after opening a file

Release Notes

0.1.0

Initial release:

• Create and manage flows
• Add functions via picker or quick add
• Navigate to functions with highlighting
• Export/import flows as JSON
• Storage in .vscode/flowditor.json

Contributing

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Run npm run compile to check for errors
5. Submit a pull request

License

MIT