Feature · Workspace
Code Editor
Monaco Editor v0.53 integrated directly with Guaardvark's ReACT agent. Open any file, edit inline, run code in the sandbox, and watch agent-proposed diffs land in the editor in real time — entirely on your local machine.
Monaco v0.53
The same editor engine that powers VS Code runs in the browser at Monaco v0.53. Syntax highlighting for 80+ languages, IntelliSense, bracket matching, minimap, multi-cursor, and split-pane views all work out of the box. It's not a simplified textarea — it's the full Monaco experience connected to your file system.
Agent-Driven Diffs
Ask the agent to modify a file in the chat panel. The agent's ReACT loop calls edit_code and verify_change from the code manipulation tools, generating the change as a diff. The diff appears in Monaco's built-in diff viewer before being applied, so you can review exactly what the agent proposes before the file changes. Accept, reject, or ask for a revision.
Sandboxed Execution
Run Python and shell commands from within the editor via the code_execution_api.py sandbox. Results appear in the integrated output panel. The agent can also execute code autonomously as part of its ReACT loop — write a function, execute it to verify it works, observe the output, iterate — without leaving the editor surface.
File Tree & Project Scope
The file browser panel shows files scoped to the active project, populated from the /api/documents endpoint filtered by projectId. Navigate directories, open multiple files in tabs, and rename or delete files. A future update will add a VS Code-style expandable file tree rooted at a configurable workspace directory, per the what-would-we-have-atomic-wand.md plan.
What it does
The agent and the editor in the same window
Cursor and GitHub Copilot are both excellent tools, but they require cloud connections for their AI features: every suggestion goes to a remote server. Guaardvark's Code Editor runs Monaco in the browser against a local file system and connects it to an agent running entirely on your hardware via Ollama. There are no cloud API keys, no code uploads to third-party servers, and no usage limits. For teams working on proprietary codebases under strict data governance, that's the decisive difference.
The integration between the editor and the agent is bidirectional. From the editor, you can highlight a code block and send it to the chat panel with a right-click. From the chat panel, you can ask the agent to read, analyse, or modify any file in the project, and the result appears as a diff in the editor. The agent uses code_manipulation_tools.py from the tools layer — the same tools used by the standalone code assistant — but rendered through the Monaco diff viewer rather than as chat text. This gives you the context and explanation of a chat interaction with the precision of a diff-based editor workflow.
Code execution runs through code_execution_api.py in a sandboxed subprocess. The sandbox captures stdout, stderr, and exit code, returning them to the output panel. For agent-driven execution during the ReACT loop, the same execution tool is called programmatically, and the agent observes the output as a tool result before deciding its next action. This closes the write–run–observe loop entirely within the platform: the agent can write a function, execute it, see the output, fix a bug, execute again, and deliver a working solution without any manual step.
Under the hood
Monaco integration. Monaco Editor v0.53 is bundled as an npm dependency in the React frontend (frontend/src/pages/CodeEditorPage.jsx). The editor mounts with an appropriate language model detected from the file extension. File content is loaded via file_operations_api.py and written back on save. The diff view uses Monaco's built-in createDiffEditor API, presenting the original content on the left and the agent's proposed changes on the right. The agent-to-editor bridge is a Socket.IO event: when the agent's edit_code tool call completes, it emits a code:diff_ready event with the diff payload, which the frontend receives and injects into the Monaco diff editor.
Code tools and execution. The agent's code tools are registered in backend/tools/agent_tools/code_manipulation_tools.py and code_execution_tools.py. read_code reads a file by path, edit_code applies a diff, search_code performs a regex or text search across the project's files, verify_change checks that an edit produced the expected result by running a validation command. Sandboxed execution spawns a subprocess with a restricted environment, a configurable timeout, and memory limits managed by the resource system. The code_intelligence_api.py blueprint provides higher-level analysis endpoints (symbol extraction, call graph analysis, dependency mapping) that power context-aware suggestions.
# Agent instruction for a code task (from chat panel, same session as editor)
# "Add type annotations to all functions in utils/embedding_router.py"
# The agent calls:
# 1. read_code("backend/utils/embedding_router.py")
# 2. LLM reasons about necessary type annotations
# 3. edit_code(path, diff_content)
# 4. verify_change(path, "python3 -m mypy backend/utils/embedding_router.py")
# 5. Diff appears in Monaco diff viewer for review
Use cases
What the Code Editor is good for
Proprietary codebase work under data governance
Your company's policy prohibits uploading source code to cloud AI services. Guaardvark runs Monaco and the agent entirely on your own hardware — no code leaves your network. The agent has access to the full project codebase via the file tools, can read multiple files for context, propose multi-file changes, and run your test suite to verify its work, all without a single outbound request to a third-party AI API.
Automated refactoring with review
Ask the agent to apply a refactoring pattern across a module — rename a class, extract a function, add error handling to all API endpoints. The agent produces a diff for each file change. You review each diff in Monaco's side-by-side view, accept the good ones, and send back the ones that need adjustment. The agent iterates on rejected diffs based on your feedback. The result is a reviewed, verified refactoring completed in a fraction of the time of manual editing.
Learning and exploration
Open an unfamiliar codebase in the editor, ask the agent to explain a module, trace a call path, or describe the purpose of a confusing function. The agent reads the actual file content rather than answering from training data, so its explanations are grounded in the specific code you're looking at. Highlight a function and ask "how does this interact with the cache layer?" and the agent reads both files before answering.
Guaardvark Code Editor vs. cloud AI coding tools
Cursor, GitHub Copilot, and similar tools are excellent for public or low-sensitivity codebases, but all route code through cloud APIs. Guaardvark's Code Editor is the self-hosted alternative: Monaco runs in your browser, the agent runs Ollama on your hardware, and the file system is local. No code travels outside your network. There are no per-seat fees, no token usage costs, and no service outages that block your work. The agent's code tools — read, edit, execute, verify — have been validated through a 4-layer self-improvement test suite that includes planted-bug detection and end-to-end code quality improvement, so the tooling quality is production-tested.
See full comparison →
FAQ
Code Editor — common questions
Which languages does Monaco support?
Monaco v0.53 has built-in language support for JavaScript, TypeScript, Python, Go, Rust, Java, C/C++, C#, HTML, CSS, JSON, YAML, Markdown, SQL, and 70+ others. Syntax highlighting and basic IntelliSense work for all supported languages. Agent-driven code analysis and modification work for any text file regardless of language, since the agent reads file content directly.
Is code execution sandboxed and safe?
Yes. The execution sandbox in code_execution_api.py runs commands in a subprocess with configurable timeouts, memory limits, and a restricted environment. Network access from sandboxed code is disabled by default. The security self-check test suite (backend/tests/unit/test_security_self_check.py) validates sandbox isolation on each test run.
Can the agent edit files outside the project scope?
The file tools resolve paths relative to the project's file store and apply path sanitisation to prevent directory traversal. Files outside the project boundary are not accessible to the agent's file tools. A system-level admin mode with broader file access can be configured for use cases requiring it, but is disabled by default.
Does the editor auto-save?
Auto-save is configurable. The default is manual save (Ctrl+S / Cmd+S) so agent-proposed changes that have been accepted in the diff view are not persisted until you explicitly save. This gives you a final human review gate before any change touches the file system. Auto-save mode (save after each edit or after a configurable idle period) is available in Settings for workflows where that's preferred.
Can I use the Code Editor with the Swarm feature?
Yes. When the Multi-Agent Swarm feature ships in v2.6, swarm worker agents will use the same code tools as the single-agent code assistant, and diff results from multiple workers will be presentable in the editor's multi-file diff view. This enables parallel refactoring workflows where multiple agents work on different modules simultaneously, with review of all their diffs in a unified editor session.
Monaco + local AI, no cloud required
Install Guaardvark and get a full Monaco editor wired to a local ReACT agent — zero code leaves your network, zero per-token fees.