🔱 Trident

A modern, web-based Git client built with Next.js. Manage your repositories, view commit history with a visual graph, and perform common Git operations through an intuitive interface.

Features

• Repository Management - Add, delete, and manage multiple local Git repositories
• Visual Commit Graph - Fork-style commit visualization with branch lanes
• Branch Operations - Create, checkout, delete, rename, rebase, and merge branches
• Change Staging - Stage/unstage files individually or all at once
• Stash Support - Stash, reapply, and delete stashed changes
• Diff Viewer - Syntax-highlighted diff view for reviewing changes
• Commit History - Browse commit history with infinite scroll and branch filtering
• Command Palette - Quick access to common actions via Cmd/Ctrl+K
• Settings - Configure default repository folder and preferences
• Dark/Light Mode - Theme toggle for comfortable viewing

Roadmap & TODO

Implemented

Repository Management

• Open local repositories from a filesystem browser
• List recent repositories and reopen quickly (Command Palette)
• Delete repositories from the app list (without deleting files)
• Shared repository/settings storage across app instances
• Set repository display name
• Configure default root folder for browsing repositories

Working Directory & Staging

• View working tree and index status
• Stage/unstage individual files
• Stage all / unstage all
• Discard unstaged changes and untracked files
• Stash changes with message
• List/apply/pop/drop stashes
• Inspect stash file lists and per-file stash diffs

Committing

• Commit with subject + optional body
• Amend latest commit message (reword)

Branching, History & Graph

• Visual commit graph with branch lanes
• Branch visibility filters persisted per repository
• List local/remote branches with ahead/behind tracking info
• Create branch from current HEAD or selected ref
• Checkout local branch
• Checkout remote branch to new local tracking branch
• Delete local and remote branches
• Rename local branches
• Rename remote branches
• Merge with options (rebase-before-merge, squash, fast-forward)
• Rebase onto target branch (with optional auto-stash)
• Preflight conflict checks for merge/rebase
• Hard/soft/mixed reset to selected commit
• Cherry-pick single/multiple commits and abort cherry-pick
• Commit details and per-file commit diffs (split/inline)

Remote Operations

• Fetch default remote
• Fetch specific remote
• Fetch all remotes (prune)
• Pull from remote branch (rebase option)
• Push to remote branch (force, set-upstream, rebase-first, squash, local-tags)

Tags, Credentials, and Automation

• Create local tag and optionally push to remote
• Delete local tag
• Delete remote tag
• Manage credentials (GitHub/GitLab) and associate per repository
• Run repository custom bash scripts from branch context menu (with live output/cancel)

UX & Reliability

• Dark/light/system theme toggle
• Image diff support and binary file detection
• Large-diff protection to prevent UI freeze
• Persist key UI state (sidebar/panel sizes/folders/filters)
• Git error handling with actionable messages + lock file cleanup action

TODO

• Clone repository from URL
• Initialize a new repository
• Manage remotes (add/edit/remove remote definitions)
• Revert commits
• Commit signing (GPG/SSH)
• Co-author commit support
• Interactive rebase UI
• Blame/annotate view
• Submodule management
• Git LFS workflows

Tech Stack

• Framework: Next.js 16 (App Router)
• Language: TypeScript
• UI Components: DaisyUI
• Styling: Tailwind CSS 4
• State Management: TanStack Query
• Git Operations: simple-git
• Diff Rendering: @alexbruf/react-diff-viewer
• Theming: next-themes
• Validation: Zod

Getting Started

Prerequisites

• Node.js 18+
• Git installed and available in PATH

Run with npx

npx trident-git

This launches the app on an available local port (default 3100).
You can also pass options:

npx trident-git --port 3200
npx trident-git --dev

Published npm packages are expected to include a prebuilt .next output, so npx trident-git does not build on the end user's machine.

Installation

# Clone the repository
git clone <repository-url>
cd trident

# Install dependencies
npm install

# Start the development server
npm run dev

Open http://localhost:3000 in your browser.

Build for Production

npm run build
npm start

Usage

1. Add a Repository - Click "Add Repository" on the home page and browse to select a local Git repository
2. View Changes - The workspace view shows staged and unstaged changes with diff previews
3. Commit Changes - Stage files and enter a commit message (Cmd/Ctrl+Enter to commit)
4. Browse History - Navigate to the History tab to view the commit graph
5. Manage Branches - Use the branch sidebar to switch, create, or manage branches

Project Structure

src/
├── app/                    # Next.js App Router pages
│   ├── api/               # API routes for Git operations
│   │   ├── git/           # Git action endpoints
│   │   ├── fs/            # File system endpoints
│   │   └── repos/         # Repository management
│   └── workspace/         # Workspace pages (history, changes, stashes, settings)
├── components/            # React components
│   ├── git/              # Git-specific components
│   │   ├── diff-view.tsx
│   │   ├── git-graph.tsx
│   │   ├── history-view.tsx
│   │   └── status-view.tsx
│   ├── layout/           # Layout components
│   └── ui/               # Reusable UI components (Radix-based)
├── hooks/                # Custom React hooks
├── lib/                  # Utilities and services
│   ├── git.ts           # Git service wrapper
│   ├── graph-utils.ts   # Commit graph algorithms
│   ├── store.ts         # State management
│   └── types.ts         # TypeScript definitions

Scripts

Command	Description
npm run dev	Start development server
npm run build	Build for production
npm run start	Start production server
npm run lint	Run ESLint
npm run cli	Start through the packaged CLI launcher
npm run pack:preview	Preview npm package contents

License

MIT