Christoph/GitLite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 35 Wiki Activity

Improve global search: Add diffing from results with query highlighting

Browse Source 
Users can now open a diff for a specific search hit directly from the global search results. The original search query will be highlighted within the diff view, making it easier to locate the relevant changes.

Additionally, add `--no-textconv` to git commands used in search and diff operations. This prevents failures when git encounters binary files that textconv drivers might otherwise attempt to process.
This commit is contained in:
Christoph Brandau
2026-06-30 20:32:59 +02:00
parent 2cc1d34fc3
commit 405f302db9
5 changed files with 94 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/CompareDialog.svelte
+20 -4
View File
@@ -15,6 +15,8 @@
selectedDiffPath: string;
isBusy: boolean;
restoreLabel?: string;
/** When opened from a search hit, the term to highlight on matching lines. */
highlightQuery?: string;
onClose: () => void;
onRestore?: () => void;
onSelectFile: (file: GitDiffFile) => void;
@@ -25,11 +27,25 @@
selectedDiffPath = "",
isBusy = false,
restoreLabel = "",
highlightQuery = "",
onClose = () => {},
onRestore = undefined,
onSelectFile = () => {},
}: Props = $props();
// Needle = first non-empty line of the search query, lowercased for matching.
let highlightNeedle = $derived(
highlightQuery
.split("\n")
.map((line) => line.trim())
.find((line) => line.length > 0)
?.toLowerCase() ?? ""
);
function isMatch(text?: string): boolean {
return highlightNeedle.length > 0 && !!text && text.toLowerCase().includes(highlightNeedle);
}
let beforePane = $state<HTMLDivElement | null>(null);
let afterPane = $state<HTMLDivElement | null>(null);
let isSyncingSplitScroll = false;
@@ -259,8 +275,8 @@
{#if row.type === "span"}
<div class="split-span split-{row.kind}">{row.text}</div>
{:else}
<div class="split-num" class:del={row.leftKind === "del"} class:empty={row.leftKind === "empty"}>{row.leftNum ?? ""}</div>
<div class="split-cell" class:del={row.leftKind === "del"} class:empty={row.leftKind === "empty"}>{row.leftText ?? " "}</div>
<div class="split-num" class:del={row.leftKind === "del"} class:empty={row.leftKind === "empty"} class:match={isMatch(row.leftText)}>{row.leftNum ?? ""}</div>
<div class="split-cell" class:del={row.leftKind === "del"} class:empty={row.leftKind === "empty"} class:match={isMatch(row.leftText)}>{row.leftText ?? " "}</div>
{/if}
{/each}
</div>
@@ -276,8 +292,8 @@
{#if row.type === "span"}
<div class="split-span split-{row.kind}">{row.text}</div>
{:else}
<div class="split-num" class:add={row.rightKind === "add"} class:empty={row.rightKind === "empty"}>{row.rightNum ?? ""}</div>
<div class="split-cell" class:add={row.rightKind === "add"} class:empty={row.rightKind === "empty"}>{row.rightText ?? " "}</div>
<div class="split-num" class:add={row.rightKind === "add"} class:empty={row.rightKind === "empty"} class:match={isMatch(row.rightText)}>{row.rightNum ?? ""}</div>
<div class="split-cell" class:add={row.rightKind === "add"} class:empty={row.rightKind === "empty"} class:match={isMatch(row.rightText)}>{row.rightText ?? " "}</div>
{/if}
{/each}
</div>