Skip to content

harshmriduhash/Dev-orchestrator-AI

Repository files navigation

AgentFlow - AI-Powered DevOps Automation

AgentFlow Logo

Transform GitHub Issues into Production-Ready Pull Requests with AI Agents

TypeScript React Supabase Tailwind CSS

Live Demo · Documentation · Get Started


📋 Table of Contents


🎯 Problem & Solution

The Problem

Modern development teams face critical bottlenecks that slow down delivery:

Pain Point Impact
Manual Issue Triage Engineers spend 2-4 hours/day reading, understanding, and planning issue implementation
Context Switching Developers lose 23 minutes on average recovering focus after each interruption
Inconsistent Code Quality Different developers implement similar features in vastly different ways
Slow PR Turnaround Simple bug fixes take days due to backlogs and review cycles
Knowledge Silos Only certain team members understand specific parts of the codebase

How AgentFlow Solves This

AgentFlow deploys a multi-agent AI system that automates the entire workflow from issue to pull request:

┌─────────────────────────────────────────────────────────────────┐
│                     BEFORE AgentFlow                            │
├─────────────────────────────────────────────────────────────────┤
│  Issue Created → Developer Reads → Plans → Codes → PR → Review │
│       ↓              ↓                ↓       ↓        ↓        │
│    [0 min]      [30-60 min]      [2-8 hrs] [30 min] [1-2 days]  │
│                                                                 │
│  TOTAL TIME: 1-3 DAYS                                          │
└─────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────┐
│                     AFTER AgentFlow                             │
├─────────────────────────────────────────────────────────────────┤
│  Issue Created → Planner Agent → Coder Agent → PR Ready        │
│       ↓              ↓               ↓            ↓             │
│    [0 min]       [2-5 min]       [5-15 min]   [Ready!]         │
│                                                                 │
│  TOTAL TIME: 10-20 MINUTES                                     │
└─────────────────────────────────────────────────────────────────┘

💰 Key Benefits

Does It Save Time?

YES - Up to 90% reduction in issue-to-PR time

Metric Before After Savings
Issue Analysis 30-60 min 2-5 min 95%
Implementation 2-8 hours 5-15 min 97%
Code Review Prep 30 min 0 min 100%
Total Cycle Time 1-3 days 10-20 min ~95%

Does It Save Money?

YES - Significant cost reduction

Team Size Monthly Dev Hours Saved Cost Savings (@ $75/hr)
5 developers 200 hours $15,000/month
10 developers 450 hours $33,750/month
25 developers 1,200 hours $90,000/month

ROI Calculation:

  • Starter Plan ($29/mo) → Saves $15,000+ → 517x ROI
  • Pro Plan ($99/mo) → Saves $33,750+ → 340x ROI
  • Enterprise (custom) → Custom savings analysis

✨ Features

Core Agents

Agent Function Output
🧠 Planner Agent Analyzes issues, breaks down tasks, identifies risks TaskSpec JSON
👨‍💻 Coder Agent Generates minimal, safe code changes Git diff + PatchSpec
🔍 Reviewer Agent Validates code quality and conventions Approval/Rejection

Platform Features

  • GitHub Integration - Webhook-based real-time processing
  • Risk Assessment - Automatic risk level classification
  • Convention Enforcement - Follows your repo's coding style
  • Real-time Dashboard - Monitor all agent activity
  • Team Collaboration - Multi-user workspaces
  • Audit Logs - Complete traceability

🏗 Software Architecture

High-Level Architecture

