DEV Community

mirocow
mirocow

Posted on

Building an Open-Source Git Client with a Tool-Use AI Agent Loop (Electron + React + TS)

As developers, we interact with Git every single day. While terminal wizards swear by CLI, many of us prefer visual clients like SmartGit or GitKraken for complex operations like interactive rebasing or 3-pane conflict resolution.

But I felt something was missing in modern Git clients: deep, autonomous AI integration. I didn't just want another "AI commit message generator button". I wanted an actual AI pair programmer that could look at my repository status, run diffs, understand the local context, and execute actions on my behalf when asked.
So, I built PrismGit — an open-source, modern cross-platform Git client using Electron 32, React 18, Vite 5, TypeScript 5.6, and Zustand.

The Architecture Under the Hood

PrismGit follows strict process separation to ensure UI responsiveness:

  1. Electron Main Process (electron/): Acts as the trusted environment. It runs a persistent file watcher and handles heavy Git operations using the simple-git library wrapper.
  2. Electron Renderer Process (src/): A snappy React application styled with Tailwind (using Ayu Dark/Light palettes) and powered by Vite for instant loading. Because simple-git spawns OS child processes asynchronously via Promises, it fits perfectly into Electron's IPC (Inter-Process Communication) model. The frontend never freezes, even during massive rebases.

Designing the AI Agent Tool-Use Loop
The jewel of PrismGit v2.1+ is its multi-model AI assistant. It supports 12 LLM providers ranging from local Ollama and LM Studio configurations (for absolute code privacy) to cloud models via Groq, Google Gemini, Anthropic, and OpenAI.
Instead of a basic chatbot, PrismGit implements a Function Calling / Tool-Use loop. The LLM is provided with a schema of 24+ Git-specific tools.

When you type a prompt like "Check what changed in my styling and commit it with a standard message," the AI enters a recursive execution loop:

  1. User enters the prompt in the UI.
  2. The LLM is called and decides to trigger the get_status or get_diff tool.
  3. The main process runs the corresponding simple-git command and returns raw data.
  4. The LLM processes the output and triggers the next tools (stage, commit, push) until the task is complete. To prevent blowing up user token budgets on long diffs, I implemented automatic context compression. Older messages in the session are condensed while crucial repository metadata remains preserved. Bringing Power Features to the Web Aside from AI, I wanted PrismGit to match the power of desktop heavyweights. Using simple-git as the heavy-lifter, I was able to implement: • Visual Interactive Rebase: A beautiful React-based drag-and-drop todo editor mapping directly to pick, reword, edit, squash, fixup, and drop. • 3-Pane Conflict Solver: Renders Base, Ours, and Theirs layouts, monitoring conflict files via status hooks to merge chunks gracefully. • Advanced Ref Management: Native, first-class UI support for Git Worktrees, Submodules, Reflogs, Stashes, and Git LFS. Deterministic Multi-Platform Builds

Desktop clients can be a nightmare to bundle for multiple operating systems due to native node module compilation flags (node-gyp).
To enforce deterministic, reproducible builds without pollution, PrismGit builds everything inside decoupled Docker containers coordinated by a unified Makefile (using Wine to generate Windows binaries smoothly).

PrismGit is fully open-source under the MIT License, features 100% localization parity across 4 languages, and contains an extensive Vitest + Playwright testing pipeline.
I'd love to hear your thoughts on building GUI clients on top of Git CLI wrappers. What are your strategies for optimizing heavy diff parsing?

Let's discuss in the comments below!

Explore PrismGit on GitHub: https://github.com/Mirocow/prismgit

Top comments (0)