Skip to content

sonct1/CLIConfigEditUI

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

152 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

CLI Config Editor

A cross-platform desktop application for managing configuration files of AI Coding CLI tools.

Tauri React TypeScript Tailwind CSS

Problem

AI coding assistants (Claude Code, Gemini CLI, Amp, Cursor, etc.) each store settings in different locations across your filesystem. Finding and editing these configuration files is tedious, especially when using multiple tools daily.

Solution

CLI Config Editor provides a unified interface to:

  • Discover configuration files for popular AI CLI tools automatically
  • Edit settings with syntax highlighting and validation
  • Manage custom CLI tool configurations
  • Theme support with dark and light modes

Screenshots

Main Interface (Dark Theme)

Main Interface

MCP Sync Settings

MCP Sync

Config Editor

Config Editor

Features

  • ✅ Auto-detection of installed CLI tools
  • ✅ Monaco Editor with syntax highlighting (JSON, YAML, TOML, INI)
  • ✅ Dark, light, and system theme support
  • ✅ Custom tool configurations
  • ✅ Unsaved changes indicator (visual dot on sidebar items)
  • ✅ Format/prettify code
  • ✅ Comprehensive keyboard shortcuts
  • ✅ Toast notifications
  • ✅ Persistent settings (theme, custom tools)
  • Config file versioning - Save, compare, and switch between config snapshots
  • MCP Settings Sync - Sync MCP server configurations across all AI coding tools
  • Command Palette - Quick access to all actions (Ctrl/Cmd+K)
  • Auto-save - Optional automatic saving with configurable delay
  • Reduced motion - Accessibility option to minimize animations
  • SSH Remote Config - Edit config files on remote servers via SSH

Supported Platforms

Platform Status
macOS ✅ Tested
Ubuntu/Linux ✅ Tested
Windows ⚠️ Supported (not tested)

Note: Windows support is implemented but has not been tested. Please report any issues.

Pre-configured CLI Tools

Tool Config Format Description
Claude Code JSON/Markdown Anthropic's official Claude Code CLI
Gemini CLI JSON/Markdown Google's Gemini CLI
Amp JSON/Markdown Sourcegraph's AI coding agent
GitHub Copilot CLI JSON GitHub's agentic AI coding assistant
Cursor JSON AI-first code editor
OpenCode JSON AI coding agent by SST
Factory Droid CLI JSON Factory's AI coding agent
Qwen Code JSON/Markdown Alibaba's AI coding agent CLI
Augment Code CLI (Auggie) JSON Augment Code's AI coding CLI
Kiro CLI JSON AWS Kiro agentic coding CLI
Rovo Dev CLI YAML/JSON Atlassian's Rovo Dev AI coding CLI
Qoder CLI JSON Qoder's AI coding CLI
Letta Code JSON Memory-first, model-agnostic coding agent

IDE Platforms (Extension Settings)

Platform Description
VS Code Visual Studio Code extension settings
Cursor Cursor IDE extension settings
Windsurf Codeium's AI-native IDE
Antigravity Google's agent-first development platform

