Workflow-Overview.md

Visual Workflow Builder Documentation

Overview

The Visual Workflow Builder is embedded in the Cody AI VS Code extension that lets you create automated workflows combining Cody AI capabilities with command-line operations. Using an intuitive drag-and-drop interface, you can chain together different actions to automate repetitive tasks.

Core Components

Node Types

1. CLI Actions

   • Execute shell commands
   • Access inputs using ${1}, ${2} syntax where numbers correspond to parent node connections
   • Safety measures prevent execution of system-critical commands

2. Cody LLM Actions

   • Interact with Cody AI
   • Create custom prompts with ${1}, ${2} placeholders for specific parent outputs
   • Process outputs from multiple parent nodes in order

3. Preview Nodes

   • View all parent outputs separated by newlines
   • Verify workflow outputs
   • Debug data transformations

4. Input Text Nodes

   • Add custom text content
   • Create template messages using ${1}, ${2} syntax
   • Store reusable snippets

Building Workflows

1. Adding Nodes

   • Click desired node type in sidebar
   • Nodes automatically position in viewport
   • Each node can be freely moved and arranged

2. Connecting Nodes

   • Drag from node endpoints to create connections
   • Connection order determines input numbering (${1}, ${2}, etc.)
   • Multiple inputs/outputs supported with indexed access

3. Configuring Nodes

   • Click node to open Property Editor
   • Set node-specific parameters:
     • CLI commands with ${1} for first input, ${2} for second, etc.
     • Cody prompts with indexed inputs
     • Input text with variable substitution
     • Preview settings showing all inputs

4. Workflow Management

   • Save workflows for later use
   • Load existing workflows
   • Execute entire workflow chain

Execution Features

1. Real-time Status

   • Visual feedback during execution
   • Error highlighting
   • Execution progress tracking

2. Data Flow

   • Indexed access to parent node outputs
   • Input sanitization for security
   • Preview all inputs in order

3. Error Handling

   • Clear error messages
   • Failed node highlighting
   • Execution stop on errors

Best Practices

1. Workflow Design

   • Start with input nodes
   • Add processing steps with clear input references
   • Use preview nodes to verify data flow
   • Test incrementally

2. Using Input References

   • Use ${1}, ${2} to reference specific parent outputs
   • Connection order determines input numbers
   • Preview nodes show all inputs for verification

3. CLI Integration

   • Test commands individually
   • Reference specific inputs clearly with ${n} syntax
   • Maintain security awareness

This workflow builder empowers you to create powerful automation chains combining Cody's AI capabilities with system commands, all within the familiar VS Code environment.

Workflow-UseCases.md

Workflow Editor Use Cases

Git Operations Automation

1. Smart Commit Message Generator

   • CLI Node: git diff --staged
   • LLM Node: "Analyze the following git diff and generate a semantic commit message following the Conventional Commits format. Focus on the main changes and keep it concise: ${1}"
   • CLI Node: git commit -m "${1}"

2. Branch Management

   • CLI Node: git branch -a
   • LLM Node: "Review these Git branches and suggest which ones can be safely deleted. Consider merged branches and outdated feature branches. Present the suggestions in a clear list format: ${1}"
   • CLI Node: Execute branch cleanup commands

Code Review Assistance

1. PR Description Generator

   • CLI Node: git diff main...HEAD
   • LLM Node: "Generate a detailed pull request description from this diff. Include: 1) Summary of changes 2) Technical implementation details 3) Testing considerations. Format in proper markdown: ${1}"
   • Preview Node: Display formatted PR description

2. Code Review Analyzer

   • CLI Node: git show
   • LLM Node: "Perform a thorough code review analysis of these changes. Focus on: 1) Code quality 2) Potential bugs 3) Performance implications 4) Security concerns. Format as markdown with categories: ${1}"
   • Preview Node: Display review comments

Documentation Workflows

1. README Generator

   • CLI Node: find . -name "*.ts" -o -name "*.tsx"
   • CLI Node: cat ${1}
   • LLM Node: "Generate a comprehensive README.md from this codebase analysis. Include: 1) Project overview 2) Installation 3) Usage 4) API documentation 5) Contributing guidelines. Use proper markdown formatting: ${1}"
   • Preview Node: Display formatted README

2. API Documentation

   • CLI Node: grep -r "@api" .
   • LLM Node: "Convert these API comments into OpenAPI 3.0 specification format. Include detailed descriptions, parameters, request/response examples, and proper yaml formatting: ${1}"
   • Preview Node: Show formatted API docs

Code Analysis

1. Code Quality Check

   • CLI Node: git ls-files '*.ts' '*.tsx'
   • CLI Node: eslint ${1}
   • LLM Node: "Analyze these ESLint issues and provide actionable solutions. For each issue: 1) Explain the problem 2) Show a code example of the fix 3) Explain why it's better. Format in markdown with sections for each type of issue: ${1}"
   • Preview Node: Display formatted report

