difit 1.0.7 → 1.1.0

package/README.md

@@ -11,51 +11,104 @@ A lightweight command-line tool that spins up a local web server to display Git
 - 🌙 **GitHub-like UI**: Familiar dark theme file list and diff interface
 - 💬 **Inline Comments**: Add comments to specific lines and generate Claude Code prompts
 - 🔄 **Side-by-Side & Inline Views**: Choose your preferred diff viewing mode
+- 🖥️ **Terminal UI Mode**: View diffs directly in your terminal with `--tui` flag
 - ⚡ **Zero Config**: Just run `npx reviewit <commit>` and it works
 - 🔐 **Local Only**: Never exposes data over network - runs on localhost only
 - 🛠️ **Modern Stack**: React 18 + TypeScript + Tailwind CSS
+- 🎨 **Syntax Highlighting**: Dynamic language loading for Bash, PHP, SQL, Ruby, Java, and more
 - ✨ **100% vibe coding**: Built with pure coding energy and good vibes
 
 ## 📦 Installation
 
 ```bash
-# Global install
-npm install -g reviewit
-
-# Or use npx (no installation needed)
+# use npx (no installation needed)
 npx reviewit <commit-ish>
+
+# or Global install
+npm install -g reviewit
 ```
 
 ## 🚀 Usage
 
 ```bash
-# Review a specific commit
-reviewit 6f4a9b7
+# default: HEAD commit changes
+npx reviewit
 
-# Review HEAD~3
-reviewit HEAD~3
+# Review a specific commit changes
+npx reviewit 6f4a9b7
+npx reviewit HEAD^
+npx reviewit HEAD~3
 
-# Review uncommitted changes (working directory)
-reviewit .
+# Special Arguments
+npx reviewit staging  # staging area changes
+npx reviewit working  # working directory changes
+npx reviewit .        # uncommited all changes
 
 # Custom port, don't auto-open browser
-reviewit 6f4a9b7 --port 4300 --no-open
+npx reviewit 6f4a9b7 --port 4300 --no-open
 
-# Via npx
-npx reviewit main~1
-npx reviewit .  # uncommitted changes
+# Terminal UI mode (no browser)
+npx reviewit --tui
+npx reviewit working --tui
 ```
 
 ### ⚙️ CLI Options
 
-| Flag           | Default    | Description                                          |
-| -------------- | ---------- | ---------------------------------------------------- |
-| `<commit-ish>` | (required) | Any Git reference: hash, tag, HEAD~n, branch, or `.` |
-| `--port`       | auto       | Preferred port; falls back if occupied               |
-| `--no-open`    | false      | Don't automatically open browser                     |
-| `--mode`       | inline     | Diff mode: `inline` or `side-by-side`                |
+| Flag           | Default      | Description                                                        |
+| -------------- | ------------ | ------------------------------------------------------------------ |
+| `<commit-ish>` | (required)   | Any Git reference: hash, tag, HEAD~n, branch, or Special Arguments |
+| `--port`       | auto         | Preferred port; falls back if occupied                             |
+| `--no-open`    | false        | Don't automatically open browser                                   |
+| `--mode`       | side-by-side | Diff mode: `inline` or `side-by-side`                              |
+| `--tui`        | false        | Use terminal UI mode instead of web interface                      |
+
+### 🔑 Special Arguments
+
+ReviewIt supports special arguments for common diff scenarios:
+
+| Keyword   | Description                                            |
+| --------- | ------------------------------------------------------ |
+| `working` | Shows unstaged changes in your working directory       |
+| `staged`  | Shows staged changes ready to be committed             |
+| `.`       | Shows all uncommitted changes (both staged & unstaged) |
+
+## 💬 Comment System
+
+ReviewIt includes an inline commenting system that integrates with Claude Code:
+
+1. **Add Comments**: Click on any diff line to add a comment
+2. **Edit Comments**: Edit existing comments with the edit button
+3. **Generate Prompts**: Comments include a "Copy Prompt" button that formats the context for Claude Code
+4. **Copy All**: Use "Copy All Prompt" to copy all comments in a structured format
+5. **Persistent Storage**: Comments are saved in browser localStorage per commit
+
+### Comment Prompt Format
+
+```
+File: src/components/Button.tsx
+Line: 42
+Comment: This function name should probably be more specific
+```
+
+## 🎨 Syntax Highlighting
+
+ReviewIt supports syntax highlighting for multiple programming languages with dynamic loading:
+
+### Supported Languages
+
+- **JavaScript/TypeScript**: `.js`, `.jsx`, `.ts`, `.tsx`
+- **Web Technologies**: HTML, CSS, JSON, XML, Markdown
+- **Shell Scripts**: `.sh`, `.bash`, `.zsh`, `.fish` files
+- **Backend Languages**: PHP, SQL, Ruby, Java
+- **Systems Languages**: C, C++, Rust, Go
+- **Others**: Python, Swift, Kotlin, YAML
+
+### Dynamic Language Loading
 