Tech Stack

  • Framework: Tauri v2 - Rust backend + web frontend
  • Backend: Rust - File system operations, security, platform APIs
  • Frontend: TypeScript + React 18 + Tailwind CSS
  • Editor: Monaco Editor (VS Code's editor component)
  • State: Zustand with persistence

Quick Start

Prerequisites

  • Node.js 18+ and pnpm (or npm/yarn)
  • Rust (install via rustup)

System Dependencies

Ubuntu/Debian

sudo apt-get update
sudo apt-get install -y \
  libgtk-3-dev \
  libwebkit2gtk-4.1-dev \
  libjavascriptcoregtk-4.1-dev \
  libsoup-3.0-dev \
  libayatana-appindicator3-dev \
  librsvg2-dev

macOS

xcode-select --install

Windows

Installation & Development

# Clone the repository
git clone https://github.com/NguyenSiTrung/CLIConfigEditUI.git
cd CLIConfigEditUI

# Install dependencies
pnpm install

# Development mode (with hot reload)
pnpm tauri dev

# Build for production
pnpm tauri build

Installing Pre-built Releases

Download the latest release from GitHub Releases.

Note: The app is not code-signed. You may need to follow platform-specific steps to run it.

macOS

  1. Download the .dmg file
  2. Open the DMG and drag the app to Applications
  3. First launch: Right-click the app → "Open" → Click "Open" in the dialog
    • Or run in Terminal: xattr -cr /Applications/CLI\ Config\ Editor.app
  4. macOS may show "unidentified developer" warning - this is expected for unsigned apps

Linux (AppImage)

# Download the AppImage
chmod +x cli-config-editor_*.AppImage

# Run
./cli-config-editor_*.AppImage

Linux (Debian/Ubuntu)

sudo dpkg -i cli-config-editor_*.deb

Windows

  1. Download the .msi or .exe installer
  2. Windows may show "Windows protected your PC" - click "More info" → "Run anyway"
  3. Or right-click the installer → Properties → Check "Unblock" → Apply

Available Scripts

Command Description
pnpm tauri dev Start development with Tauri
pnpm tauri build Build production app
pnpm dev Frontend only (no Tauri)
pnpm typecheck Run TypeScript type checker
pnpm lint Run ESLint
pnpm format Format code with Prettier
pnpm test Run frontend tests

Keyboard Shortcuts

Shortcut Action
Ctrl/Cmd + S Save current file
Ctrl/Cmd + K Open Command Palette
Ctrl/Cmd + , Open Settings
Ctrl/Cmd + B Toggle sidebar
Ctrl/Cmd + Shift + M Toggle MCP panel
Alt/Option + Shift + F Format code
Escape Close modal/dialog

Project Structure

├── src/                    # Frontend (React + TypeScript)
│   ├── components/         # UI components
│   │   ├── header.tsx      # App header with theme toggle
│   │   ├── sidebar.tsx     # Tool list sidebar
│   │   ├── config-editor.tsx # Monaco editor wrapper
│   │   ├── welcome-screen.tsx # Initial landing page
│   │   ├── add-tool-modal.tsx # Custom tool dialog
│   │   ├── settings-modal.tsx # Settings dialog
│   │   └── toast.tsx       # Toast notifications
│   ├── stores/             # Zustand state management
│   ├── types/              # TypeScript type definitions
│   └── utils/              # CLI tool definitions
├── src-tauri/              # Backend (Rust)
│   ├── src/
│   │   ├── commands/       # Tauri commands (IPC)
│   │   ├── config/         # CLI tool definitions
│   │   └── lib.rs          # App entry point
│   ├── capabilities/       # Tauri v2 permissions
│   ├── icons/              # App icons
│   └── Cargo.toml
├── docs/                   # Documentation
└── public/                 # Static assets

Documentation

Config Versioning

Save and manage multiple versions of each configuration file:

Feature Description
Save Version Snapshot current or custom content with name and description
Apply Version Load a saved version into the editor
Compare Versions Side-by-side diff view using Monaco diff editor
Edit Version Modify version content directly without applying
Set Default Mark a version as the default for quick access
Duplicate/Rename Organize versions with copy and rename operations

How to Use

  1. Open any config file in the editor
  2. Click the Versions tab in the toolbar
  3. Click Save Version to create a snapshot
  4. Select versions to compare or click Edit/Apply to use them

Versions are stored in the app's data directory and persist across sessions.

MCP Settings Sync

Manage and synchronize MCP (Model Context Protocol) server configurations across all your AI coding tools with automatic format conversion.

Feature Description
Source Modes Import from Claude (~/.claude.json) or maintain app-managed list
Multi-tool Sync Sync to Claude, Gemini CLI, Amp, GitHub Copilot CLI, OpenCode, Factory Droid, Qwen Code
Format Conversion Automatic conversion between Standard, Copilot, and OpenCode formats
Preview Changes See exactly what will change before applying
Conflict Resolution Resolve conflicts when source and target have different configs for the same server
Backups Automatic backup before any modification

Supported Tools for MCP Sync

Tool Config Path Format
Claude Code ~/.claude.json Standard (mcpServers)
Gemini CLI ~/.gemini/settings.json Standard (mcpServers)
Amp ~/.config/amp/settings.json Standard (amp.mcpServers)
GitHub Copilot CLI ~/.copilot/mcp-config.json Copilot (servers)
OpenCode ~/.config/opencode/opencode.json OpenCode (mcp)
Factory Droid CLI ~/.factory/mcp.json Standard (mcpServers)
Qwen Code ~/.qwen/settings.json Standard (mcpServers)
Qoder CLI ~/.qoder.json Standard (mcpServers)

How to Use

  1. Click MCP Sync in the header to switch to MCP settings view
  2. Choose source: Claude Import or App-Managed
  3. View tool sync status (green = synced, yellow = out-of-sync)
  4. Click Sync on individual tools or Sync All for batch sync
  5. Review preview and resolve any conflicts before applying

SSH Remote Config

Edit config files on remote servers (VPS, cloud instances) directly via SSH.

Prerequisites

  • SSH access to your remote server with key-based authentication
  • Your SSH keys should be loaded in ssh-agent or configured in ~/.ssh/config
  • The remote server must be accessible from your machine

Supported SSH Path Formats

Format Example
User + Host user@hostname:/path/to/config.json
Host only (uses SSH config) myserver:/path/to/config.json
With port user@hostname:2222:/path/to/config.json
IPv6 user@[::1]:22:/path/to/config.json

Adding a Remote Config

  1. Click Add Config File for any tool
  2. Select SSH Remote as the Path Type
  3. Enter the SSH path (e.g., user@server:/home/user/.config/tool/config.json)
  4. Click Test Connection to verify connectivity
  5. Click Add Config File to save

Troubleshooting SSH Connections

Issue Solution
"Permission denied" Ensure your SSH key is added to the server's ~/.ssh/authorized_keys
"Connection refused" Check if SSH service is running on the remote server
"Host key verification failed" Add the host to your known_hosts or use StrictHostKeyChecking=accept-new
"Connection timed out" Verify network connectivity and firewall rules

Note: No passwords are stored in the application. All authentication uses your system's SSH configuration.

Contributing

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

Commit Convention

feat: add new feature
fix: bug fix
docs: documentation changes
style: formatting, no code change
refactor: code restructure
test: add tests
chore: maintenance

License

MIT

About

No description, website, or topics provided.

Resources

Security policy

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages

  • TypeScript 80.9%
  • Rust 18.1%
  • Other 1.0%