┌─────────────────────────────────────────────────────────────────────────┐
│                           AgentFlow Platform                            │
├─────────────────────────────────────────────────────────────────────────┤
│                                                                         │
│  ┌──────────────┐     ┌──────────────┐     ┌──────────────┐            │
│  │   Frontend   │     │   Backend    │     │   Database   │            │
│  │   (React)    │────▶│ (Edge Funcs) │────▶│  (Postgres)  │            │
│  └──────────────┘     └──────────────┘     └──────────────┘            │
│         │                    │                    │                     │
│         │                    ▼                    │                     │
│         │           ┌──────────────┐              │                     │
│         │           │  AI Gateway  │              │                     │
│         │           │  (Lovable)   │              │                     │
│         │           └──────────────┘              │                     │
│         │                    │                    │                     │
│         ▼                    ▼                    ▼                     │
│  ┌─────────────────────────────────────────────────────────────┐       │
│  │                    GitHub Integration                        │       │
│  │   Webhooks │ Issues │ Pull Requests │ Repository Access     │       │
│  └─────────────────────────────────────────────────────────────┘       │
│                                                                         │
└─────────────────────────────────────────────────────────────────────────┘

Component Architecture

src/
├── components/
│   ├── ui/                    # Shadcn UI components (buttons, cards, etc.)
│   ├── auth/                  # Authentication components
│   │   └── AuthForm.tsx       # Sign in/up forms
│   ├── dashboard/             # Dashboard-specific components
│   │   ├── DashboardLayout.tsx
│   │   ├── StatsCard.tsx
│   │   ├── IssuesList.tsx
│   │   └── ActivityChart.tsx
│   ├── Navbar.tsx             # Main navigation
│   ├── HeroSection.tsx        # Landing page hero
│   ├── FeaturesSection.tsx    # Features showcase
│   ├── PricingSection.tsx     # Pricing tiers
│   └── Footer.tsx             # Site footer
├── hooks/
│   ├── useAuth.tsx            # Authentication state & methods
│   ├── useRepos.tsx           # Repository CRUD operations
│   ├── useIssues.tsx          # Issues management
│   ├── usePullRequests.tsx    # PR tracking
│   └── useProfile.tsx         # User profile management
├── pages/
│   ├── Index.tsx              # Landing page
│   ├── Dashboard.tsx          # Main dashboard
│   ├── Repositories.tsx       # Repo management
│   ├── Settings.tsx           # User settings
│   ├── SignIn.tsx             # Authentication
│   └── SignUp.tsx
├── integrations/
│   └── supabase/
│       ├── client.ts          # Supabase client instance
│       └── types.ts           # Auto-generated types
└── lib/
    └── utils.ts               # Utility functions

Data Flow

┌─────────────┐    ┌─────────────┐    ┌─────────────┐    ┌─────────────┐
│   GitHub    │    │   Webhook   │    │   Planner   │    │   Coder     │
│   Issue     │───▶│   Handler   │───▶│   Agent     │───▶│   Agent     │
│   Created   │    │             │    │             │    │             │
└─────────────┘    └─────────────┘    └─────────────┘    └─────────────┘
                                             │                  │
                                             ▼                  ▼
                                      ┌─────────────┐    ┌─────────────┐
                                      │  TaskSpec   │    │  PatchSpec  │
                                      │   (JSON)    │    │   + Diff    │
                                      └─────────────┘    └─────────────┘
                                                               │
                                                               ▼
                                                        ┌─────────────┐
                                                        │  GitHub PR  │
                                                        │   Created   │
                                                        └─────────────┘

🔧 System Design

Database Schema