2. Dependencies Analyzer

   • CLI Node: npm list
   • LLM Node: "Review this dependency tree and provide recommendations for: 1) Outdated packages that should be updated 2) Security implications 3) Potential dependency conflicts 4) Package size optimizations. Format as a prioritized markdown list: ${1}"
   • Preview Node: Show upgrade recommendations

Testing Assistance

1. Test Case Generator

   • Input Node: Paste function code
   • LLM Node: "Generate comprehensive Jest unit tests for this code. Include: 1) Happy path tests 2) Edge cases 3) Error scenarios 4) Mocking examples. Use proper Jest/TypeScript syntax and add detailed comments: ${1}"
   • Preview Node: Display generated tests

2. Test Coverage Analyzer

   • CLI Node: npm run test:coverage
   • LLM Node: "Analyze this test coverage report and provide: 1) Critical areas lacking coverage 2) Specific test scenarios needed 3) Priority recommendations. Format in markdown with clear sections: ${1}"
   • Preview Node: Show recommendations

Code Migration

1. TypeScript Converter

   • Input Node: Paste JavaScript code
   • LLM Node: "Convert this JavaScript code to TypeScript. Include: 1) Proper type definitions 2) Interface declarations 3) Leverage TypeScript features. Add detailed comments explaining the conversion choices: ${1}"
   • Preview Node: Show converted code

2. Framework Migration

   • Input Node: React component code
   • LLM Node: "Convert this React component to Vue 3 Composition API. Ensure: 1) Proper lifecycle hooks conversion 2) State management translation 3) Event handling adaptation 4) Template syntax conversion. Add migration notes as comments: ${1}"
   • Preview Node: Display migrated code

Performance Optimization

1. Bundle Size Analyzer

   • CLI Node: npm run build
   • LLM Node: "Analyze this bundle size report and provide: 1) Large dependencies that can be optimized 2) Code splitting opportunities 3) Dynamic import suggestions 4) Tree-shaking improvements. Format as actionable markdown list: ${1}"
   • Preview Node: Show optimization suggestions

2. Runtime Performance

   • CLI Node: lighthouse ${url}
   • LLM Node: "Review these Lighthouse metrics and provide detailed optimization strategies for: 1) First Contentful Paint 2) Time to Interactive 3) Cumulative Layout Shift 4) Performance score. Include code examples for fixes: ${1}"
   • Preview Node: Display optimization steps

Security Scanning

1. Dependency Vulnerability Check

   • CLI Node: npm audit
   • LLM Node: "Analyze these security vulnerabilities and provide: 1) Severity assessment 2) Exploit scenarios 3) Specific upgrade paths 4) Mitigation strategies if upgrades aren't possible. Format as security report: ${1}"
   • Preview Node: Show security recommendations

2. Code Security Scan

   • CLI Node: git diff main
   • LLM Node: "Perform a security analysis of these changes. Check for: 1) Input validation issues 2) Authentication/authorization gaps 3) Data exposure risks 4) Common security antipatterns. Format as security review: ${1}"
   • Preview Node: Display security findings

i18n Workflows

1. Translation Generator

   • Input Node: Source language text
   • LLM Node: "Translate this text into the following languages maintaining proper context and localization considerations: 1) Spanish 2) French 3) German 4) Japanese. Format as structured JSON: ${1}"
   • Preview Node: Show formatted translations

2. i18n Key Analyzer

   • CLI Node: find . -name "*.json"
   • LLM Node: "Analyze these translation files and identify: 1) Missing translations 2) Inconsistent keys 3) Formatting issues 4) Suggestions for better i18n structure. Format as detailed report: ${1}"
   • Preview Node: Show missing translations

Release Management

1. Changelog Generator

   • CLI Node: git log --oneline
   • LLM Node: "Generate a structured changelog from these commits. Group by: 1) Features 2) Bug fixes 3) Breaking changes 4) Performance improvements. Follow Keep a Changelog format: ${1}"
   • Preview Node: Display formatted changelog

2. Version Bump Automation

   • CLI Node: npm version
   • LLM Node: "Generate comprehensive release notes from version changes. Include: 1) Major changes 2) Migration guides 3) Breaking changes 4) Credits. Format in markdown: ${1}"
   • CLI Node: Git tag and push

Configuration Management

1. ENV File Generator

   • CLI Node: List environment variables
   • LLM Node: "Create a detailed .env template with: 1) Required variables 2) Optional variables 3) Default values 4) Security considerations. Include comments for each setting: ${1}"
   • Preview Node: Show formatted config

2. Config Validator

   • Input Node: Configuration file
   • LLM Node: "Validate this configuration file checking for: 1) Required fields 2) Type correctness 3) Security issues 4) Best practices. Provide detailed feedback for each issue: ${1}"
   • Preview Node: Show validation results