feat: fix git window and add pretty diff viewer (#178)
Security Scan and Upload / Security & DefectDojo Upload (push) Successful in 58s
CI / Lint & Test (push) Successful in 16m33s
CI / Build Linux (push) Successful in 20m56s
CI / Build Windows (cross-compile) (push) Successful in 31m1s

## Summary

- **Fix git window "Not a git repository" error** — The working directory received from Claude Code is a WSL Linux path (e.g. `/home/naomi/...`), but git commands were being run as native Windows processes with `.current_dir()`. Windows can't resolve WSL paths, causing `git rev-parse --git-dir` to fail. Fixed by routing git commands through `wsl -- git -C <path>` when the working directory starts with `/`.

- **Add syntax highlighting and line numbers to diff view** — Replaced the raw `<pre>` block with a proper `DiffViewer` component featuring:
  - Old/new line number columns with correct tracking across hunks
  - Colour-coded gutter (`+`/`-`) with green/red row backgrounds
  - Syntax highlighting via `highlight.js` using the detected file language, respecting all app themes via `--hljs-*` CSS variables
  - Styled hunk headers and file headers

## New files

- `src/lib/utils/diffParser.ts` — pure diff parsing logic
- `src/lib/utils/diffParser.test.ts` — 30 tests covering all line types, line number tracking, and language detection
- `src/lib/components/DiffViewer.svelte` — the pretty diff viewer component

 This pull request was created with help from Hikari~ 🌸

Reviewed-on: #178
Co-authored-by: Hikari <hikari@nhcarrigan.com>
Co-committed-by: Hikari <hikari@nhcarrigan.com>
This commit was merged in pull request #178.
This commit is contained in:
2026-03-06 09:19:16 -08:00
committed by Naomi Carrigan
parent 9af61a4a29
commit 1ae440659c
5 changed files with 668 additions and 7 deletions
+4 -6
View File
@@ -2,6 +2,7 @@
import { invoke } from "@tauri-apps/api/core";
import { onMount, onDestroy } from "svelte";
import { claudeStore } from "$lib/stores/claude";
import DiffViewer from "$lib/components/DiffViewer.svelte";
interface GitFileChange {
path: string;
@@ -600,7 +601,9 @@
<h3>📄 {diffFile}</h3>
<button on:click={() => (showDiff = false)} title="Close"></button>
</div>
<pre class="diff-content">{diffContent || "(No changes)"}</pre>
<div class="diff-content">
<DiffViewer {diffContent} filePath={diffFile ?? ""} />
</div>
</div>
</div>
{/if}
@@ -1096,12 +1099,7 @@
.diff-content {
flex: 1;
overflow: auto;
padding: 1rem;
margin: 0;
font-family: var(--font-mono);
font-size: 0.85rem;
line-height: 1.4;
white-space: pre;
background: var(--bg-primary);
}
</style>