┌─────────────────────────────────────────────────────────────────────┐
│                         Database Schema                              │
├─────────────────────────────────────────────────────────────────────┤
│                                                                      │
│  ┌──────────────┐       ┌──────────────┐       ┌──────────────┐     │
│  │   profiles   │       │ github_repos │       │    issues    │     │
│  ├──────────────┤       ├──────────────┤       ├──────────────┤     │
│  │ id           │       │ id           │       │ id           │     │
│  │ user_id (FK) │◀──────│ user_id (FK) │──────▶│ user_id (FK) │     │
│  │ full_name    │       │ repo_name    │◀──────│ repo_id (FK) │     │
│  │ company      │       │ repo_url     │       │ issue_number │     │
│  │ avatar_url   │       │ is_active    │       │ issue_title  │     │
│  │ created_at   │       │ created_at   │       │ risk_level   │     │
│  │ updated_at   │       │ updated_at   │       │ status       │     │
│  └──────────────┘       └──────────────┘       └──────────────┘     │
│                                                       │              │
│                                                       ▼              │
│                                               ┌──────────────┐       │
│                                               │pull_requests │       │
│                                               ├──────────────┤       │
│                                               │ id           │       │
│                                               │ issue_id(FK) │       │
│                                               │ pr_number    │       │
│                                               │ pr_url       │       │
│                                               │ status       │       │
│                                               │ files_changed│       │
│                                               └──────────────┘       │
│                                                                      │
└─────────────────────────────────────────────────────────────────────┘

Security Architecture

┌─────────────────────────────────────────────────────────────────────┐
│                      Security Layers                                 │
├─────────────────────────────────────────────────────────────────────┤
│                                                                      │
│  Layer 1: Authentication                                            │
│  ┌────────────────────────────────────────────────────────────┐     │
│  │  Supabase Auth │ Email/Password │ Session Management       │     │
│  └────────────────────────────────────────────────────────────┘     │
│                                                                      │
│  Layer 2: Authorization                                             │
│  ┌────────────────────────────────────────────────────────────┐     │
│  │  Row Level Security (RLS) │ Role-based Access │ Policies   │     │
│  └────────────────────────────────────────────────────────────┘     │
│                                                                      │
│  Layer 3: Data Protection                                           │
│  ┌────────────────────────────────────────────────────────────┐     │
│  │  Encrypted at Rest │ TLS in Transit │ Secure Secrets       │     │
│  └────────────────────────────────────────────────────────────┘     │
│                                                                      │
│  Layer 4: API Security                                              │
│  ┌────────────────────────────────────────────────────────────┐     │
│  │  Webhook Signatures │ Rate Limiting │ Input Validation     │     │
│  └────────────────────────────────────────────────────────────┘     │
│                                                                      │
└─────────────────────────────────────────────────────────────────────┘

Agent Execution Flow

┌─────────────────────────────────────────────────────────────────────┐
│                    Agent Execution Pipeline                          │
├─────────────────────────────────────────────────────────────────────┤
│                                                                      │
│  1. INTAKE                                                          │
│     ┌─────────┐                                                     │
│     │ GitHub  │──▶ Webhook ──▶ Validate ──▶ Queue                   │
│     │ Issue   │                                                     │
│     └─────────┘                                                     │
│                                                                      │
│  2. PLANNING                                                        │
│     ┌─────────┐                                                     │
│     │ Planner │──▶ Parse Issue ──▶ Generate TaskSpec ──▶ Validate   │
│     │ Agent   │                                                     │
│     └─────────┘                                                     │
│          │                                                          │
│          ▼                                                          │
│     ┌─────────────────────────────────────────┐                     │
│     │ TaskSpec                                │                     │
│     │ - task_id: "issue-123"                  │                     │
│     │ - summary: "Add user avatar upload"     │                     │
│     │ - risk_level: "medium"                  │                     │
│     │ - affected_areas: ["components/", ...]  │                     │
│     │ - acceptance_criteria: [...]            │                     │
│     └─────────────────────────────────────────┘                     │
│                                                                      │
│  3. CODING                                                          │
│     ┌─────────┐                                                     │
│     │ Coder   │──▶ Load Context ──▶ Generate Diff ──▶ Validate      │
│     │ Agent   │                                                     │
│     └─────────┘                                                     │
│          │                                                          │
│          ▼                                                          │
│     ┌─────────────────────────────────────────┐                     │
│     │ PatchSpec                               │                     │
│     │ - files_changed: 3                      │                     │
│     │ - tests_added: true                     │                     │
│     │ - lint_status: "pass"                   │                     │
│     │ - typecheck_status: "pass"              │                     │
│     └─────────────────────────────────────────┘                     │
│                                                                      │
│  4. DELIVERY                                                        │
│     ┌─────────┐                                                     │
│     │ GitHub  │◀── Create Branch ◀── Apply Diff ◀── Open PR        │
│     │   PR    │                                                     │
│     └─────────┘                                                     │
│                                                                      │
└─────────────────────────────────────────────────────────────────────┘