-> **Note**: Use `.` as the commit-ish to review uncommitted changes in your working directory!
+- Languages are loaded on-demand for better performance
+- Automatic language detection from file extensions
+- Fallback to plain text for unsupported languages
+- Safe dependency resolution (e.g., PHP requires markup-templating)
 
 ## 🛠️ Development
 
@@ -94,30 +147,13 @@ pnpm run typecheck
 - **Development mode**: Uses Vite's dev server for hot reload and fast development
 - **Production mode**: Serves built static files (used by npx and production builds)
 
-## 💬 Comment System
-
-ReviewIt includes an inline commenting system that integrates with Claude Code:
-
-1. **Add Comments**: Click on any diff line to add a comment
-2. **Edit Comments**: Edit existing comments with the edit button
-3. **Generate Prompts**: Comments include a "Copy Prompt" button that formats the context for Claude Code
-4. **Copy All**: Use "Copy All Prompt" to copy all comments in a structured format
-5. **Persistent Storage**: Comments are saved in browser localStorage per commit
-
-### Comment Prompt Format
-
-```
-File: src/components/Button.tsx
-Line: 42
-Comment: This function name should probably be more specific
-```
-
 ## 🏗️ Architecture
 
 - **CLI**: Commander.js for argument parsing
 - **Backend**: Express server with simple-git for diff processing
 - **Frontend**: React 18 + TypeScript + Vite
 - **Styling**: Tailwind CSS v4 with GitHub-like dark theme
+- **Syntax Highlighting**: Prism.js with dynamic language loading
 - **Testing**: Vitest for unit tests
 - **Quality**: ESLint, Prettier, lefthook pre-commit hooks
 

package/dist/cli/index.js

@@ -1,5 +1,6 @@
 #!/usr/bin/env node
 import { Command } from 'commander';
+import React from 'react';
 import pkg from '../../package.json' with { type: 'json' };
 import { startServer } from '../server/server.js';
 import { validateCommitish } from './utils.js';
@@ -8,24 +9,50 @@ program
     .name('reviewit')
     .description('A lightweight Git diff viewer with GitHub-like interface')
     .version(pkg.version)
-    .argument('[commit-ish]', 'Git commit, tag, branch, or HEAD~n reference (default: HEAD)', 'HEAD')
+    .argument('[commit-ish]', 'Git commit, tag, branch, HEAD~n reference, or "working"/"staged"/"." (default: HEAD)', 'HEAD')
     .option('--port <port>', 'preferred port (auto-assigned if occupied)', parseInt)
     .option('--no-open', 'do not automatically open browser')
     .option('--mode <mode>', 'diff mode (inline only for now)', 'inline')
+    .option('--tui', 'use terminal UI instead of web interface')
     .action(async (commitish, options) => {
     try {
-        if (!validateCommitish(commitish)) {
+        // Determine what to show
+        let targetCommitish = commitish;
+        // Handle special arguments
+        if (commitish === 'working') {
+            targetCommitish = 'working';
+        }
+        else if (commitish === 'staged') {
+            targetCommitish = 'staged';
+        }
+        else if (commitish === '.') {
+            targetCommitish = '.';
+        }
+        if (options.tui) {
+            // Check if we're in a TTY environment
+            if (!process.stdin.isTTY) {
+                console.error('Error: TUI mode requires an interactive terminal (TTY).');
+                console.error('Try running the command directly in your terminal without piping.');
+                process.exit(1);
+            }
+            // Dynamic import for TUI mode
+            const { render } = await import('ink');
+            const { default: TuiApp } = await import('../tui/App.js');
+            render(React.createElement(TuiApp, { commitish: targetCommitish }));
+            return;
+        }
+        if (!validateCommitish(targetCommitish)) {
             console.error('Error: Invalid commit-ish format');
             process.exit(1);
         }
         const { url } = await startServer({
-            commitish,
+            commitish: targetCommitish,
             preferredPort: options.port,
             openBrowser: options.open,
             mode: options.mode,
         });
         console.log(`\n🚀 ReviewIt server started on ${url}`);
-        console.log(`📋 Reviewing: ${commitish}`);
+        console.log(`📋 Reviewing: ${targetCommitish}`);
         if (options.open) {
             console.log('🌐 Opening browser...\n');
         }

package/dist/cli/utils.js

@@ -10,8 +10,8 @@ export function validateCommitish(commitish) {
     if (trimmed === 'HEAD~') {
         return false;
     }
-    if (trimmed === '.') {
-        return true; // Allow '.' for working directory diff
+    if (trimmed === '.' || trimmed === 'working' || trimmed === 'staged') {
+        return true; // Allow special keywords for working directory and staging area diff
     }
     const validPatterns = [
         /^[a-f0-9]{4,40}$/i, // SHA hashes