Inspiration: This project was inspired by the challenges developers face when using AI coding tools like Bolt.New, Lovable.Dev, ChatGPT, GitHub Copilot, Cursor and Windsurf etc. AI tools often add unwanted features, complexity, and technical debt.
What it does: VibeMantis uses network-level interception to analyze and control AI requests in real-time, stopping scope creep and unwanted features at the source.
The project aims to solve common frustrations with AI coding tools:
AI adding features you didn't ask for Introducing unnecessary complexity Creating potential security vulnerabilities Adding dependencies you don't need
How we built it: The project was built using a modern React stack with TypeScript and Vite as the build tool. Here's a breakdown of the key technologies and implementation details:
Frontend Framework: React with TypeScript for type safety and better developer experience
Styling: Tailwind CSS for utility-first styling, with a custom dark theme configuration
State Management: React hooks for local state management, with custom hooks like useAIInterception and useAIMonitoring
Backend Integration: Supabase for authentication, database, and edge functions
Real-time Features:
Network interception using modified fetch and XMLHttpRequest WebSocket connections for real-time updates Custom event system for component communication Browser Extension:
Built with vanilla JavaScript Uses Chrome Extension APIs for network interception Content scripts for page integration Background service worker for persistent monitoring Project Structure:
Component-based architecture with reusable UI elements Service layer for business logic Utility functions for common operations Type definitions for better code organization
Challenges we ran into: 1. Implementing reliable interception of AI API calls required careful handling of browser networking APIs. We had to modify both fetch and XMLHttpRequest to capture requests before they reached AI services, which introduced edge cases with different request formats. Network-level interception complexity, 2. Cross-browser compatibility - The browser extension needed to work across Chrome, Firefox, and Edge, each with slightly different extension APIs. This required additional abstraction layers and browser-specific code paths. 3. Real-time analysis performance - Analyzing AI requests in real-time without introducing noticeable latency was challenging. We had to optimize our analysis algorithms and implement caching to maintain responsiveness.
Accomplishments that we're proud of: I have an MVP to work on now. Thats a massive achievement for me and its actually working even though there is room for improvement. Plus, for the first time i developed a Browser extension.
What we learned: Through developing VibeMantis, we learned several valuable lessons:
AI tools frequently add unrequested features - We confirmed our hypothesis that AI coding assistants routinely add extra functionality, animations, and complexity beyond what users explicitly request.
Network-level interception is effective - Intercepting AI requests at the network level before they reach AI services proved to be the most effective approach for preventing unwanted changes, rather than trying to detect issues after code generation.
Real-time protection is possible - Despite the technical challenges, we demonstrated that it's feasible to analyze and modify AI requests in real-time without significantly impacting user experience.
Pattern-based detection works well - Our approach of using pattern matching to identify scope creep and security risks in AI requests proved highly effective, especially when combined with machine learning analysis.
Cross-platform integration is crucial - Users need protection across all development environments (browser, VS Code, CI/CD), making a unified protection system essential.
User control is important - Providing granular controls for risk thresholds and protection rules significantly improved user satisfaction and reduced false positive frustrations.
Enterprise teams need shared protection - Organizations benefit from team-wide protection policies and centralized monitoring to maintain consistent code quality standards.
Extension architecture matters - The performance and reliability of browser extensions depend heavily on their architecture, particularly how they handle communication between content scripts, background scripts, and the web platform.
What's next for CodeMantis - Stop AI from Breaking Your Code: Looking ahead, VibeMantis has several exciting directions for future development:
Advanced AI Model Integration - Expanding support for more AI models and tools, including newer versions of GPT, Claude, and other emerging AI coding assistants.
IDE Plugin Ecosystem - Developing plugins for additional IDEs like IntelliJ, PyCharm, and Visual Studio to provide protection across all development environments.
Enhanced Pattern Recognition - Improving our pattern detection algorithms with machine learning to better identify subtle forms of scope creep and security vulnerabilities.
Enterprise Compliance Features - Adding compliance reporting, audit trails, and governance features for enterprise customers with strict security requirements.
CI/CD Pipeline Expansion - Deeper integration with more CI/CD platforms and automated testing frameworks to catch issues before they reach production.
Real-time Collaboration - Adding features for team collaboration, allowing developers to share and review AI-generated code changes in real-time.
Custom Rule Builder - A visual interface for creating and testing custom protection rules without writing regular expressions.
Performance Optimization - Further optimizing the extension to minimize performance impact while maintaining robust protection.
Mobile Development Support - Extending protection to mobile app development environments and frameworks.
AI Training Feedback Loop - Creating a system where detected issues help train better AI coding assistants that respect developer constraints.
Built With
- css
- framer
- lucide
- motion
- react
- tailwind
- typescript
Log in or sign up for Devpost to join the conversation.