Architect Agent
Architect Agent is a proactive Clean Architecture linter and AI-powered semantic refactoring assistant built specifically for React and Next.js projects. It continuously monitors component complexity, detects architectural violations, and cleanly decouples messy business logic into highly modular, production-ready structures.
Features
1. Proactive Complexity Linter
Automatically analyzes .tsx and .jsx files in real-time. It flags files exceeding pragmatic development thresholds (> 150 lines or > 5 React Hooks) with a warning, prompting you to extract hidden domain logic before it turns into technical debt.
2. Next.js Directory Guard
Enforces strict Clean Architecture rules within the App Router (/app/ directory). It intercepts arbitrary UI Components placed directly under the routing layer and warns developers to move them to proper shared directories like @/components/ui/.
3. Smart Context-Aware Modularization
Powered by Gemini 3.1 Flash Lite with strict JSON Structured Outputs, the extension offers a one-click Quick Fix (💡 Extract business logic to custom hook) that breaks down complex files intelligently:
- React State & Side Effects -> Routed cleanly into
hooks/ (e.g., hooks/useHeader.ts).
- Pure Fetching/Axios Logic -> Routed into
api/ or services/ (e.g., api/dappApi.ts).
- Helpers & Calculations -> Routed into
utils/ (e.g., utils/helpers.ts).
- Sub-components / Icons -> Extracted cleanly as a sibling file in the same directory to prevent infinite nested subfolders.
4. Anti-Over-Engineering Guardrails
Unlike generic AI engines that split code into endless micro-files, Architect Agent forces a pragmatic approach tailored for rapid MVP delivery. It caps modular outputs to a maximum of 1 or 2 cohesive modules per refactor loop, keeping your workspace clean, performant, and instantly maintainable.
Requirements
- VS Code: Version
^1.125.0 or higher.
- Google Gemini API Key: Requires a free or paid API Key from Google AI Studio.
- Network Connection: Active internet access is required to securely call the Gemini endpoint during the refactoring process.
Extension Settings
Architect Agent contributes the following configuration option to your global or workspace preferences:
architect-agent.geminiApiKey: The secure string token used to authenticate requests to the Gemini API.
Note: If this setting is empty when you trigger the refactoring agent for the first time, an secure input dialog box will automatically appear at the top of your editor window to help you save it instantly.
Known Issues
- Auto-Formatting: The extension calls your workspace's default document formatter (
editor.action.formatDocument) directly after modifying the code. Make sure a formatter like Prettier or the default TypeScript formatter is configured in your project to preserve your team's custom style guide automatically.
Release Notes
0.0.1 (MVP Launch)
- Implemented live static complexity rules (150-line limit / 5-hook threshold).
- Added Next.js App Router boundary protections.
- Integrated Gemini REST API with strict JSON Schema outputs to enforce atomic workspace mutation.
- Implemented Context-Aware Dynamic Routing to eliminate redundant nested directories (
components/components/).