🚀 Getting Started

Prerequisites

  • Node.js 18+ and npm
  • Git

Installation

# Clone the repository
git clone <YOUR_GIT_URL>

# Navigate to project directory
cd <YOUR_PROJECT_NAME>

# Install dependencies
npm install

# Start development server
npm run dev

Environment Variables

The following environment variables are automatically configured:

  • VITE_SUPABASE_URL - Backend API URL
  • VITE_SUPABASE_PUBLISHABLE_KEY - Public API key

📝 Checklists

MVP Launch Checklist

  • Landing page with value proposition
  • User authentication (sign up/sign in)
  • Protected dashboard routes
  • Repository management CRUD
  • Issues tracking display
  • Pull requests monitoring
  • User profile settings
  • Responsive design
  • Database schema with RLS
  • GitHub webhook integration
  • Analytics dashboard with charts
  • User onboarding flow
  • Error boundary for crash recovery
  • Agent execution pipeline (AI processing)
  • Email notifications (Resend API key required)

Production Checklist

  • Environment variables configured
  • Database migrations applied
  • Row Level Security enabled on all tables
  • Authentication flow tested
  • Webhook signature verification
  • Error handling with boundaries
  • Loading states implemented
  • Error monitoring setup (Sentry/LogRocket)
  • Performance monitoring
  • CDN configuration
  • Custom domain setup
  • SSL certificate
  • Rate limiting configured
  • Backup strategy implemented
  • Disaster recovery plan

Execution Checklist

  • Project structure organized
  • Component architecture defined
  • State management implemented (React Query)
  • API integration complete
  • Form validation in place
  • Loading states implemented
  • Error handling standardized
  • Real-time analytics dashboard
  • Data visualization with Recharts
  • Unit tests coverage >80%
  • Integration tests for critical paths
  • E2E tests for user flows

SaaS Ready Checklist

  • Multi-tenant database design
  • User isolation via RLS policies
  • Subscription tier structure defined
  • Pricing page implemented
  • New user onboarding experience
  • Payment integration (Stripe)
  • Usage metering
  • Billing dashboard
  • Invoice generation
  • Subscription management
  • Upgrade/downgrade flows

Launch Checklist

  • SEO meta tags configured
  • Open Graph images
  • robots.txt configured
  • Favicon set
  • Real-time dashboard analytics
  • Analytics integration (GA4/Plausible)
  • Social media accounts created
  • Launch announcement prepared
  • Documentation complete
  • Support channels established
  • Feedback collection mechanism

Ready Checklist (Go-Live)

  • All critical features functional
  • Mobile responsive verified
  • Cross-browser testing complete
  • Security audit passed
  • GitHub webhook handler deployed
  • User onboarding implemented
  • Load testing completed
  • Rollback procedure documented
  • Team trained on incident response
  • Customer support ready
  • Marketing materials prepared
  • Press release drafted

🛠 Tech Stack

Category Technology
Frontend React 18, TypeScript, Vite
Styling Tailwind CSS, Shadcn/UI
Animation Framer Motion
State TanStack Query (React Query)
Backend Supabase (Postgres, Auth, Edge Functions)
AI Lovable AI Gateway
Hosting Lovable Platform

🤝 Contributing

We welcome contributions! Please see our contributing guidelines for more details.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.


Built with ❤️ using Lovable

Website · Twitter · Discord

About

Built a Devtool, AgentFlow which Transform GitHub Issues into Production-Ready Pull Requests with AI Agents to help developers save time and money

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors